Add item links for the feed-items page

assets/js/app.js

@@ -78,7 +78,16 @@
                 if (response.status == "read" || response.status == "unread") {
 
                     find_next_item();
-                    if (hide) remove_item(response.item_id);
+
+                    if (hide) {
+                        remove_item(response.item_id);
+                    }
+                    else if (response.status == "read") {
+                        show_item_as_read(item_id);
+                    }
+                    else if (response.status == "unread") {
+                        show_item_as_unread(item_id);
+                    }
                 }
             }
         }
@@ -147,6 +156,31 @@
         }
     }
 
+    // Show an item as read (change title color and add icon)
+    function show_item_as_read(item_id)
+    {
+        var link = document.getElementById("open-" + item_id);
+
+        if (link) {
+            link.className = "read";
+
+            var icon = document.createElement("span");
+            icon.id = "read-icon-" + item_id;
+            icon.appendChild(document.createTextNode("☑ "));
+            link.parentNode.insertBefore(icon, link);
+        }
+    }
+
+    // Show an item as unread (change title color and remove read icon)
+    function show_item_as_unread(item_id)
+    {
+        var link = document.getElementById("open-" + item_id);
+        if (link) link.className = "";
+
+        var icon = document.getElementById("read-icon-" + item_id);
+        if (icon) icon.parentNode.removeChild(icon);
+    }
+
     // Show the refresh icon when updating a feed
     function show_refresh_icon(feed_id)
     {
@@ -260,7 +294,7 @@
             if (item.getAttribute("data-item-id") != item_id) item = false;
         }
 
