enabled buttons in the navigation header (at least buttons on the left side of the bar), renamed stateMachine to navigation

7 files changed, 183 insertions, 35 deletions

diff --git a/js/codeq/language.js b/js/codeq/language.js
index 2864098..d4b6ee4 100644
--- a/js/codeq/language.js
+++ b/js/codeq/language.js
@@ -5,14 +5,31 @@
 (function(){
     codeq.globalStateMachine.register('language',{
         'enter': function(){
-            $("#screen_language").css('display', '');
             $('#submit_language').on('click',function(){
                 codeq.globalStateMachine.transition('problem',$('#language').val());
+                //var lan = $('#language').val();
+                //codeq.activateState('problem',{'lan':lan});
             });
+
+            $('#navigation-login').css('display', '');
+            /*$('#navigation-login').on('click', function(){
+               codeq.globalStateMachine.transition('login');
+               //codeq.activateState('login');
+            });*/
+            $("#navigation-language").addClass("active");
+            $('#navigation-language').css('display', '');
+
+            $("#screen_language").css('display', '');
         },
         'exit' : function(){
             $("#submit_language").off();
             $("#screen_language").css('display', 'none');
+
+            $('#navigation-login').css('display', 'none');
+            //$('#navigation-login').off();
+            $('#navigation-language').css('display', 'none');
+            $("#navigation-language").removeClass("active");
+
             $('#language').val("prolog");//reset to the default value
         }
     });
diff --git a/js/codeq/login.js b/js/codeq/login.js
index 11a4900..bb92325 100644
--- a/js/codeq/login.js
+++ b/js/codeq/login.js
@@ -15,24 +15,34 @@
                 $('#disabled').css('cursor', '');
                 if (data.code !== 0) throw new Error('Login failed, code: ' + data.code + ', message: ' + data.message);
                 codeq.globalStateMachine.transition('language');
+                //codeq.activateState('language');
             })
             .fail(function (reason) {
                 $('#disabled').css('display', 'none');
                 $('#disabled').css('cursor', '');
                 codeq.log.error('Login failed: ' + reason, reason);
                 alert('Login request failed: ' + reason);
+                $('#disabled').css('display', 'none');
             })
             .done();
     };
     codeq.globalStateMachine.register('login',{
         'enter': function(){
             $("#submit").on('click', loginFun);
+
+            $("#navigation-login").addClass("active");
+            $('#navigation-login').css('display', '');
+
             $("#screen_login").css('display', '');
             $('#disabled').css('display', 'none');
         },
         'exit' : function(){
             $("#submit").off('click', loginFun);
             $("#screen_login").css('display', 'none');
+            $("#password").val('');
+
+            $('#navigation-login').css('display', 'none');
+            $("#navigation-login").removeClass("active");
         }
     });
 })();
