From 504a5786d8b3caff1ce91e8121008d65f091bd59 Mon Sep 17 00:00:00 2001 From: Tyler Vigario Date: Mon, 27 Apr 2020 20:18:28 -0700 Subject: [PATCH] Implement play mode as dropdown button --- static/js/custom.js | 38 +++++++++++------------ templates/index.html | 74 +++++++++++++++++++++++--------------------- 2 files changed, 57 insertions(+), 55 deletions(-) diff --git a/static/js/custom.js b/static/js/custom.js index 8c39006..aa016af 100644 --- a/static/js/custom.js +++ b/static/js/custom.js @@ -46,6 +46,13 @@ var last_volume = 0; var playing = false; var playPauseBtn = $("#play-pause-btn"); +var playModeBtns = { + 'one-shot': $('#one-shot-mode-btn'), + random: $('#random-mode-btn'), + repeat: $('#repeat-mode-btn'), + autoplay: $('#autoplay-mode-btn') +}; + function request(_url, _data, refresh = false) { console.log(_data); $.ajax({ @@ -255,27 +262,14 @@ function updateControls(empty, play, mode, volume) { playPauseBtn.find('[data-fa-i2svg]').removeClass('fa-pause').addClass('fa-play'); } } - if (mode === "one-shot") { - $("#oneshot-btn").removeClass("btn-secondary").addClass("btn-primary").prop("disabled", true); - $("#repeat-btn").removeClass("btn-primary").addClass("btn-secondary").prop("disabled", false); - $("#random-btn").removeClass("btn-primary").addClass("btn-secondary").prop("disabled", false); - $("#autoplay-btn").removeClass("btn-primary").addClass("btn-secondary").prop("disabled", false); - } else if (mode === "repeat") { - $("#oneshot-btn").removeClass("btn-primary").addClass("btn-secondary").prop("disabled", false); - $("#repeat-btn").removeClass("btn-secondary").addClass("btn-primary").prop("disabled", true); - $("#random-btn").removeClass("btn-primary").addClass("btn-secondary").prop("disabled", false); - $("#autoplay-btn").removeClass("btn-primary").addClass("btn-secondary").prop("disabled", false); - } else if (mode === "random") { - $("#oneshot-btn").removeClass("btn-primary").addClass("btn-secondary").prop("disabled", false); - $("#repeat-btn").removeClass("btn-primary").addClass("btn-secondary").prop("disabled", false); - $("#random-btn").removeClass("btn-secondary").addClass("btn-primary").prop("disabled", false); // This is a feature. - $("#autoplay-btn").removeClass("btn-primary").addClass("btn-secondary").prop("disabled", false); - } else if (mode === "autoplay") { - $("#oneshot-btn").removeClass("btn-primary").addClass("btn-secondary").prop("disabled", false); - $("#repeat-btn").removeClass("btn-primary").addClass("btn-secondary").prop("disabled", false); - $("#random-btn").removeClass("btn-primary").addClass("btn-secondary").prop("disabled", false); - $("#autoplay-btn").removeClass("btn-secondary").addClass("btn-primary").prop("disabled", true); + + let otherModes = Object.assign({}, playModeBtns); + delete otherModes[mode]; + for (_mode in otherModes) { + otherModes[_mode].removeClass('active'); } + playModeBtns[mode].addClass('active'); + if (volume != last_volume) { last_volume = volume; if (volume > 1) { @@ -321,6 +315,10 @@ function togglePlayPause() { } } +function changePlayMode(mode) { + request('post', {action: mode}); +} + // Check the version of playlist to see if update is needed. setInterval(checkForPlaylistUpdate, 3000); diff --git a/templates/index.html b/templates/index.html index d1e39b2..6ee3a03 100644 --- a/templates/index.html +++ b/templates/index.html @@ -6,17 +6,17 @@ botamusique web interface - + - - + +