From 4c9edfcbcbf5d161f288dd508f87a3551faa5979 Mon Sep 17 00:00:00 2001 From: Florrie Date: Sun, 26 Apr 2020 22:53:54 -0300 Subject: further hackery to make the multi menu more useful --- ui.js | 68 ++++++++++++++++++++++++++++++++++++++++++++----------------------- 1 file changed, 45 insertions(+), 23 deletions(-) diff --git a/ui.js b/ui.js index de01ace..43fd2b3 100644 --- a/ui.js +++ b/ui.js @@ -361,14 +361,16 @@ class AppElement extends FocusElement { {text: 'Multi', menuFn: () => { const { queuePlayers } = this.backend return [ - {label: `(Multi-players - ${queuePlayers.length})`}, + {key: 'heading', label: `(Multi-players - ${queuePlayers.length})`}, {divider: true}, ...queuePlayers.map((queuePlayer, index) => { const PIE = new PlaybackInfoElement(queuePlayer, this) PIE.displayMode = 'collapsed' PIE.updateTrack() - return {element: PIE} - }) + return {key: 'qp' + index, element: PIE} + }), + {divider: true}, + {key: 'add-new-player', label: `Add new player`, action: () => this.addQueuePlayer().then(() => 'reload')} ] }} ]) @@ -505,6 +507,9 @@ class AppElement extends FocusElement { handleRemovedQueuePlayer(queuePlayer) { this.removeQueuePlayerListenersAndUI(queuePlayer) + if (this.menubar.contextMenu) { + setTimeout(() => this.menubar.contextMenu.reload(), 0) + } } async handlePlaying(track, oldTrack, queuePlayer) { @@ -3227,15 +3232,6 @@ class PlaybackInfoElement extends FocusElement { action: () => { const { parent } = this this.app.removeQueuePlayer(this.queuePlayer) - if (parent) { - parent.removeInput(this) - parent.fixLayout() - // uhhh for some reason this selects the app instead of the form - // for all the PIEs? not sure why but it probably has to do with - // context menu shenanigans. it's currently 29:50 and i am really - // definitely not going to try to figure that out right now! - parent.root.select(parent) - } } } ] @@ -3695,7 +3691,16 @@ class ContextMenu extends FocusElement { this.submenu = null } - show({x = 0, y = 0, items}) { + show({x = 0, y = 0, items: itemsArg, focusKey = null}) { + this.reload = () => { + const els = [this.root.selectedElement, ...this.root.selectedElement.directAncestors] + const focusKey = Object.keys(keyElementMap).find(key => els.includes(keyElementMap[key])) + this.close(false) + this.show({x, y, items: itemsArg, focusKey}) + } + + let items = (typeof itemsArg === 'function') ? itemsArg() : itemsArg + items = items.filter(Boolean) if (!items.length) { return @@ -3722,9 +3727,13 @@ class ContextMenu extends FocusElement { } } + const keyElementMap = {} + for (const item of items.filter(Boolean)) { + let focusEl if (item.element) { addDividerIfWanted() + focusEl = item.element this.form.addInput(item.element) item.element.showContextMenu = this.showSubmenu if (item.isDefault) { @@ -3737,21 +3746,30 @@ class ContextMenu extends FocusElement { const button = new Button(item.label) button.keyboardIdentifier = item.keyboardIdentifier || item.label if (item.action) { - button.on('pressed', () => { - this.close() - item.action() + button.on('pressed', async () => { + if (await item.action() === 'reload') { + this.reload() + } else { + this.close() + } }) } + focusEl = button this.form.addInput(button) if (item.isDefault) { this.root.select(button) } } + if (item.key) { + keyElementMap[item.key] = focusEl + } } this.fixLayout() - if (!items.some(item => item.isDefault)) { + if (focusKey && keyElementMap[focusKey]) { + this.root.select(keyElementMap[focusKey]) + } else if (!items.some(item => item.isDefault)) { this.form.firstInput() } @@ -3799,16 +3817,20 @@ class ContextMenu extends FocusElement { if (this.visible) { const newlySelected = this.root.selectedElement this.close() - this.selectedBefore.root.select(newlySelected) + newlySelected.root.select(newlySelected) } } - close() { + close(remove = true) { this.clearItems() this.visible = false - this.selectedBefore.root.select(this.selectedBefore) - this.parent.removeChild(this) - this.emit('closed') + if (this.selectedBefore.root.select) { + this.selectedBefore.root.select(this.selectedBefore) + } + if (remove && this.parent) { + this.parent.removeChild(this) + this.emit('closed') + } } clearItems() { @@ -4039,7 +4061,7 @@ class Menubar extends ListScrollForm { button.on('pressed', () => { this.contextMenu = this.showContextMenu({ x: container.absLeft, y: container.absY + 1, - items: menuFn ? menuFn() : menuItems + items: menuFn }) this.contextMenu.on('closed', () => { this.contextMenu = null -- cgit 1.3.0-6-gf8a5