This repository has been archived by the owner on Jul 5, 2023. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 3
/
demo.html
68 lines (68 loc) · 2.62 KB
/
demo.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
60
61
62
63
64
65
66
67
68
<!DOCTYPE html>
<html>
<head>
<title>Play</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<style>
html, body {
height: 100%;
}
</style>
<link href="https://cdnjs.cloudflare.com/ajax/libs/video.js/6.13.0/video-js.min.css" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/videojs-resolution-switcher/0.4.2/videojs-resolution-switcher.min.css" rel="stylesheet">
</head>
<body style="margin: 0px">
<video id="my-video" class="video-js vjs-default-skin" style="width: 100%; height: 100%">
<p class="vjs-no-js">
To view this video please enable JavaScript, and consider upgrading to a web browser that
<a href="https://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a>
</p>
</video>
<script src="https://cdnjs.cloudflare.com/ajax/libs/video.js/6.13.0/video.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/videojs-contrib-hls/5.15.0/videojs-contrib-hls.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/videojs-hotkeys/0.2.25/videojs.hotkeys.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/videojs-resolution-switcher/0.4.2/videojs-resolution-switcher.min.js"></script>
<script>
var qualities = ["", "wqvga", "hd480", "hd720", "hd1080"];
var labels = {"": "原画", "wqvga": "VGA", "hd480": "480P", "hd720": "720P", "hd1080": "1080P"};
var reses = {"": 10000, "wqvga": 240, "hd480": 480, "hd720": 720,"hd1080": 1080};
var srcs = [];
for(var i in qualities) {
srcs[i] = {
src: "m3u8.php?" + window.location.search.substr(1) + "&quality=" + qualities[i],
type: 'application/x-mpegURL',
label: labels[qualities[i]],
res: reses[qualities[i]]
};
}
videojs.options.html5.nativeAudioTracks = false;
videojs.options.html5.nativeVideoTracks = false;
videojs.options.hls.overrideNative = true;
player = videojs('my-video', {
controls: true,
preload: 'auto',
plugins: {
videoJsResolutionSwitcher: {
default: "low",
dynamicLabel: true
}
}
}, function(){
this.on('resolutionchange', function() {
console.info('Source changed to %s', player.src())
});
this.hotkeys({
volumeStep: 0.1,
seekStep: 5,
enableModifiersForNumbers: false
});
this.textTrackSettings.setValues({
backgroundOpacity: "0",
fontPercent: 1.20,
edgeStyle: "uniform",
});
this.updateSrc(srcs);
});
</script>
</body>
</html>