From dfc6b0e389fe624d300ca1aa1078cf468e9b22bb Mon Sep 17 00:00:00 2001 From: 7Ds7 <7Ds7@users.noreply.github.com> Date: Wed, 15 Jan 2020 19:50:47 +0100 Subject: [PATCH 1/6] VideoJs warnings - plugin is now registerPlugin - videojs.addClass is now videojs.dom.addClass --- lib/videojs-resolution-switcher.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/lib/videojs-resolution-switcher.js b/lib/videojs-resolution-switcher.js index eae1c38..f2a926d 100644 --- a/lib/videojs-resolution-switcher.js +++ b/lib/videojs-resolution-switcher.js @@ -58,11 +58,11 @@ this.controlText('Quality'); if(options.dynamicLabel){ - videojs.addClass(this.label, 'vjs-resolution-button-label'); + videojs.dom.addClass(this.label, 'vjs-resolution-button-label'); this.el().appendChild(this.label); }else{ var staticLabel = document.createElement('span'); - videojs.addClass(staticLabel, 'vjs-menu-icon'); + videojs.dom.addClass(staticLabel, 'vjs-menu-icon'); this.el().appendChild(staticLabel); } player.on('updateSources', videojs.bind( this, this.update ) ); @@ -362,6 +362,6 @@ }; // register the plugin - videojs.plugin('videoJsResolutionSwitcher', videoJsResolutionSwitcher); + videojs.registerPlugin('videoJsResolutionSwitcher', videoJsResolutionSwitcher); })(window, videojs); })(); From 9c23135d3b08075ea20840bd421432b251e8f80c Mon Sep 17 00:00:00 2001 From: 7Ds7 <7Ds7@users.noreply.github.com> Date: Tue, 18 Feb 2020 19:00:13 +0100 Subject: [PATCH 2/6] More changes to videojs 7 - Make resolution hover - changed to handleTechSeeked_ - force resolution switch to change label --- lib/videojs-resolution-switcher.js | 26 +++++++++++++++++++------- 1 file changed, 19 insertions(+), 7 deletions(-) diff --git a/lib/videojs-resolution-switcher.js b/lib/videojs-resolution-switcher.js index f2a926d..0f281e3 100644 --- a/lib/videojs-resolution-switcher.js +++ b/lib/videojs-resolution-switcher.js @@ -31,16 +31,20 @@ MenuItem.call(this, player, options); this.src = options.src; - player.on('resolutionchange', videojs.bind(this, this.update)); + player.on('resolutionchange', videojs.bind(this, this.update)) } } ); ResolutionMenuItem.prototype.handleClick = function(event){ - MenuItem.prototype.handleClick.call(this,event); + MenuItem.prototype.handleClick.call(this, event); this.player_.currentResolution(this.options_.label); + // this.player_.updateSrc(this.player_.options_.sources) + // MenuButton.prototype.update.call(this); }; ResolutionMenuItem.prototype.update = function(){ - var selection = this.player_.currentResolution(); - this.selected(this.options_.label === selection.label); + var selection = (this.player_ && this.player_.currentResolution() ) ? this.player_.currentResolution() : null ; + if ( selection ) { + this.selected(this.options_.label === selection.label); + } }; MenuItem.registerComponent('ResolutionMenuItem', ResolutionMenuItem); @@ -56,7 +60,6 @@ MenuButton.call(this, player, options); this.el().setAttribute('aria-label','Quality'); this.controlText('Quality'); - if(options.dynamicLabel){ videojs.dom.addClass(this.label, 'vjs-resolution-button-label'); this.el().appendChild(this.label); @@ -65,6 +68,14 @@ videojs.dom.addClass(staticLabel, 'vjs-menu-icon'); this.el().appendChild(staticLabel); } + + // Make hover on resolution button + this.el().addEventListener('mouseover', function(e) { + videojs.dom.addClass(this, 'vjs-hover'); + }); + + // force update of resolution to change label + player.on('resolutionchange', videojs.bind(this, this.update)) player.on('updateSources', videojs.bind( this, this.update ) ); } } ); @@ -94,6 +105,7 @@ return MenuButton.prototype.update.call(this); }; ResolutionMenuButton.prototype.buildCSSClass = function(){ + videojs.dom.addClass(this.el(), 'vjs-resolution-button') return MenuButton.prototype.buildCSSClass.call( this ) + ' vjs-resolution-button'; }; MenuButton.registerComponent('ResolutionMenuButton', ResolutionMenuButton); @@ -151,7 +163,6 @@ */ player.currentResolution = function(label, customSourcePicker){ if(label == null) { return this.currentResolutionState; } - // Lookup sources for label if(!this.groupedSrc || !this.groupedSrc.label || !this.groupedSrc.label[label]){ return; @@ -181,7 +192,8 @@ player.handleTechSeeked_(); if(!isPaused){ // Start playing and hide loadingSpinner (flash issue ?) - player.play().handleTechSeeked_(); + player.play(); + player.handleTechSeeked_(); } player.trigger('resolutionchange'); }); From c1105b5f6c123807665f2dc342b981a6de145158 Mon Sep 17 00:00:00 2001 From: 7Ds7 <7Ds7@users.noreply.github.com> Date: Tue, 18 Feb 2020 19:02:02 +0100 Subject: [PATCH 3/6] Removed commented lines --- lib/videojs-resolution-switcher.js | 2 -- 1 file changed, 2 deletions(-) diff --git a/lib/videojs-resolution-switcher.js b/lib/videojs-resolution-switcher.js index 0f281e3..f9ed46a 100644 --- a/lib/videojs-resolution-switcher.js +++ b/lib/videojs-resolution-switcher.js @@ -37,8 +37,6 @@ ResolutionMenuItem.prototype.handleClick = function(event){ MenuItem.prototype.handleClick.call(this, event); this.player_.currentResolution(this.options_.label); - // this.player_.updateSrc(this.player_.options_.sources) - // MenuButton.prototype.update.call(this); }; ResolutionMenuItem.prototype.update = function(){ var selection = (this.player_ && this.player_.currentResolution() ) ? this.player_.currentResolution() : null ; From 5d904fb1e01f29c1223728abe63168ee97573eb8 Mon Sep 17 00:00:00 2001 From: 7Ds7 <7Ds7@users.noreply.github.com> Date: Tue, 18 Feb 2020 19:03:47 +0100 Subject: [PATCH 4/6] bump videojs version --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index aa8ab26..eace52f 100644 --- a/package.json +++ b/package.json @@ -47,6 +47,6 @@ "videojs-youtube": "^2.0.8" }, "peerDependencies": { - "video.js": "^5.8" + "video.js": "^7.4.1" } } From 8e1345f95e7d2553184d60a44924946490a95df6 Mon Sep 17 00:00:00 2001 From: 7Ds7 <7Ds7@users.noreply.github.com> Date: Tue, 25 Feb 2020 03:38:28 +0100 Subject: [PATCH 5/6] bumped videojs devDependency --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index eace52f..bb254d8 100644 --- a/package.json +++ b/package.json @@ -42,7 +42,7 @@ "grunt-contrib-qunit": "^1.1", "grunt-contrib-uglify": "^1.0", "grunt-contrib-watch": "^1.0", - "video.js": "^5.8", + "video.js": "^7.4.1", "qunitjs": "^1.22", "videojs-youtube": "^2.0.8" }, From 2e2942abffd018e9f0c4f82b5d6d8b2b7f86c827 Mon Sep 17 00:00:00 2001 From: 7Ds7 <7Ds7@users.noreply.github.com> Date: Tue, 25 Feb 2020 03:42:55 +0100 Subject: [PATCH 6/6] Fixing lint errors --- lib/videojs-resolution-switcher.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/lib/videojs-resolution-switcher.js b/lib/videojs-resolution-switcher.js index f9ed46a..de87221 100644 --- a/lib/videojs-resolution-switcher.js +++ b/lib/videojs-resolution-switcher.js @@ -31,7 +31,7 @@ MenuItem.call(this, player, options); this.src = options.src; - player.on('resolutionchange', videojs.bind(this, this.update)) + player.on('resolutionchange', videojs.bind(this, this.update)); } } ); ResolutionMenuItem.prototype.handleClick = function(event){ @@ -73,7 +73,7 @@ }); // force update of resolution to change label - player.on('resolutionchange', videojs.bind(this, this.update)) + player.on('resolutionchange', videojs.bind(this, this.update)); player.on('updateSources', videojs.bind( this, this.update ) ); } } ); @@ -103,7 +103,7 @@ return MenuButton.prototype.update.call(this); }; ResolutionMenuButton.prototype.buildCSSClass = function(){ - videojs.dom.addClass(this.el(), 'vjs-resolution-button') + videojs.dom.addClass(this.el(), 'vjs-resolution-button'); return MenuButton.prototype.buildCSSClass.call( this ) + ' vjs-resolution-button'; }; MenuButton.registerComponent('ResolutionMenuButton', ResolutionMenuButton);