add edit script for improved edition comfort

3 files changed, 68 insertions, 0 deletions

diff --git a/app/class/model.php b/app/class/model.php
index da5e8bc..b3d5274 100644
--- a/app/class/model.php
+++ b/app/class/model.php
@@ -4,6 +4,7 @@ abstract class Model
 
     const CONFIG_FILE = 'config.json';
 	const CSS_DIR = 'assets' . DIRECTORY_SEPARATOR .'css' . DIRECTORY_SEPARATOR;
+	const JS_DIR = 'assets' . DIRECTORY_SEPARATOR .'js' . DIRECTORY_SEPARATOR;
 	const FONT_DIR = 'fonts' . DIRECTORY_SEPARATOR;
 	const MEDIA_DIR = 'media' . DIRECTORY_SEPARATOR;
 	const FAVICON_DIR = 'media' . DIRECTORY_SEPARATOR . 'favicon' . DIRECTORY_SEPARATOR;
@@ -49,6 +50,11 @@ abstract class Model
 		return self::dirtopath(Model::CSS_DIR);
 	}
 
+	public static function jspath() 
+	{
+		return self::dirtopath(Model::JS_DIR);
+	}
+
 	public static function mediapath()
 	{
 		return self::dirtopath(Model::MEDIA_DIR);
diff --git a/app/view/templates/edit.php b/app/view/templates/edit.php
index c220678..e01846e 100644
--- a/app/view/templates/edit.php
+++ b/app/view/templates/edit.php
@@ -23,6 +23,8 @@
 </form>
 
 </main>
+
+<script src="<?= Model::jspath() ?>edit.js"></script>
 </body>
 
 <?php $this->stop('page') ?>
\ No newline at end of file
diff --git a/assets/js/edit.js b/assets/js/edit.js
new file mode 100644
index 0000000..6a652ad
--- /dev/null
+++ b/assets/js/edit.js
@@ -0,0 +1,60 @@
+let form;
+let unsavedChanges = false;
+
+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;
+    }
+
+    form.onsubmit = submitHandler;
+    window.onkeydown = keyboardHandler;
+    window.onbeforeunload = confirmExit;
+};
+
+/**
+ * Manage a keyboardEvent
+ * @param {KeyboardEvent} e 
+ */
+function keyboardHandler(e) {
+    if (e.composed) {
+        if (e.ctrlKey) {
+            // console.log(e.key);
+            switch (e.key) {
+                case 's':
+                    form.submit();
+                    return false;
+            }
+        }
+    }
+}
+
+/**
+ * Manage change event
+ * @param {Event} e 
+ */
+function changeHandler(e) {
+    unsavedChanges = true;
+    // console.log({unsavedChanges});
+}
+
+/**
+ * Manage submit event
+ * @param {Event} e 
+ */
+function submitHandler(e) {
+    unsavedChanges = false;
+}
+
+/**
+ * Manage a beforeUnloadEvent
+ * @param {BeforeUnloadEvent} e 
+ */
+function confirmExit(e) {
+    // console.log({unsavedChanges});
+    if (unsavedChanges) {
+        return "You have attempted to leave this page. Are you sure?";
+    }
+}
\ No newline at end of file