moved gui language selection completely into the settings dropdown menu and (gui) language changes are now written to the DB once the save button is pressed

3 files changed, 42 insertions, 19 deletions

diff --git a/index.html b/index.html
index a222f4c..6918bfa 100644
--- a/index.html
+++ b/index.html
@@ -43,12 +43,12 @@
                     </ul>
                     <ul class="nav navbar-nav navbar-right">
                         <p class="navbar-text" id="signed-in-title"></p>
-                        <li class="dropdown lang-selection">
+                        <!--<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>-->
                         <li class="dropdown">
                             <a href="#" class="dropdown-toggle" data-toggle="dropdown" aria-expanded="true">
                                 <span class="glyphicon glyphicon glyphicon-user"></span>
@@ -60,20 +60,20 @@
                                 <li><a href="#" data-toggle="modal" data-target="#modalChangePassword" data-tkey="change_pass">Change password</a></li>
                             </ul>
                         </li>
-                        <li class="dropdown">
+                        <li class="dropdown" id="settings_dropdown_menu">
                             <a href="" class="dropdown-toggle" data-toggle="dropdown" id="settingsTrigger" title="Settings, options..." aria-expanded="true"><span class="glyphicon glyphicon glyphicon-wrench" aria-hidden="true"></span></a>
                             <div class="dropdown-menu" style="background-color: #fff">
                                 <form class="form col-sm-12">
                                     <div class="form-group">
                                         <span class="small" data-tkey="language">Language</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'>Select the UI language.</span>" data-original-title="" title=""><i class="glyphicon glyphicon-question-sign"></i></a><br>
-                                        <select class="form-control">
+                                        <select class="form-control" id="gui_lang_select">
                                             <option value="sl">Slovensko</option>
                                             <option value="en">English</option>
-                                            <option value="d">Dolgooooooooooooooooooooooooooooooooooooooooooooooo</option>
+                                            <!--<option value="d">Dolgooooooooooooooooooooooooooooooooooooooooooooooo</option>-->
                                         </select>
                                     </div>
-                                    <div class="form-group">
+                                    <!--<div class="form-group">
                                         <span class="small" data-tkey="language">
                                             Language
                                         </span>
@@ -95,11 +95,11 @@
                                                 </label>
                                             </div>
                                         </div>
-                                    </div>
+                                    </div>-->
                                     <div class="form-group">
                                         <div class="text-right">
-                                            <button type="button" class="btn btn-default" data-target="settingsDropdown" data-toggle="dropdown">Close</button>
-                                            <button type="button" class="btn btn-primary" data-target="settingsDropdown" data-toggle="dropdown">Save</button>
+                                            <button type="button" class="btn btn-default" data-target="settingsDropdown" data-toggle="dropdown" id="settings_cancel_btn">Close</button>
+                                            <button type="button" class="btn btn-primary" data-target="settingsDropdown" data-toggle="dropdown" id="settings_save_btn">Save</button>
                                         </div>
                                     </div>
                                 </form>
@@ -492,5 +492,6 @@
         <script src="js/codeq/profile.js"></script>
         <script src="js/codeq/language.js"></script>
         <script src="js/codeq/problem.js"></script>
+        <script src="js/codeq/settings.js"></script>
     </body>
 </html>
diff --git a/js/codeq/login.js b/js/codeq/login.js
index 9be1c8c..391592b 100644
--- a/js/codeq/login.js
+++ b/js/codeq/login.js
@@ -20,6 +20,7 @@
                     $.merge(true, codeq.settings, sett);
                     if('lan' in sett && sett['lan'] in codeq.supportedLangs){
                         codeq.setLang(sett['lan']);
+                        $("#gui_lang_select").val(sett['lan']);
                     }
 
                     codeq.globalStateMachine.transition('language');
diff --git a/js/codeq/settings.js b/js/codeq/settings.js
index 73bef14..9eb4366 100644
--- a/js/codeq/settings.js
+++ b/js/codeq/settings.js
@@ -2,17 +2,38 @@
  * Created by robert on 9/29/15.
  */
 (function(){
-    $("#gui_lang_select").on("change",function() {
+
+    var guiLangSelect = $("#gui_lang_select");
+    var previousLang = guiLangSelect.val();
+    var closedWithSave = false;
+
+    guiLangSelect.on("change",function() {
         var lang = $("#gui_lang_select").val();
         if (lang in codeq.supportedLangs) {
-            codeq.log.debug("Changing lang to:" + lang);
-            codeq.comms.updateSettings({'lang': lang})
-                .then(function (data) {
-                    if (data.code !== 0) throw new Error('Change language failed, code: ' + data.code + ', message: ' + data.message);
-                    codeq.log.debug("success with settings");
-                    codeq.setLang(lang);
-                })
-                .done();
+            codeq.setLang(lang);
         }
-    })
+    });
+
+    $("#settings_save_btn").on("click", function() {
+        closedWithSave = true;
+    });
+
+    $("#settings_dropdown_menu").on("shown.bs.dropdown", function() {
+        closedWithSave = false;
+        previousLang = codeq.getLang();
+    }).on("hidden.bs.dropdown", function() {
+        if(closedWithSave){
+            var lang = $("#gui_lang_select").val();
+            if (lang in codeq.supportedLangs) {
+                codeq.comms.updateSettings({'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();
+            }
+        }else{
+            $("#gui_lang_select").val(previousLang);
+            if (previousLang in codeq.supportedLangs) codeq.setLang(previousLang);
+        }
+    });
 })();
\ No newline at end of file