Merge branch 'master' of ssh://212.235.189.51:22122/codeq-web

Conflicts:
	index.html

12 files changed, 161 insertions, 98 deletions

diff --git a/css/codeq.css b/css/codeq.css
index c4ab380..d457089 100644
--- a/css/codeq.css
+++ b/css/codeq.css
@@ -185,6 +185,16 @@ body {
     }
 
     /* code_editor */
+    #screen_prolog .block.block2 {
+        min-height: 100%; height: 100%;
+    }
+
+    /* console */
+    #screen_prolog .block.block3 {
+        min-height: 100%; height: 100%;
+    }
+
+    /* code_editor */
     #screen_python .block.block2 {
         min-height: 100%; height: 100%;
     }
@@ -207,6 +217,21 @@ body {
         min-height: 50%; height: 50%;
     }
 
+    .quadrants#screen_prolog > * > .block {
+        overflow: auto;
+        min-height: 100%; height: 100%;
+    }
+
+    /* code_editor */
+    #screen_prolog .block.block2 {
+        min-height: 50%; height: 50%;
+    }
+
+    /* console */
+    #screen_prolog .block.block3 {
+        min-height: 50%; height: 50%;
+    }
+
     .quadrants#screen_python > * > .block {
         overflow: auto;
         min-height: 100%; height: 100%;
@@ -243,6 +268,16 @@ body {
         border-right: 1px solid #ddd;
     }
 
+    #screen_prolog .block.block1 {
+        min-height: 50%; height: 50%;
+        border-right: 0;
+    }
+
+    /* hints */
+    #screen_prolog .block.block4 {
+        min-height: 50%; height: 50%;
+    }
+
     #screen_python .block.block1 {
         min-height: 50%; height: 50%;
         border-right: 0;
@@ -383,10 +418,6 @@ ul.dropdown-menu a {
     cursor: pointer;
 }
 
-.lang-selection ul.dropdown-menu {
-    min-width: 4em;
-}
-
 /* main screen */
 #screen_language a {
     cursor: pointer;
diff --git a/index.html b/index.html
index b78f190..5f73cf0 100644
--- a/index.html
+++ b/index.html
@@ -44,12 +44,6 @@
                     </ul>
                     <ul class="nav navbar-nav navbar-right">
                         <p class="navbar-text"><span data-tkey="signed_in_as">Signed in as </span><span id="signed-in-title">Janez</span></p>
-                        <!--<li class="dropdown lang-selection">
-                            <a href="#" class="dropdown-toggle" data-toggle="dropdown" aria-expanded="true">
-                                <span class="lang-choice"></span>
-                            </a>
-                            <ul class="dropdown-menu"></ul>
-                        </li>-->
                         <li class="dropdown">
                             <a href="#" class="dropdown-toggle" data-toggle="dropdown" aria-expanded="true">
                                 <span class="glyphicon glyphicon glyphicon-user"></span>
@@ -74,6 +68,11 @@
                                             <!--<option value="d">Dolgooooooooooooooooooooooooooooooooooooooooooooooo</option>-->
                                         </select>
                                     </div>
+                                    <div class="form-group">
+                                        <span class="small" data-tkey="robot_address">Robot’s address</span>
+                                        <a class="text-muted" data-container="body" data-toggle="popover" data-trigger="hover" data-placement="left" data-html="true" data-content="<span class='small'>Set the robot's IP address.</span>" data-original-title="" title=""><i class="glyphicon glyphicon-question-sign"></i></a><br>
+                                        <input type="text" class="form-control" id="robot_address_input" />
+                                    </div>
                                     <!--<div class="form-group">
                                         <span class="small" data-tkey="language">
                                             Language
@@ -128,7 +127,54 @@
                 </div>
             </form>
         </div-->
