AAI login is moved to its own screen and js file

4 files changed, 76 insertions, 15 deletions

diff --git a/index.html b/index.html
index ae7ff38..31e6540 100644
--- a/index.html
+++ b/index.html
@@ -100,7 +100,7 @@
                             <div class="col-md-12">
                                 <span data-tkey="signin_via">Login via</span>
                                 <div class="ssa-buttons">
-                                    <a href="#" class="ssa-buttons" role="button" data-dismiss="modal" data-toggle="modal" data-target="#modalAAI">
+                                    <a href="" class="ssa-buttons" role="button" data-dismiss="modal" data-toggle="modal" data-target="#modalAAI" id="aai_login_button">
                                         <img src="res/gumb_aaiprijava.png" style="width: 49%">
                                     </a>
                                 </div>
@@ -139,6 +139,21 @@
             </div>
         </div>
 
+        <!-- AAI login -->
+        <div class="container" id="screen_aai_login" style="display: none;">
+            <div class="container">
+                <div class="row">
+                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true" data-toggle="modal" data-target="#modalLogIn" id="cancel_aai_login">×</button>
+                    <h3 class="text-center">Arnes AAI</h3>
+                </div>
+            </div>
+            <div class="container">
+                <div class="row" style="padding: 0; padding-top: 5px;">
+                    <iframe width="100%" height="850px"  frameborder="0" scrolling="no" allowtransparency="true" src="https://codeq.si/Shibboleth.sso/Login?forceAuthn=1"></iframe>
+                </div>
+            </div>
+        </div>
+
         <!--Sign up screen-->
         <div class="container" id="screen_signup" style="display: none;">
             <div class="modal-dialog modal-sm">
@@ -381,7 +396,7 @@
         </div><!--container-->
 
         <!-- Modals -->
-        <div id="modalAAI" class="modal fade in" tabindex="-1" role="dialog" aria-hidden="false" data-keyboard="false" data-backdrop="static" style="display: none;">
+        <!--div id="modalAAI" class="modal fade in" tabindex="-1" role="dialog" aria-hidden="false" data-keyboard="false" data-backdrop="static" style="display: none;">
             <div class="modal-dialog">
                 <div class="modal-content">
                     <div class="modal-header">
@@ -391,9 +406,9 @@
                     <div class="modal-body" style="padding: 0;">
                         <iframe width="100%" height="500px" frameborder="0" scrolling="no" allowtransparency="true" src="https://codeq.si/Shibboleth.sso/Login?forceAuthn=1"></iframe>
                     </div>
-                </div><!-- /.modal-content -->
-            </div><!-- /.modal-dialog -->
-        </div><!-- /.modal -->
+                </div>
+            </div>
+        </div-->
 
         <!-- Covers the whole screen with a semi-transparent block, so no input events can be triggered below.
              Used as a wait screen; must be the last element in the DOM.
@@ -431,6 +446,7 @@
         <script src="js/codeq/robot.js"></script>
         <script src="js/codeq/signup.js"></script>
         <script src="js/codeq/login.js"></script>
+        <script src="js/codeq/aaiLogin.js"></script>
         <script src="js/codeq/change_password.js"></script>
         <script src="js/codeq/profile.js"></script>
         <script src="js/codeq/language.js"></script>
