see changelog

shiyiya · Mar 15, 2024 · 0f2f644 · 0f2f644
1 parent 3189ac1
commit 0f2f644
Show file tree

Hide file tree

Showing 6 changed files with 56 additions and 96 deletions.
diff --git a/README.md b/README.md
@@ -13,7 +13,7 @@
 
 - https://oplayer.vercel.app
 - https://ohplayer.netlify.app
-- [Standalone Demo](https://oplayer.vercel.app/ohls.html?playlist=%5B%7B"title"%3A"Disney%27s+Oceans+-+MP4"%2C"src"%3A"%2F%2Fvjs.zencdn.net%2Fv%2Foceans.mp4"%2C"poster"%3A"%2F%2Fvjs.zencdn.net%2Fv%2Foceans.png"%2C"duration"%3A"00%3A46"%7D%2C%7B"title"%3A"Big+Buck+Bunny+-+HLS"%2C"src"%3A"https%3A%2F%2Ftest-streams.mux.dev%2Fx36xhzz%2Fx36xhzz.m3u8"%2C"poster"%3A"https%3A%2F%2Fd2zihajmogu5jn.cloudfront.net%2Fbig-buck-bunny%2Fbbb.png"%2C"duration"%3A"10%3A34"%7D%2C%7B"title"%3A"Big+Buck+Bunny+-+DASH"%2C"src"%3A"https%3A%2F%2Fdash.akamaized.net%2Fakamai%2Fbbb_30fps%2Fbbb_30fps.mpd"%2C"poster"%3A"https%3A%2F%2Fd2zihajmogu5jn.cloudfront.net%2Fbig-buck-bunny%2Fbbb.png"%2C"duration"%3A"10%3A34"%7D%5D)
+- [Standalone Demo](https://oplayer.vercel.app/ohls.html?playlist=%5B%7B"title"%3A"Disney%27s+Oceans+-+MP4"%2C"src"%3A"https%3A%2F%2Fvjs.zencdn.net%2Fv%2Foceans.mp4"%2C"poster"%3A"https%3A%2F%2Fvjs.zencdn.net%2Fv%2Foceans.png"%2C"duration"%3A"00%3A46"%7D%2C%7B"title"%3A"Big+Buck+Bunny+-+HLS"%2C"src"%3A"https%3A%2F%2Ftest-streams.mux.dev%2Fx36xhzz%2Fx36xhzz.m3u8"%2C"poster"%3A"https%3A%2F%2Fd2zihajmogu5jn.cloudfront.net%2Fbig-buck-bunny%2Fbbb.png"%2C"duration"%3A"10%3A34"%7D%2C%7B"title"%3A"Big+Buck+Bunny+-+DASH"%2C"src"%3A"https%3A%2F%2Fdash.akamaized.net%2Fakamai%2Fbbb_30fps%2Fbbb_30fps.mpd"%2C"poster"%3A"https%3A%2F%2Fd2zihajmogu5jn.cloudfront.net%2Fbig-buck-bunny%2Fbbb.png"%2C"duration"%3A"10%3A34"%7D%5D)
 
 ## Who use OPlayer?
 

diff --git a/examples/standalone/main.ts b/examples/standalone/main.ts
@@ -146,8 +146,8 @@ const player = Player.make<Ctx>('#player', {
         },
         {
           title: "Disney's Oceans - MP4",
-          src: '//vjs.zencdn.net/v/oceans.mp4',
-          poster: '//vjs.zencdn.net/v/oceans.png',
+          src: 'https://vjs.zencdn.net/v/oceans.mp4',
+          poster: 'https://vjs.zencdn.net/v/oceans.png',
           duration: '00:46'
         },
         {

diff --git a/packages/core/CHANGELOG.md b/packages/core/CHANGELOG.md
@@ -2,6 +2,11 @@
 
 ## UnRelease
 
+## [1.2.33-beta.3]
+
+- pause before source changeing.
+- single apply plugin.
+
 ## [1.2.33-beta.1]
 
 - add events `sourcechangeerror`, `qualitychangeerror`.

diff --git a/packages/core/package.json b/packages/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@oplayer/core",
-  "version": "1.2.33-beta.2",
+  "version": "1.2.33-beta.3",
   "description": "Oh! Another HTML5 video player.",
   "type": "module",
   "main": "./dist/index.es.js",

diff --git a/packages/core/src/player.ts b/packages/core/src/player.ts
@@ -218,8 +218,8 @@ export class Player<Context extends Record<string, any> = Record<string, any>> {
   }
 
   applyPlugin(plugin: PlayerPlugin) {
+    this.plugins.push(plugin)
     const returned = plugin.apply(this)
-
     const { name, key } = plugin
     if (returned) {
       //@ts-ignore

diff --git a/packages/docs/public/ohls.html b/packages/docs/public/ohls.html
@@ -1,4 +1,4 @@
-<!doctype html>
+<!DOCTYPE html>
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
@@ -12,73 +12,32 @@
         margin: 0;
         background-color: #000;
       }
+
       #oplayer,
       .placeholder {
         width: 100vw;
         height: 100vh;
       }
-
-      .placeholder {
-        display: flex;
-        align-items: center;
-        justify-content: center;
-      }
-
-      .placeholder span {
-        animation: jello-horizontal 1.2s both infinite;
-        letter-spacing: 4px;
-        color: #fff;
-        font-size: 24px;
-      }
-
-      @keyframes jello-horizontal {
-        0% {
-          transform: scale3d(1, 1, 1);
-        }
-        30% {
-          transform: scale3d(1.25, 0.75, 1);
-        }
-        40% {
-          transform: scale3d(0.75, 1.25, 1);
-        }
-        50% {
-          transform: scale3d(1.15, 0.85, 1);
-        }
-        65% {
-          transform: scale3d(0.95, 1.05, 1);
-        }
-        75% {
-          transform: scale3d(1.05, 0.95, 1);
-        }
-        100% {
-          transform: scale3d(1, 1, 1);
-        }
-      }
     </style>
   </head>
+
   <body>
-    <div id="oplayer">
-      <div class="placeholder">
-        <span>WAIT ···</span>
-      </div>
-    </div>
+    <div id="oplayer"></div>
 
-    <script src="https://cdn.jsdelivr.net/npm/@oplayer/core@latest/dist/index.min.js"></script>
-    <script src="https://cdn.jsdelivr.net/npm/@oplayer/ui@latest/dist/index.min.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/@oplayer/core@1.2.33-beta.3/dist/index.min.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/@oplayer/ui@1.2.36-beta.2/dist/index.min.js"></script>
 
     <script>
       var hlsScriptCdn = 'https://cdn.jsdelivr.net/npm/@oplayer/hls@latest/dist/index.hls.js'
       var danmakuScriptCdn = 'https://cdn.jsdelivr.net/npm/@oplayer/danmaku@latest/dist/index.min.js'
-      var playlistScriptCdn = 'https://cdn.jsdelivr.net/npm/@oplayer/plugins@latest/dist/playlist.min.js'
+      var playlistScriptCdn = 'https://cdn.jsdelivr.net/npm/@oplayer/plugins@1.0.10-beta.2/dist/playlist.min.js'
       var chromecastScriptCdn = 'https://cdn.jsdelivr.net/npm/@oplayer/plugins@latest/dist/chromecast.min.js'
 
       var query = document.location.search.substring(1)
       var src, poster, subtitle, danmaku, title, watermark
       var playlist = []
       if (query.startsWith('http')) {
-        src = query.endsWith('==')
-          ? atob(query.substring(0, query.length - 2))
-          : safeDecodeURIComponent(query)
+        src = query.endsWith('==') ? atob(query.substring(0, query.length - 2)) : safeDecodeURIComponent(query)
       } else {
         var search = new URLSearchParams(document.location.search)
         src = safeDecodeURIComponent(search.get('src'))
@@ -93,9 +52,9 @@
                 {
                   name: 'Default',
                   default: true,
-                  src: decodeURIComponent(search.get('subtitle'))
-                }
-              ]
+                  src: decodeURIComponent(search.get('subtitle')),
+                },
+              ],
             }
           : undefined
 
@@ -109,70 +68,76 @@
                 top: '10px',
                 right: '10px',
                 maxWidth: '200px',
-                height: 'auto'
-              }
+                height: 'auto',
+              },
             }
           : undefined
       }
 
