Remove data.js and substitute data.json

public/js/data.js

@@ -1,95 +0,0 @@
-var BOOKS = {
-    "bible": [
-        "Genesis",
-        "Exodus",
-        "Leviticus",
-        "Numbers",
-        "Deuteronomy",
-        "Joshua",
-        "Judges",
-        "Ruth",
-        "1 Samuel",
-        "2 Samuel",
-        "1 Kings",
-        "2 Kings",
-        "1 Chronicles",
-        "2 Chronicles",
-        "Ezra",
-        "Nehemiah",
-        "Esther",
-        "Job",
-        "Psalms",
-        "Proverbs",
-        "Ecclesiastes",
-        "Song of Solomon",
-        "Isaiah",
-        "Jeremiah",
-        "Lamentations",
-        "Ezekiel",
-        "Daniel",
-        "Hosea",
-        "Joel",
-        "Amos",
-        "Obadiah",
-        "Jonah",
-        "Micah",
-        "Nahum",
-        "Habakkuk",
-        "Zephaniah",
-        "Haggai",
-        "Zechariah",
-        "Malachi",
-        "Matthew",
-        "Mark",
-        "Luke",
-        "John",
-        "Acts",
-        "Romans",
-        "1 Corinthians",
-        "2 Corinthians",
-        "Galatians",
-        "Ephesians",
-        "Philippians",
-        "Colossians",
-        "1 Thessalonians",
-        "2 Thessalonians",
-        "1 Timothy",
-        "2 Timothy",
-        "Titus",
-        "Philemon",
-        "Hebrews",
-        "James",
-        "1 Peter",
-        "2 Peter",
-        "1 John",
-        "2 John",
-        "3 John",
-        "Jude",
-        "Revelation"
-    ],
-    "creed": {
-        "apc": "Apostle's Creed",
-        "nc": "Nicene Creed",
-        "atc": "Athanasian Creed",
-        "dc": "Definition of Chalcedon",
-        "fc": "French Confession"
-    },
-    "bc": [
-        1, 37
-    ],
-    "hc": [
-        1, 52
-    ],
-    "cd": [
-        "1", "2", "3", "5", "Conclusion"
-    ],
-    "wcf": [
-        1, 33
-    ],
-    "wsc": [
-        1, 107
-    ],
-    "wlc": [
-        1, 196
-    ]
-};

public/js/script.js

@@ -6,6 +6,22 @@ let saved = false;
 let textDirty = false;
 let saveTimeout = 10000;
 var to = null;
