Discource-C
/
discourse
mirror of https://github.com/discourse/discourse.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

FIX: Clicking on gear icon should hide popup menu.

This commit is contained in:
Guo Xiang Tan 2016-07-11 10:54:19 +08:00
parent 6e385f11b3
commit 4b557842eb
3 changed files with 34 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

58
app/assets/javascripts/discourse/components/composer-editor.js.es6
View File

@ -366,37 +366,41 @@ export default Ember.Component.extend({
this._resetUpload(true);
},
showOptions(toolbarEvent) {
// long term we want some smart positioning algorithm in popup-menu
// the problem is that positioning in a fixed panel is a nightmare
// cause offsetParent can end up returning a fixed element and then
// using offset() is not going to work, so you end up needing special logic
// especially since we allow for negative .top, provided there is room on screen
const myPos = this.$().position();
const buttonPos = this.$('.options').position();
toggleOptions(toolbarEvent) {
if (this.get('optionsVisible')) {
this.sendAction('hideOptions');
} else {
// long term we want some smart positioning algorithm in popup-menu
// the problem is that positioning in a fixed panel is a nightmare
// cause offsetParent can end up returning a fixed element and then
// using offset() is not going to work, so you end up needing special logic
// especially since we allow for negative .top, provided there is room on screen
const myPos = this.$().position();
const buttonPos = this.$('.options').position();
const popupHeight = $('#reply-control .popup-menu').height();
const popupWidth = $('#reply-control .popup-menu').width();
const popupHeight = $('#reply-control .popup-menu').height();
const popupWidth = $('#reply-control .popup-menu').width();
var top = myPos.top + buttonPos.top - 15;
var left = myPos.left + buttonPos.left - (popupWidth/2);
var top = myPos.top + buttonPos.top - 15;
var left = myPos.left + buttonPos.left - (popupWidth/2);
const composerPos = $('#reply-control').position();
const composerPos = $('#reply-control').position();
if (composerPos.top + top - popupHeight < 0) {
top = top + popupHeight + this.$('.options').height() + 50;
if (composerPos.top + top - popupHeight < 0) {
top = top + popupHeight + this.$('.options').height() + 50;
}
var replyWidth = $('#reply-control').width();
if (left + popupWidth > replyWidth) {
left = replyWidth - popupWidth - 40;
}
const selected = toolbarEvent.selected;
toolbarEvent.selectText(selected.start, selected.end - selected.start);
this.sendAction('showOptions', toolbarEvent,
{ position: "absolute", left, top });
}
var replyWidth = $('#reply-control').width();
if (left + popupWidth > replyWidth) {
left = replyWidth - popupWidth - 40;
}
const selected = toolbarEvent.selected;
toolbarEvent.selectText(selected.start, selected.end - selected.start);
this.sendAction('showOptions', toolbarEvent,
{ position: "absolute", left, top });
},
showUploadModal(toolbarEvent) {
@ -432,7 +436,7 @@ export default Ember.Component.extend({
group: 'extras',
icon: 'gear',
title: 'composer.options',
sendAction: 'showOptions'
sendAction: 'toggleOptions'
});
}

2
app/assets/javascripts/discourse/templates/components/composer-editor.hbs
View File

@ -5,7 +5,7 @@
markdownOptions=markdownOptions
extraButtons="extraButtons"
importQuote="importQuote"
showOptions="showOptions"
toggleOptions="toggleOptions"
showUploadModal="showUploadModal"
togglePreview="togglePreview"
validation=validation

2
app/assets/javascripts/discourse/templates/composer.hbs
View File

@ -90,6 +90,8 @@
groupsMentioned="groupsMentioned"
importQuote="importQuote"
showOptions="showOptions"
hideOptions="hideOptions"
optionsVisible=optionsVisible
showToolbar=showToolbar
showUploadSelector="showUploadSelector"
afterRefresh="afterRefresh"}}