play/pause works
This commit is contained in:
parent
83297238c2
commit
671bcd300f
8
NOTES.md
8
NOTES.md
|
@ -7,13 +7,13 @@
|
|||
- [ ] Display config dialog (is this even needed?)
|
||||
- [x] `Update DB` button
|
||||
- [x] Disable if running update is detected
|
||||
- [ ] `Previous Track` button
|
||||
- [ ] `Next Track` button
|
||||
- [x] `Previous Track` button
|
||||
- [x] `Next Track` button
|
||||
- [x] `Stop` button
|
||||
- [x] `Play` button
|
||||
- [ ] `Pause` button
|
||||
- [x] `Pause` button
|
||||
- [x] Track seeker
|
||||
- [ ] `Repeat` toggle
|
||||
- [x] `Repeat` toggle
|
||||
- [ ] `Shuffle` toggle
|
||||
- [ ] xfade
|
||||
- [ ] decrease
|
||||
|
|
|
@ -124,7 +124,7 @@ func wsServe(c echo.Context) error {
|
|||
c.Logger().Error(err)
|
||||
break
|
||||
} else {
|
||||
log.Println(msg)
|
||||
// log.Print(msg)
|
||||
if strings.ToLower(msg) == "#status" {
|
||||
status, err := mpdConn.Status()
|
||||
if err != nil {
|
||||
|
|
30
static/controls.js
vendored
30
static/controls.js
vendored
|
@ -1,3 +1,5 @@
|
|||
// Configuration
|
||||
|
||||
const API_URL = `${document.location.protocol}//${document.location.host}/api`;
|
||||
const VOLUME_STEP = 5;
|
||||
|
||||
|
@ -130,21 +132,21 @@ control_update_db.addEventListener("click", e => {
|
|||
});
|
||||
control_previous.addEventListener("click", e => {
|
||||
fetch(`${API_URL}/previous_track`).then(async r => {
|
||||
if (200 >= r.status < 300) {
|
||||
if (r.status >= 400) {
|
||||
console.error(`API returned ${r.status}: ${r.statusText}`);
|
||||
}
|
||||
});
|
||||
});
|
||||
control_play_pause.addEventListener("click", e => {
|
||||
if (e.target.innerHTML === "⏵︎") { // TODO: check is never true
|
||||
if (e.target.innerHTML === "⏸︎") { // pause // TODO: check is never true
|
||||
fetch(`${API_URL}/pause`).then(async r => {
|
||||
if (200 >= r.status < 300) {
|
||||
if (r.status >= 400) {
|
||||
console.error(`API returned ${r.status}: ${r.statusText}`);
|
||||
}
|
||||
});
|
||||
} else { // Pause
|
||||
fetch(`${API_URL}/play`).then(async r => {
|
||||
if (200 >= r.status < 300) {
|
||||
if (r.status >= 400) {
|
||||
console.error(`API returned ${r.status}: ${r.statusText}`);
|
||||
}
|
||||
});
|
||||
|
@ -152,21 +154,21 @@ control_play_pause.addEventListener("click", e => {
|
|||
});
|
||||
control_stop.addEventListener("click", e => {
|
||||
fetch(`${API_URL}/stop`).then(async r => {
|
||||
if (200 >= r.status < 300) {
|
||||
if (r.status >= 400) {
|
||||
console.error(`API returned ${r.status}: ${r.statusText}`);
|
||||
}
|
||||
});
|
||||
});
|
||||
control_next.addEventListener("click", e => {
|
||||
fetch(`${API_URL}/next_track`).then(async r => {
|
||||
if (200 >= r.status < 300) {
|
||||
if (r.status >= 400) {
|
||||
console.error(`API returned ${r.status}: ${r.statusText}`);
|
||||
}
|
||||
});
|
||||
});
|
||||
control_progress.addEventListener("change", e => {
|
||||
fetch(`${API_URL}/seek/${e.target.value}`).then(async r => {
|
||||
if (200 >= r.status < 300) {
|
||||
if (r.status >= 400) {
|
||||
console.error(`API returned ${r.status}: ${r.statusText}`);
|
||||
}
|
||||
});
|
||||
|
@ -180,7 +182,7 @@ control_repeat.addEventListener("click", e => {
|
|||
e.target.dataset.state = "on";
|
||||
}
|
||||
fetch(`${API_URL}/repeat`).then(async r => {
|
||||
if (200 >= r.status < 300) {
|
||||
if (r.status >= 400) {
|
||||
console.error(`API returned ${r.status}: ${r.statusText}`);
|
||||
}
|
||||
});
|
||||
|
@ -194,7 +196,7 @@ control_shuffle.addEventListener("click", e => {
|
|||
e.target.dataset.state = "on";
|
||||
}
|
||||
fetch(`${API_URL}/random`).then(async r => {
|
||||
if (200 >= r.status < 300) {
|
||||
if (r.status >= 400) {
|
||||
console.error(`API returned ${r.status}: ${r.statusText}`);
|
||||
}
|
||||
});
|
||||
|
@ -202,7 +204,7 @@ control_shuffle.addEventListener("click", e => {
|
|||
control_xfade_minus.addEventListener("click", e => {
|
||||
// TODO: not yet implemented
|
||||
fetch(`${API_URL}/xfade`).then(async r => {
|
||||
if (200 >= r.status < 300) {
|
||||
if (r.status >= 400) {
|
||||
console.error(`API returned ${r.status}: ${r.statusText}`);
|
||||
}
|
||||
});
|
||||
|
@ -210,7 +212,7 @@ control_xfade_minus.addEventListener("click", e => {
|
|||
control_xfade_plus.addEventListener("click", e => {
|
||||
// TODO: not yet implemented
|
||||
fetch(`${API_URL}/xfade`).then(async r => {
|
||||
if (200 >= r.status < 300) {
|
||||
if (r.status >= 400) {
|
||||
console.error(`API returned ${r.status}: ${r.statusText}`);
|
||||
}
|
||||
});
|
||||
|
@ -218,7 +220,7 @@ control_xfade_plus.addEventListener("click", e => {
|
|||
control_volume_up.addEventListener("click", e => {
|
||||
const v = Math.min(parseInt(control_volume.value) + VOLUME_STEP, 100);
|
||||
fetch(`${API_URL}/volume/${v}`).then(async r => {
|
||||
if (200 >= r.status < 300) {
|
||||
if (r.status >= 400) {
|
||||
console.error(`API returned ${r.status}: ${r.statusText}`);
|
||||
}
|
||||
});
|
||||
|
@ -228,7 +230,7 @@ control_volume_up.addEventListener("click", e => {
|
|||
control_volume_down.addEventListener("click", e => {
|
||||
const v = Math.max(parseInt(control_volume.value) - VOLUME_STEP, 0);
|
||||
fetch(`${API_URL}/volume/${v}`).then(async r => {
|
||||
if (200 >= r.status < 300) {
|
||||
if (r.status >= 400) {
|
||||
console.error(`API returned ${r.status}: ${r.statusText}`);
|
||||
}
|
||||
});
|
||||
|
@ -236,7 +238,7 @@ control_volume_down.addEventListener("click", e => {
|
|||
});
|
||||
control_volume.addEventListener("change", e => {
|
||||
fetch(`${API_URL}/volume/${e.target.value}`).then(async r => {
|
||||
if (200 >= r.status < 300) {
|
||||
if (r.status >= 400) {
|
||||
console.error(`API returned ${r.status}: ${r.statusText}`);
|
||||
}
|
||||
});
|
||||
|
|
|
@ -13,21 +13,21 @@ function addSongToQueue(song) {
|
|||
length.innerText = song.length;
|
||||
const actions = document.createElement("td");
|
||||
actions.classList.add("actions");
|
||||
// TODO: maybe use a instead of button?
|
||||
// TODO: maybe use `a` instead of `button`?
|
||||
const moveUp = document.createElement("button");
|
||||
moveUp.classList.add("borderless");
|
||||
moveUp.innerHTML = "🔺"; // 🔺 Red Triangle Pointed Down
|
||||
moveUp.addEventListener("click", event => {
|
||||
console.log(`DEBUG: move song ${song.id} up`);
|
||||
});
|
||||
// TODO: maybe use a instead of button?
|
||||
// TODO: maybe use `a` instead of `button`?
|
||||
const moveDown = document.createElement("button");
|
||||
moveDown.classList.add("borderless");
|
||||
moveDown.innerHTML = "$#x1F53B;"; // 🔻 Red Triangle Pointed Up
|
||||
moveDown.addEventListener("click", event => {
|
||||
console.log(`DEBUG: move song ${song.id} down`);
|
||||
});
|
||||
// TODO: maybe use a instead of button?
|
||||
// TODO: maybe use `a` instead of `button`?
|
||||
const remove = document.createElement("button");
|
||||
remove.classList.add("borderless");
|
||||
remove.innerHTML = "$#x274C;"; // ❌ Cross mark; 🗑️ Wastebasket
|
||||
|
|
Loading…
Reference in a new issue