yetangitu/videojs-resolution-switcher
1
0
Fork 0
mirror of https://github.com/kmoskwiak/videojs-resolution-switcher.git synced 2025-10-05 10:49:28 +02:00
Code Issues Releases Wiki Activity

Merge 2e2942abff into 85f1e51c8b

Browse source
This commit is contained in:
7Ds7 2020-02-25 03:43:00 +01:00 • committed by GitHub
commit 5fe0939bf6
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 21 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

28
lib/videojs-resolution-switcher.js
View file

@ -35,12 +35,14 @@
} }
} ); } );
ResolutionMenuItem.prototype.handleClick = function(event){ 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_.currentResolution(this.options_.label);
}; };
ResolutionMenuItem.prototype.update = function(){ ResolutionMenuItem.prototype.update = function(){
var selection = this.player_.currentResolution(); var selection = (this.player_ && this.player_.currentResolution() ) ? this.player_.currentResolution() : null ;
this.selected(this.options_.label === selection.label); if ( selection ) {
this.selected(this.options_.label === selection.label);
}
}; };
MenuItem.registerComponent('ResolutionMenuItem', ResolutionMenuItem); MenuItem.registerComponent('ResolutionMenuItem', ResolutionMenuItem);
@ -56,15 +58,22 @@
MenuButton.call(this, player, options); MenuButton.call(this, player, options);
this.el().setAttribute('aria-label','Quality'); this.el().setAttribute('aria-label','Quality');
this.controlText('Quality'); this.controlText('Quality');
if(options.dynamicLabel){ 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); this.el().appendChild(this.label);
}else{ }else{
var staticLabel = document.createElement('span'); var staticLabel = document.createElement('span');
videojs.addClass(staticLabel, 'vjs-menu-icon'); videojs.dom.addClass(staticLabel, 'vjs-menu-icon');
this.el().appendChild(staticLabel); 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 ) ); player.on('updateSources', videojs.bind( this, this.update ) );
} }
} ); } );
@ -94,6 +103,7 @@
return MenuButton.prototype.update.call(this); return MenuButton.prototype.update.call(this);
}; };
ResolutionMenuButton.prototype.buildCSSClass = function(){ ResolutionMenuButton.prototype.buildCSSClass = function(){
videojs.dom.addClass(this.el(), 'vjs-resolution-button');
return MenuButton.prototype.buildCSSClass.call( this ) + ' vjs-resolution-button'; return MenuButton.prototype.buildCSSClass.call( this ) + ' vjs-resolution-button';
}; };
MenuButton.registerComponent('ResolutionMenuButton', ResolutionMenuButton); MenuButton.registerComponent('ResolutionMenuButton', ResolutionMenuButton);
@ -151,7 +161,6 @@
*/ */
player.currentResolution = function(label, customSourcePicker){ player.currentResolution = function(label, customSourcePicker){
if(label == null) { return this.currentResolutionState; } if(label == null) { return this.currentResolutionState; }
// Lookup sources for label // Lookup sources for label
if(!this.groupedSrc || !this.groupedSrc.label || !this.groupedSrc.label[label]){ if(!this.groupedSrc || !this.groupedSrc.label || !this.groupedSrc.label[label]){
return; return;
@ -181,7 +190,8 @@
player.handleTechSeeked_(); player.handleTechSeeked_();
if(!isPaused){ if(!isPaused){
// Start playing and hide loadingSpinner (flash issue ?) // Start playing and hide loadingSpinner (flash issue ?)
player.play().handleTechSeeked_(); player.play();
player.handleTechSeeked_();
} }
player.trigger('resolutionchange'); player.trigger('resolutionchange');
}); });
@ -362,6 +372,6 @@
}; };
// register the plugin // register the plugin
videojs.plugin('videoJsResolutionSwitcher', videoJsResolutionSwitcher); videojs.registerPlugin('videoJsResolutionSwitcher', videoJsResolutionSwitcher);
})(window, videojs); })(window, videojs);
})(); })();

4
package.json
View file

@ -42,11 +42,11 @@
"grunt-contrib-qunit": "^1.1", "grunt-contrib-qunit": "^1.1",
"grunt-contrib-uglify": "^1.0", "grunt-contrib-uglify": "^1.0",
"grunt-contrib-watch": "^1.0", "grunt-contrib-watch": "^1.0",
"video.js": "^5.8", "video.js": "^7.4.1",
"qunitjs": "^1.22", "qunitjs": "^1.22",
"videojs-youtube": "^2.0.8" "videojs-youtube": "^2.0.8"
}, },
"peerDependencies": { "peerDependencies": {
"video.js": "^5.8" "video.js": "^7.4.1"
} }
} }