diff options
| author | Mark Powers <mark@marks.kitchen> | 2022-09-24 22:19:44 -0500 |
|---|---|---|
| committer | Mark Powers <mark@marks.kitchen> | 2022-09-24 22:19:44 -0500 |
| commit | e882d551d58cb873d11f0774a79b48b4490ecbce (patch) | |
| tree | ee334966b828f746bc98279eaea9a1dfa55bdb5c | |
| parent | 09a0be0bd5d119c177ee18b692e84fb4ba49a129 (diff) | |
Add volume slider
| -rw-r--r-- | index.js | 44 | ||||
| -rw-r--r-- | main.js | 6 |
2 files changed, 40 insertions, 10 deletions
@@ -61,18 +61,30 @@ function enqueue(id){ .then(data => console.log(`Added ${id} to queue`)); } -function playlist(){ - return fetch(`${config.baseURL}/playlist`, { +function set_volume(value){ + fetch(`${config.baseURL}/post`, { + "credentials": "include", + "headers": headers(), + "body": `action=volume_set_value&new_volume=${value}`, + "method": "POST", + }) +} + +async function playlist(){ + let info_res = await fetch(`${config.baseURL}/post`, { + "credentials": "include", + "headers": headers(), + "method": "POST", + }) + let info_json = await info_res.json() + let playlist_res = await fetch(`${config.baseURL}/playlist`, { "credentials": "include", "headers": headers(), "method": "GET", - }).then(response => { - try { - return response.json() - } catch (error) { - return {} - } }) + let playlist_json = await playlist_res.json() + info_json.items = playlist_json.items + return info_json } async function get_all_sounds(){ @@ -193,6 +205,7 @@ server.get('/', async (req, res) => { <ol id="playlist"><ol> </div> <button onclick="random()">random</button> + <input type="range" min="0" max="100" class="slider" id="volume"> <body> ` try { @@ -239,8 +252,14 @@ server.get('/random', async (req, res, next) => { }) server.get('/playlist', async (req, res, next) => { - let playlist_items = await playlist() - res.send(playlist_items) + try { + let playlist_items = await playlist() + res.send(playlist_items) + } catch (error) { + console.error("problem getting current status") + console.error(error) + res.send({items: [], }) + } }) server.get('/main.js', async (req, res, next) => { @@ -257,6 +276,11 @@ server.get('/delete/:id', async (req, res, next) => { res.send("ok") }) +server.get('/volume/:val', async (req, res, next) => { + set_volume(req.params.val) + res.send("ok") +}) + server.get('/:id', async (req, res, next) => { enqueue(req.params.id) res.send("ok") @@ -10,6 +10,7 @@ function random(){ fetch("/random") } function playlist(){ + let volume_slider = document.getElementById("volume") function f(){ fetch("/playlist").then(res => res.json()).then(res => { let el = document.getElementById("playlist") @@ -24,9 +25,14 @@ function playlist(){ li.innerHTML = my_html el.appendChild(li) }) + volume_slider.value = res.volume * 100 }) } var intervalId = setInterval(f, 5000); f() + + volume_slider.onchange = function() { + fetch(`/volume/${volume_slider.value/100}`) + } } window.addEventListener('load', event => playlist()); |