Fixed tabbing backwards.

Now you can tab through all of the controls in Video forwards, and then tab backwards.

common/lib/xmodule/xmodule/js/src/video/07_video_volume_control.js

@@ -77,20 +77,25 @@ function () {
             $(this).addClass('open');
         });
 
-        state.videoVolumeControl.buttonEl.on('focus', function() {
-            $(this).parent().addClass('open');
-        });
-
         state.videoVolumeControl.el.on('mouseleave', function() {
             $(this).removeClass('open');
         });
 
         state.videoVolumeControl.buttonEl.on('blur', function() {
+            if (state.volumeBlur !== true) {
+                state.videoVolumeControl.el.addClass('open');
                 state.videoVolumeControl.volumeSliderEl.find('a').focus();
+            } else {
+                state.volumeBlur = false;
+            }
         });
 
         state.videoVolumeControl.volumeSliderEl.find('a').on('blur', function () {
             state.videoVolumeControl.el.removeClass('open');
+
+            state.videoVolumeControl.buttonEl.focus();
+
+            state.volumeBlur = true;
         });
     }
 

common/lib/xmodule/xmodule/js/src/video/08_video_speed_control.js

@@ -58,6 +58,8 @@ function () {
                 );
         });
 
+        state.videoSpeedControl.videoSpeedsEl.find('a:first').addClass('first_speed_el');
+
         state.videoSpeedControl.setSpeed(state.speed);
     }
 
@@ -89,7 +91,13 @@ function () {
 
             state.videoSpeedControl.el.children('a')
                 .on('focus', function () {
+                    if (state.firstSpeedBlur === true) {
+                        $(this).parent().removeClass('open');
+
+                        state.firstSpeedBlur = false;
+                    } else {
                         $(this).parent().addClass('open');
+                    }
                 })
                 .on('blur', function () {
                     state.videoSpeedControl.videoSpeedsEl
@@ -101,6 +109,16 @@ function () {
                 .on('blur', function () {
                     state.videoSpeedControl.el.removeClass('open');
                 });
+
+            state.videoSpeedControl.videoSpeedsEl.find('a.speed_link:first')
+                .on('blur', function () {
+                    state.firstSpeedBlur = true;
+                });
+
+            state.videoSpeedControl.videoSpeedsEl.find('a.speed_link')
+                .on('focus', function () {
+                    state.firstSpeedBlur = false;
+                });
         }
     }
 
@@ -162,6 +180,10 @@ function () {
             _this.videoSpeedControl.videoSpeedsEl.prepend(listItem);
         });
 
+        this.videoSpeedControl.videoSpeedsEl
+            .find('a:first')
+            .addClass('first_speed_el');
+
         _bindHandlers(this);
     }