upd: note.js

migrate from old to new
This commit is contained in:
2026-06-13 12:14:36 -04:00
parent 2b2b2aaec5
commit 537940e394
+119 -25
View File
@@ -1,5 +1,65 @@
import { state } from './state.js';
import { toggleFields } from './home.js';
import { toggleFields, makeButton } from './home.js';
var failureCount = state.saveFailureCount;
/**
* Retrieves a note from the server based on the provided ID.
*
* @param {string} id - The ID of the note to retrieve.
* @param {boolean} [runOpen=true] - Whether to open the note sidebar after retrieving the note.
* @return {Promise<void>} A promise that resolves when the note is successfully retrieved and the UI is updated.
*/
export function retrieveNote(id, runOpen = true) {
fetch('/get-note', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({
'id': id
})
})
.then(response => response.json())
.then(result => {
var dt = new Date(result.date.date);
document.querySelector('#notes').value = result.text;
document.querySelector('#passage').value = result.passage;
document.querySelector('#series').value = result.series.id;
document.querySelector('#speaker').value = result.speaker.id;
document.querySelector('#noteTitle').value = result.title;
document.querySelector('#noteDate').value = '';
document.querySelector('#noteDate').value =
(dt.getMonth() < 9 ? '0' + (dt.getMonth() + 1) : (dt.getMonth() + 1)) + '/' +
(dt.getDate() < 10 ? '0' + dt.getDate() : dt.getDate()) + '/' +
dt.getFullYear();
document.querySelector('#noteId').value = result.id;
if (result.recording) {
document.querySelector('#recording').value = result.recording;
}
if (result.refs) {
state.references = result.refs;
}
const list = document.querySelector('#ref-list');
list.innerHTML = '';
var newList = null;
for (var x in state.references) {
var newList = document.createElement('li');
newList.className = 'tab';
var button = makeButton(x);
newList.appendChild(button);
list.appendChild(newList);
}
if (runOpen) {
note.openNote(false);
}
});
}
/**
* Toggles the visibility of the note list and reference elements.
@@ -9,7 +69,7 @@ import { toggleFields } from './home.js';
*/
export function openNote(openSidebar = true) {
const noteList = document.querySelector('#note-list');
const refs = document.querySelector('#ref');
const refs = document.querySelector('#ref-text');
if (noteList.style.display == 'block') {
noteList.style.display = 'none';
@@ -19,8 +79,8 @@ export function openNote(openSidebar = true) {
refs.style.display = 'none';
}
if (openSidebar) {
document.querySelector('.toggle').click();
if (openSidebar && !document.querySelector('.container').classList.contains('sidebar-collapsed')) {
document.querySelector('.container').classList.add('sidebar-collapsed');
}
}
@@ -51,7 +111,7 @@ export function showSave() {
// Schedule the animation to run every 1 second (which is equivalent to a 1-second delay between each iteration)
var si = setInterval(function () {
// Increment the opacity of the checkmark by 0.01 each time
op = parseFloat(checkmark.style.opacity);
let op = parseFloat(checkmark.style.opacity);
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
@@ -144,9 +204,9 @@ export function newNote() {
state.references = {};
state.saved = true;
state.textDirty = false;
document.querySelector('#note-header-left h2').classList.remove('dirty');
document.querySelector('.note-header-column h2').classList.remove('dirty');
dt = new Date();
var dt = new Date();
document.querySelector('#noteDate').value = dt.getFullYear() + '-' +
(dt.getMonth() < 9 ? '0' + (dt.getMonth() + 1) : (dt.getMonth() + 1)) + '-' +
(dt.getDate() < 10 ? '0' + dt.getDate() : dt.getDate());
@@ -159,8 +219,8 @@ export function newNote() {
document.querySelector('#noteId').value = '';
document.querySelector('#ref-list').innerHTML = '';
document.querySelector('#ref').innerHTML = '';
document.querySelector('.toggle').click();
document.querySelector('#ref-text').innerHTML = '';
document.querySelector('.container').classList.add('sidebar-collapsed');
}
/**
@@ -208,7 +268,7 @@ export function saveNote(event) {
passage: document.querySelector('#passage').value,
note: document.querySelector('#notes').value,
recording: document.querySelector('#recording').value,
refs: references
refs: state.references
};
$.ajax({
url: '/save-note',
@@ -220,14 +280,13 @@ export function saveNote(event) {
})
.done(function (data) {
if (data.msg == 'saved' && !state.saved) {
state.saveFailureCount = SAVE_FAILURE_LIMIT;
saveCheck.classList.remove('saving', 'error', 'fa-times-circle', 'fa-save');
showSave();
if (noteText == document.querySelector('#notes').value) {
state.saved = true;
state.textDirty = false;
document.querySelector('note-header h2').classList.remove('dirty');
document.querySelector('mobile-note-header h2').classList.remove('dirty');
document.querySelector('.note-header h2').classList.remove('dirty');
document.querySelector('.mobile-note-header h2').classList.remove('dirty');
}
if (data.new) {
@@ -236,7 +295,7 @@ export function saveNote(event) {
}
})
.fail(function (xhr, status, error) {
state.saveFailureCount--;
state.failureCount--;
saveCheck.classList.remove('saving', 'fa-save');
saveCheck.classList.add('fa-times-circle', 'error');
console.error(error);
@@ -246,11 +305,11 @@ export function saveNote(event) {
saveCheck.classList.remove('saving', 'fa-save');
saveCheck.classList.add('error', 'fa-times-circle');
}
clearTimeout(to);
if (state.saveFailureCount > 0) {
clearTimeout(state.to);
if (state.failureCount > 0) {
state.to = setTimeout(saveNote, state.saveInterval);
} else {
state.saveFailureCount = SAVE_FAILURE_LIMIT;
state.failureCount = state.saveFailureCount;
}
});
}
@@ -281,6 +340,8 @@ export function findRefLinks() {
})
.then(response => response.text())
.then(result => {
let psg, book, cv;
passage = passage.replace(/\+/g, ' ');
psg = passage.split(' ');
if (psg.length > 2) {
@@ -292,8 +353,8 @@ export function findRefLinks() {
}
showPassage(
e,
"<button onclick='closePopup()'>Close</button>&nbsp;&nbsp;" +
"<button onclick=\"queryRef('bible', '" + book + "', '" + cv + "')\">Open Ref</button><br/>" +
"<button onclick='note.closePopup()'>Close</button>&nbsp;&nbsp;" +
"<button onclick=\"ref.queryRef('bible', '" + book + "', '" + cv + "')\">Open Ref</button><br/>" +
result);
});
});
@@ -339,30 +400,63 @@ export function findLinks() {
}
showPassage(
e,
"<button onclick='home.closePopup()'>Close</button>&nbsp;&nbsp;" +
"<button onclick=\"home.queryRef('bible', '" + book + "', '" + cv + "')\">Open Ref</button><br/>" +
"<button onclick='note.closePopup()'>Close</button>&nbsp;&nbsp;" +
"<button onclick=\"ref.queryRef('bible', '" + book + "', '" + cv + "')\">Open Ref</button><br/>" +
result);
});
});
}
}
/**
* Shows a passage in a popup element relative to the cursor position.
*
* @param {Event} event - The event that triggered the function.
* @param {string} text - The text to be displayed in the popup.
* @return {void} This function does not return a value.
*/
export function showPassage(event, text) {
// Create a new div element for the popup
const popup = document.querySelector('#passage-popup');
popup.innerHTML = state.md.render(text);
// Position the popup relative to the cursor
let x = event.clientX + window.scrollX;
let y = event.clientY + window.scrollY;
// Set the position of the popup element
popup.style.top = `${y}px`;
popup.style.left = `${x}px`;
popup.style.display = 'block';
}
/**
* Closes the passage popup by clearing its content and hiding it.
*
* @return {void} This function does not return anything.
*/
export function closePopup() {
const popup = document.querySelector('#passage-popup');
popup.innerHTML = '';
popup.style.display = 'none';
}
/**
* Opens the share note functionality.
*/
export function openShareNote() {
var id = document.querySelector('#noteId').value;
let id = document.querySelector('#noteId').value;
if (!id) {
alert('No Open Note Found');
return;
}
bd = document.querySelector('#modal-backdrop');
let bd = document.querySelector('#modal-backdrop');
bd.style.display = 'block';
cont = document.querySelector('#modal-container');
let cont = document.querySelector('#modal-container');
cont.style.display = bd.style.display;
emailCont = document.querySelector('#modal-container');
let emailCont = document.querySelector('#modal-container');
emailCont.style.left = ((window.innerWidth / 2) - (emailCont.clientWidth / 2)) + 'px';
emailCont.style.top = ((window.innerHeight / 2) - (emailCont.clientHeight / 2)) + 'px';
}