Merge pull request #380 from raccoongang/GREENHOST-198-fix-broken-mar…

…kup-and-progress-bar [GREENHOST-198] fix broken markup and progress bar
raccoongang · Dec 18, 2019 · fa914d0 · fa914d0
2 parents 1d42904 + 985209a
commit fa914d0
Showing 1 changed file with 14 additions and 7 deletions.
diff --git a/video_xblock/static/vendor/js/Vimeo.js b/video_xblock/static/vendor/js/Vimeo.js
@@ -67,7 +67,7 @@ THE SOFTWARE. */
       this.iframe.setAttribute('allowFullScreen', '0');
 
       var divWrapper = document.createElement('div');
-      divWrapper.setAttribute('style', 'margin:0 auto;padding-bottom:56.25%;width:100%;height:0;position:relative;overflow:hidden;');
+      divWrapper.setAttribute('style', 'margin:0 auto;width:100%;height:100%;position:relative;overflow:hidden;');
       divWrapper.setAttribute('class', 'vimeoFrame');
       divWrapper.appendChild(this.iframe);
 
@@ -139,7 +139,7 @@ THE SOFTWARE. */
 
     },
 
-    onReady: function(){
+    onReady: function() {
       this.isReady_ = true;
       this.triggerReady();
       this.trigger('loadedmetadata');
@@ -156,28 +156,36 @@ THE SOFTWARE. */
       this.trigger('progress');
       if (durationUpdate) this.trigger('durationchange');
     },
+
     onPlayProgress: function(data) {
       this.vimeoInfo.time = data.seconds;
       this.trigger('timeupdate');
     },
+
     onPlay: function() {
       this.vimeoInfo.state = VimeoState.PLAYING;
       this.trigger('play');
     },
+
     onPause: function() {
       this.vimeoInfo.state = VimeoState.PAUSED;
       this.trigger('pause');
     },
+
     onFinish: function() {
       this.vimeoInfo.state = VimeoState.ENDED;
       this.trigger('ended');
     },
+
     onSeek: function(data) {
       this.trigger('seeking');
       this.vimeoInfo.time = data.seconds;
+      this.vimeoInfo.duration = data.duration;
+      this.trigger("durationchange");
       this.trigger('timeupdate');
       this.trigger('seeked');
     },
+
     onError: function(error){
       this.error = error;
       this.trigger('error');
@@ -257,8 +265,7 @@ THE SOFTWARE. */
     pause: function() { this.vimeo.api('pause'); },
 
     paused: function() {
-        return this.vimeoInfo.state !== VimeoState.PLAYING &&
-            this.vimeoInfo.state !== VimeoState.BUFFERING;
+        return this.vimeoInfo.state !== VimeoState.PLAYING && this.vimeoInfo.state !== VimeoState.BUFFERING;
     },
 
     ended: function() {
@@ -269,7 +276,7 @@ THE SOFTWARE. */
         return this.vimeoInfo.time || 0;
     },
 
-    setCurrentTime: function(seconds){
+    setCurrentTime: function(seconds) {
       this.vimeo.api('seekTo', seconds);
       this.player_.trigger('timeupdate');
     },
@@ -390,8 +397,8 @@ THE SOFTWARE. */
               '.vjs-vimeo .vjs-iframe-blocker { display: none; }' +
               '.vjs-vimeo.vjs-user-inactive .vjs-iframe-blocker { display: block; }' +
               '.vjs-vimeo .vjs-poster { background-size: cover; }' +
-              // '.vjs-vimeo { height:100%; }' +
-              '.vimeoplayer { width:100%; height:180%; position:absolute; left:0; top:-40%; }';
+              '.vimeoplayer { width:100%; height:100%; position:absolute; left:0; top:0; pointer-events: none;}' +
+              '.video-js .vjs-control-bar { z-index: 3 }';
 
     var head = document.head || document.getElementsByTagName('head')[0];