FIX: Progress bar wasn't showing percentage after 2nd post was made

This commit is contained in:
Robin Ward 2015-05-28 14:58:14 -04:00
parent f87fc98411
commit fe18bdbcfb
2 changed files with 18 additions and 21 deletions

View File

@ -16,10 +16,10 @@
label="topic.progress.go_bottom"}}
</nav>
{{/if}}
<nav id='topic-progress' title="{{i18n 'topic.progress.title'}}" {{bind-attr class="hideProgress:hidden"}}>
<nav id='topic-progress' title="{{i18n 'topic.progress.title'}}" class="{{if hideProgress 'hidden'}}">
<div class='nums'>
<h4>{{progressPosition}}</h4><span {{bind-attr class="hugeNumberOfPosts:hidden"}}> <span>/</span> <h4>{{model.postStream.filteredPostsCount}}</h4></span>
<h4>{{progressPosition}}</h4><span class="{{if hugeNumberOfPosts 'hidden'}}"> <span>/</span> <h4>{{model.postStream.filteredPostsCount}}</h4></span>
</div>
<i {{bind-attr class=":fa expanded::fa-sort"}}></i>
<i class="fa {{if expanded 'fa-sort'}}"></i>
<div class='bg'>&nbsp;</div>
</nav>

View File

@ -4,11 +4,6 @@ export default Ember.View.extend({
classNameBindings: ['docked'],
_inserted: function() {
// This get seems counter intuitive, but it's to trigger the observer on
// the streamPercentage for this view. Otherwise the process bar does not
// update.
this.get('controller.streamPercentage');
this.appEvents.on("composer:opened", this, '_dock')
.on("composer:resized", this, '_dock')
.on("composer:closed", this, '_dock')
@ -17,7 +12,6 @@ export default Ember.View.extend({
// Reflows are expensive. Cache the jQuery selector
// and the width when inserted into the DOM
this._$topicProgress = this.$('#topic-progress');
this._progressWidth = this._$topicProgress[0].offsetWidth;
}.on('didInsertElement'),
_unbindEvents: function() {
@ -29,28 +23,31 @@ export default Ember.View.extend({
_updateBar: function() {
Em.run.scheduleOnce('afterRender', this, '_updateProgressBar');
}.observes('controller.streamPercentage', 'controller.model.postStream.stream.@each'),
}.observes('controller.streamPercentage', 'controller.model.postStream.stream.@each').on('init'),
_updateProgressBar: function() {
// speeds up stuff, bypass jquery slowness and extra checks
var totalWidth = this._progressWidth,
progressWidth = this.get('controller.streamPercentage') * totalWidth;
if (!this._totalWidth) {
this._totalWidth = this._$topicProgress[0].offsetWidth;
}
const totalWidth = this._totalWidth;
const progressWidth = this.get('controller.streamPercentage') * totalWidth;
this._$topicProgress.find('.bg')
.css("border-right-width", (progressWidth === totalWidth) ? "0px" : "1px")
.width(progressWidth);
},
_dock: function () {
var maximumOffset = $('#topic-footer-buttons').offset(),
_dock() {
const maximumOffset = $('#topic-footer-buttons').offset(),
composerHeight = $('#reply-control').height() || 0,
$topicProgressWrapper = this.$(),
style = $topicProgressWrapper.attr('style') || '',
isDocked = false,
offset = window.pageYOffset || $('html').scrollTop();
let isDocked = false;
if (maximumOffset) {
var threshold = maximumOffset.top,
const threshold = maximumOffset.top,
windowHeight = $(window).height(),
topicProgressHeight = $('#topic-progress').height();
@ -63,7 +60,7 @@ export default Ember.View.extend({
$topicProgressWrapper.css('bottom', '');
}
} else {
var height = composerHeight + "px";
const height = composerHeight + "px";
if ($topicProgressWrapper.css('bottom') !== height) {
$topicProgressWrapper.css('bottom', height);
}
@ -84,21 +81,21 @@ export default Ember.View.extend({
}
if (this.get('controller.expanded')) {
var self = this;
const self = this;
Em.run.schedule('afterRender', function() {
self.$('input').focus();
});
}
}.observes('controller.expanded'),
click: function(e) {
click(e) {
if ($(e.target).parents('#topic-progress').length) {
this.get('controller').send('toggleExpansion');
}
},
keyDown: function(e) {
var controller = this.get('controller');
keyDown(e) {
const controller = this.get('controller');
if (controller.get('expanded')) {
if (e.keyCode === 13) {
controller.send('jumpPost');