diff --git a/app/assets/javascripts/discourse/components/topic-progress.js.es6 b/app/assets/javascripts/discourse/components/topic-progress.js.es6 index 6da51fc7ebf..c4a4a4e7fcf 100644 --- a/app/assets/javascripts/discourse/components/topic-progress.js.es6 +++ b/app/assets/javascripts/discourse/components/topic-progress.js.es6 @@ -9,6 +9,7 @@ export default Ember.Component.extend({ progressPosition: null, postStream: Ember.computed.alias('topic.postStream'), userWantsToJump: null, + _streamPercentage: null, init() { this._super(); @@ -35,14 +36,6 @@ export default Ember.Component.extend({ } }, - @computed('postStream.loaded', 'progressPosition', 'postStream.filteredPostsCount', 'postStream.highest_post_number') - streamPercentage(loaded, progressPosition, filteredPostsCount, highestPostNumber) { - if (!loaded) { return 0; } - if (highestPostNumber === 0) { return 0; } - const perc = progressPosition / filteredPostsCount; - return (perc > 1.0) ? 1.0 : perc; - }, - @computed('progressPosition') jumpTopDisabled(progressPosition) { return progressPosition <= 3; @@ -72,11 +65,17 @@ export default Ember.Component.extend({ } }, - @observes('streamPercentage', 'postStream.stream.[]') + @observes('postStream.stream.[]') _updateBar() { Ember.run.scheduleOnce('afterRender', this, this._updateProgressBar); }, + _topicScrolled(event) { + this.set('progressPosition', event.postIndex); + this._streamPercentage = event.percent; + this._updateBar(); + }, + didInsertElement() { this._super(); @@ -84,7 +83,7 @@ export default Ember.Component.extend({ .on("composer:resized", this, this._dock) .on('composer:closed', this, this._dock) .on("topic:scrolled", this, this._dock) - .on('topic:current-post-changed', postNumber => this.set('progressPosition', postNumber)) + .on('topic:current-post-scrolled', this, this._topicScrolled) .on('topic-progress:keyboard-trigger', this, this.keyboardTrigger); Ember.run.scheduleOnce('afterRender', this, this._updateProgressBar); @@ -96,13 +95,12 @@ export default Ember.Component.extend({ .off("composer:resized", this, this._dock) .off('composer:closed', this, this._dock) .off('topic:scrolled', this, this._dock) - .off('topic:current-post-changed') + .off('topic:current-post-scrolled') .off('topic-progress:keyboard-trigger'); }, _updateProgressBar() { - if (this.isDestroyed || this.isDestroying) { return; } - if (this.get('hidden')) { return; } + if (this.isDestroyed || this.isDestroying || this.get('hidden')) { return; } const $topicProgress = this.$('#topic-progress'); // speeds up stuff, bypass jquery slowness and extra checks @@ -110,7 +108,7 @@ export default Ember.Component.extend({ this._totalWidth = $topicProgress[0].offsetWidth; } const totalWidth = this._totalWidth; - const progressWidth = this.get('streamPercentage') * totalWidth; + const progressWidth = (this._streamPercentage || 0) * totalWidth; const borderSize = (progressWidth === totalWidth) ? "0px" : "1px"; const $bg = $topicProgress.find('.bg'); diff --git a/app/assets/javascripts/discourse/controllers/topic.js.es6 b/app/assets/javascripts/discourse/controllers/topic.js.es6 index 147a508b1a3..5e6b0d3d8e7 100644 --- a/app/assets/javascripts/discourse/controllers/topic.js.es6 +++ b/app/assets/javascripts/discourse/controllers/topic.js.es6 @@ -206,13 +206,14 @@ export default Ember.Controller.extend(SelectedPostsCount, BufferedContent, { const postStream = model.get('postStream'); this._progressIndex = postStream.progressIndexOfPost(post); - this.appEvents.trigger('topic:current-post-changed', this._progressIndex); }, currentPostScrolled(event) { + const total = this.get('model.postStream.filteredPostsCount'); + const percent = (parseFloat(this._progressIndex + event.percent - 1) / total); this.appEvents.trigger('topic:current-post-scrolled', { postIndex: this._progressIndex, - percent: event.percent + percent: Math.max(Math.min(percent, 1.0), 0.0) }); }, diff --git a/app/assets/javascripts/discourse/widgets/topic-timeline.js.es6 b/app/assets/javascripts/discourse/widgets/topic-timeline.js.es6 index 1138e32785b..851de634e19 100644 --- a/app/assets/javascripts/discourse/widgets/topic-timeline.js.es6 +++ b/app/assets/javascripts/discourse/widgets/topic-timeline.js.es6 @@ -170,8 +170,7 @@ createWidget('timeline-scrollarea', { }, topicCurrentPostScrolled(event) { - const { postIndex, percent } = event; - this.state.percentage = this._percentFor(this.attrs.topic, parseFloat(postIndex) + percent); + this.state.percentage = event.percent; }, _percentFor(topic, postIndex) {