diff --git a/app/js/component.js b/app/js/component.js index 02b0fbe..69f1870 100644 --- a/app/js/component.js +++ b/app/js/component.js @@ -13,7 +13,7 @@ export class Item extends HasApp { } export default class Component extends HasApp { - constructor(options) { + constructor(options = {}) { super(); if (options.selection) { this.selection = new Selection(this, options.selection); } } diff --git a/app/js/elements/menu.js b/app/js/elements/menu.js index 3dc55f9..22e8768 100644 --- a/app/js/elements/menu.js +++ b/app/js/elements/menu.js @@ -2,7 +2,7 @@ import Component from "../component.js"; class Menu extends Component { constructor() { - super({selection:null}); + super(); this._tabs = Array.from(this.querySelectorAll("[data-for]")); this._tabs.forEach(tab => { diff --git a/app/js/elements/player.js b/app/js/elements/player.js index dcb56be..f0a3fe2 100644 --- a/app/js/elements/player.js +++ b/app/js/elements/player.js @@ -8,7 +8,7 @@ const DELAY = 1000; class Player extends Component { constructor() { - super({selection:null}); + super(); this._current = {}; this._toggledVolume = 0; this._idleTimeout = null; diff --git a/app/js/elements/playlists.js b/app/js/elements/playlists.js index b8ceb0b..8369084 100644 --- a/app/js/elements/playlists.js +++ b/app/js/elements/playlists.js @@ -9,18 +9,6 @@ class Playlists extends Component { this._initCommands(); } - handleEvent(e) { - switch (e.type) { - case "playlists-change": - this._sync(); - break; - } - } - - _onAppLoad() { - this._app.addEventListener("playlists-change", this); - } - _onComponentChange(c, isThis) { this.hidden = !isThis; if (isThis) { this._sync(); } @@ -41,13 +29,27 @@ class Playlists extends Component { _initCommands() { const sel = this.selection; - sel.addCommand(async items => { + sel.addCommand(async item => { + const name = item.name; + const commands = ["clear", `load "${this._mpd.escape(name)}"`, "play"]; + await this._mpd.command(commands); + this.selection.clear(); + this._app.dispatchEvent(new CustomEvent("queue-change")); // fixme notification? }, {label:"Play", icon:"play"}); - sel.addCommand(async items => { + sel.addCommand(async item => { + const name = item.name; + await this._mpd.command(`load "${this._mpd.escape(name)}"`); + this.selection.clear(); + this._app.dispatchEvent(new CustomEvent("queue-change")); // fixme notification? }, {label:"Enqueue", icon:"plus"}); - sel.addCommand(async items => { + sel.addCommand(async item => { + const name = item.name; + if (!confirm(`Really delete playlist '${name}'?`)) { return; } + + await this._mpd.command(`rm "${this._mpd.escape(name)}"`); + this._sync(); }, {label:"Delete", icon:"delete"}); sel.addCommandCancel(); diff --git a/app/js/elements/settings.js b/app/js/elements/settings.js index 65f9791..79d533d 100644 --- a/app/js/elements/settings.js +++ b/app/js/elements/settings.js @@ -12,7 +12,7 @@ function saveToStorage(key, value) { class Settings extends Component { constructor() { - super({selection:null}); + super(); this._inputs = { theme: this.querySelector("[name=theme]"), color: Array.from(this.querySelectorAll("[name=color]"))