eplayer 1.5.2 → 1.5.3

package/docs/eplayer.js

@@ -138,13 +138,13 @@ class Eplayer extends HTMLElement {
       case 38:
         try {
           this.video.volume = parseInt(this.video.volume * 100) / 100 + 0.05
-        } catch (e) {}
+        } catch (e) { }
         setVolume(this.video.volume.toFixed(1) * 10, this.$('.line'))
         break
       case 40:
         try {
           this.video.volume = parseInt(this.video.volume * 100) / 100 - 0.05
-        } catch (e) {}
+        } catch (e) { }
         setVolume(this.video.volume.toFixed(1) * 10, this.$('.line'))
         break
       case 32:
@@ -272,10 +272,11 @@ class Eplayer extends HTMLElement {
         }
         .lines{
           padding:0 10px;
+          display:flex;
+          align-items: center;
         }
         .line{
-          padding:0;
-          margin-bottom: -2px;
+          padding:0 2px;
           cursor:pointer
         }
         .line i{
@@ -565,7 +566,7 @@ class Eplayer extends HTMLElement {
         setVolume(index + 1, this.$('.line'))
       }
     })
-    document.oncontextmenu = () => false
+    this.$('.eplayer').oncontextmenu = () => false
   }
 }
 
@@ -598,7 +599,7 @@ function isFullScreen() {
   return document.isFullScreen || document.webkitIsFullScreen || document.mozIsFullScreen
 }
 
-;(function () {
+; (function () {
   let link = document.createElement('link')
   link.setAttribute('href', 'https://at.alicdn.com/t/font_836948_g9fk6jqpl8l.css')
   link.setAttribute('rel', 'stylesheet')

package/docs/index.html

@@ -98,7 +98,7 @@
   </style>
   <div class="wrapper">
     <e-player id="ep"
-      src="https://gss3.baidu.com/6LZ0ej3k1Qd3ote6lo7D0j9wehsv/tieba-smallvideo/3_d97abb65fc36a1d689efd3a105bebce1.mp4">
+      src="https://bos.nj.bpc.baidu.com/tieba-movideo/347573243_f2740215c9863213a9f272b81aab1b90_8b216f814f25.mp4">
     </e-player>
     <a href="https://github.com/132yse/eplayer">github</a>
     <a href="https://github.com/132yse/eplayer/blob/master/README.md">README</a>
@@ -110,4 +110,4 @@
   <script src="./pic.js"></script>
 </body>
 
-</html>
+</html>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "eplayer",
-  "version": "1.5.2",
+  "version": "1.5.3",
   "description": "A web-components html5 video player facing future",
   "main": "./packages/eplayer/index.js",
   "module": "./packages/eplayer/index.js",

package/packages/eplayer/index.js

@@ -159,18 +159,11 @@ export default class Eplayer extends HTMLElement {
   }
 
   full() {
+    let el = this.$('.eplayer')
     if (isFullScreen()) {
-      if (document.exitFullscreen) {
-        document.exitFullscreen()
-      } else if (document.mozCancelFullScreen) {
-        document.mozCancelFullScreen()
-      } else if (document.webkitCancelFullScreen) {
-        document.webkitCancelFullScreen()
-      } else if (document.msExitFullscreen) {
-        document.msExitFullscreen()
-      }
+      const efs = document.exitFullscreen || document.webkitExitFullscreen || document.mozCancelFullScreen || document.msExitFullscreen
+      return efs()
     } else {
-      let el = this.$('.eplayer')
       let rfs = el.requestFullScreen || el.webkitRequestFullScreen || el.mozRequestFullScreen || el.msRequestFullscreen
       return rfs.call(el)
     }
@@ -272,15 +265,15 @@ export default class Eplayer extends HTMLElement {
         }
         .lines{
           padding:0 10px;
+          display:flex;
+          align-items: center;
         }
         .line{
-          padding:0;
-          margin-bottom: -2px;
+          padding:0 0.1rem;
           cursor:pointer
         }
         .line i{
           width:4px;
-          border-radius:4px;
           display: inline-block;
           background: var(--icons,rgba(255,255,255,0.6));
           height: 12px;
@@ -565,7 +558,7 @@ export default class Eplayer extends HTMLElement {
         setVolume(index + 1, this.$('.line'))
       }
     })
-    document.oncontextmenu = () => false
+    this.$('.eplayer').oncontextmenu = () => false
   }
 }