rdelaage
/
miniflux-v2
mirror of https://github.com/miniflux/v2.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Fix download button loading label

This commit is contained in:
Frédéric Guillot 2024-03-15 20:19:38 -07:00
parent f6f63b5282
commit 7c80d6b86d
1 changed files with 29 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

56
internal/ui/static/js/app.js
View File

@ -167,11 +167,11 @@ function handleEntryStatus(item, element, setToRead) {
} }
} }
// Add a span-icon with a `label` to `element` as a child // Add an icon-label span element.
function addIcon(element, label) { function appendIconLabel(element, labelTextContent) {
const span = document.createElement('span'); const span = document.createElement('span');
span.classList.add('icon-label'); span.classList.add('icon-label');
span.textContent = label; span.textContent = labelTextContent;
element.appendChild(span); element.appendChild(span);
} }
@ -202,7 +202,7 @@ function toggleEntryStatus(element, toasting) {
} }
link.replaceChildren(iconElement.content.cloneNode(true)); link.replaceChildren(iconElement.content.cloneNode(true));
addIcon(link, label); appendIconLabel(link, label);
link.dataset.value = newStatus; link.dataset.value = newStatus;
if (element.classList.contains("item-status-" + currentStatus)) { if (element.classList.contains("item-status-" + currentStatus)) {
@ -268,12 +268,12 @@ function saveEntry(element, toasting) {
} }
element.textContent = ""; element.textContent = "";
addIcon(element, element.dataset.labelLoading); appendIconLabel(element, element.dataset.labelLoading);
const request = new RequestBuilder(element.dataset.saveUrl); const request = new RequestBuilder(element.dataset.saveUrl);
request.withCallback(() => { request.withCallback(() => {
element.textContent = ""; element.textContent = "";
addIcon(element, element.dataset.labelDone); appendIconLabel(element, element.dataset.labelDone);
element.dataset.completed = true; element.dataset.completed = true;
if (toasting) { if (toasting) {
const iconElement = document.querySelector("template#icon-save"); const iconElement = document.querySelector("template#icon-save");
@ -294,37 +294,37 @@ function handleBookmark(element) {
// Send the Ajax request and change the icon when bookmarking an entry. // Send the Ajax request and change the icon when bookmarking an entry.
function toggleBookmark(parentElement, toasting) { function toggleBookmark(parentElement, toasting) {
const element = parentElement.querySelector(":is(a, button)[data-toggle-bookmark]"); const buttonElement = parentElement.querySelector(":is(a, button)[data-toggle-bookmark]");
if (!element) { if (!buttonElement) {
return; return;
} }
element.textContent = ""; buttonElement.textContent = "";
addIcon(element, element.dataset.labelLoading); appendIconLabel(buttonElement, buttonElement.dataset.labelLoading);
const request = new RequestBuilder(element.dataset.bookmarkUrl); const request = new RequestBuilder(buttonElement.dataset.bookmarkUrl);
request.withCallback(() => { request.withCallback(() => {
const currentStarStatus = element.dataset.value; const currentStarStatus = buttonElement.dataset.value;
const newStarStatus = currentStarStatus === "star" ? "unstar" : "star"; const newStarStatus = currentStarStatus === "star" ? "unstar" : "star";
let iconElement, label; let iconElement, label;
if (currentStarStatus === "star") { if (currentStarStatus === "star") {
iconElement = document.querySelector("template#icon-star"); iconElement = document.querySelector("template#icon-star");
label = element.dataset.labelStar; label = buttonElement.dataset.labelStar;
if (toasting) { if (toasting) {
showToast(element.dataset.toastUnstar, iconElement); showToast(buttonElement.dataset.toastUnstar, iconElement);
} }
} else { } else {
iconElement = document.querySelector("template#icon-unstar"); iconElement = document.querySelector("template#icon-unstar");
label = element.dataset.labelUnstar; label = buttonElement.dataset.labelUnstar;
if (toasting) { if (toasting) {
showToast(element.dataset.toastStar, iconElement); showToast(buttonElement.dataset.toastStar, iconElement);
} }
} }
element.replaceChildren(iconElement.content.cloneNode(true)); buttonElement.replaceChildren(iconElement.content.cloneNode(true));
addIcon(element, label); appendIconLabel(buttonElement, label);
element.dataset.value = newStarStatus; buttonElement.dataset.value = newStarStatus;
}); });
request.execute(); request.execute();
} }
@ -335,18 +335,20 @@ function handleFetchOriginalContent() {
return; return;
} }
const element = document.querySelector(":is(a, button)[data-fetch-content-entry]"); const buttonElement = document.querySelector(":is(a, button)[data-fetch-content-entry]");
if (!element) { if (!buttonElement) {
return; return;
} }
const previousElement = element.cloneNode(true); const previousElement = buttonElement.cloneNode(true);
addIcon(element, element.dataset.labelLoading);
const request = new RequestBuilder(element.dataset.fetchContentUrl); buttonElement.textContent = "";
appendIconLabel(buttonElement, buttonElement.dataset.labelLoading);
const request = new RequestBuilder(buttonElement.dataset.fetchContentUrl);
request.withCallback((response) => { request.withCallback((response) => {
element.textContent = ''; buttonElement.textContent = '';
element.appendChild(previousElement); buttonElement.appendChild(previousElement);
response.json().then((data) => { response.json().then((data) => {
if (data.hasOwnProperty("content") && data.hasOwnProperty("reading_time")) { if (data.hasOwnProperty("content") && data.hasOwnProperty("reading_time")) {
@ -629,7 +631,7 @@ function showToast(label, iconElement) {
const toastMsgElement = document.getElementById("toast-msg"); const toastMsgElement = document.getElementById("toast-msg");
if (toastMsgElement) { if (toastMsgElement) {
toastMsgElement.replaceChildren(iconElement.content.cloneNode(true)); toastMsgElement.replaceChildren(iconElement.content.cloneNode(true));
addIcon(toastMsgElement, label); appendIconLabel(toastMsgElement, label);
const toastElementWrapper = document.getElementById("toast-wrapper"); const toastElementWrapper = document.getElementById("toast-wrapper");
if (toastElementWrapper) { if (toastElementWrapper) {