Fix inline handlers

3 files changed, 61 insertions, 28 deletions

diff --git a/js/editredirect.js b/js/editredirect.js
index 08070b5..41944a4 100644
--- a/js/editredirect.js
+++ b/js/editredirect.js
@@ -9,8 +9,7 @@ function createNewRedirect() {
 	el('#btn-save-redirect').setAttribute('disabled', 'disabled');
 }
 
-function editRedirect(ev) {
-	let index = indexFromClickEvent(ev);
+function editRedirect(index) {
 	el('#edit-redirect-form h3').innerHTML = 'Edit Redirect';
 	activeRedirect = new Redirect(REDIRECTS[index]); //Make a new one, which we can dump a bunch of stuff on...
 	activeRedirect.existing = true;
@@ -41,7 +40,8 @@ function saveRedirect() {
 	hideForm('#edit-redirect-form');
 }
 
-function toggleAdvancedOptions() {
+function toggleAdvancedOptions(ev) {
+	ev.preventDefault();
 	let advancedOptions = el('.advanced');
 	if (advancedOptions.classList.contains('hidden')) {
 		advancedOptions.classList.remove('hidden');
@@ -52,9 +52,8 @@ function toggleAdvancedOptions() {
 	}
 }
 
-//Listen to any change from the edit form...
-el('#edit-redirect-form').addEventListener('input', function(ev) {
 
+function editFormChange() {
 	//Now read values back from the form...
 	for (let input of el('#edit-redirect-form').querySelectorAll('input[type="text"][data-bind]')) {
 		let prop = input.getAttribute('data-bind');
@@ -72,12 +71,13 @@ el('#edit-redirect-form').addEventListener('input', function(ev) {
 	activeRedirect.updateExampleResult();
 
 	dataBind('#edit-redirect-form', activeRedirect);
-});
+}
+
 
 
 var deleteIndex;
-function confirmDeleteRedirect(ev) {
-	deleteIndex = indexFromClickEvent(ev);
+function confirmDeleteRedirect(index) {
+	deleteIndex = index;
 	let redirect = REDIRECTS[deleteIndex];
 	showForm('#delete-redirect-form', redirect);
 }
@@ -93,4 +93,23 @@ function deleteRedirect() {
 
 function cancelDelete() {
 	hideForm('#delete-redirect-form');
-}
\ No newline at end of file
+}
+
+
+function setupEditAndDeleteEventListeners() {
+
+	el('#btn-save-redirect').addEventListener('click', saveRedirect);
+	el('#btn-cancel-edit').addEventListener('click', cancelEdit);
+
+	el('#confirm-delete').addEventListener('click', deleteRedirect);
+	el('#cancel-delete').addEventListener('click', cancelDelete);
+
+	el('#advanced-toggle a').addEventListener('click', toggleAdvancedOptions);	
+
+	el('#create-new-redirect').addEventListener('click', createNewRedirect);
+	//Listen to any change from the edit form...
+	el('#edit-redirect-form').addEventListener('input', editFormChange);
+}
+
+
+setupEditAndDeleteEventListeners();
\ No newline at end of file
diff --git a/js/importexport.js b/js/importexport.js
index c47b71d..c3e79dd 100644
--- a/js/importexport.js
+++ b/js/importexport.js
@@ -86,4 +86,11 @@ function updateExportLink() {
 	el('#export-link').href = 'data:text/plain;charset=utf-8,' + encodeURIComponent(json); 
 }
 
-updateExportLink();
\ No newline at end of file
+updateExportLink();
+
+function setupImportExportEventListeners() {
+	el("#import-file").addEventListener('change', importRedirects);
+	el("#export-link").addEventListener('mousedown', updateExportLink);
+}
+
+setupImportExportEventListeners();
\ No newline at end of file
diff --git a/js/redirectorpage.js b/js/redirectorpage.js
index fd5be8c..482838f 100644
--- a/js/redirectorpage.js
+++ b/js/redirectorpage.js
@@ -99,12 +99,7 @@ function updateBindings() {
 	}
 }
 
-function indexFromClickEvent(ev) {
-	return parseInt(ev.target.getAttribute('data-index') || ev.target.parentNode.getAttribute('data-index'));
-}
-
-function duplicateRedirect(ev) {
-	let index = indexFromClickEvent(ev);
+function duplicateRedirect(index) {
 	let redirect = new Redirect(REDIRECTS[index]);
 	REDIRECTS.splice(index, 0, redirect);
 
@@ -115,8 +110,7 @@ function duplicateRedirect(ev) {
 	saveChanges();
 }
 
-function toggleDisabled(ev) {
-	let index = indexFromClickEvent(ev);
+function toggleDisabled(index) {
 	let redirect = REDIRECTS[index];
 	redirect.disabled = !redirect.disabled
 	updateBindings();
@@ -124,11 +118,7 @@ function toggleDisabled(ev) {
 }
 
 
-function moveUp(ev) {
-	if (ev.target.classList.contains('disabled')) {
-		return;
-	}
-	let index = indexFromClickEvent(ev);
+function moveUp(index) {
 	let prev = REDIRECTS[index-1];
 	REDIRECTS[index-1] = REDIRECTS[index];
 	REDIRECTS[index] = prev;
@@ -136,11 +126,7 @@ function moveUp(ev) {
 	saveChanges();
 }
 
-function moveDown(ev) {
-	if (ev.target.classList.contains('disabled')) {
-		return;
-	}
-	let index = indexFromClickEvent(ev);
+function moveDown(index) {
 	let next = REDIRECTS[index+1];
 	REDIRECTS[index+1] = REDIRECTS[index];
 	REDIRECTS[index] = next;
@@ -171,6 +157,27 @@ function pageLoad() {
 	if(navigator.userAgent.toLowerCase().indexOf("chrome") > -1){
 		show('#storage-sync-option');
 	}
+
+
+	//Setup event listeners
+	el('#hide-message').addEventListener('click', hideMessage);
+	el('#storage-sync-option input').addEventListener('click', toggleSyncSetting);
+
+	el('.redirect-rows').addEventListener('click', function(ev) {
+		let action = ev.target.getAttribute('data-action');
+
+		//We clone and re-use nodes all the time, so instead of attaching and removing event handlers endlessly we just put
+		//a data-action attribute on them with the name of the function that should be called...
+		if (!action) {
+			return;
+		}
+
+		let handler = window[action];
+
+		let index = parseInt(ev.target.getAttribute('data-index'));
+
+		handler(index);
+	});
 }
 
 pageLoad();
\ No newline at end of file