diff --git a/public/js/script.js b/public/js/script.js index bfcab29..8de744d 100644 --- a/public/js/script.js +++ b/public/js/script.js @@ -1,9 +1,11 @@ // Get the link element const link = document.querySelector('.hamburger'); var converter = null; -var markdownit = null; +var md = null; var references = {}; let saved = false; +let textDirty = false; +let saveTimeout = 10000; // Add an event listener to the link if (link) { @@ -13,11 +15,22 @@ if (link) { }); } +document.addEventListener('keyup', function (event) { + if (event.key == "F3") { + openRef(); + } +}); + +document.querySelector('#notes').addEventListener('keyup', function (event) { + textDirty = true; + document.querySelector('#note-header-left h2').classList.add('dirty'); +}); + function setHeight() { converter = new showdown.Converter(); //converter.setFlavor(); - markdownit = new markdownit({ + md = new markdownit({ html: true, linkify: true, breaks: true @@ -45,12 +58,30 @@ function setHeight() { dt = new Date(); date.value = dt.getFullYear() + '-' + ((dt.getMonth() < 9) ? '0' + (dt.getMonth() + 1) : (dt.getMonth() + 1)) + '-' + dt.getDate(); - setTimeout(saveNote, 10000); + setTimeout(saveNote, saveTimeout); } function newNote() { - notes = document.querySelector('.notes'); - notes.textContent = ''; + notes = document.querySelector('#notes'); + notes.text = ''; + notes.value = ''; + references = {}; + saved = true; + textDirty = false; + document.querySelector('#note-header-left h2').classList.remove('dirty'); + + dt = new Date(); + document.querySelector('#noteDate').value = dt.getFullYear() + '-' + ((dt.getMonth() < 9) ? '0' + (dt.getMonth() + 1) : (dt.getMonth() + 1)) + '-' + dt.getDate(); + document.querySelector('#noteTitle').value = ''; + document.querySelector('#speaker').value = 0; + document.querySelector('#series').value = 0; + document.querySelector('#template').value = 0; + document.querySelector('#passage').value = ''; + document.querySelector('#noteId').value = uuidv4(); + + document.querySelector('#noteSearch').style.display = 'none'; + document.querySelector('#ref-list').innerHTML = ''; + document.querySelector('#ref').innerHTML = ''; } /** @@ -64,8 +95,8 @@ function saveNote(event) { event.preventDefault(); } - if (!validateNote()) { - setTimeout(saveNote, 5000); + if (!textDirty || !validateNote()) { + setTimeout(saveNote, saveTimeout); return; } @@ -76,7 +107,8 @@ function saveNote(event) { speaker: document.querySelector('#speaker').value, series: document.querySelector('#series').value, passage: document.querySelector('#passage').value, - note: document.querySelector('#notes').value + note: document.querySelector('#notes').value, + refs: references }; fetch('/index.php/save-note', { method: 'POST', @@ -90,10 +122,12 @@ function saveNote(event) { if (data.msg == 'saved' && !saved) { showSave(); saved = true; + textDirty = false; + document.querySelector('#note-header-left h2').classList.remove('dirty'); } }) .catch(error => console.log(error)); - setTimeout(saveNote, 10000); + setTimeout(saveNote, saveTimeout); } function validateNote() { @@ -105,7 +139,7 @@ function validateNote() { const id = document.querySelector('#noteId'); const psg = document.querySelector('#passage'); - if (!parseInt(id.value)) { return false; } + if (!isUuidV4Valid(id.value)) { return false; } if (!title.value.length) { return false; } if (!date.value) { return false; } if (!parseInt(speaker.value)) { return false; } @@ -116,6 +150,11 @@ function validateNote() { return true; } +function isUuidV4Valid(uuid) { + const regex = /^[a-f0-9]{8}-[a-f0-9]{4}-4[a-f0-9]{3}-[8|9|a|b][a-f0-9]{3}-[a-f0-9]{12}$/i; + return regex.test(uuid); +} + /** * Displays a checkmark animation on the screen. * @@ -267,7 +306,7 @@ function queryRef() { body: JSON.stringify({ 'type': type.value, 'book': book.value, - 'reference': input.value + 'reference': input.value, }) }) .then(response => response.text()) @@ -277,17 +316,7 @@ function queryRef() { const list = document.querySelector('#ref-list'); var newList = document.createElement('li'); newList.className = 'tab'; - var button = document.createElement('button'); - button.innerText = results.title; - button.onclick = function () { - document.querySelector('#ref').innerHTML = converter.makeHtml(references[button.innerText]); - } - button.ondblclick = function () { - document.querySelector('#ref').innerHTML = ''; - delete references[results.title]; - var list = button.parentElement; - list.remove(); - } + button = makeButton(results.title); newList.appendChild(button); list.appendChild(newList); @@ -297,13 +326,38 @@ function queryRef() { references[results.title] = results.text; input.value = ''; - document.querySelector('#referenceType').value = 0; - document.querySelector('#referenceBook').value = 0; + document.querySelector('#referenceType').value = ''; + document.querySelector('#referenceBook').value = ''; openRef(); - link.click(); + if (document.querySelector('ul.hamburger-list').classList.contains('menu-open')) { + link.click(); + } + saved = false; + textDirty = true; + saveNote(); }); } +function makeButton(title) { + var btn = document.createElement('button'); + btn.innerText = title; + btn.addEventListener('click', function () { + document.querySelector('#ref').innerHTML = converter.makeHtml(references[title]); + }); + + btn.addEventListener('dblclick', function () { + document.querySelector('#ref').innerHTML = ''; + delete references[title]; + var list = this.parentElement; + list.remove(); + saved = false; + textDirty = true; + saveNote(); + }); + + return btn; +} + function retrieveTemplate(orig, dest) { const temp = document.querySelector('#' + orig); if (temp.value == '0') { @@ -464,8 +518,14 @@ function previewNote() { var notePreview = document.querySelector('#notePreview'); var previewButton = document.querySelector('#previewBtn'); - //notePreview.innerHTML = converter.makeHtml(noteText.value); - notePreview.innerHTML = markdownit.render(noteText.value); + const title = document.querySelector('#noteTitle'); + const speaker = document.querySelector('#speaker'); + const passage = document.querySelector('#passage'); + + const markdownPreview = "# " + title.value + " - " + + speaker.options[speaker.selectedIndex].text + " - " + passage.value + "\n\n" + noteText.value; + + notePreview.innerHTML = md.render(markdownPreview); if (previewButton.value == 'Preview') { previewButton.value = 'Hide Preview'; @@ -482,7 +542,7 @@ function previewNote() { function findLinks() { var links = document.querySelector('#notePreview').querySelectorAll('a'); - alert(links.length); + //alert(links.length); } function showSearchNote(event) { @@ -519,5 +579,33 @@ function searchNote() { document.querySelector('#noteSearch').style.display = 'none'; link.click(); + + if (result.references) { + references = result.references; + } + + const list = document.querySelector('#ref-list'); + var newList = null; + for (var x in references) { + var newList = document.createElement('li'); + newList.className = 'tab'; + var button = makeButton(x); + newList.appendChild(button); + list.appendChild(newList); + } + }); +} + +/** + * Generates a random UUIDv4 string. + * + * @return {string} The generated UUIDv4 string. + */ +function uuidv4() { + return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx' + .replace(/[xy]/g, function (c) { + const r = Math.random() * 16 | 0, + v = c == 'x' ? r : (r & 0x3 | 0x8); + return v.toString(16); }); } \ No newline at end of file