-        if (item) {
+        if (item && item.getAttribute("data-hide")) {
 
             item.parentNode.removeChild(item);
             var container = document.getElementById("page-counter");

index.php

@@ -138,10 +138,11 @@ Router\get_action('mark-item-read', function() {
     $id = Request\param('id');
     $redirect = Request\param('redirect', 'unread');
     $offset = Request\int_param('offset', 0);
+    $feed_id = Request\int_param('feed_id', 0);
 
     Model\set_item_read($id);
 
-    Response\Redirect('?action='.$redirect.'&offset='.$offset);
+    Response\Redirect('?action='.$redirect.'&offset='.$offset.'&feed_id='.$feed_id.'#item-'.$id);
 });
 
 
@@ -151,10 +152,11 @@ Router\get_action('mark-item-unread', function() {
     $id = Request\param('id');
     $redirect = Request\param('redirect', 'history');
     $offset = Request\int_param('offset', 0);
+    $feed_id = Request\int_param('feed_id', 0);
 
     Model\set_item_unread($id);
 
-    Response\Redirect('?action='.$redirect.'&offset='.$offset);
+    Response\Redirect('?action='.$redirect.'&offset='.$offset.'&feed_id='.$feed_id.'#item-'.$id);
 });
 
 
@@ -164,10 +166,11 @@ Router\get_action('mark-item-removed', function() {
     $id = Request\param('id');
     $redirect = Request\param('redirect', 'history');
     $offset = Request\int_param('offset', 0);
+    $feed_id = Request\int_param('feed_id', 0);
 
     Model\set_item_removed($id);
 
-    Response\Redirect('?action='.$redirect.'&offset='.$offset);
+    Response\Redirect('?action='.$redirect.'&offset='.$offset.'&feed_id='.$feed_id);
 });
 
 
@@ -224,6 +227,7 @@ Router\get_action('bookmark', function() {
     $menu = Request\param('menu', 'unread');
     $source = Request\param('source', 'unread');
     $offset = Request\int_param('offset', 0);
+    $feed_id = Request\int_param('feed_id', 0);
 
     Model\set_bookmark_value($id, Request\int_param('value'));
 
@@ -231,7 +235,7 @@ Router\get_action('bookmark', function() {
         Response\Redirect('?action=show&menu='.$menu.'&id='.$id);
     }
 
-    Response\Redirect('?action='.$menu.'&offset='.$offset);
+    Response\Redirect('?action='.$menu.'&offset='.$offset.'&feed_id='.$feed_id.'#item-'.$id);
 });
 
 

templates/feed_items.php

@@ -20,10 +20,10 @@
 
     <section class="items" id="listing">
     <?php foreach ($items as $item): ?>
-        <article id="item-<?= $item['id'] ?>" data-item-id="<?= $item['id'] ?>" data-item-page="<?= $menu ?>" data-hide="true">
+        <article id="item-<?= $item['id'] ?>" data-item-id="<?= $item['id'] ?>" data-item-page="<?= $menu ?>">
             <h2>
-                <?= $item['bookmark'] ? '★ ' : '' ?>
-                <?= $item['status'] === 'read' ? '☑ ' : '' ?>
+                <?= $item['bookmark'] ? '<span id="bookmark-icon-'.$item['id'].'">★ </span>' : '' ?>
+                <?= $item['status'] === 'read' ? '<span id="read-icon-'.$item['id'].'">☑ </span>' : '' ?>
                 <a
                     href="?action=show&amp;menu=feed-items&amp;id=<?= $item['id'] ?>"
                     data-item-id="<?= $item['id'] ?>"
@@ -38,7 +38,33 @@
             </p>
             <p>
                 <?= Helper\get_host_from_url($item['url']) ?> |
-                <?= dt('%e %B %Y %k:%M', $item['updated']) ?> |
+                <span class="hide-mobile"><?= dt('%e %B %Y %k:%M', $item['updated']) ?> |</span>
+
+                <span class="hide-mobile">
+                <?php if ($item['bookmark']): ?>
+                    <a id="bookmark-<?= $item['id'] ?>" href="?action=bookmark&amp;value=0&amp;id=<?= $item['id'] ?>&amp;menu=feed-items&amp;offset=<?= $offset ?>&amp;feed_id=<?= $item['feed_id'] ?>"><?= t('remove bookmark') ?></a> |
+                <?php else: ?>
+                    <a id="bookmark-<?= $item['id'] ?>" href="?action=bookmark&amp;value=1&amp;id=<?= $item['id'] ?>&amp;menu=feed-items&amp;offset=<?= $offset ?>&amp;feed_id=<?= $item['feed_id'] ?>"><?= t('bookmark') ?></a> |
+                <?php endif ?>
+                </span>
+
+                <?php if ($item['status'] == 'unread'): ?>
+                    <a
+                        href="?action=mark-item-read&amp;id=<?= $item['id'] ?>&amp;offset=<?= $offset ?>&amp;redirect=feed-items&amp;feed_id=<?= $item['feed_id'] ?>"
+                    >
+                        <?= t('mark as read') ?>
+                    </a> |
+                <?php else: ?>
+                    <a
+                        href="?action=mark-item-unread&amp;id=<?= $item['id'] ?>&amp;offset=<?= $offset ?>&amp;redirect=feed-items&amp;feed_id=<?= $item['feed_id'] ?>"
+                    >
+                        <?= t('mark as unread') ?>
+                    </a> |
+                <?php endif ?>
+
+                <span class="hide-mobile">
+                <a href="?action=mark-item-removed&amp;id=<?= $item['id'] ?>&amp;offset=<?= $offset ?>&amp;redirect=feed-items&amp;feed_id=<?= $item['feed_id'] ?>"><?= t('remove') ?></a> |
+                </span>
 
                 <a
                     href="<?= $item['url'] ?>"

templates/history.php

@@ -40,6 +40,7 @@
                     href="?action=mark-item-unread&amp;id=<?= $item['id'] ?>&amp;offset=<?= $offset ?>"
                     data-action="mark-unread"
                     data-item-id="<?= $item['id'] ?>"
+                    data-hide="true"
                 >
                     <?= t('mark as unread') ?>
                 </a> |

templates/unread_items.php

@@ -48,6 +48,7 @@
                     href="?action=mark-item-read&amp;id=<?= $item['id'] ?>&amp;offset=<?= $offset ?>"
                     data-action="mark-read"
                     data-item-id="<?= $item['id'] ?>"
+                    data-hide="true"
                 >
                     <?= t('mark as read') ?>
                 </a> |