focus management and js syntax fix

lms/templates/forgot_password_modal.html

@@ -2,7 +2,7 @@
 <%! from microsite_configuration import microsite %>
 
 <%! from django.core.urlresolvers import reverse %>
-<section id="forgot-password-modal" class="modal" role="dialog" aria-label="${_('Password Reset')}">
+<section id="forgot-password-modal" class="modal" role="dialog" tabindex="-1" aria-label="${_('Password Reset')}">
   <div class="inner-wrapper">
     <button class="close-modal">&#10005;
       <span class="sr">
@@ -63,6 +63,7 @@
       $("#forgot-password-modal").attr("aria-hidden", "true");
       $("#forgot-password-link").focus();
     };
+    
     var cycle_modal_tab = function(from_element_name, to_element_name) {
       $(from_element_name).on('keydown', function(e) {
           var keyCode = e.keyCode || e.which;
@@ -74,10 +75,9 @@
       });
     };
     $("#forgot-password-modal .close-modal").click(onModalClose);
-    $("#forgot-password-modal").focus()
-    cycle_modal_tab("#forgot-password-modal .close-modal", "#pwd_reset_email")
-    cycle_modal_tab("#pwd_reset_email", "#pwd_reset_button")
-    cycle_modal_tab("#pwd_reset_button", "#forgot-password-modal .close-modal")
+    cycle_modal_tab("#forgot-password-modal .close-modal", "#pwd_reset_email");
+    cycle_modal_tab("#pwd_reset_email", "#pwd_reset_button");
+    cycle_modal_tab("#pwd_reset_button", "#forgot-password-modal .close-modal");
 
     // Hitting the ESC key will exit the modal
     $("#forgot-password-modal").on("keydown", function(e) {

lms/templates/login.html

@@ -71,8 +71,9 @@
         }
       });
       $("#forgot-password-link").click(function() {
-        $("#forgot-password-modal .close-modal").focus()
-      })
+        $("#forgot-password-modal").show();
+        $("#forgot-password-modal .close-modal").focus();
+      });
 
     })(this);
 
@@ -137,7 +138,7 @@
             <label for="password">${_('Password')}</label>
             <input id="password" type="password" name="password" value="" required aria-required="true" />
             <span class="tip tip-input">
-              <a href="#forgot-password-modal" rel="leanModal" class="pwd-reset action action-forgotpw" id="forgot-password-link" tabindex="-1" role="button" aria-haspopup="true">${_('Forgot password?')}</a>
+              <a href="#forgot-password-modal" rel="leanModal" class="pwd-reset action action-forgotpw" id="forgot-password-link" role="button" aria-haspopup="true">${_('Forgot password?')}</a>
             </span>
           </li>
         </ol>