118 lines
3.7 KiB
JavaScript
118 lines
3.7 KiB
JavaScript
/**
|
|
* SPDX-FileCopyrightText: 2023 jordi fita mas <jordi@tandem.blog>
|
|
* SPDX-License-Identifier: AGPL-3.0-only
|
|
*/
|
|
|
|
function ready(fn) {
|
|
if (document.readyState !== 'loading') {
|
|
fn();
|
|
} else {
|
|
document.addEventListener('DOMContentLoaded', fn);
|
|
}
|
|
}
|
|
|
|
ready(function () {
|
|
const snackBar = Object.assign(
|
|
document.body.appendChild(document.createElement('section')),
|
|
{
|
|
id: 'snackbar',
|
|
}
|
|
);
|
|
|
|
const errorMessage = snackBar.appendChild(document.createElement('div'));
|
|
errorMessage.setAttribute('role', 'alert');
|
|
|
|
const openClass = 'open';
|
|
const toasts = [];
|
|
let timeoutId = null;
|
|
|
|
function showError(message) {
|
|
toasts.push(message);
|
|
popUp();
|
|
}
|
|
|
|
function popUp() {
|
|
if (toasts.length === 0) {
|
|
return;
|
|
}
|
|
if (errorMessage.classList.contains(openClass)) {
|
|
dismiss();
|
|
return;
|
|
}
|
|
if (errorMessage.innerText !== "") {
|
|
// it will show after remove calls popUp again.
|
|
return;
|
|
}
|
|
errorMessage.innerText = toasts[0];
|
|
errorMessage.classList.add(openClass);
|
|
timeoutId = setTimeout(dismiss, 4000);
|
|
}
|
|
|
|
function dismiss() {
|
|
if (!errorMessage.classList.contains(openClass)) {
|
|
// already dismissed
|
|
return;
|
|
}
|
|
errorMessage.classList.remove(openClass);
|
|
clearTimeout(timeoutId);
|
|
timeoutId = setTimeout(remove, 350);
|
|
}
|
|
|
|
function remove() {
|
|
clearTimeout(timeoutId);
|
|
toasts.splice(0, 1);
|
|
errorMessage.innerText = "";
|
|
popUp();
|
|
}
|
|
|
|
document.body.addEventListener('htmx:error', function (evt) {
|
|
const errorInfo = evt.detail.errorInfo;
|
|
const error = errorInfo.xhr && errorInfo.xhr.responseText || errorInfo.error;
|
|
showError(error);
|
|
});
|
|
})
|
|
|
|
ready(function () {
|
|
const textareas = document.querySelectorAll('textarea.html');
|
|
if (textareas.length > 0) {
|
|
const language = document.documentElement.getAttribute('lang');
|
|
const script = document.head.appendChild(Object.assign(document.createElement('script'), {
|
|
src: '/static/ckeditor5@39.0.1/ckeditor.js',
|
|
}));
|
|
document.head.appendChild(Object.assign(document.createElement('style'), {
|
|
innerHTML: '.ck-content { margin-left: 5rem; }',
|
|
}));
|
|
if (language !== 'en') {
|
|
document.head.appendChild(Object.assign(document.createElement('script'), {
|
|
src: '/static/ckeditor5@39.0.1/translations/' + language + '.js',
|
|
}));
|
|
}
|
|
script.addEventListener('load', function () {
|
|
for (const textarea of textareas) {
|
|
const canvas = document.createElement('div');
|
|
textarea.parentNode.insertBefore(canvas, textarea.nextSibling);
|
|
textarea.style.display = 'none';
|
|
|
|
BalloonEditor
|
|
.create(canvas, {
|
|
language,
|
|
})
|
|
.then(editor => {
|
|
const xml = document.createElement('div');
|
|
const serializer = new XMLSerializer();
|
|
editor.setData(textarea.value);
|
|
editor.ui.focusTracker.on('change:isFocused', (event, name, focused) => {
|
|
if (!focused) {
|
|
xml.innerHTML = editor.getData();
|
|
textarea.value = serializer.serializeToString(xml).replace(' ', ' ');
|
|
}
|
|
});
|
|
})
|
|
.catch(error => {
|
|
console.error(error);
|
|
});
|
|
}
|
|
});
|
|
}
|
|
})
|