upd: *.js
Refactor methods to other scripts
This commit is contained in:
parent
eb2366ebd8
commit
3f6d32b995
85
assets/js/reference.js
Normal file
85
assets/js/reference.js
Normal file
@ -0,0 +1,85 @@
|
||||
/**
|
||||
* Retrieves the reference type from the server and populates the reference series dropdown.
|
||||
*
|
||||
* @param {HTMLElement} el - The element that triggered the function.
|
||||
* @return {Promise} A promise that resolves with the response from the server.
|
||||
*/
|
||||
export function retrieveReferenceType(el) {
|
||||
fetch('/reference/' + el.value, {
|
||||
method: 'GET',
|
||||
header: {
|
||||
'Content-Type': 'application/json'
|
||||
}
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(results => {
|
||||
document.querySelector('#referenceSeries').innerHTML = '';
|
||||
var none = document.createElement('option');
|
||||
none.value = '';
|
||||
none.text = '-- Select --';
|
||||
document.querySelector('#referenceSeries').appendChild(none);
|
||||
|
||||
for (var x in results) {
|
||||
var newSeries = document.createElement('option');
|
||||
newSeries.value = results[x].id;
|
||||
newSeries.text = results[x].label;
|
||||
document.querySelector('#referenceSeries').appendChild(newSeries);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Retrieves a reference based on the provided element value.
|
||||
*
|
||||
* @param {Element} el - The element triggering the reference retrieval
|
||||
* @return {void} No return value
|
||||
*/
|
||||
export function retrieveReference(el) {
|
||||
if (el.value == 'new') {
|
||||
document.querySelector('#refName').style.display = 'inline-block';
|
||||
return;
|
||||
}
|
||||
fetch('/get-reference', {
|
||||
method: "POST",
|
||||
header: {
|
||||
"Content-Type": "application/json"
|
||||
},
|
||||
body: JSON.stringify({
|
||||
id: el.value
|
||||
})
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(results => {
|
||||
document.querySelector('#reference').value = results.text;
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Saves a reference by sending a POST request to the server with the selected type,
|
||||
* file, and text values. Displays an alert with the response message, and clears
|
||||
* the reference and file input fields.
|
||||
*
|
||||
* @return {Promise} A Promise that resolves with the response message from the server.
|
||||
*/
|
||||
export function saveReference() {
|
||||
let ref = document.querySelector('#referenceSeries');
|
||||
let cont = document.querySelector('#reference');
|
||||
fetch('/save-reference', {
|
||||
method: 'POST',
|
||||
header: {
|
||||
'Content-Type': 'application/json'
|
||||
},
|
||||
body: JSON.stringify({
|
||||
refId: ref.value,
|
||||
text: cont.value
|
||||
})
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(results => {
|
||||
//alert(results.msg);
|
||||
|
||||
document.querySelector('#reference').value = '';
|
||||
document.querySelector('#referenceType').value = '';
|
||||
document.querySelector('#referenceSeries').value = '';
|
||||
});
|
||||
}
|
@ -8,122 +8,6 @@ var to = null;
|
||||
let controller;
|
||||
var BOOKS = {};
|
||||
|
||||
$(function () {
|
||||
setHeight();
|
||||
setBooks();
|
||||
setEventListeners();
|
||||
$('#note-table').DataTable({
|
||||
paging: false,
|
||||
ajax: {
|
||||
url: '/get-notes',
|
||||
type: 'POST'
|
||||
},
|
||||
columns: [
|
||||
{ data: 'link' },
|
||||
{ data: 'speaker.name' },
|
||||
{ data: 'passage' },
|
||||
{
|
||||
data: 'date.date',
|
||||
render: DataTable.render.date("L")
|
||||
},
|
||||
]
|
||||
});
|
||||
$('#shareBtn').on('click', openShareNote);
|
||||
$('#modal-backdrop').on('click', closeShareNote);
|
||||
});
|
||||
|
||||
/**
|
||||
* Fetches data from '/js/data.json', assigns it to BOOKS, and handles errors.
|
||||
*
|
||||
* @return {void}
|
||||
*/
|
||||
function setBooks() {
|
||||
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);
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* Sets event listeners for keyup events on the document and the '#notes' element.
|
||||
*
|
||||
* @return {void}
|
||||
*/
|
||||
function setEventListeners() {
|
||||
document.addEventListener('keyup', function (event) {
|
||||
if (event.key == "F3") {
|
||||
openRef(false);
|
||||
}
|
||||
});
|
||||
|
||||
document.querySelector('#notes').addEventListener('keyup', function (event) {
|
||||
let key = event.keyCode;
|
||||
|
||||
if (key >= 48 && key <= 90 || key >= 96 && key <= 111 || key >= 186 && key <= 222) {
|
||||
textDirty = true;
|
||||
document.querySelector('#note-header-left h2').classList.add('dirty');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Sets the height of various elements on the page based on the window's inner height.
|
||||
* Also initializes a datepicker and event listener for the search input field.
|
||||
*
|
||||
* @return {void}
|
||||
*/
|
||||
function setHeight() {
|
||||
md = new markdownit({
|
||||
html: true,
|
||||
linkify: true,
|
||||
breaks: true
|
||||
});
|
||||
|
||||
body = document.querySelector('body');
|
||||
body.style.height = window.innerHeight + 'px';
|
||||
|
||||
cont = document.querySelector('#main');
|
||||
cont.style.height = (window.innerHeight) + 'px';
|
||||
|
||||
tabs = document.querySelector('.ref-tab');
|
||||
tabs.style.height = (window.innerHeight - 13) + 'px';
|
||||
|
||||
ref = document.querySelector('.ref');
|
||||
ref.style.height = (window.innerHeight - 60) + 'px';
|
||||
|
||||
noteList = document.querySelector('#note-list');
|
||||
noteList.style.height = (window.innerHeight - 60) + 'px';
|
||||
|
||||
notes = document.querySelector('.notes');
|
||||
notes.style.height = (window.innerHeight - 60) + 'px';
|
||||
|
||||
notePreview = document.querySelector('#notePreview');
|
||||
notePreview.style.height = (window.innerHeight - 50) + 'px';
|
||||
|
||||
if ($('#noteDate')) {
|
||||
$('#noteDate').datepicker();
|
||||
}
|
||||
|
||||
if ($('#query')) {
|
||||
document.querySelector('#query').addEventListener('keyup', function (event) {
|
||||
if (event.key == "Enter") {
|
||||
search();
|
||||
}
|
||||
});
|
||||
}
|
||||
if (!to) {
|
||||
to = setTimeout(saveNote, saveInterval);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Searches for notes based on the query entered in the search field.
|
||||
@ -619,56 +503,6 @@ function removeActiveRef() {
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Retrieves a template from the server and sets it as the value of a specified destination element.
|
||||
*
|
||||
* @param {string} orig - The ID of the element containing the original template value.
|
||||
* @param {string} dest - The ID of the destination element where the retrieved template will be set.
|
||||
* @return {Promise} A Promise that resolves when the template is successfully retrieved and set as the value of the destination element.
|
||||
*/
|
||||
function retrieveTemplate(orig, dest) {
|
||||
const temp = document.querySelector('#' + orig);
|
||||
if (temp.value == '0') {
|
||||
document.querySelector('#' + dest).value = '';
|
||||
return;
|
||||
}
|
||||
fetch('/retrieve-template', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'plain/text'
|
||||
},
|
||||
body: JSON.stringify({
|
||||
'template': temp.value
|
||||
})
|
||||
})
|
||||
.then(response => response.text())
|
||||
.then(results => {
|
||||
const div = document.querySelector('#' + dest);
|
||||
div.value = results;
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Saves the template by sending a POST request to the server with template data.
|
||||
*/
|
||||
function saveTemplate() {
|
||||
fetch('/save-template', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'plain/text'
|
||||
},
|
||||
body: JSON.stringify({
|
||||
'template_id': document.querySelector('#template_id').value,
|
||||
'template_name': document.querySelector('#template_name').value,
|
||||
'template_value': document.querySelector('#template_value').value,
|
||||
})
|
||||
})
|
||||
.then(response => response.text())
|
||||
.then(results => {
|
||||
alert(results);
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Toggles the visibility of the fields container and updates the active state of the show/hide button.
|
||||
*
|
||||
@ -843,93 +677,6 @@ function filterVerse() {
|
||||
verseRange.innerText = 'Verse: ' + verse;
|
||||
}
|
||||
|
||||
/**
|
||||
* Retrieves the reference type from the server and populates the reference series dropdown.
|
||||
*
|
||||
* @param {HTMLElement} el - The element that triggered the function.
|
||||
* @return {Promise} A promise that resolves with the response from the server.
|
||||
*/
|
||||
function retrieveReferenceType(el) {
|
||||
fetch('/reference/' + el.value, {
|
||||
method: 'GET',
|
||||
header: {
|
||||
'Content-Type': 'application/json'
|
||||
}
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(results => {
|
||||
document.querySelector('#referenceSeries').innerHTML = '';
|
||||
var none = document.createElement('option');
|
||||
none.value = '';
|
||||
none.text = '-- Select --';
|
||||
document.querySelector('#referenceSeries').appendChild(none);
|
||||
|
||||
for (var x in results) {
|
||||
var newSeries = document.createElement('option');
|
||||
newSeries.value = results[x].id;
|
||||
newSeries.text = results[x].label;
|
||||
document.querySelector('#referenceSeries').appendChild(newSeries);
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* Retrieves a reference based on the provided element value.
|
||||
*
|
||||
* @param {Element} el - The element triggering the reference retrieval
|
||||
* @return {void} No return value
|
||||
*/
|
||||
function retrieveReference(el) {
|
||||
if (el.value == 'new') {
|
||||
document.querySelector('#refName').style.display = 'inline-block';
|
||||
return;
|
||||
}
|
||||
fetch('/get-reference', {
|
||||
method: "POST",
|
||||
header: {
|
||||
"Content-Type": "application/json"
|
||||
},
|
||||
body: JSON.stringify({
|
||||
id: el.value
|
||||
})
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(results => {
|
||||
document.querySelector('#reference').value = results.text;
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Saves a reference by sending a POST request to the server with the selected type,
|
||||
* file, and text values. Displays an alert with the response message, and clears
|
||||
* the reference and file input fields.
|
||||
*
|
||||
* @return {Promise} A Promise that resolves with the response message from the server.
|
||||
*/
|
||||
function saveReference() {
|
||||
let ref = document.querySelector('#referenceSeries');
|
||||
let cont = document.querySelector('#reference');
|
||||
fetch('/save-reference', {
|
||||
method: 'POST',
|
||||
header: {
|
||||
'Content-Type': 'application/json'
|
||||
},
|
||||
body: JSON.stringify({
|
||||
refId: ref.value,
|
||||
text: cont.value
|
||||
})
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(results => {
|
||||
alert(results.msg);
|
||||
|
||||
document.querySelector('#reference').value = '';
|
||||
document.querySelector('#references').value = '';
|
||||
document.querySelector('#referenceType').value = '';
|
||||
document.querySelector('#referenceSeries').value = '';
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Previews a note by rendering the markdown content of the note in a preview section.
|
||||
* Toggles between the note text and preview sections.
|
||||
@ -1236,6 +983,8 @@ function shareNote(event) {
|
||||
function increaseFont() {
|
||||
var currentSize = document.querySelector('#ref').style.fontSize;
|
||||
document.querySelector('#ref').style.fontSize = (parseInt(currentSize) + 1) + 'pt';
|
||||
document.querySelector('#notes').style.fontSize = (parseInt(currentSize) + 1) + 'pt';
|
||||
document.querySelector('#notePreview').style.fontSize = (parseInt(currentSize) + 1) + 'pt';
|
||||
}
|
||||
|
||||
/**
|
||||
@ -1246,6 +995,8 @@ function increaseFont() {
|
||||
function decreaseFont() {
|
||||
var currentSize = document.querySelector('#ref').style.fontSize;
|
||||
document.querySelector('#ref').style.fontSize = (parseInt(currentSize) - 1) + 'pt';
|
||||
document.querySelector('#notes').style.fontSize = (parseInt(currentSize) - 1) + 'pt';
|
||||
document.querySelector('#notePreview').style.fontSize = (parseInt(currentSize) - 1) + 'pt';
|
||||
}
|
||||
|
||||
/**
|
||||
|
116
assets/js/site.js
Normal file
116
assets/js/site.js
Normal file
@ -0,0 +1,116 @@
|
||||
export function initHome() {
|
||||
setHeight();
|
||||
setBooks();
|
||||
setEventListeners();
|
||||
$('#note-table').DataTable({
|
||||
paging: false,
|
||||
ajax: {
|
||||
url: '/get-notes',
|
||||
type: 'POST'
|
||||
},
|
||||
columns: [
|
||||
{ data: 'link' },
|
||||
{ data: 'speaker.name' },
|
||||
{ data: 'passage' },
|
||||
{
|
||||
data: 'date.date',
|
||||
render: DataTable.render.date("L")
|
||||
},
|
||||
]
|
||||
});
|
||||
$('#shareBtn').on('click', openShareNote);
|
||||
$('#modal-backdrop').on('click', closeShareNote);
|
||||
}
|
||||
|
||||
/**
|
||||
* Fetches data from '/js/data.json', assigns it to BOOKS, and handles errors.
|
||||
*
|
||||
* @return {void}
|
||||
*/
|
||||
export function setBooks() {
|
||||
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);
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* Sets event listeners for keyup events on the document and the '#notes' element.
|
||||
*
|
||||
* @return {void}
|
||||
*/
|
||||
export function setEventListeners() {
|
||||
document.addEventListener('keyup', function (event) {
|
||||
if (event.key == "F3") {
|
||||
openRef(false);
|
||||
}
|
||||
});
|
||||
|
||||
document.querySelector('#notes').addEventListener('keyup', function (event) {
|
||||
let key = event.keyCode;
|
||||
|
||||
if (key >= 48 && key <= 90 || key >= 96 && key <= 111 || key >= 186 && key <= 222) {
|
||||
textDirty = true;
|
||||
document.querySelector('#note-header-left h2').classList.add('dirty');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Sets the height of various elements on the page based on the window's inner height.
|
||||
* Also initializes a datepicker and event listener for the search input field.
|
||||
*
|
||||
* @return {void}
|
||||
*/
|
||||
export function setHeight() {
|
||||
md = new markdownit({
|
||||
html: true,
|
||||
linkify: true,
|
||||
breaks: true
|
||||
});
|
||||
|
||||
var body = document.querySelector('body');
|
||||
body.style.height = window.innerHeight + 'px';
|
||||
|
||||
var cont = document.querySelector('#main');
|
||||
cont.style.height = (window.innerHeight) + 'px';
|
||||
|
||||
var tabs = document.querySelector('.ref-tab');
|
||||
tabs.style.height = (window.innerHeight - 13) + 'px';
|
||||
|
||||
var ref = document.querySelector('.ref');
|
||||
ref.style.height = (window.innerHeight - 60) + 'px';
|
||||
|
||||
var noteList = document.querySelector('#note-list');
|
||||
noteList.style.height = (window.innerHeight - 60) + 'px';
|
||||
|
||||
var notes = document.querySelector('.notes');
|
||||
notes.style.height = (window.innerHeight - 60) + 'px';
|
||||
|
||||
var notePreview = document.querySelector('#notePreview');
|
||||
notePreview.style.height = (window.innerHeight - 50) + 'px';
|
||||
|
||||
if ($('#noteDate')) {
|
||||
$('#noteDate').datepicker();
|
||||
}
|
||||
|
||||
if ($('#query')) {
|
||||
document.querySelector('#query').addEventListener('keyup', function (event) {
|
||||
if (event.key == "Enter") {
|
||||
search();
|
||||
}
|
||||
});
|
||||
}
|
||||
if (!to) {
|
||||
to = setTimeout(saveNote, saveInterval);
|
||||
}
|
||||
}
|
49
assets/js/template.js
Normal file
49
assets/js/template.js
Normal file
@ -0,0 +1,49 @@
|
||||
/**
|
||||
* Retrieves a template from the server and sets it as the value of a specified destination element.
|
||||
*
|
||||
* @param {string} orig - The ID of the element containing the original template value.
|
||||
* @param {string} dest - The ID of the destination element where the retrieved template will be set.
|
||||
* @return {Promise} A Promise that resolves when the template is successfully retrieved and set as the value of the destination element.
|
||||
*/
|
||||
export function retrieveTemplate(orig, dest) {
|
||||
const temp = document.querySelector('#' + orig);
|
||||
if (temp.value == '0') {
|
||||
document.querySelector('#' + dest).value = '';
|
||||
return;
|
||||
}
|
||||
fetch('/retrieve-template', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'plain/text'
|
||||
},
|
||||
body: JSON.stringify({
|
||||
'template': temp.value
|
||||
})
|
||||
})
|
||||
.then(response => response.text())
|
||||
.then(results => {
|
||||
const div = document.querySelector('#' + dest);
|
||||
div.value = results;
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Saves the template by sending a POST request to the server with template data.
|
||||
*/
|
||||
export function saveTemplate() {
|
||||
fetch('/save-template', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'plain/text'
|
||||
},
|
||||
body: JSON.stringify({
|
||||
'template_id': document.querySelector('#template_id').value,
|
||||
'template_name': document.querySelector('#template_name').value,
|
||||
'template_value': document.querySelector('#template_value').value,
|
||||
})
|
||||
})
|
||||
.then(response => response.text())
|
||||
.then(results => {
|
||||
alert(results);
|
||||
});
|
||||
}
|
Loading…
x
Reference in New Issue
Block a user