46 lines
1.2 KiB
JavaScript
46 lines
1.2 KiB
JavaScript
import { on } from 'ember-addons/ember-computed-decorators';
|
|
|
|
export default Ember.Component.extend({
|
|
classNameBindings: ["visible::hidden", ":popup-menu", "extraClasses"],
|
|
|
|
@on('didInsertElement')
|
|
_setup() {
|
|
this.appEvents.on("popup-menu:open", this, "_changeLocation");
|
|
|
|
$('html').on(`mouseup.popup-menu-${this.get('elementId')}`, (e) => {
|
|
const $target = $(e.target);
|
|
if ($target.is("button") || this.$().has($target).length === 0) {
|
|
this.sendAction('hide');
|
|
}
|
|
});
|
|
},
|
|
|
|
@on('willDestroyElement')
|
|
_cleanup() {
|
|
$('html').off(`mouseup.popup-menu-${this.get('elementId')}`);
|
|
this.appEvents.off("popup-menu:open", this, "_changeLocation");
|
|
},
|
|
|
|
_changeLocation(location) {
|
|
const $this = this.$();
|
|
switch (location.position) {
|
|
case "absolute": {
|
|
$this.css({
|
|
position: "absolute",
|
|
top: location.top - $this.innerHeight() + 5,
|
|
left: location.left,
|
|
});
|
|
break;
|
|
}
|
|
case "fixed": {
|
|
$this.css({
|
|
position: "fixed",
|
|
top: location.top,
|
|
left: location.left - $this.innerWidth(),
|
|
});
|
|
break;
|
|
}
|
|
}
|
|
}
|
|
});
|