mark currently read item

css/news.css

@@ -421,9 +421,14 @@ div.add_parentfolder {
             background-image: -webkit-linear-gradient(top, rgb(248,248,248) 0, rgb(255,255,255) 6em);
             background-image: -ms-linear-gradient(top, rgb(248,248,248) 0, rgb(255,255,255) 6em);
             padding: 2.5em 0 0 0;
-	    cursor: default;
+	        cursor: default;
         }
 
+        .feed_item.viewed {
+            border-right: 5px solid #FF9933;
+        }
+
+
         .feed_item:first-child {
             border-top: 0;
         }

js/items.js

@@ -31,6 +31,7 @@ var t = t || function(app, string){ return string; }; // mock translation for lo
         this._$articleList = $(cssSelector);
         this._$articleList.scrollTop(0);
         this._itemCache = new ItemCache();
+        this._$articleList.children('ul').children('.feed_item:eq(0)').addClass('viewed');
         
         // mark items whose title was hid under the top edge as read
         // when the bottom is reached, mark all items as read
@@ -45,7 +46,9 @@ var t = t || function(app, string){ return string; }; // mock translation for lo
                     // wait and check if the item is still under the top edge
                     setTimeout(function(){ self._markItemAsReadTimeout(item);}, 1000);
                 }
-            })
+            });
+            // mark item with current class
+            self._markCurrentlyViewed();
         });
 
         this._itemCache.populate(this._$articleList.children('ul'));
@@ -105,6 +108,21 @@ var t = t || function(app, string){ return string; }; // mock translation for lo
         });
     };
 
+    /**
+     * Marks the currently viewed element as viewed
+     */
+    Items.prototype._markCurrentlyViewed = function() {
+        var self = this;
+        $('.viewed').removeClass('viewed');
+        var notFound = true;
+        $('.feed_item').each(function(){
+            if(notFound && ($(this).position().top + $(this).outerHeight()) >= 0){
+                $(this).addClass('viewed');
+                notFound = false;
+            }
+        });
+    };
+
     /**
      * Jumps to the next visible element
      */
@@ -136,14 +154,6 @@ var t = t || function(app, string){ return string; }; // mock translation for lo
         });
     };
 
-    /**
-     * Jump to the next element in the list
-     * @param $elem the jquery elem to which we want to jump
-     */
-    Items.prototype._getNextJump = function($elem){
-        return $elem.position().top > 1;
-    }
-
     /**
      * Jumps to an element in the article list
      * @param number the number of the item starting with 0
@@ -340,6 +350,9 @@ var t = t || function(app, string){ return string; }; // mock translation for lo
         var $html = $('<ul>');
         for(var i=0; i<itemIds.length; i++){
             var item = this._items[itemIds[i]];
+            if(i === 0){
+                item.setViewed(true);
+            }
             if(News.Objects.Menu.isShowAll() || !item.isRead()){
                 $html.append(item.getHtml());
             }
@@ -434,6 +447,18 @@ var t = t || function(app, string){ return string; }; // mock translation for lo
         this._locked = locked;
     };
 
+    /**
+     * Adds the viewed class to the item
+     * @param viewed true will add the class, false remove
+     */
+    Item.prototype.setViewed = function(viewed) {
+        if(viewed){
+            this._$html.addClass('viewed');
+        } else {
+            this._$html.removeClass('viewed');
+        }
+    };
+
     /**
      * Returns true if locked, otherwise false
      * @return true if locked, otherwise false