Discourse/discourse
Discourse/discourse
2
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2025-09-07 12:02:53 +08:00
Code Packages Activity Actions 5

Have menu panels show up on top of the composer, stop composer at header

Browse source
This commit is contained in:
Robin Ward 2015-09-01 17:33:37 -04:00
parent 1bd0f5b015
commit f5cbaf5609
4 changed files with 32 additions and 19 deletions
Download patch file Download diff file Expand all files Collapse all files

38
app/assets/javascripts/discourse/views/composer.js.es6
View file

@ -60,23 +60,22 @@ const ComposerView = Ember.View.extend(Ember.Evented, {
}, },
resize: function() { resize: function() {
const self = this; Ember.run.scheduleOnce('afterRender', () => {
Ember.run.scheduleOnce('afterRender', function() { let h = $('#reply-control').height() || 0;
const h = $('#reply-control').height() || 0; this.movePanels(h + "px");
self.movePanels.apply(self, [h + "px"]);
// Figure out the size of the fields // Figure out the size of the fields
const $fields = self.$('.composer-fields'); const $fields = this.$('.composer-fields');
let pos = $fields.position(); let pos = $fields.position();
if (pos) { if (pos) {
self.$('.wmd-controls').css('top', $fields.height() + pos.top + 5); this.$('.wmd-controls').css('top', $fields.height() + pos.top + 5);
} }
// get the submit panel height // get the submit panel height
pos = self.$('.submit-panel').position(); pos = this.$('.submit-panel').position();
if (pos) { if (pos) {
self.$('.wmd-controls').css('bottom', h - pos.top + 7); this.$('.wmd-controls').css('bottom', h - pos.top + 7);
} }
}); });
@ -117,20 +116,25 @@ const ComposerView = Ember.View.extend(Ember.Evented, {
}, },
_enableResizing: function() { _enableResizing: function() {
const $replyControl = $('#reply-control'), const $replyControl = $('#reply-control');
self = this;
const resizer = function() { const runResize = () => {
Ember.run(function() { Ember.run(() => this.resize());
self.resize();
});
}; };
$replyControl.DivResizer({ $replyControl.DivResizer({
resize: resizer, maxHeight(winHeight) {
onDrag(sizePx) { self.movePanels.apply(self, [sizePx]); } const $header = $('header.d-header');
const headerOffset = $header.offset();
const headerOffsetTop = (headerOffset) ? headerOffset.top : 0;
const headerHeight = parseInt($header.height() + headerOffsetTop - $(window).scrollTop() + 5);
return winHeight - headerHeight;
},
resize: runResize,
onDrag: (sizePx) => this.movePanels(sizePx)
}); });
afterTransition($replyControl, resizer);
afterTransition($replyControl, runResize);
this.set('controller.view', this); this.set('controller.view', this);
positioningWorkaround(this.$()); positioningWorkaround(this.$());

4
app/assets/stylesheets/common/base/menu-panel.scss
View file

@ -24,6 +24,10 @@
padding: 0.5em; padding: 0.5em;
width: 300px; width: 300px;
hr {
margin: 3px 0;
}
.panel-header { .panel-header {
position: absolute; position: absolute;
right: 20px; right: 20px;

2
app/assets/stylesheets/desktop/compose.scss
View file

@ -112,7 +112,7 @@
} }
transition: height 0.4s ease; transition: height 0.4s ease;
width: 100%; width: 100%;
z-index: 1039; z-index: 999;
height: 0; height: 0;
background-color: dark-light-diff($primary, $secondary, 90%, -60%); background-color: dark-light-diff($primary, $secondary, 90%, -60%);
bottom: 0; bottom: 0;

7
vendor/assets/javascripts/div_resizer.js vendored
View file

@ -42,7 +42,12 @@ performDrag = function(e, opts) {
thisMousePos = mousePosition(e).y; thisMousePos = mousePosition(e).y;
size = originalDivHeight + (originalPos - thisMousePos); size = originalDivHeight + (originalPos - thisMousePos);
lastMousePos = thisMousePos; lastMousePos = thisMousePos;
size = Math.min(size, $(window).height());
var maxHeight = $(window).height();
if (opts.maxHeight) {
maxHeight = opts.maxHeight(maxHeight);
}
size = Math.min(size, maxHeight);
size = Math.max(min, size); size = Math.max(min, size);
sizePx = size + "px"; sizePx = size + "px";
if (typeof opts.onDrag === "function") { if (typeof opts.onDrag === "function") {