From 002776808fe87dd8a28d6568b61e55ccb40791e6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?R=C3=A9gis=20Hanol?= <regis@hanol.fr>
Date: Wed, 6 Mar 2013 23:27:04 +0100
Subject: [PATCH] highlight the first of the newly loaded topics when scrolling

---
 .../javascripts/discourse/models/topic_list.js | 18 +++++++++++-------
 .../views/list/topic_list_item_view.js         |  9 ++++-----
 2 files changed, 15 insertions(+), 12 deletions(-)

diff --git a/app/assets/javascripts/discourse/models/topic_list.js b/app/assets/javascripts/discourse/models/topic_list.js
index ea20f70086b..2de6cd5c19c 100644
--- a/app/assets/javascripts/discourse/models/topic_list.js
+++ b/app/assets/javascripts/discourse/models/topic_list.js
@@ -17,16 +17,22 @@ Discourse.TopicList = Discourse.Model.extend({
       Discourse.URL.replaceState("/" + (this.get('filter')) + "/more");
       $.ajax(moreUrl, {
         success: function(result) {
-          var newTopics, topicIds, topics;
+          var newTopics, topicIds, topics, topicsAdded = 0;
           if (result) {
+            // the new topics loaded from the server
             newTopics = Discourse.TopicList.topicsFrom(result);
+            // the current topics
             topics = _this.get('topics');
+            // keeps track of the ids of the current topics
             topicIds = [];
             topics.each(function(t) {
               topicIds[t.get('id')] = true;
             });
+            // add new topics to the list of current topics if not already present
             newTopics.each(function(t) {
               if (!topicIds[t.get('id')]) {
+                // highlight the first of the new topics so we can get a visual feedback
+                t.set('highlight', topicsAdded++ === 0);
                 return topics.pushObject(t);
               }
             });
@@ -43,13 +49,11 @@ Discourse.TopicList = Discourse.Model.extend({
   },
 
   insert: function(json) {
-    var newTopic;
-    newTopic = Discourse.TopicList.decodeTopic(json);
-    /* New Topics are always unseen
-    */
-
+    var newTopic  = Discourse.TopicList.decodeTopic(json);
+    // new Topics are always unseen
     newTopic.set('unseen', true);
-    newTopic.set('highlightAfterInsert', true);
+    // and highlighted on the topics list view
+    newTopic.set('highlight', true);
     return this.get('inserted').unshiftObject(newTopic);
   }
 
diff --git a/app/assets/javascripts/discourse/views/list/topic_list_item_view.js b/app/assets/javascripts/discourse/views/list/topic_list_item_view.js
index d07a32ff511..5b01af4557b 100644
--- a/app/assets/javascripts/discourse/views/list/topic_list_item_view.js
+++ b/app/assets/javascripts/discourse/views/list/topic_list_item_view.js
@@ -33,16 +33,15 @@ Discourse.TopicListItemView = Discourse.View.extend({
   },
 
   didInsertElement: function() {
+    // highligth the last topic viewed
     if (Discourse.get('transient.lastTopicIdViewed') === this.get('content.id')) {
       Discourse.set('transient.lastTopicIdViewed', null);
       this.highlight();
-      return;
     }
-    if (this.get('content.highlightAfterInsert')) {
-      return this.highlight();
+    // highlight new topics that have been loaded from the server or the one we just created
+    else if (this.get('content.highlight')) {
+      this.highlight();
     }
   }
 
 });
-
-