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

Refactor confirmation handler

This commit is contained in:
Frédéric Guillot 2019-07-17 21:07:29 -07:00
parent 2b6e17c1ef
commit 99149d9f2a
9 changed files with 88 additions and 135 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
generate.go
View File

@ -190,7 +190,6 @@ func main() {
"ui/static/js/touch_handler.js",
"ui/static/js/keyboard_handler.js",
"ui/static/js/request_builder.js",
"ui/static/js/confirm_handler.js",
"ui/static/js/modal_handler.js",
"ui/static/js/app.js",
"ui/static/js/bootstrap.js",

14
template/html/category_entries.html
View File

@ -7,15 +7,12 @@
{{ if .entries }}
<li>
<a href="#"
data-confirm="true"
data-action="markPageAsRead"
data-label-question="{{ t "confirm.question" }}"
data-label-yes="{{ t "confirm.yes" }}"
data-label-no="{{ t "confirm.no" }}"
data-label-loading="{{ t "confirm.loading" }}"
data-show-only-unread="{{ if .showOnlyUnreadEntries }}1{{ end }}"
data-mark-page-as-read="true">
{{ t "menu.mark_page_as_read" }}
</a>
data-show-only-unread="{{ if .showOnlyUnreadEntries }}1{{ end }}">{{ t "menu.mark_page_as_read" }}</a>
</li>
{{ end }}
{{ if .showOnlyUnreadEntries }}
@ -54,15 +51,12 @@
<ul>
<li>
<a href="#"
data-confirm="true"
data-action="markPageAsRead"
data-label-question="{{ t "confirm.question" }}"
data-label-yes="{{ t "confirm.yes" }}"
data-label-no="{{ t "confirm.no" }}"
data-label-loading="{{ t "confirm.loading" }}"
data-show-only-unread="{{ if .showOnlyUnreadEntries }}1{{ end }}"
data-mark-page-as-read="true">
{{ t "menu.mark_page_as_read" }}
</a>
data-show-only-unread="{{ if .showOnlyUnreadEntries }}1{{ end }}">{{ t "menu.mark_page_as_read" }}</a>
</li>
</ul>
{{ end }}

14
template/html/feed_entries.html
View File

@ -7,15 +7,12 @@
{{ if .entries }}
<li>
<a href="#"
data-confirm="true"
data-action="markPageAsRead"
data-label-question="{{ t "confirm.question" }}"
data-label-yes="{{ t "confirm.yes" }}"
data-label-no="{{ t "confirm.no" }}"
data-label-loading="{{ t "confirm.loading" }}"
data-show-only-unread="{{ if .showOnlyUnreadEntries }}1{{ end }}"
data-mark-page-as-read="true">
{{ t "menu.mark_page_as_read" }}
</a>
data-show-only-unread="{{ if .showOnlyUnreadEntries }}1{{ end }}">{{ t "menu.mark_page_as_read" }}</a>
</li>
{{ end }}
{{ if .showOnlyUnreadEntries }}
@ -82,15 +79,12 @@
<ul>
<li>
<a href="#"
data-confirm="true"
data-action="markPageAsRead"
data-label-question="{{ t "confirm.question" }}"
data-label-yes="{{ t "confirm.yes" }}"
data-label-no="{{ t "confirm.no" }}"
data-label-loading="{{ t "confirm.loading" }}"
data-show-only-unread="{{ if .showOnlyUnreadEntries }}1{{ end }}"
data-mark-page-as-read="true">
{{ t "menu.mark_page_as_read" }}
</a>
data-show-only-unread="{{ if .showOnlyUnreadEntries }}1{{ end }}">{{ t "menu.mark_page_as_read" }}</a>
</li>
</ul>
{{ end }}

14
template/html/unread_entries.html
View File

@ -7,14 +7,11 @@
<ul>
<li>
<a href="#"
data-confirm="true"
data-action="markPageAsRead"
data-label-question="{{ t "confirm.question" }}"
data-label-yes="{{ t "confirm.yes" }}"
data-label-no="{{ t "confirm.no" }}"
data-label-loading="{{ t "confirm.loading" }}"
data-mark-page-as-read="true">
{{ t "menu.mark_page_as_read" }}
</a>
data-label-loading="{{ t "confirm.loading" }}">{{ t "menu.mark_page_as_read" }}</a>
</li>
<li>
<a data-link-state="flip"
@ -49,14 +46,11 @@
<ul>
<li>
<a href="#"
data-confirm="true"
data-action="markPageAsRead"
data-label-question="{{ t "confirm.question" }}"
data-label-yes="{{ t "confirm.yes" }}"
data-label-no="{{ t "confirm.no" }}"
data-label-loading="{{ t "confirm.loading" }}"
data-mark-page-as-read="true">
{{ t "menu.mark_page_as_read" }}
</a>
data-label-loading="{{ t "confirm.loading" }}">{{ t "menu.mark_page_as_read" }}</a>
</li>
</ul>
{{ end }}

48
template/views.go
View File

@ -210,15 +210,12 @@ var templateViewsMap = map[string]string{
{{ if .entries }}
<li>
<a href="#"
data-confirm="true"
data-action="markPageAsRead"
data-label-question="{{ t "confirm.question" }}"
data-label-yes="{{ t "confirm.yes" }}"
data-label-no="{{ t "confirm.no" }}"
data-label-loading="{{ t "confirm.loading" }}"
data-show-only-unread="{{ if .showOnlyUnreadEntries }}1{{ end }}"
data-mark-page-as-read="true">
{{ t "menu.mark_page_as_read" }}
</a>
data-show-only-unread="{{ if .showOnlyUnreadEntries }}1{{ end }}">{{ t "menu.mark_page_as_read" }}</a>
</li>
{{ end }}
{{ if .showOnlyUnreadEntries }}
@ -257,15 +254,12 @@ var templateViewsMap = map[string]string{
<ul>
<li>
<a href="#"
data-confirm="true"
data-action="markPageAsRead"
data-label-question="{{ t "confirm.question" }}"
data-label-yes="{{ t "confirm.yes" }}"
data-label-no="{{ t "confirm.no" }}"
data-label-loading="{{ t "confirm.loading" }}"
data-show-only-unread="{{ if .showOnlyUnreadEntries }}1{{ end }}"
data-mark-page-as-read="true">
{{ t "menu.mark_page_as_read" }}
</a>
data-show-only-unread="{{ if .showOnlyUnreadEntries }}1{{ end }}">{{ t "menu.mark_page_as_read" }}</a>
</li>
</ul>
{{ end }}
@ -717,15 +711,12 @@ var templateViewsMap = map[string]string{
{{ if .entries }}
<li>
<a href="#"
data-confirm="true"
data-action="markPageAsRead"
data-label-question="{{ t "confirm.question" }}"
data-label-yes="{{ t "confirm.yes" }}"
data-label-no="{{ t "confirm.no" }}"
data-label-loading="{{ t "confirm.loading" }}"
data-show-only-unread="{{ if .showOnlyUnreadEntries }}1{{ end }}"
data-mark-page-as-read="true">
{{ t "menu.mark_page_as_read" }}
</a>
data-show-only-unread="{{ if .showOnlyUnreadEntries }}1{{ end }}">{{ t "menu.mark_page_as_read" }}</a>
</li>
{{ end }}
{{ if .showOnlyUnreadEntries }}
@ -792,15 +783,12 @@ var templateViewsMap = map[string]string{
<ul>
<li>
<a href="#"
data-confirm="true"
data-action="markPageAsRead"
data-label-question="{{ t "confirm.question" }}"
data-label-yes="{{ t "confirm.yes" }}"
data-label-no="{{ t "confirm.no" }}"
data-label-loading="{{ t "confirm.loading" }}"
data-show-only-unread="{{ if .showOnlyUnreadEntries }}1{{ end }}"
data-mark-page-as-read="true">
{{ t "menu.mark_page_as_read" }}
</a>
data-show-only-unread="{{ if .showOnlyUnreadEntries }}1{{ end }}">{{ t "menu.mark_page_as_read" }}</a>
</li>
</ul>
{{ end }}
@ -1334,14 +1322,11 @@ var templateViewsMap = map[string]string{
<ul>
<li>
<a href="#"
data-confirm="true"
data-action="markPageAsRead"
data-label-question="{{ t "confirm.question" }}"
data-label-yes="{{ t "confirm.yes" }}"
data-label-no="{{ t "confirm.no" }}"
data-label-loading="{{ t "confirm.loading" }}"
data-mark-page-as-read="true">
{{ t "menu.mark_page_as_read" }}
</a>
data-label-loading="{{ t "confirm.loading" }}">{{ t "menu.mark_page_as_read" }}</a>
</li>
<li>
<a data-link-state="flip"
@ -1376,14 +1361,11 @@ var templateViewsMap = map[string]string{
<ul>
<li>
<a href="#"
data-confirm="true"
data-action="markPageAsRead"
data-label-question="{{ t "confirm.question" }}"
data-label-yes="{{ t "confirm.yes" }}"
data-label-no="{{ t "confirm.no" }}"
data-label-loading="{{ t "confirm.loading" }}"
data-mark-page-as-read="true">
{{ t "menu.mark_page_as_read" }}
</a>
data-label-loading="{{ t "confirm.loading" }}">{{ t "menu.mark_page_as_read" }}</a>
</li>
</ul>
{{ end }}
@ -1463,7 +1445,7 @@ var templateViewsMapChecksums = map[string]string{
"add_subscription": "a0f1d2bc02b6adc83dbeae593f74d9b936102cd6dd73302cdbec2137cafdcdd9",
"bookmark_entries": "609f4b2342152fe495a219a32f17a4528b01807d61f53cee0cbebf728be73c42",
"categories": "642ee3cddbd825ee6ab5a77caa0d371096b55de0f1bd4ae3055b8c8a70507d8d",
"category_entries": "a1a2ed91cb87d5501a7df55db4c05adfb8aca9f1991b466ab2f30cf5bdb5825d",
"category_entries": "5affb6ddaf73ac7b14d9cc67f7d518d4bb8f280ee6d9f1ad852edd44bad8c7de",
"choose_subscription": "33c04843d7c1b608d034e605e52681822fc6d79bc6b900c04915dd9ebae584e2",
"create_category": "6b22b5ce51abf4e225e23a79f81be09a7fb90acb265e93a8faf9446dff74018d",
"create_user": "1e940be3afefc0a5c6273bbadcddc1e29811e9548e5227ac2adfe697ca5ce081",
@ -1471,7 +1453,7 @@ var templateViewsMapChecksums = map[string]string{
"edit_feed": "ab30c31a4385a7b16c54baa78bdcb93a57181ed1c5018ce097d7eb50673bb995",
"edit_user": "f4f99412ba771cfca2a2a42778b023b413c5494e9a287053ba8cf380c2865c5f",
"entry": "1626bf4dd3223b2f730865676162aa0a9f0a0e009cdea90f705230542922e0f4",
"feed_entries": "96386f3ecb0080f89febbcd6489ad5f8ace3aac61066e94fb70d11462b02c143",
"feed_entries": "4bb6b96ba4d13dbaf22dcf6dd95ae36b6e5a0c99175d502865a164dc68fd4bae",
"feeds": "31acc253c547a6cce5710d72a6f6b3b396162ecd5e5af295b2cf47c1ff55bd06",
"history_entries": "b65ca1d85615caa7c314a33f1cb997aa3477a79e66b9894b2fd387271ad467d2",
"import": "8349e47a783bb40d8e9248b4771656e5f006185e11079e1c4680dd52633420ed",
@ -1480,6 +1462,6 @@ var templateViewsMapChecksums = map[string]string{
"search_entries": "d71849a4f2b0573c7c76ad0ea941812009e9f022de60895987a781d3e6f08a01",
"sessions": "1b3ec0970a4111b81f86d6ed187bb410f88972e2ede6723b9febcc4c7e5fc921",
"settings": "152143e58d057ea6ab3bfd8dd947bfd70685843ca40e40542484b23849746df4",
"unread_entries": "9bfe0223d4dc9b6179e4d35758be644138d7b1e28616ddc1f9df6efab6061ab2",
"unread_entries": "5d23dc604496bcfa5ddfd1f5b8693aa5d94d2faa10979d04983e8bd8c7de36e9",
"users": "4b56cc76fbcc424e7c870d0efca93bb44dbfcc2a08b685cf799c773fbb8dfb2f",
}

11
ui/static/js.go
View File

@ -43,8 +43,6 @@ withCallback(callback){this.callback=callback;return this;}
getCsrfToken(){let element=document.querySelector("meta[name=X-CSRF-Token]");if(element!==null){return element.getAttribute("value");}
return "";}
execute(){fetch(new Request(this.url,this.options)).then((response)=>{if(this.callback){this.callback(response);}});}}
class ConfirmHandler{executeRequest(url,redirectURL){let request=new RequestBuilder(url);request.withCallback(()=>{if(redirectURL){window.location.href=redirectURL;}else{window.location.reload();}});request.execute();}
handle(event){let questionElement=document.createElement("span");let linkElement=event.target;let containerElement=linkElement.parentNode;linkElement.style.display="none";let yesElement=document.createElement("a");yesElement.href="#";yesElement.appendChild(document.createTextNode(linkElement.dataset.labelYes));yesElement.onclick=(event)=>{event.preventDefault();let loadingElement=document.createElement("span");loadingElement.className="loading";loadingElement.appendChild(document.createTextNode(linkElement.dataset.labelLoading));questionElement.remove();containerElement.appendChild(loadingElement);if(linkElement.dataset.markPageAsRead){markPageAsRead(event.target.dataset.showOnlyUnread||false);}else{this.executeRequest(linkElement.dataset.url,linkElement.dataset.redirectUrl);}};let noElement=document.createElement("a");noElement.href="#";noElement.appendChild(document.createTextNode(linkElement.dataset.labelNo));noElement.onclick=(event)=>{event.preventDefault();linkElement.style.display="inline";questionElement.remove();};questionElement.className="confirm";questionElement.appendChild(document.createTextNode(linkElement.dataset.labelQuestion+" "));questionElement.appendChild(yesElement);questionElement.appendChild(document.createTextNode(", "));questionElement.appendChild(noElement);containerElement.appendChild(questionElement);}}
class ModalHandler{static exists(){return document.getElementById("modal-container")!==null;}
static open(fragment){if(ModalHandler.exists()){return;}
let container=document.createElement("div");container.id="modal-container";container.appendChild(document.importNode(fragment,true));document.body.appendChild(container);let closeButton=document.querySelector("a.btn-close-modal");if(closeButton!==null){closeButton.onclick=(event)=>{event.preventDefault();ModalHandler.close();};}}
@ -59,7 +57,7 @@ function setFocusToSearchInput(event){event.preventDefault();event.stopPropagati
let searchFormElement=document.querySelector(".search-form");if(searchFormElement){searchFormElement.style.display="block";}
let searchInputElement=document.getElementById("search-input");if(searchInputElement){searchInputElement.focus();searchInputElement.value="";}}
function showKeyboardShortcuts(){let template=document.getElementById("keyboard-shortcuts");if(template!==null){ModalHandler.open(template.content);}}
function markPageAsRead(){let items=DomHelper.getVisibleElements(".items .item");let entryIDs=[];items.forEach((element)=>{element.classList.add("item-status-read");entryIDs.push(parseInt(element.dataset.id,10));});if(entryIDs.length>0){updateEntriesStatus(entryIDs,"read",()=>{let element=document.querySelector("a[data-mark-page-as-read]");let showOnlyUnread=false;if(element){showOnlyUnread=element.dataset.showOnlyUnread;}
function markPageAsRead(){let items=DomHelper.getVisibleElements(".items .item");let entryIDs=[];items.forEach((element)=>{element.classList.add("item-status-read");entryIDs.push(parseInt(element.dataset.id,10));});if(entryIDs.length>0){updateEntriesStatus(entryIDs,"read",()=>{let element=document.querySelector("a[data-action=markPageAsRead]");let showOnlyUnread=false;if(element){showOnlyUnread=element.dataset.showOnlyUnread||false;}
if(showOnlyUnread){window.location.reload();}else{goToPage("next",true);}});}}
function handleEntryStatus(){if(isListView()){let currentItem=document.querySelector(".current-item");if(currentItem!==null){goToNextListItem();toggleEntryStatus(currentItem);}}else{toggleEntryStatus(document.querySelector(".entry"));}}
function toggleEntryStatus(element){let entryID=parseInt(element.dataset.id,10);let link=element.querySelector("a[data-toggle-status]");let currentStatus=link.dataset.value;let newStatus=currentStatus==="read"?"unread":"read";updateEntriesStatus([entryID],newStatus);if(currentStatus==="read"){link.innerHTML=link.dataset.labelRead;link.dataset.value="unread";}else{link.innerHTML=link.dataset.labelUnread;link.dataset.value="read";}
@ -99,14 +97,15 @@ function updateUnreadCounterValue(callback){let counterElements=document.querySe
function isEntry(){return document.querySelector("section.entry")!==null;}
function isListView(){return document.querySelector(".items")!==null;}
function flipElementState(element){let labelElement=document.createElement("span");labelElement.className="link-flipped-state";labelElement.appendChild(document.createTextNode(element.dataset.labelNewState));element.parentNode.appendChild(labelElement);element.parentNode.removeChild(element);}
function handleConfirmationMessage(linkElement,callback){linkElement.style.display="none";let containerElement=linkElement.parentNode;let questionElement=document.createElement("span");let yesElement=document.createElement("a");yesElement.href="#";yesElement.appendChild(document.createTextNode(linkElement.dataset.labelYes));yesElement.onclick=(event)=>{event.preventDefault();let loadingElement=document.createElement("span");loadingElement.className="loading";loadingElement.appendChild(document.createTextNode(linkElement.dataset.labelLoading));questionElement.remove();containerElement.appendChild(loadingElement);callback(linkElement.dataset.url,linkElement.dataset.redirectUrl);};let noElement=document.createElement("a");noElement.href="#";noElement.appendChild(document.createTextNode(linkElement.dataset.labelNo));noElement.onclick=(event)=>{event.preventDefault();linkElement.style.display="inline";questionElement.remove();};questionElement.className="confirm";questionElement.appendChild(document.createTextNode(linkElement.dataset.labelQuestion+" "));questionElement.appendChild(yesElement);questionElement.appendChild(document.createTextNode(", "));questionElement.appendChild(noElement);containerElement.appendChild(questionElement);}
document.addEventListener("DOMContentLoaded",function(){handleSubmitButtons();if(!document.querySelector("body[data-disable-keyboard-shortcuts=true]")){let keyboardHandler=new KeyboardHandler();keyboardHandler.on("g u",()=>goToPage("unread"));keyboardHandler.on("g b",()=>goToPage("starred"));keyboardHandler.on("g h",()=>goToPage("history"));keyboardHandler.on("g f",()=>goToFeedOrFeeds());keyboardHandler.on("g c",()=>goToPage("categories"));keyboardHandler.on("g s",()=>goToPage("settings"));keyboardHandler.on("ArrowLeft",()=>goToPrevious());keyboardHandler.on("ArrowRight",()=>goToNext());keyboardHandler.on("k",()=>goToPrevious());keyboardHandler.on("p",()=>goToPrevious());keyboardHandler.on("j",()=>goToNext());keyboardHandler.on("n",()=>goToNext());keyboardHandler.on("h",()=>goToPage("previous"));keyboardHandler.on("l",()=>goToPage("next"));keyboardHandler.on("o",()=>openSelectedItem());keyboardHandler.on("v",()=>openOriginalLink());keyboardHandler.on("m",()=>handleEntryStatus());keyboardHandler.on("A",()=>markPageAsRead());keyboardHandler.on("s",()=>handleSaveEntry());keyboardHandler.on("d",()=>handleFetchOriginalContent());keyboardHandler.on("f",()=>handleBookmark());keyboardHandler.on("?",()=>showKeyboardShortcuts());keyboardHandler.on("#",()=>unsubscribeFromFeed());keyboardHandler.on("/",(e)=>setFocusToSearchInput(e));keyboardHandler.on("Escape",()=>ModalHandler.close());keyboardHandler.listen();}
let touchHandler=new TouchHandler();touchHandler.listen();onClick("a[data-save-entry]",()=>handleSaveEntry());onClick("a[data-toggle-bookmark]",()=>handleBookmark());onClick("a[data-fetch-content-entry]",()=>handleFetchOriginalContent());onClick("a[data-action=search]",(event)=>setFocusToSearchInput(event));onClick("a[data-on-click=markPageAsRead]",()=>markPageAsRead());onClick("a[data-toggle-status]",(event)=>{let currentItem=DomHelper.findParent(event.target,"entry");if(!currentItem){currentItem=DomHelper.findParent(event.target,"item");}
if(currentItem){toggleEntryStatus(currentItem);}});onClick("a[data-confirm]",(event)=>{(new ConfirmHandler()).handle(event);});onClick("a[data-link-state=flip]",(event)=>{flipElementState(event.target);},true);if(document.documentElement.clientWidth<600){onClick(".logo",()=>toggleMainMenu());onClick(".header nav li",(event)=>onClickMainMenuListItem(event));}
let touchHandler=new TouchHandler();touchHandler.listen();onClick("a[data-save-entry]",()=>handleSaveEntry());onClick("a[data-toggle-bookmark]",()=>handleBookmark());onClick("a[data-fetch-content-entry]",()=>handleFetchOriginalContent());onClick("a[data-action=search]",(event)=>setFocusToSearchInput(event));onClick("a[data-action=markPageAsRead]",()=>handleConfirmationMessage(event.target,()=>markPageAsRead()));onClick("a[data-toggle-status]",(event)=>{let currentItem=DomHelper.findParent(event.target,"entry");if(!currentItem){currentItem=DomHelper.findParent(event.target,"item");}
if(currentItem){toggleEntryStatus(currentItem);}});onClick("a[data-confirm]",(event)=>handleConfirmationMessage(event.target,(url,redirectURL)=>{let request=new RequestBuilder(url);request.withCallback(()=>{if(redirectURL){window.location.href=redirectURL;}else{window.location.reload();}});request.execute();}));onClick("a[data-link-state=flip]",(event)=>{flipElementState(event.target);},true);if(document.documentElement.clientWidth<600){onClick(".logo",()=>toggleMainMenu());onClick(".header nav li",(event)=>onClickMainMenuListItem(event));}
if("serviceWorker"in navigator){let scriptElement=document.getElementById("service-worker-script");if(scriptElement){navigator.serviceWorker.register(scriptElement.src);}}});})();`,
"sw": `'use strict';self.addEventListener("fetch",(event)=>{if(event.request.url.includes("/feed/icon/")){event.respondWith(caches.open("feed_icons").then((cache)=>{return cache.match(event.request).then((response)=>{return response||fetch(event.request).then((response)=>{cache.put(event.request,response.clone());return response;});});}));}});`,
}
var JavascriptsChecksums = map[string]string{
"app": "fe24291c59706b377062df11145b8aed5d48ce06afcce78a2c99ee879632cc57",
"app": "bf306e93b04662c7ecc975c54e2ce4b1a4ed76d23ea2e708da70fb8371f368b8",
"sw": "55fffa223919cc18572788fb9c62fccf92166c0eb5d3a1d6f91c31f24d020be9",
}

44
ui/static/js/app.js
View File

@ -99,10 +99,10 @@ function markPageAsRead() {
updateEntriesStatus(entryIDs, "read", () => {
// Make sure the Ajax request reach the server before we reload the page.
let element = document.querySelector("a[data-mark-page-as-read]");
let element = document.querySelector("a[data-action=markPageAsRead]");
let showOnlyUnread = false;
if (element) {
showOnlyUnread = element.dataset.showOnlyUnread;
showOnlyUnread = element.dataset.showOnlyUnread || false;
}
if (showOnlyUnread) {
@ -462,3 +462,43 @@ function flipElementState(element) {
element.parentNode.appendChild(labelElement);
element.parentNode.removeChild(element);
}
function handleConfirmationMessage(linkElement, callback) {
linkElement.style.display = "none";
let containerElement = linkElement.parentNode;
let questionElement = document.createElement("span");
let yesElement = document.createElement("a");
yesElement.href = "#";
yesElement.appendChild(document.createTextNode(linkElement.dataset.labelYes));
yesElement.onclick = (event) => {
event.preventDefault();
let loadingElement = document.createElement("span");
loadingElement.className = "loading";
loadingElement.appendChild(document.createTextNode(linkElement.dataset.labelLoading));
questionElement.remove();
containerElement.appendChild(loadingElement);
callback(linkElement.dataset.url, linkElement.dataset.redirectUrl);
};
let noElement = document.createElement("a");
noElement.href = "#";
noElement.appendChild(document.createTextNode(linkElement.dataset.labelNo));
noElement.onclick = (event) => {
event.preventDefault();
linkElement.style.display = "inline";
questionElement.remove();
};
questionElement.className = "confirm";
questionElement.appendChild(document.createTextNode(linkElement.dataset.labelQuestion + " "));
questionElement.appendChild(yesElement);
questionElement.appendChild(document.createTextNode(", "));
questionElement.appendChild(noElement);
containerElement.appendChild(questionElement);
}

18
ui/static/js/bootstrap.js vendored
View File

@ -38,7 +38,7 @@ document.addEventListener("DOMContentLoaded", function () {
onClick("a[data-toggle-bookmark]", () => handleBookmark());
onClick("a[data-fetch-content-entry]", () => handleFetchOriginalContent());
onClick("a[data-action=search]", (event) => setFocusToSearchInput(event));
onClick("a[data-on-click=markPageAsRead]", () => markPageAsRead());
onClick("a[data-action=markPageAsRead]", () => handleConfirmationMessage(event.target, () => markPageAsRead()));
onClick("a[data-toggle-status]", (event) => {
let currentItem = DomHelper.findParent(event.target, "entry");
@ -51,9 +51,19 @@ document.addEventListener("DOMContentLoaded", function () {
}
});
onClick("a[data-confirm]", (event) => {
(new ConfirmHandler()).handle(event);
});
onClick("a[data-confirm]", (event) => handleConfirmationMessage(event.target, (url, redirectURL) => {
let request = new RequestBuilder(url);
request.withCallback(() => {
if (redirectURL) {
window.location.href = redirectURL;
} else {
window.location.reload();
}
});
request.execute();
}));
onClick("a[data-link-state=flip]", (event) => {
flipElementState(event.target);

59
ui/static/js/confirm_handler.js
View File

@ -1,59 +0,0 @@
class ConfirmHandler {
executeRequest(url, redirectURL) {
let request = new RequestBuilder(url);
request.withCallback(() => {
if (redirectURL) {
window.location.href = redirectURL;
} else {
window.location.reload();
}
});
request.execute();
}
handle(event) {
let questionElement = document.createElement("span");
let linkElement = event.target;
let containerElement = linkElement.parentNode;
linkElement.style.display = "none";
let yesElement = document.createElement("a");
yesElement.href = "#";
yesElement.appendChild(document.createTextNode(linkElement.dataset.labelYes));
yesElement.onclick = (event) => {
event.preventDefault();
let loadingElement = document.createElement("span");
loadingElement.className = "loading";
loadingElement.appendChild(document.createTextNode(linkElement.dataset.labelLoading));
questionElement.remove();
containerElement.appendChild(loadingElement);
if (linkElement.dataset.markPageAsRead) {
markPageAsRead(event.target.dataset.showOnlyUnread || false);
} else {
this.executeRequest(linkElement.dataset.url, linkElement.dataset.redirectUrl);
}
};
let noElement = document.createElement("a");
noElement.href = "#";
noElement.appendChild(document.createTextNode(linkElement.dataset.labelNo));
noElement.onclick = (event) => {
event.preventDefault();
linkElement.style.display = "inline";
questionElement.remove();
};
questionElement.className = "confirm";
questionElement.appendChild(document.createTextNode(linkElement.dataset.labelQuestion + " "));
questionElement.appendChild(yesElement);
questionElement.appendChild(document.createTextNode(", "));
questionElement.appendChild(noElement);
containerElement.appendChild(questionElement);
}
}