359 lines
23 KiB
JavaScript
359 lines
23 KiB
JavaScript
(()=>{var x='<?xml version="1.0" encoding="UTF-8"?><svg width="24px" height="24px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" color="#ffffff" stroke-width="1.5"><path d="M6.90588 4.53682C6.50592 4.2998 6 4.58808 6 5.05299V18.947C6 19.4119 6.50592 19.7002 6.90588 19.4632L18.629 12.5162C19.0211 12.2838 19.0211 11.7162 18.629 11.4838L6.90588 4.53682Z" fill="#ffffff" stroke="#ffffff" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg>';var b='<?xml version="1.0" encoding="UTF-8"?><svg width="24px" height="24px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" color="#ffffff" stroke-width="1.5" data-darkreader-inline-color="" style="--darkreader-inline-color: #e8e6e3;"><path d="M6 18.4V5.6C6 5.26863 6.26863 5 6.6 5H9.4C9.73137 5 10 5.26863 10 5.6V18.4C10 18.7314 9.73137 19 9.4 19H6.6C6.26863 19 6 18.7314 6 18.4Z" fill="#ffffff" stroke="#ffffff" stroke-width="1.5" data-darkreader-inline-fill="" data-darkreader-inline-stroke="" style="--darkreader-inline-fill: #ffffff; --darkreader-inline-stroke: #ffffff;"></path><path d="M14 18.4V5.6C14 5.26863 14.2686 5 14.6 5H17.4C17.7314 5 18 5.26863 18 5.6V18.4C18 18.7314 17.7314 19 17.4 19H14.6C14.2686 19 14 18.7314 14 18.4Z" fill="#ffffff" stroke="#ffffff" stroke-width="1.5" data-darkreader-inline-fill="" data-darkreader-inline-stroke="" style="--darkreader-inline-fill: #ffffff; --darkreader-inline-stroke: #ffffff;"></path></svg>';var y='<?xml version="1.0" encoding="UTF-8"?><svg width="24px" height="24px" stroke-width="1.5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" color="#ffffff"><path d="M7 4H4V7" stroke="#ffffff" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M17 4H20V7" stroke="#ffffff" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M7 20H4V17" stroke="#ffffff" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M17 20H20V17" stroke="#ffffff" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg>';var w='<?xml version="1.0" encoding="UTF-8"?><svg width="24px" height="24px" viewBox="0 0 24 24" stroke-width="1.5" fill="none" xmlns="http://www.w3.org/2000/svg" color="#ffffff" data-darkreader-inline-color="" style="--darkreader-inline-color: #e8e6e3;"><path d="M1 15V9C1 5.68629 3.68629 3 7 3H17C20.3137 3 23 5.68629 23 9V15C23 18.3137 20.3137 21 17 21H7C3.68629 21 1 18.3137 1 15Z" stroke="#ffffff" stroke-width="1.5" data-darkreader-inline-stroke="" style="--darkreader-inline-stroke: #ffffff;"></path><path d="M10.5 10L10.3284 9.82843C9.79799 9.29799 9.07857 9 8.32843 9V9C6.76633 9 5.5 10.2663 5.5 11.8284V12.1716C5.5 13.7337 6.76633 15 8.32843 15V15C9.07857 15 9.79799 14.702 10.3284 14.1716L10.5 14" stroke="#ffffff" stroke-width="1.5" stroke-linecap="round" data-darkreader-inline-stroke="" style="--darkreader-inline-stroke: #ffffff;"></path><path d="M18.5 10L18.3284 9.82843C17.798 9.29799 17.0786 9 16.3284 9V9C14.7663 9 13.5 10.2663 13.5 11.8284V12.1716C13.5 13.7337 14.7663 15 16.3284 15V15C17.0786 15 17.798 14.702 18.3284 14.1716L18.5 14" stroke="#ffffff" stroke-width="1.5" stroke-linecap="round" data-darkreader-inline-stroke="" style="--darkreader-inline-stroke: #ffffff;"></path></svg>';var C='<?xml version="1.0" encoding="UTF-8"?><svg width="24px" stroke-width="1.5" height="24px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" color="#ffffff"><path d="M3 13C3 17.9706 7.02944 22 12 22C16.9706 22 21 17.9706 21 13C21 8.02944 16.9706 4 12 4" stroke="#ffffff" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M9 9L9 16" stroke="#ffffff" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M15 9L13 9C12.4477 9 12 9.44772 12 10L12 11.5C12 12.0523 12.4477 12.5 13 12.5L14 12.5C14.5523 12.5 15 12.9477 15 13.5L15 15C15 15.5523 14.5523 16 14 16L12 16" stroke="#ffffff" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M12 4L4.5 4M4.5 4L6.5 2M4.5 4L6.5 6" stroke="#ffffff" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg>';var z='<?xml version="1.0" encoding="UTF-8"?><svg width="24px" stroke-width="1.5" height="24px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" color="#ffffff"><path d="M21 13C21 17.9706 16.9706 22 12 22C7.02944 22 3 17.9706 3 13C3 8.02944 7.02944 4 12 4" stroke="#ffffff" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M12 4H19.5M19.5 4L17.5 2M19.5 4L17.5 6" stroke="#ffffff" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M9 9L9 16" stroke="#ffffff" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M15 9L13 9C12.4477 9 12 9.44772 12 10L12 11.5C12 12.0523 12.4477 12.5 13 12.5L14 12.5C14.5523 12.5 15 12.9477 15 13.5L15 15C15 15.5523 14.5523 16 14 16L12 16" stroke="#ffffff" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg>';var M='<?xml version="1.0" encoding="UTF-8"?><svg width="24px" height="24px" viewBox="0 0 24 24" stroke-width="1.5" fill="none" xmlns="http://www.w3.org/2000/svg" color="#ffffff" data-darkreader-inline-color="" style="--darkreader-inline-color: #e8e6e3;"><path d="M1 13.8571V10.1429C1 9.03829 1.89543 8.14286 3 8.14286H5.9C6.09569 8.14286 6.28708 8.08544 6.45046 7.97772L12.4495 4.02228C13.1144 3.5839 14 4.06075 14 4.85714V19.1429C14 19.9392 13.1144 20.4161 12.4495 19.9777L6.45046 16.0223C6.28708 15.9146 6.09569 15.8571 5.9 15.8571H3C1.89543 15.8571 1 14.9617 1 13.8571Z" stroke="#ffffff" stroke-width="1.5" data-darkreader-inline-stroke="" style="--darkreader-inline-stroke: #ffffff;"></path><path d="M17.5 7.5C17.5 7.5 19 9 19 11.5C19 14 17.5 15.5 17.5 15.5" stroke="#ffffff" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-darkreader-inline-stroke="" style="--darkreader-inline-stroke: #ffffff;"></path><path d="M20.5 4.5C20.5 4.5 23 7 23 11.5C23 16 20.5 18.5 20.5 18.5" stroke="#ffffff" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-darkreader-inline-stroke="" style="--darkreader-inline-stroke: #ffffff;"></path></svg>';var V='<?xml version="1.0" encoding="UTF-8"?><svg width="24px" height="24px" viewBox="0 0 24 24" stroke-width="1.5" fill="none" xmlns="http://www.w3.org/2000/svg" color="#ffffff" data-darkreader-inline-color="" style="--darkreader-inline-color: #e8e6e3;"><path d="M3.5 13.8571V10.1429C3.5 9.03829 4.39543 8.14286 5.5 8.14286H8.4C8.59569 8.14286 8.78708 8.08544 8.95046 7.97772L14.9495 4.02228C15.6144 3.5839 16.5 4.06075 16.5 4.85714V19.1429C16.5 19.9392 15.6144 20.4161 14.9495 19.9777L8.95046 16.0223C8.78708 15.9146 8.59569 15.8571 8.4 15.8571H5.5C4.39543 15.8571 3.5 14.9617 3.5 13.8571Z" stroke="#ffffff" stroke-width="1.5" data-darkreader-inline-stroke="" style="--darkreader-inline-stroke: #ffffff;"></path><path d="M20.5 15L20.5 9" stroke="#ffffff" stroke-width="1.5" stroke-linecap="round" data-darkreader-inline-stroke="" style="--darkreader-inline-stroke: #ffffff;"></path></svg>';var L='<?xml version="1.0" encoding="UTF-8"?><svg width="24px" height="24px" viewBox="0 0 24 24" stroke-width="1.5" fill="none" xmlns="http://www.w3.org/2000/svg" color="#ffffff" data-darkreader-inline-color="" style="--darkreader-inline-color: #e8e6e3;"><path d="M18 14L20.0005 12M22 10L20.0005 12M20.0005 12L18 10M20.0005 12L22 14" stroke="#ffffff" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-darkreader-inline-stroke="" style="--darkreader-inline-stroke: #ffffff;"></path><path d="M2 13.8571V10.1429C2 9.03829 2.89543 8.14286 4 8.14286H6.9C7.09569 8.14286 7.28708 8.08544 7.45046 7.97772L13.4495 4.02228C14.1144 3.5839 15 4.06075 15 4.85714V19.1429C15 19.9392 14.1144 20.4161 13.4495 19.9777L7.45046 16.0223C7.28708 15.9146 7.09569 15.8571 6.9 15.8571H4C2.89543 15.8571 2 14.9617 2 13.8571Z" stroke="#ffffff" stroke-width="1.5" data-darkreader-inline-stroke="" style="--darkreader-inline-stroke: #ffffff;"></path></svg>';var T='<?xml version="1.0" encoding="UTF-8"?><svg width="24px" height="24px" stroke-width="1.5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" color="#ffffff" data-darkreader-inline-color="" style="--darkreader-inline-color: #e8e6e3;"><path d="M21.1679 8C19.6247 4.46819 16.1006 2 11.9999 2C6.81459 2 2.55104 5.94668 2.04932 11" stroke="#ffffff" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-darkreader-inline-stroke="" style="--darkreader-inline-stroke: #ffffff;"></path><path d="M17 8H21.4C21.7314 8 22 7.73137 22 7.4V3" stroke="#ffffff" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-darkreader-inline-stroke="" style="--darkreader-inline-stroke: #ffffff;"></path><path d="M2.88146 16C4.42458 19.5318 7.94874 22 12.0494 22C17.2347 22 21.4983 18.0533 22 13" stroke="#ffffff" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-darkreader-inline-stroke="" style="--darkreader-inline-stroke: #ffffff;"></path><path d="M7.04932 16H2.64932C2.31795 16 2.04932 16.2686 2.04932 16.6V21" stroke="#ffffff" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-darkreader-inline-stroke="" style="--darkreader-inline-stroke: #ffffff;"></path></svg>';var e=document.querySelector(".zorn-player"),p=document.querySelector(".video-container"),g=x,E=b,B=y,I=w,S=C,H=z,h=M,F=V,P=L,$=T;var j=`
|
|
<h2 class="zorn-title hide"></h2>
|
|
<div oncontextmenu="return false" class="zorn-player-controls">
|
|
<div class="row-2">
|
|
<div class="video-progress">
|
|
<progress id="progress-bar" value="0" min="0"></progress>
|
|
<input class="seek" id="seek" value="0" min="0" type="range" step="1">
|
|
<div class="seek-tooltip" id="seek-tooltip">00:00</div>
|
|
</div>
|
|
</div>
|
|
<div class="row-1">
|
|
<div class="row-1-start">
|
|
<div class="volume-controls">
|
|
<button data-title="Mute (m)" class="volume-button" id="volume-button">${h}</button>
|
|
<input class="volume" id="volume" value="1" type="range" max="1" min="0" step="0.01"/>
|
|
</div>
|
|
<div class="time">
|
|
<time id="time-elapsed">00:00</time>
|
|
<span> / </span>
|
|
<time id="duration">00:00</time>
|
|
</div>
|
|
</div>
|
|
<div class="row-1-center">
|
|
<button id="skip-back">${S}</button>
|
|
<button id="play-pause">${g}</button>
|
|
<button id="skip-forth">${H}</button>
|
|
</div>
|
|
<div class="row-1-end">
|
|
<button id="subtitles">${I}</button>
|
|
<button id="fullscreen">${B}</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<style>
|
|
:root {
|
|
--zorn-progress-bar-bg: rgba(100, 100, 100, 0.5);
|
|
--zorn-progress-bar: rgba(255, 0, 0, 0.5);
|
|
--zorn-thumb: red;
|
|
--zorn-rounded-corners: 4px;
|
|
}
|
|
.zorn-context-menu {
|
|
background: linear-gradient(45deg, #0a141c 0%, rgba(10, 20, 28, 1) 100%);
|
|
border-radius: 6px;
|
|
border: 1px rgba(255, 255, 255, 0.08) solid;
|
|
}
|
|
.zorn-context-menu ul {
|
|
list-style: none;
|
|
margin: 0px;
|
|
padding: 0px;
|
|
}
|
|
.zorn-context-menu ul li {
|
|
padding: 8px 32px 8px 16px;
|
|
margin: 4px;
|
|
border-radius: 4px;
|
|
font-family: arial;
|
|
}
|
|
.zorn-context-menu ul li:hover {
|
|
background: rgba(255, 255, 255, 0.1);
|
|
cursor: pointer;
|
|
}
|
|
.zorn-context-menu ul li i {
|
|
font-size: 14px;
|
|
margin-right: 12px;
|
|
width: 12px;
|
|
}
|
|
.video-container {
|
|
position: relative;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
font-family: Arial, Helvetica, sans-serif;
|
|
color: white;
|
|
}
|
|
.video-container .zorn-player-dialogs #buffering {
|
|
display: none;
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
transform: translate(-50%, -50%);
|
|
padding: 0px 24px;
|
|
border-radius: 6px;
|
|
}
|
|
.video-container .zorn-player-dialogs #buffering h2 {
|
|
font-size: 52px;
|
|
}
|
|
.video-container .zorn-player-dialogs #invalid-src {
|
|
display: none;
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 24px;
|
|
transform: translate(0px, -50%);
|
|
padding: 0px 24px;
|
|
border-radius: 6px;
|
|
}
|
|
.video-container .zorn-player-dialogs #invalid-src h2 {
|
|
font-size: 52px;
|
|
}
|
|
.video-container .zorn-player {
|
|
display: inline-flex;
|
|
}
|
|
.video-container .zorn-title {
|
|
display: none;
|
|
position: absolute;
|
|
top: 0px;
|
|
background: #000;
|
|
width: auto;
|
|
margin: 12px;
|
|
padding: 12px 24px;
|
|
border-radius: 10px;
|
|
font-size: 18px;
|
|
}
|
|
.video-container .hide {
|
|
opacity: 0;
|
|
pointer-events: none;
|
|
}
|
|
.video-container .zorn-player-title {
|
|
position: absolute;
|
|
top: 0px;
|
|
width: 100%;
|
|
background-image: linear-gradient(to top, rgba(12, 12, 12, 0), rgba(12, 12, 12, 0.75));
|
|
padding: 12px 24px;
|
|
font-size: 18px;
|
|
font-weight: bold;
|
|
}
|
|
.video-container .subtitles-menu {
|
|
display: none;
|
|
position: absolute;
|
|
right: 60px;
|
|
bottom: 50px;
|
|
background: #000 9;
|
|
list-style: none;
|
|
padding: 6px;
|
|
border-radius: 6px;
|
|
}
|
|
.video-container .subtitles-menu button {
|
|
background-color: transparent;
|
|
color: white;
|
|
border: none;
|
|
border-radius: 4px;
|
|
width: 100%;
|
|
text-align: left;
|
|
padding: 6px 12px;
|
|
cursor: pointer;
|
|
}
|
|
.video-container .subtitles-menu button:hover {
|
|
background: #fff 29;
|
|
}
|
|
.video-container .subtitles-menu .hide {
|
|
opacity: 0;
|
|
pointer-events: none;
|
|
}
|
|
.video-container .zorn-player-controls {
|
|
display: inline-flex;
|
|
right: 0;
|
|
left: 0;
|
|
padding: 10px;
|
|
position: absolute;
|
|
bottom: -1px;
|
|
transition: all 0.2s ease;
|
|
background-image: linear-gradient(to bottom, rgba(12, 12, 12, 0), rgba(12, 12, 12, 0.75));
|
|
flex-direction: inherit;
|
|
}
|
|
.video-container .zorn-player-controls .row-1 {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
width: 100%;
|
|
}
|
|
.video-container .zorn-player-controls .row-1-start {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
.video-container .zorn-player-controls .row-1-center {
|
|
display: flex;
|
|
justify-content: center;
|
|
}
|
|
.video-container .zorn-player-controls .row-1-end {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
.video-container .zorn-player-controls button {
|
|
aspect-ratio: 1;
|
|
height: 32px;
|
|
width: 32px;
|
|
color: white;
|
|
background-color: transparent;
|
|
border: none;
|
|
margin: 0px 6px;
|
|
}
|
|
.video-container .zorn-player-controls button:hover {
|
|
background: rgba(44, 44, 44, 0.6);
|
|
border-radius: 6px;
|
|
}
|
|
.video-container .zorn-player-controls .volume-controls:hover > #volume {
|
|
opacity: 1;
|
|
transition: 0.3s opacity, 0.3s width;
|
|
margin: 0px;
|
|
width: 72px;
|
|
}
|
|
.video-container .zorn-player-controls #volume {
|
|
opacity: 0;
|
|
transition: 0.3s opacity, 0.3s width;
|
|
margin: 0px -6px;
|
|
width: 0px;
|
|
}
|
|
.video-container .zorn-player-controls #volume-button svg {
|
|
aspect-ratio: 1;
|
|
height: 16px;
|
|
width: 16px;
|
|
fill: white;
|
|
padding: 3px 0px 0px 0px;
|
|
}
|
|
.video-container .zorn-player-controls .video-progress {
|
|
position: relative;
|
|
height: 6.4px;
|
|
margin: 24px 0px;
|
|
width: 100%;
|
|
}
|
|
.video-container .zorn-player-controls progress {
|
|
border-radius: 1rem;
|
|
width: 100%;
|
|
height: 8.4px;
|
|
position: absolute;
|
|
top: 0;
|
|
}
|
|
.video-container .zorn-player-controls progress::-webkit-progress-bar {
|
|
border-radius: 1rem;
|
|
background: var(--zorn-progress-bar-bg);
|
|
}
|
|
.video-container .zorn-player-controls progress::-webkit-progress-value {
|
|
background: var(--zorn-progress-bar);
|
|
border-radius: 1rem;
|
|
}
|
|
.video-container .zorn-player-controls progress::-moz-progress-bar {
|
|
border-radius: 1rem;
|
|
background: var(--zorn-progress-bar-bg);
|
|
}
|
|
.video-container .zorn-player-controls .seek {
|
|
position: absolute;
|
|
top: 0;
|
|
width: 100%;
|
|
cursor: pointer;
|
|
margin: 0;
|
|
}
|
|
.video-container .zorn-player-controls .seek:hover + .seek-tooltip {
|
|
display: block;
|
|
}
|
|
.video-container .zorn-player-controls .seek-tooltip {
|
|
display: none;
|
|
position: relative;
|
|
top: -32px;
|
|
margin-left: -30px;
|
|
font-size: 12px;
|
|
content: attr(data-title);
|
|
font-weight: bold;
|
|
color: #fff;
|
|
background-color: rgba(0, 0, 0, .5);
|
|
border-radius: 4px;
|
|
padding: 6px;
|
|
width: fit-content;
|
|
}
|
|
.video-container .zorn-player-controls input[type=range] {
|
|
height: 8.4px;
|
|
background: transparent;
|
|
cursor: pointer;
|
|
opacity: 0;
|
|
}
|
|
.video-container .zorn-player-controls input[type=range]:focus {
|
|
outline: none;
|
|
}
|
|
.video-container .zorn-player-controls input[type=range]:focus::-webkit-slider-runnable-track {
|
|
background: transparent;
|
|
}
|
|
.video-container .zorn-player-controls input[type=range]:focus::-moz-range-track {
|
|
outline: none;
|
|
}
|
|
.video-container .zorn-player-controls input[type=range]::-webkit-slider-runnable-track {
|
|
width: 100%;
|
|
cursor: pointer;
|
|
border-radius: 1.3px;
|
|
-webkit-appearance: none;
|
|
transition: all 0.4s ease;
|
|
}
|
|
.video-container .zorn-player-controls input[type=range]::-webkit-slider-thumb {
|
|
height: 12px;
|
|
width: 12px;
|
|
border-radius: 10px;
|
|
background: var(--zorn-thumb);
|
|
cursor: pointer;
|
|
-webkit-appearance: none;
|
|
margin-left: -1px;
|
|
}
|
|
.video-container .zorn-player-controls input[type=range]::-moz-range-track {
|
|
width: 100%;
|
|
height: 8.4px;
|
|
cursor: pointer;
|
|
border: 1px solid transparent;
|
|
background: transparent;
|
|
border-radius: 0;
|
|
}
|
|
.video-container .zorn-player-controls input[type=range].volume {
|
|
height: 5px;
|
|
background-color: #fff;
|
|
}
|
|
.video-container .zorn-player-controls input[type=range].volume::-webkit-slider-runnable-track {
|
|
background-color: transparent;
|
|
}
|
|
.video-container .zorn-player-controls input[type=range].volume::-webkit-slider-thumb {
|
|
margin-left: 0;
|
|
height: 14px;
|
|
width: 14px;
|
|
background: #fff;
|
|
}
|
|
.video-container .zorn-player-controls input[type=range].volume::-moz-range-thumb {
|
|
border: 1px solid #fff;
|
|
background: #fff;
|
|
}
|
|
.video-container .zorn-player-controls input[type="range"]::-moz-range-thumb {
|
|
height: 12px;
|
|
width: 12px;
|
|
border-radius: 10px;
|
|
border: none;
|
|
background: var(--zorn-thumb);
|
|
cursor: pointer;
|
|
}
|
|
.video-container .zorn-player-controls .hide {
|
|
opacity: 0;
|
|
pointer-events: none;
|
|
}
|
|
.video-container .zorn-player-controls #progress-bar {
|
|
background: var(--zorn-progress-bar-bg);
|
|
border: none;
|
|
border-radius: 10px;
|
|
}
|
|
div#buffering {
|
|
position: absolute;
|
|
top: 0px;
|
|
left: 0px;
|
|
width: 100%;
|
|
height: 90%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
animation: 1s spin linear infinite;
|
|
}
|
|
|
|
@keyframes spin {
|
|
from {
|
|
transform: rotate(0deg)
|
|
}
|
|
to {
|
|
transform: rotate(360deg)
|
|
}
|
|
}
|
|
</style>
|
|
`;function A(){e.addEventListener("error",function(t){document.querySelector("#invalid-src").style.display="inherit",document.querySelector(".zorn-player-controls").style.display="none",videoContainer.style.backgroundColor="#101010",setTimeout(()=>{e.style.opacity="0.10",document.querySelector("#buffering").style.display="none"},168)},!0),e.onwaiting=t=>{document.querySelector("#buffering").style.display="inherit",e.style.transition="5s opacity",e.style.opacity="0.25"},e.oncanplaythrough=t=>{document.querySelector("#buffering").style.display="none",e.style.transition="0.3s opacity",e.style.opacity="1"}}function U(){let t=document.querySelector(".zorn-player-controls #play-pause");t.addEventListener("click",r),e.addEventListener("click",r),e.addEventListener("play",i),e.addEventListener("pause",i);function r(){e.paused||e.ended?e.play():e.pause()}function i(){e.paused?(t.setAttribute("data-title","Play (K)"),t.innerHTML=`${g}`):(t.setAttribute("data-title","Pause (K)"),t.innerHTML=`${E}`)}}function Z(){let t=document.querySelector(".zorn-player-controls #skip-back"),r=document.querySelector(".zorn-player-controls #skip-forth");t.addEventListener("click",i),r.addEventListener("click",a);function i(){d(-10)}function a(){d(10)}function d(s){e.currentTime+=s}}function _(){let t=document.getElementById("fullscreen");function r(){document.fullscreenElement?document.exitFullscreen():document.webkitFullscreenElement?document.webkitExitFullscreen():p.webkitRequestFullscreen?p.webkitRequestFullscreen():p.requestFullscreen()}t.onclick=r;function i(){document.fullscreenElement?(t.setAttribute("data-title","Exit full screen (f)"),t.innerHTML='<i class="fa-solid fa-compress"></i>'):(t.setAttribute("data-title","Full screen (f)"),t.innerHTML='<i class="fa-solid fa-expand"></i>')}p.addEventListener("fullscreenchange",i)}function q(){var t=document.querySelector(".zorn-player-controls #subtitles"),r=[],i=function(c,k,u){var m=document.createElement("li"),l=m.appendChild(document.createElement("button"));return l.setAttribute("id",c),l.className="subtitles-button",k.length>0&&l.setAttribute("lang",k),l.value=u,l.setAttribute("data-state","inactive"),l.appendChild(document.createTextNode(u)),l.addEventListener("click",function(o){r.map(function(v,O,oe){r[O].setAttribute("data-state","inactive")});for(var n=this.getAttribute("lang"),f=0;f<e.textTracks.length;f++)e.textTracks[f].language==n?(e.textTracks[f].mode="showing",this.setAttribute("data-state","active")):e.textTracks[f].mode="hidden";a.style.display="none"}),r.push(l),m},a;if(e.textTracks){var d=document.createDocumentFragment(),a=d.appendChild(document.createElement("ul"));a.className="subtitles-menu",a.appendChild(i("subtitles-off","","Off"));for(var s=0;s<e.textTracks.length;s++)a.appendChild(i("subtitles-"+e.textTracks[s].language,e.textTracks[s].language,e.textTracks[s].label));p.appendChild(a)}t.addEventListener("click",function(c){a&&(a.style.display=a.style.display=="block"?"none":"block")})}function G(){let t=document.getElementById("volume-button"),r=document.getElementById("volume");function i(){e.muted&&(e.muted=!1),e.volume=r.value}r.addEventListener("input",i);function a(){t.setAttribute("data-title","Mute (M)"),e.muted||e.volume===0?(t.innerHTML=`${P}`,t.setAttribute("data-title","Unmute (M)")):e.volume>0&&e.volume<=.5?t.innerHTML=`${F}`:t.innerHTML=`${h}`}e.addEventListener("volumechange",a);function d(){e.muted=!e.muted,e.muted?(r.setAttribute("data-volume",r.value),r.value=0):r.value=r.dataset.volume}t.addEventListener("click",d)}function D(){let t=document.getElementById("time-elapsed"),r=document.getElementById("duration");function i(o){let n=new Date(o*1e3).toISOString().substr(11,8);return{minutes:n.substr(3,2),seconds:n.substr(6,2)}}e.addEventListener("loadedmetadata",c);function a(){let o=i(Math.round(e.currentTime));t.innerText=`${o.minutes}:${o.seconds}`,t.setAttribute("datetime",`${o.minutes}m ${o.seconds}s`)}e.addEventListener("timeupdate",a);let d=document.getElementById("progress-bar"),s=document.getElementById("seek");function c(){let o=Math.round(e.duration);s.setAttribute("max",o),d.setAttribute("max",o);let n=i(o);r.innerText=`${n.minutes}:${n.seconds}`,r.setAttribute("datetime",`${n.minutes}m ${n.seconds}s`)}function k(){s.value=Math.floor(e.currentTime),d.value=Math.floor(e.currentTime)}e.addEventListener("timeupdate",k);let u=document.getElementById("seek-tooltip");function m(o){let n=Math.round(o.offsetX/o.target.clientWidth*parseInt(o.target.getAttribute("max"),10));s.setAttribute("data-seek",n);let f=i(n);u.textContent=`${f.minutes}:${f.seconds}`;let v=e.getBoundingClientRect();u.style.left=`${o.pageX-v.left}px`}s.addEventListener("mousemove",m);function l(o){let n=o.target.dataset.seek?o.target.dataset.seek:o.target.value;e.currentTime=n,d.value=n,s.value=n}s.addEventListener("input",l),c()}var R=`
|
|
<div id="buffering" class="zorn-dialog">
|
|
${$}
|
|
</div>
|
|
`;e.insertAdjacentHTML("afterend",j);e.insertAdjacentHTML("afterend",R);A();U();Z();_();q();G();D();Buffering();})();
|