\ No newline at end of file
diff --git a/js/codeq/navigation.js b/js/codeq/navigation.js
new file mode 100644
index 0000000..4445a3d
--- /dev/null
+++ b/js/codeq/navigation.js
@@ -0,0 +1,104 @@
+/**
+ * Created by robert on 9/15/15.
+ */
+(function() {
+    codeq.makeStateMachine = function (def) {
+        var currState = null;
+        return {
+            'transition': function (name) {
+                var newState = def[name];
+                if (!newState) {
+                    codeq.log.error('Cannot transition to state ' + name + ': it is not defined');
+                    return;
+                }
+                if (newState === currState) {
+                    codeq.log.info('Will not transition between identical states: ' + name);
+                    return;
+                }
+                if (currState !== null) currState.exit();
+                currState = newState;
+                currState.enter.apply(currState, Array.prototype.slice.apply(arguments, [1]));
+            },
+            'destroy': function () {
+                if (currState !== null) currState.exit();
+                currState = null;
+            },
+            'register': function (name, state) {
+                if (name in def) codeq.log.error('The state ' + name + ' is already registered, overriding');
+                def[name] = state;
+            }
+        }
+    };
+
+
+    //the global state machine is a bit different - so it'll be implemented here
+    var makeGlobalStateMachine = function (def) {
+        var currState = null;
+        var stateChangeFun = function historyStateChangeHandler() {
+            var historyState = History.getState();
+            codeq.globalStateMachine.actualTransition.apply(codeq.globalStateMachine, $.merge([historyState.data.state] ,historyState.data.params));
+        };
+        History.Adapter.bind(window, 'statechange', stateChangeFun);
+        //prepare the history state change listener
+        return {
+            'transition': function (name) {
+                var newState = def[name];
+                if (!newState) {
+                    codeq.log.error('Cannot transition to state ' + name + ': it is not defined');
+                    return;
+                }
+                if (newState === currState) {
+                    codeq.log.info('Will not transition between identical states: ' + name);
+                    return;
+                }
+
+                if(History.getState().data.state === name) codeq.globalStateMachine.actualTransition.apply(codeq.globalStateMachine,Array.prototype.slice.apply(arguments, [0]));//special case which happens if the user refreshes while in the login screen (history state doesn't change because it goes from login to login and the above listener doesn't trigger)
+                try {
+                    History.pushState({'state': name, 'params': Array.prototype.slice.apply(arguments, [1])}, null, '?s=' + name);
+                }
+                catch (e) {
+                    codeq.log.error('init: History.pushState() failed for new state ' + name+'. Error:'+e);
+                }
+            },
+            'destroy': function () {
+                if (currState !== null) currState.exit();
+                currState = null;
+                History.Adapter.unbind(window, 'statechange', stateChangeFun);
+            },
+            'register': function (name, state) {
+                if (name in def) codeq.log.error('The state ' + name + ' is already registered, overriding');
+                def[name] = state;
+            },
+            'actualTransition': function (name) {
+                var newState = def[name];//if the newState is not the same as the old or if it doesn't exist at all is already checked at this point
+                if (currState) currState.exit();
+                currState = newState;
+                currState.enter.apply(currState, Array.prototype.slice.apply(arguments, [1]));
+            }
+        }
+    };
+    codeq.globalStateMachine = makeGlobalStateMachine({});
+
+
+    //setup all the buttons in the banner
+    $('#navigation-login').on('click', function(e){
+        codeq.globalStateMachine.transition('login');
+        e.preventDefault();//prevent this since we'll trigger a page reload otherwise
+    });
+    $('#navigation-language').on('click', function(e){
+        codeq.globalStateMachine.transition('language');
+        e.preventDefault();
+    });
+    $('#navigation-problem').on('click', function(e){
+        codeq.globalStateMachine.transition('problem');
+        e.preventDefault();
+    });
+    $('#navigation-python').on('click', function(e){
+        codeq.globalStateMachine.transition('python');
+        e.preventDefault();
+    });
+    $('#navigation-prolog').on('click', function(e){
+        codeq.globalStateMachine.transition('prolog');
+        e.preventDefault();
+    });
+})();
\ No newline at end of file
diff --git a/js/codeq/problem.js b/js/codeq/problem.js
index 6debf6d..f19cbd4 100644
--- a/js/codeq/problem.js
+++ b/js/codeq/problem.js
@@ -7,10 +7,26 @@
  */
 
 (function(){
+    var lastLanguage;
     codeq.globalStateMachine.register('problem',{
         'enter': function(language){
+            if(language)lastLanguage = language;
+            else language = lastLanguage;//This happens when we hit this with the back button
+
             $('#disabled').css('display', '');
             $('#disabled').css('cursor', 'wait');
+
+            $('#navigation-login').css('display', '');
+            /*$('#navigation-login').on('click', function(){
+                codeq.globalStateMachine.transition('login');
+            });*/
+            $('#navigation-language').css('display', '');
+            /*$('#navigation-language').on('click', function(){
+                codeq.globalStateMachine.transition('language');
+            });*/
+            $("#navigation-problem").addClass("active");
+            $('#navigation-problem').css('display', '');
+
             codeq.comms.send({'action': 'list_problems', 'language':language})
                 .then(
                 function success(data) {
@@ -99,6 +115,13 @@
             $("#problem_group option").remove();//empty the selects
             $("#problems option").remove();
             $("#screen_problem").css('display', 'none');
+
+            $('#navigation-login').css('display', 'none');
+            //$('#navigation-login').off();
+            $('#navigation-language').css('display', 'none');
+            //$('#navigation-language').off();
+            $('#navigation-problem').css('display', 'none');
+            $("#navigation-problem").removeClass("active");
         }
     });
 })();
\ No newline at end of file
diff --git a/js/codeq/prolog.js b/js/codeq/prolog.js
index e339fea..d01cc54 100644
--- a/js/codeq/prolog.js
+++ b/js/codeq/prolog.js
@@ -67,6 +67,12 @@
     var prologHandler; //created when we enter the prolog state and destroyed once we leave it
     codeq.globalStateMachine.register('prolog', {
         'enter': function (data) {
+            $('#navigation-login').css('display', '');
+            $('#navigation-language').css('display', '');
+            $('#navigation-problem').css('display', '');
+            $("#navigation-prolog").addClass("active");
+            $('#navigation-prolog').css('display', '');
+
             jqScreen.css('display', '');//we have to show the screen now so the code editor shows its initial values correctly
             prologHandler = createPrologHandler(data.data);
             subScreens = codeq.makeStateMachine(substates);
@@ -91,7 +97,13 @@
             prologHandler = null;
             subScreens.destroy();
             subScreens = null;
-            jqScreen.addClass('.block1');
+            jqScreen.addClass('block1');
+
+            $('#navigation-login').css('display', 'none');
+            $('#navigation-language').css('display', 'none');
+            $('#navigation-problem').css('display', 'none');
+            $("#navigation-prolog").removeClass("active");
+            $('#navigation-prolog').css('display', 'none');
         }
     });
 
@@ -327,6 +339,7 @@
 
         return {
             destroy: function () {
+                $('#title').text('');//empty the title text
                 jqAllButtons.off();
                 editor.off('change');
                 hinter.destroy();
diff --git a/js/codeq/python.js b/js/codeq/python.js
index e5b59c2..66f0371 100644
--- a/js/codeq/python.js
+++ b/js/codeq/python.js
@@ -69,6 +69,12 @@
     var pythonHandler; //created when we enter the python state and destroyed once we leave it
     codeq.globalStateMachine.register('python', {
         'enter': function (data) {
+            $('#navigation-login').css('display', '');
+            $('#navigation-language').css('display', '');
+            $('#navigation-problem').css('display', '');
+            $("#navigation-python").addClass("active");
+            $('#navigation-python').css('display', '');
+
             jqScreen.css('display', '');//we have to show the screen now so the code editor shows its initial values correctly
             pythonHandler = createPythonHandler(data.data);
             subScreens = codeq.makeStateMachine(substates);
@@ -93,7 +99,13 @@
             pythonHandler = null;
             subScreens.destroy();
             subScreens = null;
-            jqScreen.addClass('.block1');
+            jqScreen.addClass('block1');
+
+            $('#navigation-login').css('display', 'none');
+            $('#navigation-language').css('display', 'none');
+            $('#navigation-problem').css('display', 'none');
+            $("#navigation-python").removeClass("active");
+            $('#navigation-python').css('display', 'none');
         }
     });
 
@@ -268,6 +280,7 @@
 
         return {
             destroy: function () {
+                $('#title').text('');//empty the title text
                 jqAllButtons.off();
                 editor.off('change');
                 codeq.comms.off('terminal_output'); // stop listening for the terminal events from server
diff --git a/js/codeq/stateMachine.js b/js/codeq/stateMachine.js
deleted file mode 100644
index dff89d5..0000000
--- a/js/codeq/stateMachine.js
+++ /dev/null
@@ -1,32 +0,0 @@
-/**
- * Created by robert on 9/15/15.
- */
-
-codeq.makeStateMachine = function(def){
-    var currState = null;
-    return {
-        'transition': function(name){
-            var newState = def[name];
-            if (!newState) {
-                codeq.log.error('Cannot transition to state ' + name + ': it is not defined');
-                return;
-            }
-            if (newState === currState) {
-                codeq.log.info('Will not transition between identical states: ' + name);
-                return;
-            }
-            if(currState !== null) currState.exit();
-            currState = newState;
-            currState.enter.apply(currState,Array.prototype.slice.apply(arguments,[1]));
-        },
-        'destroy': function(){
-            if(currState !== null) currState.exit();
-            currState = null;
-        },
-        'register': function(name,state){
-            if (name in def) codeq.log.error('The state ' + name + ' is already registered, overriding');
-            def[name] = state;
-        }
-    }
-};
-codeq.globalStateMachine = codeq.makeStateMachine({});
\ No newline at end of file