play/pause fixes

This commit is contained in:
ThaUnknown 2020-08-24 20:56:19 +02:00
parent 9ab0e9302e
commit 6dc7f1124f
2 changed files with 33 additions and 24 deletions

View file

@ -91,24 +91,26 @@
<video id="video" src="" type="video/mp4" class="w-full">
</video>
<div class="player d-none flex-column justify-content-between w-full h-full">
<div class="stats d-flex justify-content-center">
<div class="d-flex">
<span class="material-icons">
people
</span>
<span class="ts" id="peers">-</span>
</div>
<div class="d-flex">
<span class="material-icons">
arrow_downward
</span>
<span class="ts" id="down">-</span>
</div>
<div class="d-flex">
<span class="material-icons">
arrow_upward
</span>
<span class="ts" id="up">-</span>
<div class="h-full" id="ptoggle">
<div class="stats d-flex justify-content-center">
<div class="d-flex">
<span class="material-icons">
people
</span>
<span class="ts" id="peers">-</span>
</div>
<div class="d-flex">
<span class="material-icons">
arrow_downward
</span>
<span class="ts" id="down">-</span>
</div>
<div class="d-flex">
<span class="material-icons">
arrow_upward
</span>
<span class="ts" id="up">-</span>
</div>
</div>
</div>
<div class="controls d-flex">

View file

@ -7,7 +7,8 @@ const controls = document.getElementsByClassName('ctrl'),
progress = document.querySelector('#prog'),
peers = document.querySelector('#peers'),
downSpeed = document.querySelector('#down'),
upSpeed = document.querySelector('#up')
upSpeed = document.querySelector('#up'),
playPause = document.querySelector('#ptoggle')
volume.addEventListener("input", function () {
updatevolume()
@ -16,7 +17,7 @@ progress.addEventListener("input", setprogress);
video.addEventListener("playing", playcheck);
video.addEventListener("canplay", updateDisplay);
video.addEventListener("loadedmetadata", setduration);
video.addEventListener("click", bpp);
playPause.addEventListener("click", bpp);
immerse();
for (let i = 0; i < controls.length; i++) {
@ -98,12 +99,18 @@ function playcheck() {
}
//play/pause button
const btnpp = document.querySelector('#bpp')
async function playVideo() {
try {
await video.play();
btnpp.innerHTML = "pause";
} catch(err) {
btnpp.innerHTML = "play_arrow";
}
}
function bpp() {
let btnpp = document.querySelector('#bpp')
if (video.paused) {
btnpp.innerHTML = "pause";
video.play();
playVideo();
} else {
btnpp.innerHTML = "play_arrow";
video.pause();