Discource-C
/
discourse
mirror of https://github.com/discourse/discourse.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

UX: loading spinner when clicking an item 

This fixes the UX when clicking a checklist item to toggle its state.
This commit is contained in:
Régis Hanol 2024-04-25 18:17:50 +02:00
parent c77d109362
commit 989d6f921a
1 changed files with 6 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
plugins/checklist/assets/javascripts/discourse/initializers/checklist.js
View File

@ -11,10 +11,6 @@ function initializePlugin(api) {
}
}
function removeReadonlyClass(boxes) {
boxes.forEach((e) => e.classList.remove("readonly"));
}
function isWhitespaceNode(node) {
return node.nodeType === 3 && node.nodeValue.match(/^\s*$/);
}
@ -80,8 +76,9 @@ export function checklistSyntax(elem, postDecorator) {
const newValue = classList.contains("checked") ? "[ ]" : "[x]";
const template = document.createElement("template");
template.innerHTML = iconHTML("spinner", { class: "fa-spin" });
template.innerHTML = iconHTML("spinner", {
class: "fa-spin list-item-checkbox",
});
box.insertAdjacentElement("afterend", template.content.firstChild);
box.classList.add("hidden");
boxes.forEach((e) => e.classList.add("readonly"));
@ -158,7 +155,9 @@ export function checklistSyntax(elem, postDecorator) {
postWidget.attrs.isSaving = false;
postWidget.scheduleRerender();
} finally {
removeReadonlyClass(boxes);
boxes.forEach((e) => e.classList.remove("readonly"));
box.classList.remove("hidden");
box.parentElement.querySelector(".fa-spin").remove();
}
};
});