final accessibility for Timeslider hopefully

2 files changed, 57 insertions, 38 deletions

diff --git a/src/static/js/broadcast_slider.js b/src/static/js/broadcast_slider.js
index a1418140..eff20b52 100644
--- a/src/static/js/broadcast_slider.js
+++ b/src/static/js/broadcast_slider.js
@@ -290,6 +290,11 @@ function loadBroadcastSliderJS(fireWhenAllScriptsAreLoaded)
       
       $(document).keyup(function(e)
       {
+        // If focus is on editbar, don't do anything
+        var target = $(':focus');
+        if($(target).parents(".toolbar").length === 1){
+            return;
+        }
         var code = -1;
         if (!e) var e = window.event;
         if (e.keyCode) code = e.keyCode;
diff --git a/src/static/js/pad_editbar.js b/src/static/js/pad_editbar.js
index e426824e..e418969e 100644
--- a/src/static/js/pad_editbar.js
+++ b/src/static/js/pad_editbar.js
@@ -312,47 +312,61 @@ var padeditbar = (function()
     // If the event is Alt F9 or Escape & we're already in the editbar menu
     // Send the users focus back to the pad
     if((evt.keyCode === 120 && evt.altKey) || evt.keyCode === 27){
-      // If we're in the editbar already..
-      // Close any dropdowns we have open..
-      padeditbar.toggleDropDown("none");
-
-      // Check we're on a pad and not on the timeslider
-      // Or some other window I haven't thought about!
-      if(typeof pad === 'undefined') return false;
-
-      // Shift focus away from any drop downs
-      $(':focus').blur(); // required to do not try to remove!
-      padeditor.ace.focus(); // Sends focus back to pad
-      // The above focus doesn't always work in FF, you have to hit enter afterwards
-      evt.preventDefault();
-    }
-
-    // On arrow keys go to next/previous button item in editbar
-    if(evt.keyCode !== 39 && evt.keyCode !== 37) return;
-
-    // Get all the focusable items in the editbar
-    var focusItems = $('#editbar').find('button, select');
-
-    // On left arrow move to next button in editbar
-    if(evt.keyCode === 37){
-      // If a dropdown is visible or we're in an input don't move to the next button
-      if($('.popup').is(":visible") || evt.target.localName === "input") return;
-
-      editbarPosition--;
-      // Allow focus to shift back to end of row and start of row
-      if(editbarPosition === -1) editbarPosition = focusItems.length -1;
-      $(focusItems[editbarPosition]).focus()
+      if($(':focus').parents(".toolbar").length === 1){
+        // If we're in the editbar already..
+        // Close any dropdowns we have open..
+        padeditbar.toggleDropDown("none");
+        // Check we're on a pad and not on the timeslider
+        // Or some other window I haven't thought about!
+        if(typeof pad === 'undefined'){
+          // Timeslider probably..
+          // Shift focus away from any drop downs
+          $(':focus').blur(); // required to do not try to remove!
+          $('#padmain').focus(); // Focus back onto the pad
+        }else{
+          // Shift focus away from any drop downs
+          $(':focus').blur(); // required to do not try to remove!
+          padeditor.ace.focus(); // Sends focus back to pad
+          // The above focus doesn't always work in FF, you have to hit enter afterwards
+          evt.preventDefault();
+        }
+      }else{
+        // Focus on the editbar :)
+        var firstEditbarElement = parent.parent.$('#editbar').children("ul").first().children().first().children().first().children().first();
+        $(this).blur();
+        firstEditbarElement.focus();
+        evt.preventDefault();
+      }
     }
+    // Are we in the toolbar??
+    if($(':focus').parents(".toolbar").length === 1){
+      // On arrow keys go to next/previous button item in editbar
+      if(evt.keyCode !== 39 && evt.keyCode !== 37) return;
+
+      // Get all the focusable items in the editbar
+      var focusItems = $('#editbar').find('button, select');
+
+      // On left arrow move to next button in editbar
+      if(evt.keyCode === 37){
+        // If a dropdown is visible or we're in an input don't move to the next button
+        if($('.popup').is(":visible") || evt.target.localName === "input") return;
+
+        editbarPosition--;
+        // Allow focus to shift back to end of row and start of row
+        if(editbarPosition === -1) editbarPosition = focusItems.length -1;
+        $(focusItems[editbarPosition]).focus()
+      }
 
-    // On right arrow move to next button in editbar
-    if(evt.keyCode === 39){
-      // If a dropdown is visible or we're in an input don't move to the next button
-      if($('.popup').is(":visible") || evt.target.localName === "input") return;
+      // On right arrow move to next button in editbar
+      if(evt.keyCode === 39){
+        // If a dropdown is visible or we're in an input don't move to the next button
+        if($('.popup').is(":visible") || evt.target.localName === "input") return;
 
-      editbarPosition++;
-      // Allow focus to shift back to end of row and start of row
-      if(editbarPosition >= focusItems.length) editbarPosition = 0;
-      $(focusItems[editbarPosition]).focus();
+        editbarPosition++;
+        // Allow focus to shift back to end of row and start of row
+        if(editbarPosition >= focusItems.length) editbarPosition = 0;
+        $(focusItems[editbarPosition]).focus();
+      }
     }
 
   }