From 5ce588f52955f321fc1e6430a2e534bee73ec3e9 Mon Sep 17 00:00:00 2001 From: n-peugnet Date: Thu, 13 Jun 2019 20:39:22 +0200 Subject: first add of ajax form submission (not tested) --- assets/js/edit.js | 21 ++++++++++++++++++--- 1 file changed, 18 insertions(+), 3 deletions(-) (limited to 'assets') diff --git a/assets/js/edit.js b/assets/js/edit.js index b0f8915..13c227b 100644 --- a/assets/js/edit.js +++ b/assets/js/edit.js @@ -11,7 +11,10 @@ window.onload = () => { inputs[i].oninput = changeHandler; } - form.onsubmit = submitHandler; + form.addEventListener("submit", function (event) { + event.preventDefault(); + submitHandler(this); + }); window.onkeydown = keyboardHandler; window.onbeforeunload = confirmExit; @@ -51,10 +54,22 @@ function changeHandler(e) { /** * Manage submit event - * @param {Event} e + * @param {HTMLFormElement} form */ -function submitHandler(e) { +function submitHandler(form) { unsavedChanges = false; + + var xhr = new XMLHttpRequest(); + var fd = new FormData(form); + + xhr.addEventListener("load", function(event) { + alert(event.target.responseText); + }); + xhr.addEventListener("error", function(event) { + alert('Oups! Quelque chose s\'est mal passé.'); + }); + xhr.open(form.method, form.action); + xhr.send(fd); } /** -- cgit v1.2.3 From fd4838740744ac167bedb01dd00bc8aaed066e5b Mon Sep 17 00:00:00 2001 From: n-peugnet Date: Thu, 13 Jun 2019 21:08:47 +0200 Subject: =?UTF-8?q?un=20peu=20chlagos=20le=20alert=20mais=20=C3=A7a=20marc?= =?UTF-8?q?he?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- assets/js/edit.js | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) (limited to 'assets') diff --git a/assets/js/edit.js b/assets/js/edit.js index 13c227b..5d80743 100644 --- a/assets/js/edit.js +++ b/assets/js/edit.js @@ -36,8 +36,7 @@ function keyboardHandler(e) { switch (e.key) { case 's': e.preventDefault(); - unsavedChanges = false; - form.submit(); + submitHandler(form); return false; } } @@ -63,10 +62,10 @@ function submitHandler(form) { var fd = new FormData(form); xhr.addEventListener("load", function(event) { - alert(event.target.responseText); + alert("updated"); }); xhr.addEventListener("error", function(event) { - alert('Oups! Quelque chose s\'est mal passé.'); + alert('Error while trying to update.'); }); xhr.open(form.method, form.action); xhr.send(fd); -- cgit v1.2.3 From 588dab7350c3077d60ccc21d55aedf77da770f18 Mon Sep 17 00:00:00 2001 From: n-peugnet Date: Sun, 20 Oct 2019 19:37:10 +0200 Subject: remove deprecated editby worker --- assets/js/edit.js | 27 --------------------------- assets/js/worker.js | 37 ------------------------------------- 2 files changed, 64 deletions(-) delete mode 100644 assets/js/worker.js (limited to 'assets') diff --git a/assets/js/edit.js b/assets/js/edit.js index 5d80743..956250e 100644 --- a/assets/js/edit.js +++ b/assets/js/edit.js @@ -1,7 +1,6 @@ let form; let unsavedChanges = false; const pageurl = basepath + pageid; -const myWorker = new Worker(jspath + 'worker.js'); window.onload = () => { form = document.getElementById('update'); @@ -17,12 +16,6 @@ window.onload = () => { }); window.onkeydown = keyboardHandler; window.onbeforeunload = confirmExit; - - myWorker.postMessage({ - type: 'init', - pageurl: pageurl, - }); - myWorker.postMessage({ type: 'stillEditing' }); }; /** @@ -77,26 +70,6 @@ function submitHandler(form) { */ function confirmExit(e) { if (unsavedChanges) { - const url = pageurl + '/removeeditby'; - console.log('send quit editing') - fetch(url, { method: 'POST' }) - .then(handleErrors) - .then((response) => { - console.log(response); - setTimeout(() => { - myWorker.postMessage({ type: 'stillEditing' }); - }, 1500); - }); return 'You have unsaved changes, do you really want to leave this page?'; - } else { - myWorker.postMessage({ type: 'quitEditing' }); - } -} - -async function handleErrors(response) { - if (!response.ok) { - const data = await response.json(); - throw Error(`${response.statusText}. ${data.message}`); } - return response.json(); } diff --git a/assets/js/worker.js b/assets/js/worker.js deleted file mode 100644 index d60fdf1..0000000 --- a/assets/js/worker.js +++ /dev/null @@ -1,37 +0,0 @@ -let pageurl; - -onmessage = function (e) { - switch (e.data.type) { - case 'init': - pageurl = e.data.pageurl; - break; - case 'stillEditing': - stillEditing(); - break; - case 'quitEditing': - quitEditing(); - break; - }; -} - -function stillEditing() { - console.log('send still editing'); - const url = pageurl + '/editby'; - const req = new XMLHttpRequest(); - req.open('POST', url, false); - req.send(null); - - const res = JSON.parse(req.responseText); - console.log(res); -} - -function quitEditing() { - console.log('send quit editing'); - const url = pageurl + '/removeeditby'; - const req = new XMLHttpRequest(); - req.open('POST', url, false); - req.send(null); - - const res = JSON.parse(req.responseText); - console.log(res); -} \ No newline at end of file -- cgit v1.2.3 From 229f7ff95ef2578adc280022e70284ec80e3dc17 Mon Sep 17 00:00:00 2001 From: n-peugnet Date: Sun, 20 Oct 2019 19:39:14 +0200 Subject: small fixes on ajax form submission - use only oninput change event - dont update unsavedchanges if toggle class - dont update unsavedchanges if ajax request fails --- assets/js/edit.js | 11 ++++++----- 1 file changed, 6 insertions(+), 5 deletions(-) (limited to 'assets') diff --git a/assets/js/edit.js b/assets/js/edit.js index 956250e..92a09b1 100644 --- a/assets/js/edit.js +++ b/assets/js/edit.js @@ -6,7 +6,6 @@ window.onload = () => { form = document.getElementById('update'); let inputs = form.elements; for (i = 0; i < inputs.length; i++) { - inputs[i].onchange = changeHandler; inputs[i].oninput = changeHandler; } @@ -25,8 +24,8 @@ window.onload = () => { function keyboardHandler(e) { if (e.composed) { if (e.ctrlKey) { - // console.log(e.key); switch (e.key) { + // ctrl + s case 's': e.preventDefault(); submitHandler(form); @@ -38,9 +37,12 @@ function keyboardHandler(e) { /** * Manage change event - * @param {Event} e + * @param {InputEvent} e */ function changeHandler(e) { + if(e.target.classList.contains("toggle")) { + return; + } unsavedChanges = true; } @@ -49,12 +51,11 @@ function changeHandler(e) { * @param {HTMLFormElement} form */ function submitHandler(form) { - unsavedChanges = false; - var xhr = new XMLHttpRequest(); var fd = new FormData(form); xhr.addEventListener("load", function(event) { + unsavedChanges = false; alert("updated"); }); xhr.addEventListener("error", function(event) { -- cgit v1.2.3