v0.1.8

fix "can not removeEventListener _orientationchangeEvt"; fix playbutton's direction abnormal when disableRotation config true;
cycjimmy · Oct 31, 2017 · e86abb6 · e86abb6
1 parent 8ab48d4
commit e86abb6
Show file tree

Hide file tree

Showing 6 changed files with 22 additions and 29 deletions.
diff --git a/dist/H5VideoPlayer.js b/dist/H5VideoPlayer.js
diff --git a/dist/H5VideoPlayer.js.map b/dist/H5VideoPlayer.js.map
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "h5-video-player",
-  "version": "0.1.7",
+  "version": "0.1.8",
   "description": "Browser full screen H5 video player",
   "main": "build/H5VideoPlayer.js",
   "scripts": {

diff --git a/src/index.js b/src/index.js
@@ -90,13 +90,16 @@ export default class H5VideoPlayer {
       orientation: this.options.orientation,
       _style,
     });
+    this.container.appendChild(this.wrapper);
 
     // video
     this.videoWrapperForConstraintRatio = this.wrapper.querySelector('.' + _style.videoWrapperForConstraintRatio);
     this.video = this.wrapper.querySelector('.' + _style.video);
 
     // mask: used to control video
-    this.mask = this.wrapper.querySelector('.' + _style.mask);
+    this.mask = document.createElement('div');
+    this.mask.classList.add(_style.mask);
+    this.container.appendChild(this.mask);
 
     // playButton
     if (this.options.control) {
@@ -110,10 +113,8 @@ export default class H5VideoPlayer {
         });
       }
 
-      this.wrapper.appendChild(this.playButton);
+      this.container.appendChild(this.playButton);
     }
-
-    this.container.appendChild(this.wrapper);
   };
 
   init() {
@@ -251,19 +252,18 @@ export default class H5VideoPlayer {
       }
 
       , _changeOrientation = () => {
-        window.removeEventListener(_orientationchangeEvt, () => _changeOrientation());
+        window.removeEventListener(_orientationchangeEvt, _changeOrientation);
 
         setTimeout(() => {
           _changeStyle();
-          window.addEventListener(_orientationchangeEvt, () => _changeOrientation(), false);
-        }, 500);
+          window.addEventListener(_orientationchangeEvt, _changeOrientation, false);
+        }, 400);
       }
     ;
 
     if (this.options.disableRotation) {
       _changeStyle();
-
-      window.addEventListener(_orientationchangeEvt, () => _changeOrientation(), false);
+      window.addEventListener(_orientationchangeEvt, _changeOrientation, false);
 
     } else {
       _addStyles(this.wrapper, {

diff --git a/src/wrapper.pug b/src/wrapper.pug
@@ -23,5 +23,3 @@ div(class=_style.videoWrapperForConstraintRatio)
       source(src=source)
 
     | I'm sorry; your browser doesn't support HTML5 video.
-
-div(class=_style.mask)
diff --git a/static/view/index.pug b/static/view/index.pug
@@ -38,6 +38,7 @@ html(lang='en')
       var video = new H5VideoPlayer(source, {
         context: '#videoWrapper',
         control: true,
+        disableRotation: true,
         hookInPlay: function () {
           console.log('hookInPlay');
         },