Change link state when marking all entries as read

ui/static/js/bootstrap.js

@@ -34,18 +34,14 @@ document.addEventListener("DOMContentLoaded", function() {
 
     let mouseHandler = new MouseHandler();
     mouseHandler.onClick("a[data-save-entry]", (event) => {
-        event.preventDefault();
         EntryHandler.saveEntry(event.target);
     });
 
     mouseHandler.onClick("a[data-toggle-bookmark]", (event) => {
-        event.preventDefault();
         EntryHandler.toggleBookmark(event.target);
     });
 
     mouseHandler.onClick("a[data-toggle-status]", (event) => {
-        event.preventDefault();
-
         let currentItem = DomHelper.findParent(event.target, "entry");
         if (! currentItem) {
             currentItem = DomHelper.findParent(event.target, "item");
@@ -57,7 +53,6 @@ document.addEventListener("DOMContentLoaded", function() {
     });
 
     mouseHandler.onClick("a[data-fetch-content-entry]", (event) => {
-        event.preventDefault();
         EntryHandler.fetchOriginalContent(event.target);
     });
 
@@ -71,6 +66,10 @@ document.addEventListener("DOMContentLoaded", function() {
         navHandler.setFocusToSearchInput(event);
     });
 
+    mouseHandler.onClick("a[data-link-state=flip]", (event) => {
+        LinkStateHandler.flip(event.target);
+    }, true);
+
     if (document.documentElement.clientWidth < 600) {
         let menuHandler = new MenuHandler();
         mouseHandler.onClick(".logo", () => menuHandler.toggleMainMenu());

ui/static/js/link_state_handler.js

@@ -0,0 +1,10 @@
+class LinkStateHandler {
+    static flip(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);
+    }
+}

ui/static/js/mouse_handler.js

@@ -1,9 +1,9 @@
 class MouseHandler {
-    onClick(selector, callback) {
+    onClick(selector, callback, noPreventDefault) {
         let elements = document.querySelectorAll(selector);
         elements.forEach((element) => {
             element.onclick = (event) => {
-                event.preventDefault();
+                noPreventDefault || event.preventDefault();
                 callback(event);
             };
         });