From 8886f16a767e1f74b270befb4342857eeacc0fc6 Mon Sep 17 00:00:00 2001 From: Thomas Lange Date: Fri, 9 Jul 2021 23:05:55 +0200 Subject: Detect unsaved changes in content editor This commit adds a bit of JavaScript code to detect unsaved changes in the content editor when trying to leave the page. The browser's default confirmation dialog is shown when unsaved changes are detected. This currently only covers the textarea of the content editor, not the other form fields. There may be a better solution (like LocalStorage), but it works for the moment. I'll add it to my TODO list... --- theme/admin/rsrc/main.js | 31 +++++++++++++++++++++++++++++++ 1 file changed, 31 insertions(+) (limited to 'theme') diff --git a/theme/admin/rsrc/main.js b/theme/admin/rsrc/main.js index 842ef47..94fc591 100644 --- a/theme/admin/rsrc/main.js +++ b/theme/admin/rsrc/main.js @@ -158,3 +158,34 @@ if(document.getElementById("delete-button")) { } } })(); + +//============================================================================== +// Detect unsaved changes in content editor +//============================================================================== +(function() { + if(document.getElementById("content-editor")) { + const editor = document.getElementById("content-editor"); + const initialValue = editor.value; + + function showConfirmationPrompt(e) { + if(editor.value !== initialValue) { + e.returnValue = ''; + e.preventDefault(); + } + } + + window.addEventListener('beforeunload', showConfirmationPrompt); + + const buttons = []; + buttons.push(document.getElementById('insert-button')); + buttons.push(document.getElementById('update-button')); + + for(let i = 0; i < buttons.length; ++i) { + if(buttons[i] !== null) { + buttons[i].addEventListener('click', function() { + window.removeEventListener('beforeunload', showConfirmationPrompt); + }); + } + } + } +})(); -- cgit v1.2.3