Update Video.js

package.json

@@ -95,8 +95,8 @@
     "trakt.tv-ondeck": "7.x.x",
     "underscore": "^1.13.6",
     "urijs": "^1.19.11",
-    "video.js": "4.11.4",
-    "videojs-youtube": "1.2.10",
+    "video.js": "^7.14.3",
+    "videojs-youtube": "^2.6.1",
     "webtorrent": "^1.9.7",
     "webtorrent-health": "1.x.x"
   },

src/app/global.js

@@ -36,6 +36,7 @@ var _ = require('underscore'),
   // Torrent engines
   WebTorrent = require('webtorrent'),
   torrentCollection = require('torrentcollection6'),
+  videojs = require('video.js'),
   // NodeJS
   child = require('child_process'),
   // package.json

src/app/index.html

@@ -6,7 +6,7 @@
     <link rel="stylesheet" type="text/css" href="/node_modules/bootstrap/dist/css/bootstrap.min.css" />
     <link rel="stylesheet" type="text/css" href="/node_modules/bootstrap/dist/css/bootstrap-theme.min.css"/>
     <link rel="stylesheet" type="text/css" href="/node_modules/@fortawesome/fontawesome-free/css/all.min.css" />
-    <link rel="stylesheet" type="text/css" href="/node_modules/video.js/dist/video-js/video-js.min.css">
+    <link rel="stylesheet" type="text/css" href="/node_modules/video.js/dist/video-js.min.css">
     <link rel="stylesheet" type="text/css" href="css/animation.css" />
     <link rel="stylesheet" type="text/css" id="theme" href="themes/Official_-_Dark_theme.css" />
   </head>
@@ -57,13 +57,13 @@
     <script src="/node_modules/mousetrap/mousetrap.min.js"></script>
     <script src="/node_modules/mousetrap/plugins/pause/mousetrap-pause.min.js"></script>
     <script src="/node_modules/mousetrap/plugins/global-bind/mousetrap-global-bind.min.js"></script>
-    <script src="/node_modules/video.js/dist/video-js/video.dev.js"></script>
+    <script src="/node_modules/video.js/dist/video.js"></script>
 
     <!-- Other dependencies -->
     <script src="vendor/videojshooks.js"></script>
     <script src="vendor/videojsplugins.js"></script>
     <script src="lib/jquery.plugins.js"></script>
-    <script src="/node_modules/videojs-youtube/dist/vjs.youtube.js"></script>
+    <script src="/node_modules/videojs-youtube/dist/Youtube.js"></script>
 
     <!-- App Initialization -->
     <script src="database.js"></script>

src/app/lib/views/player/player.js

@@ -473,8 +473,9 @@
                     techOrder: ['youtube'],
                     forceSSL: true,
                     ytcontrols: false,
-                    quality: '720p'
-                }).ready(function () {
+                    quality: '720p',
+                });
+                this.video.ready(function () {
                     that.player && that.player.cache_ && that.player.cache_.volume ? that.player.volume(Settings.playerVolume) : null;
                     this.addClass('vjs-has-started');
                 });
@@ -502,39 +503,23 @@
             } else {
                 this.video = videojs('video_player', {
                     nativeControlsForTouch: false,
+                    nativeTextTracks: false,
                     trackTimeOffset: 0,
+                    //inactivityTimeout: 2000,
                     plugins: {
-                        biggerSubtitle: {},
-                        smallerSubtitle: {},
-                        customSubtitles: {},
-                        progressTips: {}
+                        //biggerSubtitle: {},
+                        //smallerSubtitle: {},
+                        //customSubtitles: {},
                     }
-                }).ready(function () {
+                });
+                this.video.ready(function () {
                     that.playerWasReady = Date.now();
                 });
                 $('head > title').text(this.model.get('title') + ' - Popcorn-Time' );
             }
-            this.player = this.video.player();
+            this.player = this.video;
             App.PlayerView = this;
 
-            /* The following is a hack to make VideoJS listen to
-             *  mouseup instead of mousedown for pause/play on the
-             *  video element. Stops video pausing/playing when
-             *  dragged. TODO: #fixit!
-             */
-            this.player.tech.off('mousedown');
-            this.player.tech.on('mouseup', function (event) {
-                if (event.target.origEvent) {
-                    if (!event.target.origEvent.originalEvent.defaultPrevented) {
-                        that.player.tech.onClick(event);
-                    }
-                    // clean up after ourselves
-                    delete event.target.origEvent;
-                } else {
-                    that.player.tech.onClick(event);
-                }
-            });
-
             // Force custom controls
             this.player.usingNativeControls(false);
 

src/app/styl/views/player.styl

@@ -459,22 +459,6 @@
     font-size: 12px
 }
 
-.vjs-subtitles-button {
-    top: 24px
-}
-
-.vjs_smallersub_button {
-    &.vjs-control {
-        top: 24px
-    }
-}
-
-.vjs_biggersub_button {
-    &.vjs-control {
-        top: 24px
-    }
-}
-
 .player-header-background {
     position: absolute
     background: linear-gradient(rgba(0,0,0,0.7), transparent 95%, transparent) !important