dynamic label

lib/videojs-resolution-switcher.js

@@ -14,7 +14,10 @@
    */
   videoJsResolutionSwitcher = function(options) {
     var settings = videojs.mergeOptions(defaults, options),
-        player = this;
+        player = this,
+        label = document.createElement('span');
+
+    label.classList.add('vjs-resolution-button-label')
 
     /*
      * Resolution menu item
@@ -31,11 +34,17 @@
         this.on('touchstart', this.onClick)
       },
       onClick: function(){
+        console.log(this.el().parentNode.children)
+        this.el().parentNode.children.forEach(function(el){
+          el.classList.remove('vjs-selected')
+        })
         // Hide bigPlayButton
         player.bigPlayButton.hide()
         // Remember player state
         var currentTime = player.currentTime()
         var isPaused = player.paused()
+        // Change menu button label
+        label.innerHTML = this.options_.label;
         // Change player source and wait for loadedmetadata event, then play video
         player.src({src: this.src, type: this.type}).one( 'loadedmetadata', function() {
           player.currentTime(currentTime)
@@ -54,7 +63,15 @@
       constructor: function(player, options){
         this.sources = options.sources;
         MenuButton.call(this, player, options);
-        this.controlText('Quality')
+        this.controlText('Quality');
+
+        if(settings.dynamicLabel){
+          this.el().appendChild(label)
+        }else{
+          var staticLabel = document.createElement('span')
+          staticLabel.classList.add('vjs-resolution-button-staticlabel')
+          this.el().appendChild(staticLabel)
+        }
       },
       createItems: function(){
         var sources = this.sources;
@@ -79,13 +96,15 @@
         player.controlBar.resolutionSwitcher.dispose()
         delete player.controlBar.resolutionSwitcher
       }
-      //Sort sourcec
+      //Sort sources
       src = src.sort(compareResolutions)
       groupedSrc = bucketSources(src)
       var menuButton = new ResolutionMenuButton(player, { sources: src });
       menuButton.el().classList.add('vjs-resolution-button')
       player.controlBar.resolutionSwitcher = player.controlBar.addChild(menuButton)
-      player.src(chooseSrc(src));
+      var newSource = chooseSrc(src)
+      label.innerHTML = newSource.label
+      player.src(newSource);
     }
 
     /**
@@ -130,11 +149,12 @@
       if(settings.default === 'low'){ return src[src.length - 1] }
       if(settings.default === 'high'){ return src[0] }
       if(groupedSrc.res[settings.default]){ return groupedSrc.res[settings.default][0] }
-      return src
+      return src[src.length - 1]
     }
 
     // Create resolution switcher for videos form <source> tag inside <video>
     if(player.options_.sources.length > 1){
+      console.log(player.options_.sources)
       player.updateSrc(player.options_.sources)
     }