diff --git a/js/codeq/aaiLogin.js b/js/codeq/aaiLogin.js
new file mode 100644
index 0000000..e6e36ab
--- /dev/null
+++ b/js/codeq/aaiLogin.js
@@ -0,0 +1,37 @@
+/**
+ * Created by robert on 10/14/15.
+ */
+(function(){
+
+    var jqNavBarRight = $('.nav.navbar-nav.navbar-right'),
+        jqNavigationHomeBtn = $('#navigation-home'),
+        jqCancelAaiLogin = $("#cancel_aai_login");
+
+    codeq.globalStateMachine.register('aailogin',{
+        'enter': function(){
+            jqNavigationHomeBtn.off('click');//remove the click listener of this element here
+            jqNavBarRight.css('display','none');//hide settings etc.
+
+            jqCancelAaiLogin.on('click',function(){
+                codeq.globalStateMachine.transition('login');
+            });
+
+            $('#signed-in-title').html('');
+            $('#screen_aai_login').css('display','');
+        },
+        'exit' : function(){
+            //disable site specific listeners
+            jqCancelAaiLogin.off('click');
+
+            $("#screen_aai_login").css('display', 'none');
+            //re-enable the click listener
+            jqNavigationHomeBtn.on('click', function(e){
+                codeq.globalStateMachine.transition('language');
+                e.preventDefault();
+            });
+            //show the menu buttons
+            jqNavBarRight.css('display','');
+        }
+    });
+
+})();
diff --git a/js/codeq/login.js b/js/codeq/login.js
index 29dd87b..961b708 100644
--- a/js/codeq/login.js
+++ b/js/codeq/login.js
@@ -4,7 +4,10 @@
 
 (function(){
     var jqNavBarRight = $('.nav.navbar-nav.navbar-right'),
-        jqNavigationHomeBtn = $('#navigation-home');
+        jqNavigationHomeBtn = $('#navigation-home'),
+        jqAAILoginBtn = $('#aai_login_button'),
+        jqSignupBtn = $('#signup_button'),
+        jqSubmitLoginBtn = $("#submit");
 
     var loginFun = function(){
             $('#disabled').css('display', '');
@@ -56,15 +59,20 @@
             $('#signed-in-title').html('');
 
             //setup the signup button
-            $('#signup_button').on('click', function(e){
+            jqSignupBtn.on('click', function(e){
                 codeq.globalStateMachine.transition('signup');
                 e.preventDefault();
             });
+            //setup the AAI login btn
+            jqAAILoginBtn.on('click',function(e){
+                codeq.globalStateMachine.transition('aailogin');
+                e.preventDefault();
+            });
 
-            $("#submit").on('click', loginFun);
+            jqSubmitLoginBtn.on('click', loginFun);
             formInputs.on('keyup', function (ev) {
                 if ((ev.keyCode || ev.which) == 13) {
-                    $('#submit').trigger('click');
+                    jqSubmitLoginBtn.trigger('click');
                 }
             });
             //$('#modalLogIn').modal();
@@ -72,9 +80,12 @@
             $('#disabled').css('display', 'none');
         },
         'exit' : function(){
-            $("#submit").off('click', loginFun);
+            //remove the listener from the buttons specific to this page
+            jqSubmitLoginBtn.off('click', loginFun);
             formInputs.off('keyup');
-            //$('#modalLogIn').modal('hide');
+            jqSignupBtn.off('click');
+            jqAAILoginBtn.off('click');
+
             $("#screen_login").css('display', 'none');
             $('#signed-in-title').html($('#username').val());
             $("#password").val('');
@@ -84,9 +95,6 @@
                 e.preventDefault();
             });
             jqNavBarRight.css('display','');
-
-            //remove the listener from the signup button
-            $('#signup_button').off('click');
         }
     });
 })();
diff --git a/js/codeq/navigation.js b/js/codeq/navigation.js
index 9b7a8f7..5dbbf1e 100644
--- a/js/codeq/navigation.js
+++ b/js/codeq/navigation.js
@@ -71,7 +71,7 @@
             },
             'actualTransition': function (name) {
                 //check if we are logged in - if we aren't we will always transition to the login state
-                if(!codeq.comms.getSid() && name !== "signup"){//we can of course enter the signup state even if not logged in
+                if(!codeq.comms.getSid() && name !== "signup" && name !== "aailogin"){//we can of course enter the signup/aailogin state even if not logged in
                     name = 'login';//this will cause the following code to transition to the login state instead of the original one given
                 }