+let controller;
+var BOOKS = {};
+
+fetch('/js/data.json')
+    .then((res) => {
+        if (!res.ok) {
+            throw new Error('HTTP Error: Status: ${res.status}');
+        }
+        return res.json();
+    })
+    .then((data) => {
+        BOOKS = data;
+    })
+    .catch((error) => {
+        console.log(error);
+    })
 
 document.addEventListener('keyup', function (event) {
     if (event.key == "F3") {
@@ -141,6 +157,10 @@ function saveNote(event) {
         return;
     }
 
+    let saveCheck = document.querySelector('#save-check');
+
+    startSave();
+
     var note = {
         id: document.querySelector("#noteId").value,
         date: document.querySelector('#noteDate').value,
@@ -151,16 +171,17 @@ function saveNote(event) {
         note: document.querySelector('#notes').value,
         refs: references
     };
-    fetch('/index.php/save-note', {
+    $.ajax({
+        url: '/index.php/save-note',
         method: 'POST',
-        headers: {
+        contentType: 'application/json',
-            "Content-Type": 'application/json'
+        data: JSON.stringify(note),
-        },
+        dataType: 'json',
-        body: JSON.stringify(note)
+        timeout: 5000
     })
-        .then(response => response.json())
+        .done(function (data) {
-        .then(data => {
             if (data.msg == 'saved' && !saved) {
+                saveCheck.classList.remove('saving');
                 showSave();
                 saved = true;
                 textDirty = false;
@@ -171,8 +192,19 @@ function saveNote(event) {
                 }
             }
         })
-        .catch(error => console.log(error))
+        .fail(function (data) {
-        .finally(() => function () { clearTimeout(to); to = setTimeout(saveNote, saveTimeout); });
+            saveCheck.classList.remove('saving');
+            saveCheck.classList.add('error');
+            console.error(data);
+        })
+        .always(function (xhr, status) {
+            if (status == 'timeout') {
+                saveCheck.classList.remove('saving');
+                saveCheck.classList.add('error');
+            }
+            clearTimeout(to);
+            to = setTimeout(saveNote, saveTimeout);
+        });
 }
 
 function validateNote() {
@@ -198,6 +230,11 @@ function isUuidValid(uuid) {
     return regex.test(uuid);
 }
 
+function startSave() {
+    document.querySelector('#save-check').classList.add('saving');
+    document.querySelector('#save-check').style.opacity = 1;
+}
+
 /**
  * Displays a checkmark animation on the screen.
  *
@@ -213,10 +250,10 @@ function showSave() {
     var si = setInterval(function () {
         // Increment the opacity of the checkmark by 0.01 each time
         op = parseFloat(checkmark.style.opacity);
-        checkmark.style.opacity = op + 0.1;
+        checkmark.style.opacity = op - 0.1;
 
         // If the opacity is greater than or equal to 1, reset it back to 0 and stop the animation
-        if (checkmark.style.opacity >= 1) {
+        if (checkmark.style.opacity == 0.1) {
             checkmark.style.opacity = 0;
             clearInterval(si);
             saved = false;
@@ -479,21 +516,22 @@ function toggleFields() {
     const showHideBtn = document.getElementById('show-hide-btn');
 
     if (fieldsContainer.classList.contains('show')) {
-        // Hide the fields when the button says "Show Fields"
         fieldsContainer.classList.remove('show');
         fieldsContainer.style.display = 'none';
-        showHideBtn.textContent = 'Show';
+        showHideBtn.classList.remove('active');
     } else {
-        // Show the fields when the button says "Hide Fields"
         fieldsContainer.classList.add('show');
         fieldsContainer.style.display = 'block';
-        showHideBtn.textContent = 'Hide';
+        showHideBtn.classList.add('active');
     }
 
     setHeight();
 }
 
 function retrieveBooks() {
+    document.querySelector('#chapter-range').innerText = '';
+    document.querySelector('#verse-range').innerText = '';
+    document.querySelector('#referenceSearch').value = '';
     const selectedType = document.querySelector('#referenceType').value;
     if (!selectedType) { return; }
 
@@ -507,7 +545,7 @@ function retrieveBooks() {
         bookList.appendChild(none);
         for (var x in BOOKS.bible) {
             var newBook = document.createElement("option");
-            newBook.text = BOOKS.bible[x];
+            newBook.text = x;
             bookList.appendChild(newBook);
         }
     } else if (selectedType == 'creed') {
@@ -547,6 +585,39 @@ function retrieveBooks() {
     }
 }
 
+function filterBooks() {
+    document.querySelector('#chapter-range').innerText = '';
+    document.querySelector('#verse-range').innerText = '';
+    if (document.querySelector('#referenceType').value != 'bible') {
+        return;
+    }
+
+    var bookList = document.querySelector('#referenceBook');
+    var book = BOOKS.bible[bookList.value];
+    var max = Object.keys(book).length;
+
+    var chapterRange = document.querySelector('#chapter-range');
+    chapterRange.innerText = 'Chapters: ' + max;
+}
+
+function filterVerse() {
+    if (document.querySelector('#referenceType').value != 'bible') {
+        return;
+    }
+
+    var bookList = document.querySelector('#referenceBook').value;
+    var search = document.querySelector('#referenceSearch').value;
+    var chapter = search.split(':')[0];
+    var verseRange = document.querySelector('#verse-range');
+
+    if (!BOOKS.bible[bookList] || !BOOKS.bible[bookList][chapter]) {
+        verseRange.innerText = 'Unknown Chapter';
+        return;
+    }
+    var verse = BOOKS.bible[bookList][chapter];
+    verseRange.innerText = 'Verse: ' + verse;
+}
+
 function retrieveReference(el) {
     fetch('/index.php/get-reference', {
         method: "POST",
@@ -600,14 +671,14 @@ function previewNote() {
 
     notePreview.innerHTML = md.render(markdownPreview);
 
-    if (previewButton.value == 'Preview') {
+    if (previewButton.classList.contains('active')) {
-        previewButton.value = 'Hide Preview';
-        noteText.style.display = 'none';
-        notePreview.style.display = 'block';
-    } else {
-        previewButton.value = 'Preview';
         noteText.style.display = 'block';
         notePreview.style.display = 'none';
+        previewButton.classList.remove('active');
+    } else {
+        noteText.style.display = 'none';
+        notePreview.style.display = 'block';
+        previewButton.classList.add('active');
     }
 
     findLinks();
@@ -703,8 +774,8 @@ function showPassage(event, text) {
     popup.innerHTML = md.render(text);
 
     // Position the popup relative to the cursor
-    let x = event.clientX + window.pageXOffset;
+    let x = event.clientX + window.scrollX;
-    let y = event.clientY + window.pageYOffset;
+    let y = event.clientY + window.scrollY;
 
     // Set the position of the popup element
     popup.style.top = `${y}px`;