FIX: Progress wasn't docking properly

This commit is contained in:
Robin Ward 2013-07-02 13:10:38 -04:00
parent 064efa1671
commit a04924deea
4 changed files with 24 additions and 28 deletions

View file

@ -64,6 +64,15 @@ Discourse.PostStream = Em.Object.extend({
firstPostNotLoaded: Em.computed.not('firstPostLoaded'),
/**
Returns the id of the last post in the set
@property lastPostId
**/
lastPostId: function() {
return _.last(this.get('stream'));
}.property('stream.@each'),
/**
Have we loaded the last post in the stream?
@ -71,8 +80,8 @@ Discourse.PostStream = Em.Object.extend({
**/
lastPostLoaded: function() {
if (!this.get('hasLoadedData')) { return false; }
return !!this.get('posts').findProperty('id', _.last(this.get('stream')));
}.property('hasLoadedData', 'posts.[]', 'stream.@each'),
return !!this.get('posts').findProperty('id', this.get('lastPostId'));
}.property('hasLoadedData', 'posts.[]', 'lastPostId'),
lastPostNotLoaded: Em.computed.not('lastPostLoaded'),

View file

@ -39,7 +39,7 @@
<div class="row">
<section class="topic-area" id='topic' data-topic-id='{{unbound id}}'>
<div class='posts-wrapper'>
<div id='topic-progress-wrapper'>
<div id='topic-progress-wrapper' {{bindAttr class="dockedCounter:docked"}}>
<nav id='topic-progress' title="{{i18n topic.progress.title}}" {{bindAttr class="hideProgress:hidden"}}>
<button id='jump-top' title="{{i18n topic.progress.jump_top}}" {{bindAttr disabled="jumpTopDisabled"}} {{action jumpTop}}><i class="icon-circle-arrow-up"></i></button>
<div class='nums'>

View file

@ -162,9 +162,7 @@ Discourse.TopicView = Discourse.View.extend(Discourse.Scrolling, {
},
resetExamineDockCache: function() {
this.docAt = null;
this.dockedTitle = false;
this.dockedCounter = false;
this.set('docAt', false);
},
updateDock: function(postView) {
@ -239,37 +237,25 @@ Discourse.TopicView = Discourse.View.extend(Discourse.Scrolling, {
}
var offset = window.pageYOffset || $('html').scrollTop();
var firstLoaded = topic.get('postStream.firstPostLoaded');
if (!this.docAt) {
if (!this.get('docAt')) {
var title = $('#topic-title');
if (title && title.length === 1) {
this.docAt = title.offset().top;
this.set('docAt', title.offset().top);
}
}
var headerController = this.get('controller.controllers.header');
if (this.docAt) {
headerController.set('showExtraInfo', offset >= this.docAt || !firstLoaded);
if (this.get('docAt')) {
headerController.set('showExtraInfo', offset >= this.get('docAt') || topic.get('postStream.firstPostNotLoaded'));
} else {
headerController.set('showExtraInfo', !firstLoaded);
headerController.set('showExtraInfo', topic.get('postStream.firstPostNotLoaded'));
}
// there is a whole bunch of caching we could add here
var $lastPost = $('.last-post');
// Dock the counter if necessary
var $lastPost = $('article[data-post-id=' + topic.get('postStream.lastPostId') + "]");
var lastPostOffset = $lastPost.offset();
if (!lastPostOffset) return;
if (offset >= (lastPostOffset.top + $lastPost.height()) - $(window).height()) {
if (!this.dockedCounter) {
$('#topic-progress-wrapper').addClass('docked');
this.dockedCounter = true;
}
} else {
if (this.dockedCounter) {
$('#topic-progress-wrapper').removeClass('docked');
this.dockedCounter = false;
}
}
if (!lastPostOffset) { return; }
this.set('controller.dockedCounter', (offset >= (lastPostOffset.top + $lastPost.height()) - $(window).height()));
},
topicTrackingState: function() {

View file

@ -22,6 +22,8 @@ test('defaults', function() {
test('appending posts', function() {
var postStream = buildStream(4567, [1, 3, 4]);
equal(postStream.get('lastPostId'), 4, "the last post id is 4");
ok(!postStream.get('hasPosts'), "there are no posts by default");
ok(!postStream.get('firstPostLoaded'), "the first post is not loaded");
ok(!postStream.get('lastPostLoaded'), "the last post is not loaded");
@ -29,7 +31,6 @@ test('appending posts', function() {
postStream.appendPost(Discourse.Post.create({id: 2, post_number: 2}));
ok(!postStream.get('firstPostLoaded'), "the first post is still not loaded");
ok(!postStream.get('lastPostLoaded'), "the last post is still not loaded");
equal(postStream.get('posts.length'), 1, "it has one post in the stream");
postStream.appendPost(Discourse.Post.create({id: 4, post_number: 4}));