BUGFIX: progress bar was hidden when the composer was open

This commit is contained in:
Régis Hanol 2014-06-04 13:03:14 +02:00
parent fc8eef6d98
commit 7655066967
10 changed files with 77 additions and 57 deletions

View file

@ -61,7 +61,8 @@ export default Discourse.Controller.extend({
},
updateDraftStatus: function() {
this.get('model').updateDraftStatus();
var c = this.get('model');
if (c) { c.updateDraftStatus(); }
},
appendText: function(text) {

View file

@ -638,7 +638,4 @@ Discourse.TopicController = Discourse.ObjectController.extend(Discourse.Selected
}
}
});

View file

@ -292,7 +292,7 @@ Discourse.Composer = Discourse.Model.extend({
opts:
action - The action we're performing: edit, reply or createTopic
post - The post we're replying to, if present
topic - The topic we're replying to, if present
topic - The topic we're replying to, if present
quote - If we're opening a reply from a quote, the quote we're making
*/
open: function(opts) {

View file

@ -104,7 +104,6 @@
{{i18n composer.saved_draft}}
</div>
</div>
</div>
{{/if}}

View file

@ -57,9 +57,11 @@
<div class="container posts">
{{view Discourse.SelectedPostsView}}
<div class="row">
<section class="topic-area" id='topic' data-topic-id='{{unbound id}}'>
<div class='posts-wrapper'>
<div id='topic-progress-wrapper' {{bind-attr class="dockedCounter:docked"}}>
<nav id='topic-progress' title="{{i18n topic.progress.title}}" {{bind-attr class="hideProgress:hidden"}}>
<button id='jump-top' title="{{i18n topic.progress.jump_top}}" {{bind-attr disabled="jumpTopDisabled"}} {{action jumpTop}}><i class="fa fa-arrow-circle-up"></i></button>

View file

@ -26,8 +26,8 @@ Discourse.ComposerMessagesView = Ember.CollectionView.extend({
},
didInsertElement: function() {
var replyControl = $('#reply-control');
this.$().css('bottom', (replyControl.height() || 0) + "px").slideDown('fast');
var composerHeight = $('#reply-control').height() || 0;
this.$().css('bottom', composerHeight + "px").show();
}
})
});

View file

@ -53,23 +53,26 @@ Discourse.ComposerView = Discourse.View.extend(Ember.Evented, {
Ember.run.scheduleOnce('afterRender', this, 'refreshPreview');
}.observes('model.reply', 'model.hidePreview'),
movePanels: function(sizePx) {
$('.composer-popup').css('bottom', sizePx);
},
focusIn: function() {
var controller = this.get('controller');
if (controller) controller.updateDraftStatus();
},
movePanels: function(sizePx) {
$('#main-outlet').css('padding-bottom', sizePx);
$('.composer-popup').css('bottom', sizePx);
},
resize: function() {
// this still needs to wait on animations, need a clean way to do that
var self = this;
return Em.run.schedule('afterRender', function() {
var replyControl = $('#reply-control');
var h = replyControl.height() || 0;
var sizePx = "" + h + "px";
$('#main-outlet').css('padding-bottom', sizePx);
$('.composer-popup').css('bottom', sizePx);
var $replyControl = $('#reply-control');
// wait for the transitions
$replyControl.on("transitionend", function() {
var h = $replyControl.height() || 0;
var sizePx = "" + h + "px";
if (self.movePanels) { self.movePanels(sizePx); }
});
});
}.observes('model.composeState'),

View file

@ -39,7 +39,7 @@ Discourse.TopicView = Discourse.View.extend(Discourse.Scrolling, {
this._topicProgress = $topicProgress;
// CAREFUL WITH THIS AXE
// offsetWidth will cause a reflow, this ensures it only happens once
// in future it may make sense to move this offscreen to to the measurement
// in future it may make sense to move this offscreen to do the measurement
Discourse.TopicView._progressWidth = Discourse.TopicView._progressWidth || $topicProgress[0].offsetWidth;
}
@ -155,7 +155,6 @@ Discourse.TopicView = Discourse.View.extend(Discourse.Scrolling, {
@method scrolled
**/
scrolled: function(){
var offset = window.pageYOffset || $('html').scrollTop();
if (!this.get('docAt')) {
var title = $('#topic-title');
@ -172,14 +171,39 @@ Discourse.TopicView = Discourse.View.extend(Discourse.Scrolling, {
headerController.set('showExtraInfo', topic.get('postStream.firstPostNotLoaded'));
}
// Dock the counter if necessary
var $lastPost = $('article[data-post-id=' + topic.get('postStream.lastPostId') + "]");
var lastPostOffset = $lastPost.offset();
if (!lastPostOffset) {
this.set('controller.dockedCounter', false);
return;
// dock the counter if necessary
var maximumOffset = $('#topic-footer-buttons').offset(),
composerHeight = $('#reply-control').height() || 0,
$topicProgressWrapper = $('#topic-progress-wrapper'),
style = $topicProgressWrapper.attr('style') || '',
isDocked = false;
if (maximumOffset) {
var threshold = maximumOffset.top,
windowHeight = $(window).height(),
topicProgressHeight = $('#topic-progress').height();
isDocked = offset >= threshold - windowHeight + topicProgressHeight + composerHeight;
}
this.set('controller.dockedCounter', (offset >= (lastPostOffset.top + $lastPost.height()) - $(window).height()));
if (composerHeight > 0) {
if (isDocked) {
if (style.indexOf('bottom') >= 0) {
$topicProgressWrapper.css('bottom', '');
}
} else {
var height = composerHeight + "px";
if ($topicProgressWrapper.css('bottom') !== height) {
$topicProgressWrapper.css('bottom', height);
}
}
} else {
if (style.indexOf('bottom') >= 0) {
$topicProgressWrapper.css('bottom', '');
}
}
this.set("controller.dockedCounter", isDocked);
},
topicTrackingState: function() {

View file

@ -465,7 +465,11 @@ a.star {
line-height: 32px;
color: $primary;
}
.btn {
margin-bottom: 5px;
margin-right: 10px;
.fa-star {margin-right: 5px;}
}
}
#suggested-topics {
@ -497,14 +501,6 @@ button.expand-post {
margin-top: 10px;
}
#topic-footer-buttons {
.btn {
margin-bottom: 5px;
margin-right: 10px;
.fa-star {margin-right: 5px;}
}
}
.quote-button {
display: none;
position: absolute;

View file

@ -61,21 +61,6 @@
.private-message-glyph { color: scale-color($primary, $lightness: 75%); }
.private_message #topic-title .private-message-glyph { display: inline; }
#topic-closing-info {
border-top: 1px solid scale-color-diff();
padding-top: 10px;
height: 20px;
}
#topic-progress-wrapper {
position: fixed;
right: 50%;
width: 0;
bottom: 0;
z-index: 500;
outline: 1px solid transparent;
}
a.reply-new {
position: absolute;
margin-top: -2px;
@ -99,6 +84,25 @@ a:hover.reply-new {
}
}
#topic-closing-info {
border-top: 1px solid scale-color-diff();
padding-top: 10px;
height: 20px;
}
#topic-progress-wrapper {
position: fixed;
right: 50%;
width: 0;
bottom: 0;
z-index: 500;
outline: 1px solid transparent;
&.docked {
position: absolute;
bottom: -70px;
}
}
#topic-progress {
position: relative;
left: 345px;
@ -161,12 +165,6 @@ a:hover.reply-new {
}
}
#topic-progress-wrapper.docked {
position: absolute;
bottom: -70px;
}
#suggested-topics .topic-statuses .topic-status {
padding: 0;
i {