mirror of
https://github.com/iv-org/videojs-quality-selector.git
synced 2025-05-08 01:15:02 -04:00
Refs #13 Support quality selector buttons anywhere in the player's component hierarchy
Previously, the SourceInterceptor made the assumption that the QualitySelector button component is a direct child of the controlBar component. That may not always be true. Video.js allows you to specify a nested hierarchy of components, and so when plugin users choose to move the QualitySelector button elsewhere, the plugin does not work properly. This commit introduces a new event type called QUALITY_REQUESTED to signal when the user is requesting a quality change. The old QUALITY_SELECTED event is now used to denote when the plugin actually uses a new quality source. This dichotomy eliminates the need for the SourceInterceptor to have a reference to the QualitySelector button component.
This commit is contained in:
parent
ec9e06196f
commit
a682125480
5 changed files with 19 additions and 13 deletions
|
@ -25,7 +25,7 @@ module.exports = function(videojs) {
|
|||
MenuButton.call(this, player, options);
|
||||
|
||||
// Update interface instantly so the user's change is acknowledged
|
||||
player.on(events.QUALITY_SELECTED, function(event, newSource) {
|
||||
player.on(events.QUALITY_REQUESTED, function(event, newSource) {
|
||||
this.setSelectedSource(newSource);
|
||||
player.addClass(QUALITY_CHANGE_CLASS);
|
||||
|
||||
|
@ -34,6 +34,11 @@ module.exports = function(videojs) {
|
|||
});
|
||||
}.bind(this));
|
||||
|
||||
player.on(events.QUALITY_SELECTED, function(event, newSource) {
|
||||
// Update the selected source with the source that was actually selected
|
||||
this.setSelectedSource(newSource);
|
||||
}.bind(this));
|
||||
|
||||
// Since it's possible for the player to get a source before the selector is
|
||||
// created, make sure to update once we get a "ready" signal.
|
||||
player.one('ready', function() {
|
||||
|
@ -50,8 +55,12 @@ module.exports = function(videojs) {
|
|||
* @param source {object} player source to display as selected
|
||||
*/
|
||||
setSelectedSource: function(source) {
|
||||
this.selectedSrc = source ? source.src : undefined;
|
||||
this.update();
|
||||
var src = (source ? source.src : undefined);
|
||||
|
||||
if (this.selectedSrc !== src) {
|
||||
this.selectedSrc = src;
|
||||
this.update();
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue