jordi fita mas
1b923a9f65
This form has an “HTML field”, which is just a <textarea> but “improved” with the use of Automattic’s isolated block editor[0], a repackaged Gutenberg’s editor playground as full-featured multi-instance editor that does not require WordPress. I do not want to use Node to build this huge, over-engineered piece of … software. Therefore, i downloaded the released “browser” package, and added the required React bundle, like i do with HTMx. This will hold until i need a new custom block type; let’s hope i will not need it. [0]: https://github.com/Automattic/isolated-block-editor
92 lines
2.3 KiB
JavaScript
92 lines
2.3 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');
|
|
for (const textarea of textareas) {
|
|
wp.attachEditor(textarea, {
|
|
iso: {
|
|
sidebar: {
|
|
inspector: true,
|
|
inserter: true,
|
|
},
|
|
toolbar: {
|
|
inspector: true,
|
|
navigation: true,
|
|
},
|
|
},
|
|
});
|
|
}
|
|
})
|