set items to read on click/middle-click of external link

ui/static/js/app.js

@@ -12,6 +12,19 @@ function onClick(selector, callback, noPreventDefault) {
     });
 }
 
+function onAuxClick(selector, callback, noPreventDefault) {
+    let elements = document.querySelectorAll(selector);
+    elements.forEach((element) => {
+        element.onauxclick = (event) => {
+            if (!noPreventDefault) {
+                event.preventDefault();
+            }
+
+            callback(event);
+        };
+    });
+}
+
 // Show and hide the main menu on mobile devices.
 function toggleMainMenu() {
     let menu = document.querySelector(".header nav ul");
@@ -115,11 +128,13 @@ function markPageAsRead() {
 }
 
 // Handle entry status changes from the list view and entry view.
-function handleEntryStatus(element) {
+function handleEntryStatus(element, setToRead) {
     let toasting = !element;
     let currentEntry = findEntry(element);
     if (currentEntry) {
+        if (!setToRead || currentEntry.querySelector("a[data-toggle-status]").dataset.value == "unread") {
             toggleEntryStatus(currentEntry, toasting);
+        }
         if (isListView() && currentEntry.classList.contains('current-item')) {
             goToNextListItem();
         }

ui/static/js/bootstrap.js

@@ -61,6 +61,15 @@ document.addEventListener("DOMContentLoaded", function () {
         request.execute();
     }));
 
+    onClick("a[data-original-link]", (event) => {
+        handleEntryStatus(event.target, true);
+    }, true);
+    onAuxClick("a[data-original-link]", (event) => {
+        if (event.button == 1) {
+            handleEntryStatus(event.target, true);
+        }
+    }, true);
+
     if (document.documentElement.clientWidth < 600) {
         onClick(".logo", () => toggleMainMenu());
         onClick(".header nav li", (event) => onClickMainMenuListItem(event));