diff --git a/app/icons/close-circle-outline.svg b/app/icons/close-circle-outline.svg deleted file mode 100644 index dad58cf..0000000 --- a/app/icons/close-circle-outline.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/app/icons/close-circle.svg b/app/icons/close-circle.svg deleted file mode 100644 index 5a37396..0000000 --- a/app/icons/close-circle.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/app/icons/minus-circle-outline.svg b/app/icons/minus-circle-outline.svg deleted file mode 100644 index 889d629..0000000 --- a/app/icons/minus-circle-outline.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/app/icons/minus-circle.svg b/app/icons/minus-circle.svg deleted file mode 100644 index 445910b..0000000 --- a/app/icons/minus-circle.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/app/icons/pause-circle-outline.svg b/app/icons/pause-circle-outline.svg deleted file mode 100644 index f9825b5..0000000 --- a/app/icons/pause-circle-outline.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/app/icons/pause-circle.svg b/app/icons/pause-circle.svg deleted file mode 100644 index 9f33cb7..0000000 --- a/app/icons/pause-circle.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/app/icons/play-circle-outline.svg b/app/icons/play-circle-outline.svg deleted file mode 100644 index 792051f..0000000 --- a/app/icons/play-circle-outline.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/app/icons/play-circle.svg b/app/icons/play-circle.svg deleted file mode 100644 index 9835bb8..0000000 --- a/app/icons/play-circle.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/app/icons/plus-circle-outline.svg b/app/icons/plus-circle-outline.svg deleted file mode 100644 index 3fe6bec..0000000 --- a/app/icons/plus-circle-outline.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/app/icons/plus-circle.svg b/app/icons/plus-circle.svg deleted file mode 100644 index 64b5a32..0000000 --- a/app/icons/plus-circle.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/app/index.html b/app/index.html index 94a2ca1..8e67d55 100644 --- a/app/index.html +++ b/app/index.html @@ -39,14 +39,7 @@
- - - + @@ -104,7 +97,7 @@ - + diff --git a/app/js/lib/icons.js b/app/js/lib/icons.js index a37532e..6f4de58 100644 --- a/app/js/lib/icons.js +++ b/app/js/lib/icons.js @@ -1,98 +1,68 @@ let ICONS={}; -ICONS["playlist-music"] = ` +ICONS["playlist-music"] = ` `; -ICONS["play-circle-outline"] = ` - -`; -ICONS["folder"] = ` +ICONS["folder"] = ` `; -ICONS["shuffle"] = ` +ICONS["shuffle"] = ` `; -ICONS["artist"] = ` +ICONS["artist"] = ` `; -ICONS["download"] = ` +ICONS["download"] = ` `; -ICONS["minus-circle"] = ` - -`; -ICONS["magnify"] = ` +ICONS["magnify"] = ` `; -ICONS["rewind"] = ` +ICONS["rewind"] = ` `; -ICONS["account-multiple"] = ` +ICONS["account-multiple"] = ` `; -ICONS["settings"] = ` +ICONS["settings"] = ` `; -ICONS["pause"] = ` +ICONS["pause"] = ` `; -ICONS["pause-circle"] = ` - -`; -ICONS["close-circle-outline"] = ` - -`; -ICONS["volume-off"] = ` +ICONS["volume-off"] = ` `; -ICONS["close"] = ` +ICONS["close"] = ` `; -ICONS["music"] = ` +ICONS["music"] = ` `; -ICONS["minus"] = ` +ICONS["minus"] = ` `; -ICONS["close-circle"] = ` - -`; -ICONS["repeat"] = ` +ICONS["repeat"] = ` `; -ICONS["play"] = ` +ICONS["play"] = ` `; -ICONS["pause-circle-outline"] = ` - -`; -ICONS["plus"] = ` +ICONS["plus"] = ` `; -ICONS["content-save"] = ` +ICONS["content-save"] = ` `; -ICONS["library-music"] = ` +ICONS["library-music"] = ` `; -ICONS["fast-forward"] = ` +ICONS["fast-forward"] = ` `; -ICONS["minus-circle-outline"] = ` - -`; -ICONS["volume-high"] = ` +ICONS["volume-high"] = ` `; -ICONS["album"] = ` +ICONS["album"] = ` `; -ICONS["plus-circle-outline"] = ` - -`; -ICONS["plus-circle"] = ` - -`; -ICONS["play-circle"] = ` - -`; export default ICONS; diff --git a/app/js/lib/selection.js b/app/js/lib/selection.js index decb8c2..80448da 100644 --- a/app/js/lib/selection.js +++ b/app/js/lib/selection.js @@ -3,7 +3,7 @@ import * as html from "./html.js"; export default class Selection { constructor(component) { this._component = component; - this._items = new Set(); + this._items = []; // FIXME ukladat skutecne HTML? co kdyz nastane refresh? this._node = html.node("cyp-commands", {hidden:true}); const button = this.addCommand(_ => this.clear(), {icon:"close", label:"Clear"}); @@ -11,12 +11,11 @@ export default class Selection { } clear() { - const nodes = Array.from(this._items); - while (nodes.length) { this._remove(nodes.pop()); } + while (this._items.length) { this._remove(this._items[0]); } } toggle(node) { - if (this._items.has(node)) { + if (this._items.includes(node)) { this._remove(node); } else { this._add(node); @@ -31,17 +30,17 @@ export default class Selection { } _add(node) { - const size = this._items.size; - this._items.add(node); + const length = this._items.length; + this._items.push(node); node.classList.add("selected"); - if (size == 0) { this._show(); } + if (length == 0) { this._show(); } } _remove(node) { - this._items.delete(node); + const index = this._items.indexOf(node); + this._items.splice(index, 1); node.classList.remove("selected"); - if (this._items.size == 0) { this._hide(); } - + if (this._items.length == 0) { this._hide(); } } _show() { diff --git a/app/js/queue.js b/app/js/queue.js index 1c7fc77..4615131 100644 --- a/app/js/queue.js +++ b/app/js/queue.js @@ -10,15 +10,24 @@ class Queue extends Component { /* this.querySelector(".clear").addEventListener("click", async _ => { await this._mpd.command("clear"); - this._sync(); - }); - - this.querySelector(".save").addEventListener("click", _ => { - let name = prompt("Save current queue as a playlist?", "name"); - if (name === null) { return; } - this._mpd.command(`save "${this._mpd.escape(name)}"`); + this._sync(); FIXME! }); */ + this.selection.addCommand(_ => { + }, {label:"Select all", icon:"plus"}); + + this.selection.addCommand(async items => { + let name = prompt("Save selected songs as a playlist?", "name"); + if (name === null) { return; } + + name = this._mpd.escape(name); + const commands = items.map(item => { + return `playlistadd "${name}" "${this._mpd.escape(item.data["file"])}"`; + }); + + await this._mpd.command(commands); + // FIXME notify? + }, {label:"Save", icon:"content-save"}); } handleEvent(e) { @@ -81,14 +90,14 @@ class Item extends HasApp { class Song extends Item { constructor(data) { super(); - this._data = data; + this.data = data; this.dataset.songId = data["Id"]; } connectedCallback() { let info = html.node("div", {className:"info"}, "", this); - let lines = formatSongInfo(this._data); + let lines = formatSongInfo(this.data); html.node("h2", {}, lines.shift(), info); lines.length && html.node("div", {}, lines.shift(), info); diff --git a/app/svg2js.sh b/app/svg2js.sh index bd3d9d2..e496c68 100755 --- a/app/svg2js.sh +++ b/app/svg2js.sh @@ -7,7 +7,7 @@ process_svg () { NAME=$1 ID=$(basename $NAME | sed -e 's/.svg//') - DATA=$(cat $NAME | xmlstarlet fo -D -N | xmlstarlet $ARGS $DELETE) + DATA=$(cat $NAME | xmlstarlet fo -D -N | xmlstarlet $ARGS $DELETE | sed -e 's+xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" ++') printf "ICONS[\"$ID\"] = \`$DATA\`;\n" }