support custom video type

README.md

@@ -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
 

demo/demo.js

@@ -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 () {

demo/index.html

@@ -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>

package.json

@@ -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",

src/js/player.js

@@ -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/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;
 
-        // 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/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: Webtorrent is not supported.');
+                    this.notice('Error: Can\'t find Webtorrent.');
                 }
+                break;
             }
-            else {
-                this.notice('Error: Can\'t find Webtorrent.');
-            }
-            break;
         }
     }