-
+<!--TODO -->
+        <!-- login screen -->
+        <div class="container" id="screen_login" style="display: none;">
+            <div class="modal-dialog modal-sm">
+                <!--div class="modal-content"-->
+                    <div class="row"><!--class="modal-header"-->
+                        <h3 class="text-center">Please sign in</h3>
+                    </div>
+                    <div class="row"><!--class="modal-body"-->
+                        <div class="row">
+                            <div class="col-md-12">
+                                Login via
+                                <div class="ssa-buttons">
+                                    <a href="#" class="ssa-buttons" role="button" data-dismiss="modal" data-toggle="modal" data-target="#modalAAI">
+                                        <img src="res/gumb_aaiprijava.png" style="width: 49%">
+                                    </a>
+                                </div>
+                                or
+                                <form class="form" role="form" method="post" action="login" accept-charset="UTF-8" id="login-nav">
+                                    <div class="form-group">
+                                        <label class="sr-only" for="username">Username</label>
+                                        <input type="text" class="form-control" id="username" placeholder="Username" required>
+                                    </div>
+                                    <div class="form-group">
+                                        <label class="sr-only" for="password">Password</label>
+                                        <input type="password" class="form-control" id="password" placeholder="Password" required>
+                                        <!--div class="help-block text-right"><a href="#">Forgot the password?</a></div-->
+                                    </div>
+                                    <div class="form-group">
+                                        <button class="btn btn-primary btn-block" type="button" id="submit">Sign in</button>
+                                    </div>
+                                    <!--div class="checkbox">
+                                        <label>
+                                            <input type="checkbox"> keep me logged-in
+                                        </label>
+                                    </div-->
+                                </form>
+                            </div>
+                        </div>
+                    </div><!--/modal-body-->
+                    <div class="row"><!-- class="modal-footer"-->
+                        <div class="text-center">
+                            New here ? <a href="#" role="button" data-dismiss="modal" data-toggle="modal" data-target="#modalSignUp"><b>Sign Up</b></a>
+                        </div>
+                    </div><!--/modal-footer-->
+                <!--/div-->
+            </div>
+        </div>
 
         <!-- main screen: programming language selection, settings, etc. -->
         <div class="container" id="screen_language" style="text-align: center; display: none;">
@@ -154,34 +200,40 @@
         <!-- problem screen: prolog -->
         <div class="container-fluid quadrants block1" id="screen_prolog" style="display: none;">
             <div class="row">
-                <div class="col-lg-3 col-md-6 col-sm-12 block block1">
-                    <div class="description-container">
-                        <h2 class="title" data-dict="prolog" data-tkey="slug"></h2>
-                        <div class="description" data-dict="prolog" data-tkey="description"></div>
+                <div class="col-lg-4 col-md-4 col-sm-12 block block-left">
+                    <div class="col-lg-12 col-md-12 col-sm-12 block block1">
+                        <div class="scrollable-content-container">
+                            <div class="description-container">
+                                <h2 class="title" data-dict="prolog" data-tkey="slug"></h2>
+                                <div class="description" data-dict="prolog" data-tkey="description"></div>
+                            </div>
+                        </div>
+                        <div class="block-label">Instructions</div>
                     </div>
-                    <div class="block-label">Instructions</div>
-                </div>
-                <div class="col-lg-3 col-md-6 col-sm-12 block block2">
-                    <nav class="navbar navbar-default block-toolbar">
-                        <div class="container-fluid">
-                            <button type="button" class="btn btn-default navbar-btn btn-plan" data-tkey="btn_plan">Plan</button>
-                            <button type="button" class="btn btn-default navbar-btn btn-hint" data-tkey="btn_hint">Hint</button>
-                            <button type="button" class="btn btn-default navbar-btn btn-test" data-tkey="btn_test">Test</button>
+                    <div class="col-lg-12 col-md-12 col-sm-12 block block4">
+                        <div class="scrollable-content-container">
+                            <div class="hints"></div>
                         </div>
-                    </nav>
-                    <div class="code_editor"></div>
-                    <div class="block-statusbar"></div>
-                    <div class="block-label">Code</div>
-                </div>
-                <div class="col-lg-3 col-md-6 col-sm-12 block block3">
-                    <div class="console"></div>
-                    <div class="block-label">Console</div>
+                        <div class="block-label">Hints</div>
+                    </div>
                 </div>
