diff --git a/.eslintrc b/.eslintrc index b80fdb0..f5d4ebe 100644 --- a/.eslintrc +++ b/.eslintrc @@ -56,6 +56,7 @@ "module": false, "Hls": false, "flvjs": false, - "dashjs": false + "dashjs": false, + "WebTorrent": false } } \ No newline at end of file diff --git a/README.md b/README.md index 42a3ddc..eab4792 100644 --- a/README.md +++ b/README.md @@ -25,6 +25,7 @@ DPlayer is a lovely HTML5 danmaku video player to help people build video and da - [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) - Media formats - MP4 H.264 - WebM diff --git a/demo/demo.js b/demo/demo.js index cb86c4d..fc58502 100644 --- a/demo/demo.js +++ b/demo/demo.js @@ -149,6 +149,14 @@ function initPlayers () { // } // }); + // window.dp9 = new DPlayer({ + // container: document.getElementById('dplayer9'), + // video: { + // url: 'magnet:?xt=urn:btih:08ada5a7a6183aae1e09d831df6748d566095a10&dn=Sintel&tr=udp%3A%2F%2Fexplodie.org%3A6969&tr=udp%3A%2F%2Ftracker.coppersurfer.tk%3A6969&tr=udp%3A%2F%2Ftracker.empire-js.us%3A1337&tr=udp%3A%2F%2Ftracker.leechers-paradise.org%3A6969&tr=udp%3A%2F%2Ftracker.opentrackr.org%3A1337&tr=wss%3A%2F%2Ftracker.btorrent.xyz&tr=wss%3A%2F%2Ftracker.fastcast.nz&tr=wss%3A%2F%2Ftracker.openwebtorrent.com&ws=https%3A%2F%2Fwebtorrent.io%2Ftorrents%2F&xs=https%3A%2F%2Fwebtorrent.io%2Ftorrents%2Fsintel.torrent', + // type: 'webtorrent' + // } + // }); + // window.dp6 = new DPlayer({ // container: document.getElementById('dplayer6'), // preload: 'none', diff --git a/demo/index.html b/demo/index.html index 84b7d67..fb4a963 100644 --- a/demo/index.html +++ b/demo/index.html @@ -10,6 +10,7 @@ + @@ -54,6 +55,11 @@
+

WebTorrent

+
+
+
+

Live

diff --git a/src/js/player.js b/src/js/player.js index 9bd9241..c6ff50e 100644 --- a/src/js/player.js +++ b/src/js/player.js @@ -323,26 +323,73 @@ class DPlayer { } } - // HTTP Live Streaming - if (this.type === 'hls' && Hls && Hls.isSupported()) { - const hls = new Hls(); - hls.loadSource(video.src); - hls.attachMedia(video); - } + 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: Can\'t find Hls.'); + } + break; - // FLV - if (this.type === 'flv' && flvjs && flvjs.isSupported()) { - const flvPlayer = flvjs.createPlayer({ - type: 'flv', - url: video.src - }); - flvPlayer.attachMediaElement(video); - flvPlayer.load(); - } + // 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: Can\'t find flvjs.'); + } + break; - // MPEG DASH - if (this.type === 'dash' && dashjs) { - dashjs.MediaPlayer().create().initialize(video, video.src, false); + // 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) { + 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: Can\'t find Webtorrent.'); + } + break; } } @@ -367,7 +414,7 @@ class DPlayer { // video download error: an error occurs this.on('error', () => { - this.tran && this.notice && this.notice(this.tran('This video fails to load'), -1); + this.tran && this.notice && this.type !== 'webtorrent' & this.notice(this.tran('This video fails to load'), -1); }); // video end