You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
119 lines
9.9 KiB
119 lines
9.9 KiB
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>HarambeeTV</title>
|
|
<link href="data:image/vnd.microsoft.icon;base64,AAABAAIAEBAAAAAAIABoBAAAJgAAACAgAAAAACAAqBAAAI4EAAAoAAAAEAAAACAAAAABACAAAAAAAEAEAAAAAAAAAAAAAAAAAAAAAAAA////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8BKYT2MSqD9mX///8BKYT1iymE9eUqhPZf////Af///wH///8B////Af///wH///8B////Af///wH///8BK4L1EyqE9vkqhPb/KoP2UyqE9qcqhPaRKoT2yyiH9wkpg/WPJIbzBf///wH///8B////Af///wH///8BKoT1bSuF9UcqhPb9KoT2qyqE9dcphPaFKoT20yqE9X8phPZpKYT2tymE9pH///8B////Af///wH///8BKYT3CSqE9ukpg/bPKYT2wSqE9qkqhPaVKYT2iSqE9v8qhPZZKoT1zSqD9YEqhPWdKYT1P////wH///8BigBkK3cVeQVaQq9LKYP2OSmE9y8tf/FbK4P1Gy2A8V0qg/VfKYT2QymE9UErg/c3KYT0MyqE9kf///8B////AYwAZYOLAGY/jABlR4wAZYuLAGaNjABmj4wAZZmLAGaLiwBmoYwAZn+MAGaLjABmqYwAZn96F4BRiwBmS40AZkWLAGaLjABldX4ReXtkNJ9rYzihO2E5ozUsg/gJLn3vFTN56iNuJ5FJfhJ5QyqD9Tcpg/UhKoP2m////wGOAGMFjABlQ05TwKF4GYF7KoT2wymD9qEqg/atKoT28yqD9mMqhPa3KoP18T1r2kMqhPbrKoT1XSiF9h3///8B////AYkAYgdmMZuLQGbV2S597ncqhPaTKYT2tSmE9vEqg/ZXKYT2xyqE9d8qhPZhKoT2ySqE9pP///8B////Af///wH///8B////ASmE9pcqhPajKoT2xSmE9sUqg/WfKYP1hyqE9t0qhPWvKoT1dSqE9msqg/al////Af///wH///8B////Af///wErgP8DKoP2lyqE9u8phPVrKYP2tSqD9sUqhPaXKoP13yqD9oH///8B////Af///wH///8B////Af///wH///8B////Af///wEinv8DIojuBSqE9rUpg/XLK4P1GymD9pcpg/Yt////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////AQAA//8AAP//AAD//wAA//8AAP//AAD//wAA//8AAP//AAD//wAA//8AAP//AAD//wAA//8AAP//AAD//wAA//8oAAAAIAAAAEAAAAABACAAAAAAAIAQAAAAAAAAAAAAAAAAAAAAAAAA////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8BK4D/Df///wH///8B////ARyO/wkqhPbZKoT18SmE9ssqhfdj////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8BKYT3HyqE9qUqhPb7K4T2j////wH///8BK4P1TyqE9v8qhPb5KoX24yqE9vkriPcf////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////AS6A8xcqhfblKoT2/yqE9v8qhPb/KoT3W////wErhfdbKoT2/yqF9uUqgvY3KoT2+yqE95n///8B////ASmE9WsngPUb////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8BK4T2NyqE9v8qhPb/KoT2/yqE9v8qhPbnK4D/DSuD90MqhPb/KoT2/y2G+SkrhPebKoT2+yiH9yH///8BKoT22yqE9t0khvMV////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8BKYP1SySS/wcrhvY7KoT2/yqE9v8rhPfxKoT2syqE9v8qhPWBLIP4IyqE9v8qhPb/K4T2cyiC9TMqhPb/KoT3mf///wEqhPbBKoT27yqF9skcjv8J////Af///wH///8B////Af///wH///8B////Af///wH///8B////ASuF9WcqhPb/K4X2zTCA7xEqhPb3KoT2/yuE9vcth/ARKoT25yqE9vMkhvMVKoT23SqE9v8rhPbZ////ASuF9s0qhPb1KIbyEymE95sqhfaTKoT31SqE9Z////8B////Af///wH///8B////Af///wH///8B////Af///wH///8BKoT27yqE9v8qhPb/KYP2byqE9q0qhPb/KoT2/yyD+SkrhPZtKoT2/yqF938pg/aJKoT2/yqE9v8pg/hFK4P1ZSqE9v8rhPZzLIP2UyqE9bsrhfVnKoT2/yuF9Ef///8B////Af///wH///8B////Af///wH///8B////ASmE9x8qhPb/K4T3tSqE9ucqhPbnKYT3XSqE9v8qhPb/KoX3fySS/wcrhPblKoX25SiG9jkqhPb/KoT2/yqF9q8ui/8LKoT27SqE9dUkgP8PKoT25ySG8xUrhPb9KYT2s////wH///8B////Af///wH///8B////Af///wH///8BAKr/AyuD9nEohvgnLIP4IymE9r8pg/hFKoX3eSqD9qkrhPW7////ASuD9WsqhPb/K4P1ZSuD9aEqhPXXKoT2+TOA/wspg/VRKoX2sSyD+SkrhPe1KIbyEyqE9bsrhPb9KYT3H////wH///8B////Af///wGLAGWhiQBiDf///wGIAGYPjABnkYAAgAP///8B////Af///wH///8BgACABZIAbQf///8B////ATOZ/wWLAF0L////Af///wEkkv8HAKr/A////wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////AYwAZr+MAGdF////AYsAZm+MAGa3////AY0AZZ2MAGWXjABmx4wAZ1ONAGebjQBmpYwAZq+NAGaTiwBmrYwAZneMAGdniwBlUYwAZomMAGaZjABns4sAZ2OMAGa9jQBmj4wAZp+MAGdpjABmhYwAZ2eKAGoZ////Af///wH///8BjABlf40AZYn///8BjABmi40AZWH///8BjABmX4sAZpeMAGaZiwBmg4wAZuWJAGIbjABmlYsAZY2NAGZrjABnn4wAZt+LAGbrjgBnSYwAZpWNAGaRjABmiYwAZsmNAGaPjQBmkY0AZmckkv8HUVHAVYsAZoONAGaRjQBnm40AZXWKAGg7jABm/4wAZtWMAGbdiwBmt44AYyWLAGaXjQBma6oAVQOMAGWDjABlb////wH///8B////AYAAgAX///8B////AZUAag2AAIAFjABmcYsAZVn///8B////Af///wH///8B////ASuE99Mpg/aJ////Af///wGAAFUHlQBqDaoAVQOMAGbvkgBhFYcAaRGMAGbPK4P3QyqE9pMrgPQZK4L0Ly6C8TdOTrwXKoT1TyyD+CP///8BAKr/AyuD9U8phfhFK4b2OyqE9lWLA2hXjABmjSuH+CUqhPaLLIP1TSmF9UsrgvU1K4P1oSqF9nP///8B////Af///wH///8B////AYwAZquKA2dXK4X3l4sAZqWCEHcvKoT26SuE9qkphPVrKoT2/yqD92ErhPfxKoT2/yqE9s////8BKoT23SqE9v8qhfdjKoT2/yyB8sdmNp9VJoT2GyqE9v8qhPbJKYT3HyqF9pMphPY5KIb2Of///wH///8B////Af///wH///8BjQBlY4gDap8qhPb7TVTCi4wAZo0phPd9KoT2+yyD+SkqhPbzKoP2wyqE9Z0qhPb/KoT2/ymD+CUrg/aLKoT2/yqE93sqhPb/KoT2/yuE95v///8BKoX25SuE9v0ui/8LKoT1u////wH///8B////Af///wH///8B////Af///wGJAGIbjABm6SuC868qhPbzhglvs0VizhsrhPb9KoP1hyqF95kqhPb/KYX3XyqE9v8qhPb/K4X3YSmD+EUqhPb/KoT3eyqE9uMqhPb/KoT3uf///wEqhfavKoT2/yqG9z0qhPbR////Af///wH///8B////Af///wH///8B////Af///wGLAGdjRF7QMSqE9vs5ceHDgA5xEymE9rMqhPbtK4T3PSqE9v8qhPZ1KYT2yyqE9v8qhPWdK4D0GSqE9v8phPanKoT1nyqE9v8qhPbN////ASqF93kqhPb/KoX2cyqE9sn///8B////Af///wH///8B////Af///wH///8B////Af///wH///8BKYX2jyqE9v8qhPaHK4T2UyqE9v8rhfdhKYT20SqE9tEphPZXKoT2/yqE9ukAgP8DKoT26yqE9t0qhPVpKoT2/yqE9t////8BLIX0LyqE9v8qhPbpKoT3t////wH///8B////Af///wH///8B////Af///wH///8B////Af///wErgP8NKoT2wyqE9v8qhfaxKoT2/yqE97kphPZ3KoT2/yyD9U0qhPbZKoT2/yuC9C8qhfarKoT2/yuE9lMqhPb/KoT18f///wH///8BK4T3fyuE99Mng/ch////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wErgP8NKoT2wyqE9v8qhPb/KoT29SmF9RkqhPb7KoX2yymD92MqhPb/KoP2bSqF92MqhPb/KoP2jSqE9v8qhPb/QID/Bf///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wErgP8NKoT2jSqE9ucrhPbf////ASmF9pUqhPb/KoP2qSqE9v8qhParJ4n/DSuE9usqhPXxKoT2/yqE9v0rgP8H////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8BAKr/AzOZ/wX///8BIojuDyqE9ucqhPb/KoT2/ymE9r////8BK4P1ayqE9v8qhPb/KoT2rf///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8BLIP4IyuF9s0qhPbtKoP1gf///wH///8BJ4P4JyyE9TUAgP8D////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////Af///wH///8B////AQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA" rel="icon" type="image/png" />
|
|
<link href="./node_modules/video.js/dist/video-js.min.css" rel="stylesheet" />
|
|
<link href="./node_modules/videojs-hls-quality-selector/dist/videojs-hls-quality-selector.css" rel="stylesheet" />
|
|
<script src="./node_modules/video.js/dist/video.min.js"></script>
|
|
<script src="./node_modules/@videojs/http-streaming/dist/videojs-http-streaming.min.js"></script>
|
|
<script src="./node_modules/videojs-hls-quality-selector/dist/videojs-hls-quality-selector.min.js"></script>
|
|
|
|
<style>
|
|
body {
|
|
margin: 0px;
|
|
font: 20px 'RobotoRegular', Arial, sans-serif;
|
|
font-weight: 100;
|
|
height: 100%;
|
|
color: #0f1419;
|
|
background-image: url('./bg.svg');
|
|
background-color: #ff5800;
|
|
}
|
|
div.info {
|
|
position: fixed;
|
|
background: #66008C;
|
|
padding: 50px 50px 50px 50px;
|
|
border-radius: 10px;
|
|
width: 1050px;
|
|
height: 600px;
|
|
top: 50%;
|
|
left: 50%;
|
|
margin-top: -400px;
|
|
margin-left: -550px;
|
|
}
|
|
div.butt {
|
|
margin-top: 10px;
|
|
margin-right: 10px;
|
|
border-radius: 4px;
|
|
height: 30px;
|
|
width: 70px;
|
|
background: #ff5800;
|
|
font-size: 15px;
|
|
line-height: 30px;
|
|
text-align: center;
|
|
float: left;
|
|
}
|
|
|
|
div.butt:hover {
|
|
background: #ffa678;
|
|
cursor: pointer;
|
|
}
|
|
|
|
div.selected {
|
|
margin-top: 10px;
|
|
margin-right: 10px;
|
|
border-radius: 4px;
|
|
height: 30px;
|
|
width: 70px;
|
|
background: #943300;
|
|
font-size: 15px;
|
|
line-height: 30px;
|
|
text-align: center;
|
|
float: left;
|
|
color: white;
|
|
}
|
|
|
|
#footer {
|
|
position: fixed;
|
|
bottom: 36px;
|
|
width: 100%;
|
|
}
|
|
#center {
|
|
width: 400px;
|
|
margin: 0 auto;
|
|
font: 12px Courier;
|
|
}
|
|
|
|
</style>
|
|
|
|
</head>
|
|
<body>
|
|
|
|
<div class="info">
|
|
<video-js id="vid1" width="1050px" height="600px" class="vjs-default-skin vjs-big-play-centered" controls>
|
|
<source
|
|
src="http://harambee-woest.student.utwente.nl:8080/live/teampresentaties_1080p60_10128kbs/index.m3u8"
|
|
type="application/x-mpegURL">
|
|
</video-js>
|
|
<div>
|
|
<div class="butt" onclick="document.location='/indexl.html'">
|
|
360p
|
|
</div>
|
|
<div class="butt" onclick="document.location='/indexm.html'">
|
|
480p
|
|
</div>
|
|
<div class="butt" onclick="document.location='/indexh.html'">
|
|
720p
|
|
</div>
|
|
<div class="butt" onclick="document.location='/indexh60.html'">
|
|
720p60
|
|
</div>
|
|
<div class="butt" onclick="document.location='/index.html'">
|
|
1080p
|
|
</div>
|
|
<div class="selected">
|
|
1080p60
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
<script>
|
|
document.addEventListener("DOMContentLoaded", function(event) {
|
|
var player = videojs('vid1');
|
|
player.hlsQualitySelector();
|
|
player.play();
|
|
});
|
|
|
|
</script>
|
|
</html>
|
|
|