-                <div class="col-lg-3 col-md-6 col-sm-12 block block4">
-                    <div class="scrollable-content-container">
-                        <div class="hints"></div>
+                <div class="col-lg-8 col-md-8 col-sm-12 block block-right ">
+                    <div class="col-lg-6 col-md-12 col-sm-12 block block2">
+                        <nav class="navbar navbar-default block-toolbar">
+                            <div class="container-fluid">
+                                <button type="button" class="btn btn-default navbar-btn btn-plan" data-tkey="btn_plan">Plan</button>
+                                <button type="button" class="btn btn-default navbar-btn btn-hint" data-tkey="btn_hint">Hint</button>
+                                <button type="button" class="btn btn-default navbar-btn btn-test" data-tkey="btn_test">Test</button>
+                            </div>
+                        </nav>
+                        <div class="code_editor"></div>
+                        <div class="block-statusbar"></div>
+                        <div class="block-label">Code</div>
+                    </div>
+                    <div class="col-lg-6 col-md-12 col-sm-12 block block3">
+                        <div class="console"></div>
+                        <div class="block-label">Console</div>
                     </div>
-                    <div class="block-label">Hints</div>
                 </div>
             </div><!--/row-->
         </div><!--container-->
@@ -245,7 +297,6 @@
                             <button type="button" class="btn btn-default navbar-btn btn-plan">Plan</button>
                             <button type="button" class="btn btn-default navbar-btn btn-hint">Hint</button>
                             <button type="button" class="btn btn-default navbar-btn btn-run">Run</button>
-                            <input type="text" id="robot_ip" placeholder="Robot's IP"></input>
                             <button type="button" class="btn btn-default navbar-btn btn-stop">Stop</button>
                         </div>
                     </nav>
@@ -299,7 +350,7 @@
 
         <!-- Modals -->
 
-        <div id="modalLogIn" class="modal fade in" tabindex="-1" role="dialog" aria-hidden="false" data-keyboard="false" data-backdrop="static" style="display: none;">
+        <!--<div id="modalLogIn" class="modal fade in" tabindex="-1" role="dialog" aria-hidden="false" data-keyboard="false" data-backdrop="static" style="display: none;">
             <div class="modal-dialog modal-sm">
                 <div class="modal-content">
                     <div class="modal-header">
@@ -323,7 +374,7 @@
                                     <div class="form-group">
                                         <label class="sr-only" for="password" data-tkey="password">Password</label>
                                         <input type="password" class="form-control" id="password" data-tkey-placeholder="password" placeholder="Password" required>
-                                        <!--div class="help-block text-right"><a href="#">Forgot the password?</a></div-->
+                                        <!--div class="help-block text-right"><a href="#">Forgot the password?</a></div->
                                     </div>
                                     <div class="form-group">
                                         <button class="btn btn-primary btn-block" type="button" id="submit" data-tkey="signin_button">Sign in</button>
@@ -332,11 +383,11 @@
                                         <label>
                                             <input type="checkbox"> keep me logged-in
                                         </label>
-                                    </div-->
+                                    </div->
                                 </form>
                             </div>
                         </div>
-                    </div><!--/modal-body-->
+                    </div><!--/modal-body->
                     <div class="modal-footer">
                         <div class="text-center">
                             <span data-tkey="signin_footer">New here ? </span><a href="#" role="button" data-dismiss="modal" data-toggle="modal" data-target="#modalSignUp"><b data-tkey="signin_footer_signup">Sign Up</b></a>
@@ -348,7 +399,7 @@
                     </div><!--/modal-footer-->
                 </div>
             </div>
-        </div>
+        </div>-->
 
 
         <div id="modalSignUp" class="modal fade in" tabindex="-1" role="dialog" aria-hidden="false" data-keyboard="false" data-backdrop="static" style="display: none;">
@@ -464,7 +515,6 @@
         <!-- codeq app cont. -->
         <script src="js/codeq/init.js"></script>
         <script src="js/codeq/translation.js"></script>
-        <script src="js/codeq/statusbar.js"></script>
         <script src="js/codeq/navigation.js"></script>
         <script src="js/codeq/comms.js"></script>
         <script src="js/codeq/console.js"></script>
diff --git a/js/codeq/core.js b/js/codeq/core.js
index 6b76042..0976ecc 100644
--- a/js/codeq/core.js
+++ b/js/codeq/core.js
@@ -395,10 +395,6 @@
             'sl': 'Slovenščina'
         },
         'isWebApp': false, // this is a PhoneGap/Cordova build, will be overridden in cordova.js for webapp
