-
Notifications
You must be signed in to change notification settings - Fork 2
/
Copy pathexample.html
59 lines (52 loc) · 1.52 KB
/
example.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
52
53
54
55
56
57
58
59
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Video.js Levels</title>
<link href="node_modules/video.js/dist/video-js/video-js.css" rel="stylesheet" type="text/css">
<link href="lib/videojs-levels.css" rel="stylesheet" type="text/css">
<style>
body {
margin: 0;
}
#video {
position: absolute;
}
</style>
</head>
<body>
<video id="video" class="video-js vjs-default-skin" controls width="100%" height="100%"
poster="http://video-js.zencoder.com/oceans-clip.png"
data-setup='{"techOrder": ["flash", "html5"]}'>
<source src="http://playertest.longtailvideo.com/adaptive/oceans_aes/oceans_aes.m3u8" type='video/mp4' />
</video>
<script src="node_modules/video.js/dist/video-js/video.js"></script>
<script src="lib/videojs-levels.js"></script>
<script>
// See https://github.com/mangui/flashls
videojs.options.flash = {
swf: "node_modules/videojs-swf/dist/video-js.swf",
flashVars: {
hls_startfromlevel: 0,
hls_capleveltostage: false,
hls_debug: false,
hls_debug2: false,
hls_usehardwarevideodecoder: true,
hls_minbufferlength: 10,
hls_lowbufferlength: 3,
hls_maxbufferlength: 60,
hls_seekmode: 'KEYFRAME',
//hls_nextlevel: -1,
hls_seekfromlevel: 0
},
params: {
allowfullscreen: "true",
wmode: "direct",
allowscriptaccess: "always",
}
}
// fire up the plugin
videojs('video').levels();
</script>
</body>
</html>