Merge pull request #6694 from edx/shr/bug/TNL-1202-HD-button-not-working-properly

Hd button on for default high resolutions

common/lib/xmodule/xmodule/js/spec/video/video_quality_control_spec.js

@@ -92,6 +92,19 @@
                 qualityControl.el.click();
                 expect(player.setPlaybackQuality).toHaveBeenCalledWith('large');
             });
+
+            it('quality control is active if HD is available',
+                function () {
+                 player.getAvailableQualityLevels.andReturn(
+                     ['highres', 'hd1080', 'hd720']
+                 );
+
+                 qualityControl.quality = 'highres';
+
+                 videoPlayer.onPlay();
+                 expect(qualityControl.el).toHaveClass('active');
+            });
+
         });
 
         describe('constructor, HTML5 mode', function () {

common/lib/xmodule/xmodule/js/src/video/05_video_quality_control.js

@@ -103,6 +103,7 @@ function () {
         // HD qualities are available, show video quality control.
         if (this.config.availableHDQualities.length > 0) {
             this.trigger('videoQualityControl.showQualityControl');
+            this.trigger('videoQualityControl.onQualityChange', this.videoQualityControl.quality);
         }
         // On initialization, force the video quality to be 'large' instead of
         // 'default'. Otherwise, the player will sometimes switch to HD
@@ -115,7 +116,6 @@ function () {
     function onQualityChange(value) {
         var controlStateStr;
         this.videoQualityControl.quality = value;
-
         if (_.contains(this.config.availableHDQualities, value)) {
             controlStateStr = gettext('HD on');
             this.videoQualityControl.el
@@ -141,6 +141,7 @@ function () {
         event.preventDefault();
 
         newQuality = isHD ? 'large' : 'highres';
+        
         this.trigger('videoPlayer.handlePlaybackQualityChange', newQuality);
     }