-        'getLang': function () {
-            return codeq.settings['gui_lang'];
-        },
-
         'setLang': function (newLang) {
             codeq.settings['gui_lang'] = newLang;
             codeq.fire('langchange', {'lang': newLang});
diff --git a/js/codeq/hint.js b/js/codeq/hint.js
index d5e27b0..b5468e0 100644
--- a/js/codeq/hint.js
+++ b/js/codeq/hint.js
@@ -280,7 +280,7 @@
                         jqMark.popover({
                             'content': function () {
                                 // decide on what to display only after the popup is triggered, so we can choose the correct translation
-                                return htmlPrefix + translations[codeq.getLang()] + '</span>';
+                                return htmlPrefix + translations[codeq.settings['gui_lang']] + '</span>';
                             },
                             'html': true,
                             'placement': 'auto bottom',
diff --git a/js/codeq/login.js b/js/codeq/login.js
index b8323e1..32b821d 100644
--- a/js/codeq/login.js
+++ b/js/codeq/login.js
@@ -30,6 +30,7 @@
                         codeq.setLang(sett['gui_lang']);
                         $("#gui_lang_select").val(sett['gui_lang']);
                     }
+                    $('#robot_address_input').val(codeq.settings['robot_address'] || '');
 
                     codeq.globalStateMachine.transition('language');
                     //codeq.activateState('language');
@@ -47,6 +48,7 @@
 
     codeq.globalStateMachine.register('login',{
         'enter': function(){
+            $('#navigation-home').off('click');//remove the click listener of this element here only - in each other state the listener should exist
             $('#signed-in-title').html('');
             $("#submit").on('click', loginFun);
             formInputs.on('keyup', function (ev) {
@@ -54,16 +56,22 @@
                     $('#submit').trigger('click');
                 }
             });
-            $('#modalLogIn').modal();
-            //$("#screen_login").css('display', '');
+            //$('#modalLogIn').modal();
+            $("#screen_login").css('display', '');
             $('#disabled').css('display', 'none');
         },
         'exit' : function(){
             $("#submit").off('click', loginFun);
             formInputs.off('keyup');
-            $('#modalLogIn').modal('hide');
-            //$("#screen_login").css('display', 'none');
+            //$('#modalLogIn').modal('hide');
+            $("#screen_login").css('display', 'none');
+            $('#signed-in-title').html('Signed in as '+$('#username').val());
             $("#password").val('');
+            //re-enable the click listener
+            $('#navigation-home').on('click', function(e){
+                codeq.globalStateMachine.transition('language');
+                e.preventDefault();
+            });
         }
     });
 })();
diff --git a/js/codeq/navigation.js b/js/codeq/navigation.js
index eafa5cc..af1d250 100644
--- a/js/codeq/navigation.js
+++ b/js/codeq/navigation.js
@@ -105,14 +105,15 @@
         codeq.comms.logout()
             .then(function (data) {
                 console.log(data);
-                //codeq.globalStateMachine.transition('login');
+                codeq.comms.disconnect();
+                codeq.globalStateMachine.transition('login');
             })
             .fail(function (reason) {
                 console.log(reason);
             })
             .done();
 
