southfox/miniflux
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

More progress towards trusted-types

Browse source 
Create a new function `addIcon` and use it to add icons, instead of
operating on raw html.
This commit is contained in:
jvoisin 2024-03-13 18:20:45 +01:00 committed by Frédéric Guillot
parent d862d86f90
commit e0ee28c013
1 changed files with 21 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

28
internal/ui/static/js/app.js
View file

@ -167,6 +167,14 @@ function handleEntryStatus(item, element, setToRead) {
} }
} }
// Add a span-icon with a `label` to `element` as a child
function addIcon(element, label) {
const span = document.createElement('span');
span.classList.add('icon-label');
span.textContent = label;
element.appendChild(span);
}
// Change the entry status to the opposite value. // Change the entry status to the opposite value.
function toggleEntryStatus(element, toasting) { function toggleEntryStatus(element, toasting) {
const entryID = parseInt(element.dataset.id, 10); const entryID = parseInt(element.dataset.id, 10);
@ -193,7 +201,8 @@ function toggleEntryStatus(element, toasting) {
} }
} }
link.innerHTML = iconElement.innerHTML + '<span class="icon-label">' + label + '</span>'; link.innerHTML = iconElement.innerHTML;
addIcon(link, label);
link.dataset.value = newStatus; link.dataset.value = newStatus;
if (element.classList.contains("item-status-" + currentStatus)) { if (element.classList.contains("item-status-" + currentStatus)) {
@ -258,11 +267,13 @@ function saveEntry(element, toasting) {
return; return;
} }
element.innerHTML = '<span class="icon-label">' + element.dataset.labelLoading + '</span>'; element.textContent = "";
addIcon(element, element.dataset.labelLoading);
const request = new RequestBuilder(element.dataset.saveUrl); const request = new RequestBuilder(element.dataset.saveUrl);
request.withCallback(() => { request.withCallback(() => {
element.innerHTML = '<span class="icon-label">' + element.dataset.labelDone + '</span>'; element.textContent = "";
addIcon(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");
@ -288,7 +299,8 @@ function toggleBookmark(parentElement, toasting) {
return; return;
} }
element.innerHTML = '<span class="icon-label">' + element.dataset.labelLoading + '</span>'; element.textContent = "";
addIcon(element, element.dataset.labelLoading);
const request = new RequestBuilder(element.dataset.bookmarkUrl); const request = new RequestBuilder(element.dataset.bookmarkUrl);
request.withCallback(() => { request.withCallback(() => {
@ -310,7 +322,8 @@ function toggleBookmark(parentElement, toasting) {
} }
} }
element.innerHTML = iconElement.innerHTML + '<span class="icon-label">' + label + '</span>'; element.innerHTML = iconElement.innerHTML;
addIcon(element, label);
element.dataset.value = newStarStatus; element.dataset.value = newStarStatus;
}); });
request.execute(); request.execute();
@ -328,7 +341,7 @@ function handleFetchOriginalContent() {
} }
const previousElement = element.cloneNode(true); const previousElement = element.cloneNode(true);
element.innerHTML = '<span class="icon-label">' + element.dataset.labelLoading + '</span>'; addIcon(element, element.dataset.labelLoading);
const request = new RequestBuilder(element.dataset.fetchContentUrl); const request = new RequestBuilder(element.dataset.fetchContentUrl);
request.withCallback((response) => { request.withCallback((response) => {
@ -615,7 +628,8 @@ function showToast(label, iconElement) {
const toastMsgElement = document.getElementById("toast-msg"); const toastMsgElement = document.getElementById("toast-msg");
if (toastMsgElement) { if (toastMsgElement) {
toastMsgElement.innerHTML = iconElement.innerHTML + '<span class="icon-label">' + label + '</span>'; toastMsgElement.innerHTML = iconElement.innerHTML;
addIcon(toastMsgElement, label);
const toastElementWrapper = document.getElementById("toast-wrapper"); const toastElementWrapper = document.getElementById("toast-wrapper");
if (toastElementWrapper) { if (toastElementWrapper) {