-      var plugins = [
-        OUI({
-          keyboard: { global: true },
-          slideToSeek: 'always',
-          controlBar: { back: 'fullscreen' },
-          theme: { watermark },
-          subtitle,
-          errorBuilder(e, t, builder) {
-            builder({
-              ...e,
-              message:
-                e.message || '' + '\n' + 'Open an issues https://github.com/shiyiya/oplayer/issues/new/choose'
-            })
-          }
-        })
-      ]
+      var player = OPlayer.make('#oplayer', {
+        source: { src: !playlist.length ? src : undefined, poster, title: title || 'Free HTML5 Player' },
+        playbackRate: localStorage.getItem('@oplayer/UserPreferences/speed'),
+        volume: localStorage.getItem('@oplayer/UserPreferences/volume'),
+      })
+        .use([
+          OUI({
+            keyboard: { global: true },
+            slideToSeek: 'always',
+            controlBar: { back: 'fullscreen' },
+            theme: { watermark },
+            subtitle,
+            errorBuilder(e, t, builder) {
+              builder({
+                ...e,
+                message: e.message || '' + '\n' + 'Open an issues https://github.com/shiyiya/oplayer/issues/new/choose',
+              })
+            },
+          }),
+        ])
+        .create()
+        .on(console.log)
 
       var deps = [
         [
           chromecastScriptCdn,
           () => {
-            plugins.push(OChromecast)
-          }
-        ]
+            player.applyPlugin(OChromecast)
+          },
+        ],
       ]
 
       if (/m3u8(#|\?|$)/.test(src) || playlist.some((it) => /m3u8(#|\?|$)/.test(it.src))) {
         deps.push([
           hlsScriptCdn,
           () => {
-            plugins.push(OHls({ forceHLS: true }))
-          }
+            player.applyPlugin(OHls({ forceHLS: true }))
+          },
         ])
       }
 
       if (/.mpd(#|\?|$)/i.test(src) || playlist.some((it) => /.mpd(#|\?|$)/i.test(it.src))) {
         deps.push(['https://cdn.jsdelivr.net/npm/@oplayer/dash@latest/dist/index.min.js', () => {}])
         deps.push([
-          'http://cdn.dashjs.org/latest/dash.all.min.js',
+          'https://cdn.dashjs.org/latest/dash.all.min.js',
           () => {
             const dash = ODash()
             dash.constructor.library = dashjs
-            plugins.push(dash)
-          }
+            player.applyPlugin(dash)
+          },
         ])
       }
 
       if (playlist.length) {
         deps.push([
           playlistScriptCdn,
           () => {
-            plugins.push(
+            player.applyPlugin(
               new OPlaylist({
                 initialIndex: 0,
-                sources: playlist
+                sources: playlist,
               })
             )
-          }
+          },
         ])
       }
 
@@ -188,16 +153,6 @@
           })
         }
 
-        document.querySelector('.placeholder').remove()
-        var player = (window.player = OPlayer.make('#oplayer', {
-          source: { src: !playlist.length ? src : undefined, poster, title },
-          playbackRate: localStorage.getItem('@oplayer/UserPreferences/speed'),
-          volume: localStorage.getItem('@oplayer/UserPreferences/volume')
-        })
-          .use(plugins)
-          .create()
-          .on(console.log))
-
         player.on('ratechange', () => {
           if (!player.isSourceChanging)
             localStorage.setItem('@oplayer/UserPreferences/speed', player.playbackRate.toString())