diff options
author | toasted-nutbread <toasted-nutbread@users.noreply.github.com> | 2021-01-23 21:07:45 -0500 |
---|---|---|
committer | GitHub <noreply@github.com> | 2021-01-23 21:07:45 -0500 |
commit | 9fbdb9757b22c2bb9afe5061137bfe4b3b755e91 (patch) | |
tree | b7d3e9111b621ca2bf81f0c8023a433b64e9f055 /ext/mixed/js | |
parent | 85c039850c45246e367e194232e5ace8771f14e7 (diff) |
Update popup menu structure (#1301)
* Wrap menu items in popup-menu-body
* Use bodyNode instead of node
* Update selector
* Update _setPosition to not use items
Diffstat (limited to 'ext/mixed/js')
-rw-r--r-- | ext/mixed/js/popup-menu.js | 20 |
1 files changed, 12 insertions, 8 deletions
diff --git a/ext/mixed/js/popup-menu.js b/ext/mixed/js/popup-menu.js index 2e3f395d..124c1984 100644 --- a/ext/mixed/js/popup-menu.js +++ b/ext/mixed/js/popup-menu.js @@ -21,6 +21,7 @@ class PopupMenu extends EventDispatcher { this._sourceElement = sourceElement; this._containerNode = containerNode; this._node = containerNode.querySelector('.popup-menu'); + this._bodyNode = containerNode.querySelector('.popup-menu-body'); this._isClosed = false; this._eventListeners = new EventListenerCollection(); } @@ -37,13 +38,17 @@ class PopupMenu extends EventDispatcher { return this._node; } + get bodyNode() { + return this._bodyNode; + } + get isClosed() { return this._isClosed; } prepare() { - const items = this._node.querySelectorAll('.popup-menu-item'); - this._setPosition(items); + const items = this._bodyNode.querySelectorAll('.popup-menu-item'); + this._setPosition(); this._containerNode.focus(); this._eventListeners.addEventListener(window, 'resize', this._onWindowResize.bind(this), false); @@ -84,7 +89,7 @@ class PopupMenu extends EventDispatcher { this._close(null, 'resize', true); } - _setPosition(items) { + _setPosition() { // Get flags let horizontal = 1; let vertical = 1; @@ -138,11 +143,10 @@ class PopupMenu extends EventDispatcher { const menuRect = menu.getBoundingClientRect(); let top = menuRect.top; let bottom = menuRect.bottom; - if (verticalCover === 1 && items.length > 0) { - const rect1 = items[0].getBoundingClientRect(); - const rect2 = items[items.length - 1].getBoundingClientRect(); - top = rect1.top; - bottom = rect2.bottom; + if (verticalCover === 1) { + const bodyRect = this._bodyNode.getBoundingClientRect(); + top = bodyRect.top; + bottom = bodyRect.bottom; } let x = ( |