-
Notifications
You must be signed in to change notification settings - Fork 5
/
Copy pathhlsjs-wrapper.html
51 lines (44 loc) · 1.36 KB
/
hlsjs-wrapper.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Hls.js DNA Wrapper</title>
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
<style>
body {
font-family: 'Roboto', sans-serif;
}
</style>
<link rel="stylesheet" href="//samples.streamroot.io/web/assets/demo-pages.css">
<!-- Makes the header -->
<script src="//samples.streamroot.io/web/assets/header.js"></script>
<!-- Builds -->
<script src="//cdn.jsdelivr.net/npm/[email protected]/dist/hls.min.js"></script>
<script src="//cdn.streamroot.io/hlsjs-dna-wrapper/1/stable/hlsjs-dna-wrapper.js"></script>
<!-- Graphs -->
<script src="//tools.streamroot.io/usage-graphs/stable/graphs.js"></script>
</head>
<body>
<header></header>
<center>
<video id="demoplayer" width="512" height="288" muted controls autoplay></video>
<div id="streamroot-graphs"></div>
</center>
<script>
var hlsjsConfig = {
"maxBufferSize": 0,
"maxBufferLength": 30,
"liveSyncDuration": 30
};
var dnaConfig = {};
var hls = new Hls(hlsjsConfig);
var wrapper = new HlsjsDnaWrapper(hls, "demoswebsiteandpartners", dnaConfig);
var videoElement = document.getElementById('demoplayer');
hls.loadSource('https://demo-vod.streamroot.io/index.m3u8');
hls.attachMedia(videoElement);
hls.on(Hls.Events.MANIFEST_PARSED, function () {
videoElement.play();
});
</script>
</body>
</html>