xiaoxue_admin
/
DPlayer
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

support custom video type

This commit is contained in:
DIYgod 2018-01-19 18:50:25 +08:00
parent 8e69adab3c
commit d753f8289a
No known key found for this signature in database
GPG Key ID: EC0B76A252D3EF67
7 changed files with 115 additions and 82 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
README.md
View File

@ -22,19 +22,20 @@ DPlayer is a lovely HTML5 danmaku video player to help people build video and da
**DPlayer supports:**
- Streaming formats
- [HLS](https://github.com/video-dev/hls.js)
- [FLV](https://github.com/Bilibili/flv.js)
- [MPEG DASH](https://github.com/Dash-Industry-Forum/dash.js)
- [HLS](https://github.com/video-dev/hls.js)
- [FLV](https://github.com/Bilibili/flv.js)
- [MPEG DASH](https://github.com/Dash-Industry-Forum/dash.js)
- [WebTorrent](https://github.com/webtorrent/webtorrent)
- Any other custom streaming formats
- Media formats
- MP4 H.264
- WebM
- Ogg Theora Vorbis
- MP4 H.264
- WebM
- Ogg Theora Vorbis
- Features
- Danamku
- Screenshot
- Hotkeys
- Quality switching
- Danamku
- Screenshot
- Hotkeys
- Quality switching
- Thumbnails
- Subtitle

16
demo/demo.js
View File

@ -177,6 +177,22 @@ function initPlayers () {
// type: 'hls'
// }
// });
// window.dp10 = new DPlayer({
// container: document.getElementById('dplayer10'),
// video: {
// url: 'https://qq.webrtc.win/tv/Pear-Demo-Yosemite_National_Park.mp4',
// type: 'pearplayer',
// customType: {
// 'pearplayer': function (video, player) {
// new PearPlayer(video, {
// src: video.src,
// autoplay: player.options.autoplay
// });
// }
// }
// }
// });
}
function clearPlayers () {

6
demo/index.html
View File

@ -11,6 +11,7 @@
<script src="https://cdn.jsdelivr.net/npm/hls.js/dist/hls.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/dashjs/dist/dash.all.min.js"></script>
<script src="https://cdn.jsdelivr.net/webtorrent/latest/webtorrent.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/pearplayer"></script>
<script src="DPlayer.js"></script>
</head>
@ -66,6 +67,11 @@
<div id="dplayer6"></div>
</div>
<h2 id="custon-type">Custon video type</h2>
<div class="example">
<div id="dplayer10"></div>
</div>
<script src="https://cdn.jsdelivr.net/npm/stats.js"></script>
<script src="demo.js"></script>
</body>

2
dist/DPlayer.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
dist/DPlayer.min.js.map vendored
View File

File diff suppressed because one or more lines are too long

2
package.json
View File

@ -1,6 +1,6 @@
{
"name": "dplayer",
"version": "1.20.2",
"version": "1.21.0",
"description": "Wow, such a lovely HTML5 danmaku video player",
"main": "dist/DPlayer.min.js",
"style": "dist/DPlayer.min.css",

148
src/js/player.js
View File

@ -308,93 +308,103 @@ class DPlayer {
initMSE (video, type) {
this.type = type;
if (this.type === 'auto') {
if (/m3u8(#|\?|$)/i.exec(video.src)) {
this.type = 'hls';
}
else if (/.flv(#|\?|$)/i.exec(video.src)) {
this.type = 'flv';
}
else if (/.mpd(#|\?|$)/i.exec(video.src)) {
this.type = 'dash';
if (this.options.video.customType && this.options.video.customType[type]) {
if (Object.prototype.toString.call(this.options.video.customType[type]) === '[object Function]') {
this.options.video.customType[type](this.video, this);
}
else {
this.type = 'normal';
console.error(`Illegal customType: ${type}`);
}
}
switch (this.type) {
// https://github.com/video-dev/hls.js
case 'hls':
if (Hls) {
if (Hls.isSupported()) {
const hls = new Hls();
hls.loadSource(video.src);
hls.attachMedia(video);
else {
if (this.type === 'auto') {
if (/m3u8(#|\?|$)/i.exec(video.src)) {
this.type = 'hls';
}
else if (/.flv(#|\?|$)/i.exec(video.src)) {
this.type = 'flv';
}
else if (/.mpd(#|\?|$)/i.exec(video.src)) {
this.type = 'dash';
}
else {
this.notice('Error: Hls is not supported.');
this.type = 'normal';
}
}
else {
this.notice('Error: Can\'t find Hls.');
}
break;
// https://github.com/Bilibili/flv.js
case 'flv':
if (flvjs && flvjs.isSupported()) {
if (flvjs.isSupported()) {
const flvPlayer = flvjs.createPlayer({
type: 'flv',
url: video.src
});
flvPlayer.attachMediaElement(video);
flvPlayer.load();
switch (this.type) {
// https://github.com/video-dev/hls.js
case 'hls':
if (Hls) {
if (Hls.isSupported()) {
const hls = new Hls();
hls.loadSource(video.src);
hls.attachMedia(video);
}
else {
this.notice('Error: Hls is not supported.');
}
}
else {
this.notice('Error: flvjs is not supported.');
this.notice('Error: Can\'t find Hls.');
}
}
else {
this.notice('Error: Can\'t find flvjs.');
}
break;
break;
// https://github.com/Dash-Industry-Forum/dash.js
case 'dash':
if (dashjs) {
dashjs.MediaPlayer().create().initialize(video, video.src, false);
}
else {
this.notice('Error: Can\'t find dashjs.');
}
break;
// https://github.com/webtorrent/webtorrent
case 'webtorrent':
if (WebTorrent) {
if (WebTorrent.WEBRTC_SUPPORT) {
this.container.classList.add('dplayer-loading');
const client = new WebTorrent();
const torrentId = video.src;
client.add(torrentId, (torrent) => {
const file = torrent.files.find((file) => file.name.endsWith('.mp4'));
file.renderTo(this.video, {
autoplay: this.options.autoplay
}, () => {
this.container.classList.remove('dplayer-loading');
// https://github.com/Bilibili/flv.js
case 'flv':
if (flvjs && flvjs.isSupported()) {
if (flvjs.isSupported()) {
const flvPlayer = flvjs.createPlayer({
type: 'flv',
url: video.src
});
});
flvPlayer.attachMediaElement(video);
flvPlayer.load();
}
else {
this.notice('Error: flvjs is not supported.');
}
}
else {
this.notice('Error: Webtorrent is not supported.');
this.notice('Error: Can\'t find flvjs.');
}
break;
// https://github.com/Dash-Industry-Forum/dash.js
case 'dash':
if (dashjs) {
dashjs.MediaPlayer().create().initialize(video, video.src, false);
}
else {
this.notice('Error: Can\'t find dashjs.');
}
break;
// https://github.com/webtorrent/webtorrent
case 'webtorrent':
if (WebTorrent) {
if (WebTorrent.WEBRTC_SUPPORT) {
this.container.classList.add('dplayer-loading');
const client = new WebTorrent();
const torrentId = video.src;
client.add(torrentId, (torrent) => {
const file = torrent.files.find((file) => file.name.endsWith('.mp4'));
file.renderTo(this.video, {
autoplay: this.options.autoplay
}, () => {
this.container.classList.remove('dplayer-loading');
});
});
}
else {
this.notice('Error: Webtorrent is not supported.');
}
}
else {
this.notice('Error: Can\'t find Webtorrent.');
}
break;
}
else {
this.notice('Error: Can\'t find Webtorrent.');
}
break;
}
}