-        codeq.globalStateMachine.transition('login');
+        //codeq.globalStateMachine.transition('login');
         e.preventDefault();//prevent this since we'll trigger a page reload otherwise
     });
     $('#navigation-profile').on('click', function(e){
diff --git a/js/codeq/robot.js b/js/codeq/robot.js
index 1188c7f..a1b76f1 100644
--- a/js/codeq/robot.js
+++ b/js/codeq/robot.js
@@ -147,8 +147,7 @@
                 alert(error);
             },
             reconnectTimer = null,
-            address = '192.168.1.174:8000',  // TODO get this from settings
-            url = 'ws://' + address + '/',
+            url = 'ws://' + codeq.settings['robot_address'] + ':8000/',
             socket = eio(url);
 
         // set up the websocket events
diff --git a/js/codeq/settings.js b/js/codeq/settings.js
index 252a2ea..dd844a5 100644
--- a/js/codeq/settings.js
+++ b/js/codeq/settings.js
@@ -3,12 +3,13 @@
  */
 (function(){
 
-    var guiLangSelect = $("#gui_lang_select");
-    var previousLang = guiLangSelect.val();
-    var closedWithSave = false;
+    var guiLangSelect = $('#gui_lang_select'),
+        robotAddressInput = $('#robot_address_input'),
+        previousGuiLang = guiLangSelect.val(),
+        closedWithSave = false;
 
     guiLangSelect.on("change",function() {
-        var lang = $("#gui_lang_select").val();
+        var lang = guiLangSelect.val();
         if (lang in codeq.supportedLangs) {
             codeq.setLang(lang);
         }
@@ -20,20 +21,21 @@
 
     $("#settings_dropdown_menu").on("shown.bs.dropdown", function() {
         closedWithSave = false;
-        previousLang = codeq.getLang();
+        previousGuiLang = codeq.settings['gui_lang'];
     }).on("hidden.bs.dropdown", function() {
         if(closedWithSave){
-            var lang = $("#gui_lang_select").val();
-            if (lang in codeq.supportedLangs) {
-                codeq.comms.updateSettings({'gui_lang': lang})
-                    .then(function (data) {
-                        if (data.code !== 0) throw new Error('Change language failed, code: ' + data.code + ', message: ' + data.message);//error msg if something went wring while saving to db
-                    })
-                    .done();
-            }
+            codeq.settings['robot_address'] = robotAddressInput.val();
+            codeq.comms.updateSettings(codeq.settings)
+                .then(function (data) {
+                    if (data.code !== 0) {
+                        throw new Error('Updating settings failed, code: ' + data.code + ', message: ' + data.message);
+                    }
+                })
+                .done();
         }else{
-            $("#gui_lang_select").val(previousLang);
-            if (previousLang in codeq.supportedLangs) codeq.setLang(previousLang);
+            guiLangSelect.val(previousGuiLang);
+            if (previousGuiLang in codeq.supportedLangs) codeq.setLang(previousGuiLang);
+            robotAddressInput.val(codeq.settings['robot_address']);
         }
     });
 })();
diff --git a/js/codeq/statusbar.js b/js/codeq/statusbar.js
deleted file mode 100644
index 56070bd..0000000
--- a/js/codeq/statusbar.js
+++ /dev/null
@@ -1,26 +0,0 @@
-(function () {
-
-    var jqBar = $('#topbar'),
-        jqLang = jqBar.find('.lang-selection'),
-        jqLangChoice = jqLang.find('.lang-choice');
-
-    (function () {
-        var langs = codeq.supportedLangs,
-            jqMenu = jqLang.find('.dropdown-menu'),
-            lang, cssClass;
-        for (lang in langs) {
-            if (!langs.hasOwnProperty(lang)) continue;
-            cssClass = 'lang-' + lang;
-            jqMenu.append('<li><a class="' + cssClass + '">' + lang + '</a></li>');
-            jqMenu.find('.' + cssClass).on('click', (function (l) {return function () {codeq.setLang(l)};})(lang));
-        }
-    })();
-
-    codeq.on('langchange', function (params) {
-        jqLangChoice.text(params.lang);
-    });
-
-    codeq.statusbar = {
-
-    };
-})();
\ No newline at end of file
diff --git a/js/codeq/translation.js b/js/codeq/translation.js
index bd2bf32..f0c8aab 100644
--- a/js/codeq/translation.js
+++ b/js/codeq/translation.js
@@ -80,7 +80,7 @@
         'emptyDictionary': {}, // use this with registerDictionary when you don't want any translations
 
         'translateDom': function (jqTopElt) {
-            var lang = codeq.getLang();
+            var lang = codeq.settings['gui_lang'];
             jqTopElt.filter('[data-tkey]').each(function () {
                 translateElement(jqTopElt,'tkey', lang)
             });
@@ -93,4 +93,4 @@
             return dicts[name];
         }
     };
-})();
\ No newline at end of file
+})();
diff --git a/res/en.json b/res/en.json
index 1a41876..0eade46 100644
--- a/res/en.json
+++ b/res/en.json
@@ -1,5 +1,6 @@
 {
   "language": "Language",
+  "robot_address": "Robot’s IP address",
   "problem_list": "Problems",
   "python": "Python",
   "prolog": "Prolog",
diff --git a/res/sl.json b/res/sl.json
index 1d8bc5c..dc29ebb 100644
--- a/res/sl.json
+++ b/res/sl.json
@@ -1,5 +1,6 @@
 {
   "language": "Jezik",
+  "robot_address": "Robotov naslov IP",
   "problem_list": "Naloge",
   "python": "Python",
   "prolog": "Prolog",