AlwaysKillSticky/options.js

/*******************************/
/* EVENT LISTENER MANIPULATION */
/*******************************/

/*	Adds an event listener to a button (or other clickable element), attaching 
	it to both "click" and "keyup" events (for use with keyboard navigation).
	Optionally also attaches the listener to the 'mousedown' event, making the 
	element activate on mouse down instead of mouse up. */
Element.prototype.addActivateEvent = function(func, includeMouseDown) {
	let ael = this.activateEventListener = (event) => { if (event.button === 0 || event.key === ' ') func(event) };
	if (includeMouseDown) this.addEventListener("mousedown", ael);
	this.addEventListener("click", ael);
	this.addEventListener("keyup", ael);
}

/*	Removes event listener from a clickable element, automatically detaching it
	from all relevant event types. */
Element.prototype.removeActivateEvent = function() {
	let ael = this.activateEventListener;
	this.removeEventListener("mousedown", ael);
	this.removeEventListener("click", ael);
	this.removeEventListener("keyup", ael);
}

/*******************/
/* EVENT LISTENERS */
/*******************/

document.querySelectorAll("button").forEach(button => {
	button.addActivateEvent((event) => {
		event.target.blur();

		if (button.classList.contains("save-button"))
			saveChanges();
		else
			resetChanges();
	});
});

document.querySelectorAll("textarea").forEach(textarea => {
	textarea.addEventListener("input", (event) => {
		document.querySelectorAll("button").forEach(button => {
			button.disabled = false;
		});
	});
});

/***********/
/* HELPERS */
/***********/

function saveChanges() {
	let matchingPatterns = document.querySelector("#matchingPatterns textarea").value;
	let exclusionPatterns = document.querySelector("#exclusionPatterns textarea").value;
	chrome.storage.sync.set({
		"matchingPatterns": matchingPatterns,
		"exclusionPatterns": exclusionPatterns
	}, () => {
		document.querySelectorAll("button").forEach(button => {
			button.disabled = true;
		});
	});
}

function resetChanges() {
	chrome.storage.sync.get([ "matchingPatterns", "exclusionPatterns" ], (result) => {
		document.querySelector("#matchingPatterns textarea").value = result.matchingPatterns;
		document.querySelector("#exclusionPatterns textarea").value = result.exclusionPatterns;
		document.querySelectorAll("button").forEach(button => {
			button.disabled = true;
		});
	});
}

/******************/
/* INITIALIZATION */
/******************/

resetChanges();

document.querySelector("#matchingPatterns textarea").focus();