diff --git a/lib/videojs-resolution-switcher.js b/lib/videojs-resolution-switcher.js index c0b3c0b..0615ab1 100644 --- a/lib/videojs-resolution-switcher.js +++ b/lib/videojs-resolution-switcher.js @@ -15,13 +15,13 @@ } (function(window, videojs) { - - + + var defaults = {}, videoJsResolutionSwitcher, currentResolution = {}, // stores current resolution - menuItemsHolder = {}; // stores menuItems - + menuItemsHolder = {}; // stores menuItems + function setSourcesSanitized(player, sources, label, customSourcePicker) { currentResolution = { label: label, @@ -34,7 +34,7 @@ return {src: src.src, type: src.type, res: src.res}; })); } - + /* * Resolution menu item */ @@ -71,6 +71,10 @@ if(!isPaused){ this.player_.bigPlayButton.hide(); } + if(typeof customSourcePicker !== 'function' && + typeof this.options_.customSourcePicker === 'function'){ + customSourcePicker = this.options_.customSourcePicker; + } // Change player source and wait for loadeddata event, then play video // loadedmetadata doesn't work right now for flash. // Probably because of https://github.com/videojs/video-js-swf/issues/124 @@ -90,8 +94,8 @@ }); } }); - - + + /* * Resolution menu button */ @@ -102,9 +106,9 @@ this.label = label; this.label.innerHTML = options.initialySelectedLabel; // Sets this.player_, this.options_ and initializes the component - MenuButton.call(this, player, options); + MenuButton.call(this, player, options, settings); this.controlText('Quality'); - + if(settings.dynamicLabel){ this.el().appendChild(label); }else{ @@ -121,7 +125,7 @@ item.selected(item === clickedItem); }); }; - + for (var key in labels) { if (labels.hasOwnProperty(key)) { menuItems.push(new ResolutionMenuItem( @@ -129,7 +133,8 @@ { label: key, src: labels[key], - initialySelected: key === this.options_.initialySelectedLabel + initialySelected: key === this.options_.initialySelectedLabel, + customSourcePicker: this.options_.customSourcePicker }, onClickUnselectOthers, this.label)); @@ -140,7 +145,7 @@ return menuItems; } }); - + /** * Initialize the plugin. * @param {object} [options] configuration for the plugin @@ -148,10 +153,11 @@ videoJsResolutionSwitcher = function(options) { var settings = videojs.mergeOptions(defaults, options), player = this, - label = document.createElement('span'); - + label = document.createElement('span'), + groupedSrc = {}; + label.classList.add('vjs-resolution-button-label'); - + /** * Updates player sources or returns current source URL * @param {Array} [src] array of sources [{src: '', type: '', label: '', res: ''}] @@ -167,14 +173,14 @@ } //Sort sources src = src.sort(compareResolutions); - var groupedSrc = bucketSources(src); + groupedSrc = bucketSources(src); var choosen = chooseSrc(groupedSrc, src); - var menuButton = new ResolutionMenuButton(player, { sources: groupedSrc, initialySelectedLabel: choosen.label , initialySelectedRes: choosen.res }, settings, label); + var menuButton = new ResolutionMenuButton(player, { sources: groupedSrc, initialySelectedLabel: choosen.label , initialySelectedRes: choosen.res , customSourcePicker: settings.customSourcePicker}, settings, label); menuButton.el().classList.add('vjs-resolution-button'); player.controlBar.resolutionSwitcher = player.controlBar.addChild(menuButton); return setSourcesSanitized(player, choosen.sources, choosen.label); }; - + /** * Returns current resolution or sets one when label is specified * @param {String} [label] label name @@ -188,7 +194,11 @@ } return player; }; - + + player.getGroupedSrc = function(){ + return groupedSrc; + } + /** * Method used for sorting list of sources * @param {Object} a - source object with res property @@ -199,7 +209,7 @@ if(!a.res || !b.res){ return 0; } return (+b.res)-(+a.res); } - + /** * Group sources by label, resolution and type * @param {Array} src Array of sources @@ -215,24 +225,24 @@ initResolutionKey(resolutions, 'label', source); initResolutionKey(resolutions, 'res', source); initResolutionKey(resolutions, 'type', source); - + appendSourceToKey(resolutions, 'label', source); appendSourceToKey(resolutions, 'res', source); appendSourceToKey(resolutions, 'type', source); }); return resolutions; } - + function initResolutionKey(resolutions, key, source) { if(resolutions[key][source[key]] == null) { resolutions[key][source[key]] = []; } } - + function appendSourceToKey(resolutions, key, source) { resolutions[key][source[key]].push(source); } - + /** * Choose src if option.default is specified * @param {Object} groupedSrc {res: { key: [] }} @@ -252,13 +262,13 @@ } else if (groupedSrc.res[selectedRes]) { selectedLabel = groupedSrc.res[selectedRes][0].label; } - + if(selectedRes === undefined){ return {res: selectedRes, label: selectedLabel, sources: groupedSrc.label[selectedLabel]}; } return {res: selectedRes, label: selectedLabel, sources: groupedSrc.res[selectedRes]}; } - + // Create resolution switcher for videos form tag inside