mirror of
https://github.com/torappinfo/uweb.git
synced 2024-08-14 23:54:59 +00:00
45 lines
1.4 KiB
HTML
45 lines
1.4 KiB
HTML
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/plyr/dist/plyr.css"/>
|
|
<video id="player" playsinline controls>
|
|
<source id="src" />
|
|
</video>
|
|
<script src="https://cdn.jsdelivr.net/npm/plyr"></script>
|
|
<script src="https://cdn.jsdelivr.net/hls.js/latest/hls.js"></script>
|
|
<script>
|
|
const source = location.search.substring(3);//?u=
|
|
{
|
|
let d = document;
|
|
let e = d.getElementById("src");
|
|
e.src = source;
|
|
}
|
|
const video = document.querySelector("video");
|
|
const defaultOptions = {};
|
|
if (Hls.isSupported()) {
|
|
const hls = new Hls();
|
|
hls.loadSource(source);
|
|
hls.on(Hls.Events.MANIFEST_PARSED, function (event, data) {
|
|
const availableQualities = hls.levels.map((l) => l.height);
|
|
defaultOptions.quality = {
|
|
default: availableQualities[0],
|
|
options: availableQualities,
|
|
forced: true,
|
|
onChange: (e) => updateQuality(e),
|
|
}
|
|
|
|
// Initialize new Plyr player with quality options
|
|
const player = new Plyr(video, defaultOptions);
|
|
});
|
|
hls.attachMedia(video);
|
|
window.hls = hls;
|
|
} else {
|
|
const player = new Plyr(video, defaultOptions);
|
|
}
|
|
|
|
function updateQuality(newQuality) {
|
|
window.hls.levels.forEach((level, levelIndex) => {
|
|
if (level.height === newQuality) {
|
|
console.log("Found quality match with " + newQuality);
|
|
window.hls.currentLevel = levelIndex;
|
|
}
|
|
});
|
|
}
|
|
</script>
|