storm/bragi
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: web interface: mode icon instead of 'Mode'

Browse Source
This commit is contained in:
Terry Geng 2020-04-29 10:24:57 +08:00
parent 5617268270
commit 984309409a
2 changed files with 15 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
static/js/custom.js
View File

@ -52,6 +52,12 @@ var playModeBtns = {
repeat: $('#repeat-mode-btn'), repeat: $('#repeat-mode-btn'),
autoplay: $('#autoplay-mode-btn') autoplay: $('#autoplay-mode-btn')
}; };
var playModeIcon = {
'one-shot': 'fa-tasks',
random: 'fa-random',
repeat: 'fa-redo',
autoplay: 'fa-robot'
};
function request(_url, _data, refresh = false) { function request(_url, _data, refresh = false) {
console.log(_data); console.log(_data);
@ -263,13 +269,17 @@ function updateControls(empty, play, mode, volume) {
} }
} }
let otherModes = Object.assign({}, playModeBtns); for (const otherModes of Object.values(playModeBtns)) {
delete otherModes[mode]; otherModes.removeClass('active');
for (_mode in otherModes) {
otherModes[_mode].removeClass('active');
} }
playModeBtns[mode].addClass('active'); playModeBtns[mode].addClass('active');
let playModeIndicator = $('#modeIndicator');
for (const icon_class of Object.values(playModeIcon)) {
playModeIndicator.removeClass(icon_class);
}
playModeIndicator.addClass(playModeIcon[mode]);
if (volume != last_volume) { if (volume != last_volume) {
last_volume = volume; last_volume = volume;
if (volume > 1) { if (volume > 1) {

2
templates/index.html
View File

@ -36,7 +36,7 @@
<div class="dropdown mb-2 btn-space" style="margin-left: auto;"> <div class="dropdown mb-2 btn-space" style="margin-left: auto;">
<button class="btn btn-secondary dropdown-toggle" type="button" id="play-mode" <button class="btn btn-secondary dropdown-toggle" type="button" id="play-mode"
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Mode <i class="fas fa-tasks mr-2" aria-hidden="true" id="modeIndicator"></i>
</button> </button>
<div class="dropdown-menu" aria-labelledby="play-mode"> <div class="dropdown-menu" aria-labelledby="play-mode">
<a class="dropdown-item" href="#" id="one-shot-mode-btn" <a class="dropdown-item" href="#" id="one-shot-mode-btn"