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