Implement play/pause as one button
This commit is contained in:
parent
8c6b5e8f63
commit
7766b15ea1
@ -43,6 +43,9 @@ var playlist_range_to = 0;
|
||||
|
||||
var last_volume = 0;
|
||||
|
||||
var playing = false;
|
||||
var playPauseBtn = $("#play-pause-btn");
|
||||
|
||||
function request(_url, _data, refresh = false) {
|
||||
console.log(_data);
|
||||
$.ajax({
|
||||
@ -56,7 +59,7 @@ function request(_url, _data, refresh = false) {
|
||||
}
|
||||
updateControls(data.empty, data.play, data.mode, data.volume);
|
||||
}
|
||||
}
|
||||
},
|
||||
});
|
||||
if (refresh) {
|
||||
location.reload()
|
||||
@ -241,18 +244,15 @@ function bindPlaylistEvent() {
|
||||
|
||||
function updateControls(empty, play, mode, volume) {
|
||||
if (empty) {
|
||||
$("#play-btn").prop("disabled", true);
|
||||
$("#pause-btn").prop("disabled", true);
|
||||
$("#stop-btn").prop("disabled", true);
|
||||
playPauseBtn.prop("disabled", true);
|
||||
} else {
|
||||
playPauseBtn.prop("disabled", false);
|
||||
if (play) {
|
||||
$("#play-btn").prop("disabled", true);
|
||||
$("#pause-btn").prop("disabled", false);
|
||||
$("#stop-btn").prop("disabled", false);
|
||||
playing = true;
|
||||
playPauseBtn.find('[data-fa-i2svg]').removeClass('fa-play').addClass('fa-pause');
|
||||
} else {
|
||||
$("#play-btn").prop("disabled", false);
|
||||
$("#pause-btn").prop("disabled", true);
|
||||
$("#stop-btn").prop("disabled", true);
|
||||
playing = false;
|
||||
playPauseBtn.find('[data-fa-i2svg]').removeClass('fa-pause').addClass('fa-play');
|
||||
}
|
||||
}
|
||||
if (mode === "one-shot") {
|
||||
@ -313,6 +313,14 @@ function setPageTheme(theme) {
|
||||
document.getElementById("pagestyle").setAttribute("href", "../static/css/bootstrap.darkly.min.css");
|
||||
}
|
||||
|
||||
function togglePlayPause() {
|
||||
if (playing) {
|
||||
request('post', {action: 'pause'});
|
||||
} else {
|
||||
request('post', {action: 'resume'});
|
||||
}
|
||||
}
|
||||
|
||||
// Check the version of playlist to see if update is needed.
|
||||
setInterval(checkForPlaylistUpdate, 3000);
|
||||
|
||||
|
@ -28,22 +28,9 @@
|
||||
<div id="playlist">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="btn-group mb-2">
|
||||
<button type="button" id="play-btn" class="btn btn-info btn-space"
|
||||
onclick="request('post', {action : 'resume'})" disabled>
|
||||
<i class="fas fa-play" aria-hidden="true"></i>
|
||||
</button>
|
||||
|
||||
<button type="button" id="pause-btn" class="btn btn-warning btn-space"
|
||||
onclick="request('post', {action : 'pause'})" disabled>
|
||||
<i class="fas fa-pause" aria-hidden="true"></i>
|
||||
</button>
|
||||
|
||||
<button type="button" id="stop-btn" class="btn btn-danger btn-space"
|
||||
onclick="request('post', {action : 'stop'})" disabled>
|
||||
<i class="fas fa-stop" aria-hidden="true"></i>
|
||||
</button>
|
||||
</div>
|
||||
<button type="button" id="play-pause-btn" class="btn btn-info mb-2" onclick="togglePlayPause()">
|
||||
<i class="fas fa-play"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div class="col text-right">
|
||||
<div class="btn-group mb-2">
|
||||
|
Loading…
x
Reference in New Issue
Block a user