1 files changed, 29 insertions, 25 deletions

diff --git a/ui/static/js/app.js b/ui/static/js/app.js
index 91de712..f054cc0 100644
--- a/ui/static/js/app.js
+++ b/ui/static/js/app.js
@@ -115,17 +115,17 @@ function markPageAsRead() {
 }
 
 // Handle entry status changes from the list view and entry view.
-function handleEntryStatus() {
-    if (isListView()) {
-        let currentItem = document.querySelector(".current-item");
-        if (currentItem !== null) {
-            // The order is important here,
-            // On the unread page, the read item will be hidden.
+function handleEntryStatus(element) {
+    let currentEntry = findEntry(element);
+    if (currentEntry) {
+        // The order is important here,
+        // On the unread page, the read item will be hidden.
+        // If "goToNextListItem" first, it may go to an item about to hide:
+        // Imagine that user click 'mark as read' right below the '.current-item'
+        toggleEntryStatus(currentEntry);
+        if (isListView() && currentEntry.classList.contains('current-item')) {
             goToNextListItem();
-            toggleEntryStatus(currentItem);
         }
-    } else {
-        toggleEntryStatus(document.querySelector(".entry"));
     }
 }
 
@@ -180,14 +180,10 @@ function updateEntriesStatus(entryIDs, status, callback) {
 }
 
 // Handle save entry from list view and entry view.
-function handleSaveEntry() {
-    if (isListView()) {
-        let currentItem = document.querySelector(".current-item");
-        if (currentItem !== null) {
-            saveEntry(currentItem.querySelector("a[data-save-entry]"));
-        }
-    } else {
-        saveEntry(document.querySelector("a[data-save-entry]"));
+function handleSaveEntry(element) {
+    let currentEntry = findEntry(element);
+    if (currentEntry) {
+        saveEntry(currentEntry.querySelector("a[data-save-entry]"));
     }
 }
 
@@ -212,14 +208,10 @@ function saveEntry(element) {
 }
 
 // Handle bookmark from the list view and entry view.
-function handleBookmark() {
-    if (isListView()) {
-        let currentItem = document.querySelector(".current-item");
-        if (currentItem !== null) {
-            toggleBookmark(currentItem);
-        }
-    } else {
-        toggleBookmark(document.querySelector(".entry"));
+function handleBookmark(element) {
+    let currentEntry = findEntry(element);
+    if (currentEntry) {
+        toggleBookmark(currentEntry);
     }
 }
 
@@ -454,6 +446,18 @@ function isListView() {
     return document.querySelector(".items") !== null;
 }
 
+function findEntry(element) {
+    if (isListView()) {
+        if (element) {
+            return DomHelper.findParent(element, "item");
+        } else {
+            return document.querySelector(".current-item");
+        }
+    } else {
+        return document.querySelector(".entry");
+    }
+}
+
 function handleConfirmationMessage(linkElement, callback) {
     linkElement.style.display = "none";