highlight the first of the newly loaded topics when scrolling

This commit is contained in:
Régis Hanol 2013-03-06 23:27:04 +01:00
parent a0949ca992
commit 002776808f
2 changed files with 15 additions and 12 deletions

View File

@ -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);
}

View File

@ -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();
}
}
});