Compare commits

...

2 commits

4 changed files with 25 additions and 26 deletions

View file

@ -1,11 +1,12 @@
---
const {
PlayerName,
BigPlayButton
BigPlayButton,
ShowBackAndForward
} = Astro.props
---
<script define:vars={{PlayerName, BigPlayButton}}>
<script define:vars={{PlayerName, BigPlayButton, ShowBackAndForward}}>
/**
* @licstart The following is the entire license notice for the
* JavaScript code in this page.
@ -228,35 +229,31 @@ function Gestures() {
// Hide Controls
function AutoToggleControls() {
function Hide_Controls2() {
if (Player.paused) {
return;
} else {
document.querySelector("#zorn-player-" + PlayerName + " .video-controls").classList.add("hide");
function Hide_Controls() {
if (Player.paused) {return}
else {VideoControls.classList.add("zorn-controls-hide")}
}
}
function Show_Controls2() {
document.querySelector("#zorn-player-" + PlayerName + " .video-controls").classList.remove("hide");
}
VideoControls.addEventListener("mouseenter", Show_Controls2);
VideoControls.addEventListener("mouseleave", Hide_Controls2);
function Show_Controls() {VideoControls.classList.remove("zorn-controls-hide")}
VideoControls.addEventListener("mouseenter", Show_Controls);
VideoControls.addEventListener("mouseleave", Hide_Controls);
var mouseTimer = null, cursorVisible = true;
function Hide_Cursor() {
mouseTimer = null;
VideoContainer.style.cursor = "none";
VideoControls.style.cursor = "none";
cursorVisible = false;
Hide_Controls2();
Hide_Controls();
}
document.onmousemove = function () {
VideoControls.onmousemove = function () {
if (mouseTimer) {
window.clearTimeout(mouseTimer);
Show_Controls2();
Show_Controls();
}
if (!cursorVisible) {
VideoContainer.style.cursor = "default";
VideoControls.style.cursor = "default";
cursorVisible = true;
}
mouseTimer = window.setTimeout(Hide_Cursor, 3200);
mouseTimer = window.setTimeout(Hide_Cursor, 2400);
};
}
@ -360,6 +357,6 @@ Fullscreen()
Gestures()
KeyboardShortcuts()
PlayPause()
SkipAround()
if (ShowBackAndForward === true) {SkipAround()} else {null}
PlayAgain()
</script>

View file

@ -110,5 +110,5 @@ function Seek() {
initializeVideo()
}
Seek()
setTimeout(() => {Seek()}, 1000) // Prevent invalid date error
</script>

View file

@ -92,7 +92,7 @@ import './Styles/Iconoir.css'
:
<Controls Subtitles={Subtitles} ShowBackAndForward={ShowBackAndForward} PlayerName={PlayerName} Live={Live}/>
}
<Controller PlayerName={PlayerName} BigPlayButton={BigPlayButton}/>
<Controller PlayerName={PlayerName} BigPlayButton={BigPlayButton} ShowBackAndForward={ShowBackAndForward}/>
<Seek PlayerName={PlayerName}/>
</div>

View file

@ -227,9 +227,9 @@
}
}
.video-controls.hide {
opacity: 0;
transition: 0.3s opacity;
.zorn-controls-hide {
opacity: 0 !important;
transition: 0.3s opacity !important;
}
.big-present-button {
@ -241,7 +241,9 @@
color: white;
border: none;
border-radius: 6rem;
background: rgba(0, 0, 0, 0.32);
background: transparent;
backdrop-filter: blur(6px) contrast(0.9) brightness(0.5);
-webkit-backdrop-filter: blur(6px) contrast(0.9) brightness(0.5);
display: flex;
align-items: center;
justify-content: center;