Popup menu updates (#942)

* Expose isClosed property

* Add popupMenu to detail

* Return true if closed, false otherwise

* Add closed event to PopupMenu
This commit is contained in:
toasted-nutbread 2020-10-18 19:48:44 -04:00 committed by GitHub
parent 9fa2ebddc8
commit 69e5ea6138
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -15,8 +15,9 @@
* along with this program. If not, see <https://www.gnu.org/licenses/>. * along with this program. If not, see <https://www.gnu.org/licenses/>.
*/ */
class PopupMenu { class PopupMenu extends EventDispatcher {
constructor(sourceElement, container) { constructor(sourceElement, container) {
super();
this._sourceElement = sourceElement; this._sourceElement = sourceElement;
this._container = container; this._container = container;
this._menu = container.querySelector('.popup-menu'); this._menu = container.querySelector('.popup-menu');
@ -24,6 +25,10 @@ class PopupMenu {
this._eventListeners = new EventListenerCollection(); this._eventListeners = new EventListenerCollection();
} }
get isClosed() {
return this._isClosed;
}
prepare() { prepare() {
const items = this._menu.querySelectorAll('.popup-menu-item'); const items = this._menu.querySelectorAll('.popup-menu-item');
this._setPosition(items); this._setPosition(items);
@ -41,6 +46,7 @@ class PopupMenu {
bubbles: false, bubbles: false,
cancelable: false, cancelable: false,
detail: { detail: {
popupMenu: this,
container: this._container, container: this._container,
menu: this._menu menu: this._menu
} }
@ -48,7 +54,7 @@ class PopupMenu {
} }
close() { close() {
this._close(null, 'close'); return this._close(null, 'close');
} }
// Private // Private
@ -149,13 +155,14 @@ class PopupMenu {
} }
_close(item, cause) { _close(item, cause) {
if (this._isClosed) { return; } if (this._isClosed) { return true; }
const action = (item !== null ? item.dataset.menuAction : null); const action = (item !== null ? item.dataset.menuAction : null);
const result = this._sourceElement.dispatchEvent(new CustomEvent('menuClosed', { const result = this._sourceElement.dispatchEvent(new CustomEvent('menuClosed', {
bubbles: false, bubbles: false,
cancelable: true, cancelable: true,
detail: { detail: {
popupMenu: this,
container: this._container, container: this._container,
menu: this._menu, menu: this._menu,
item, item,
@ -163,11 +170,21 @@ class PopupMenu {
cause cause
} }
})); }));
if (!result) { return; } if (!result) { return false; }
this._eventListeners.removeAllEventListeners(); this._eventListeners.removeAllEventListeners();
if (this._container.parentNode !== null) { if (this._container.parentNode !== null) {
this._container.parentNode.removeChild(this._container); this._container.parentNode.removeChild(this._container);
} }
this.trigger('closed', {
popupMenu: this,
container: this._container,
menu: this._menu,
item,
action,
cause
});
return true;
} }
} }