Skip to content

Instantly share code, notes, and snippets.

What would you like to do?
<!DOCTYPE html>
<html lang="de">
<meta charset="UTF-8">
<link rel="stylesheet" href="style.css">
<div id="container">
<div id="header">
<div class="spacer"></div>
<div class="header-image">
<img src="img/wusel_infos.png"/>
<div class="header-item" id="header-center">
<h1>Orientierungseinheit Informatik Uni Boon 2020</h1>
<div id="timetable">
<a href="" target="_blank">Zeitplan</a>
<div class="header-image">
<img src="img/wusel_lern.png"/>
<div class="spacer"></div>
<div id="main">
<div id="player"></div>
<iframe src="" id="chat"></iframe>
<p>Video-URL für externe Player: <a id="streamUrl" href="#"></a></p>
<script type="text/javascript" src=""></script>
<script type="text/javascript" src="level-selector.js"></script>
const urlParams = new URLSearchParams(;
const availableMirrors = ['mirror1', 'mirror2'];
let mirror = urlParams.get('mirror');
if (!mirror) {
mirror = availableMirrors[Math.floor(Math.random() * availableMirrors.length)];
const streamUrl = `https://${mirror}.{{ netbase__domain }}/stream1.m3u8`;
const player = new Clappr.Player({
source: streamUrl,
autoPlay: false,
plugins: [LevelSelector],
levelSelectorConfig: {
title: 'Auflösung',
labels: {
1: '{{ stream_label_hd }}',
0: '{{ stream_label_sd }}',
parentId: "#player",
width: "100%",
height: "100%",
mediacontrol: {seekbar: "#2180BC", buttons: "#2180BC"},
hlsjsConfig: {
liveSyncDurationCount: 1,
liveMaxLatencyDurationCount: 5,
startFragPrefetch: true
let streamUrlElement = document.getElementById('streamUrl');
streamUrlElement.textContent = streamUrl;
streamUrlElement.href = streamUrl;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment