Merge pull request #104 from yokuze/support_videojs_8

Support Video.js 8
silvermine · Nov 15, 2023 · 4433638 · 4433638
2 parents db9791a + 99b43e5
commit 4433638
Show file tree

Hide file tree

Showing 5 changed files with 32 additions and 10 deletions.
diff --git a/README.md b/README.md
@@ -70,6 +70,17 @@ Remember to also add the CSS to your build. With most bundlers you can:
 require('@silvermine/videojs-quality-selector/dist/css/quality-selector.css')
 ```
 
+> [!WARNING]
+> This plugin's source code uses ES6+ syntax and keywords, such as `class` and `static`.
+> If you need to support [browsers that do not support newer JavaScript
+> syntax](https://caniuse.com/es6), you will need to use a tool like
+> [Babel](https://babeljs.io/) to transpile and polyfill your code.
+>
+> Alternatively, you can
+> `require('@silvermine/videojs-chromecast/dist/js/silvermine-videojs-quality-selector.js')`
+> to use a JavaScript file that has already been polyfilled/transpiled down to ES5
+> compatibility.
+
 ### Providing video sources
 
 Sources can be provided with either the `<source>` tag or via the `src` function on the

diff --git a/docs/demo/index.html b/docs/demo/index.html
@@ -3,8 +3,8 @@
 <head>
    <meta charset=utf-8 />
    <title>videojs-quality-selector Demo</title>
-   <link href="https://unpkg.com/video.js@7.5.4/dist/video-js.css" rel="stylesheet">
-   <script src="https://unpkg.com/video.js@7.5.4/dist/video.js"></script>
+   <link href="https://unpkg.com/video.js@8.6.1/dist/video-js.css" rel="stylesheet">
+   <script src="https://unpkg.com/video.js@8.6.1/dist/video.js"></script>
    <script src="../../dist/js/silvermine-videojs-quality-selector.min.js"></script>
    <link href="../../dist/css/quality-selector.css" rel="stylesheet">
 </head>

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -40,8 +40,8 @@
     "@silvermine/eslint-config": "3.0.1",
     "@silvermine/standardization": "2.0.0",
     "autoprefixer": "8.6.5",
-    "babelify": "10.0.0",
     "babel-eslint": "10.1.0",
+    "babelify": "10.0.0",
     "check-node-version": "4.0.3",
     "core-js": "3.11.0",
     "coveralls": "3.0.3",

diff --git a/src/scss/quality-selector.scss b/src/scss/quality-selector.scss
@@ -12,7 +12,14 @@
       font-weight: normal;
       font-style: normal;
       &::before {
-         content: '\f110';
+         // The correct icon font character for Video.js 7 and below:
+         .video-js:not(.vjs-v8) & {
+            content: '\f110';
+         }
+         // Icon font character for Video.js 8:
+         .vjs-v8 & {
+            content: '\f114';
+         }
       }
    }
 }