playlist commands

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); }
 	}

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 => {

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;

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();

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]"))