summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--index.html32
-rw-r--r--js/codeq/navigation.js4
-rw-r--r--js/codeq/settings.js71
3 files changed, 75 insertions, 32 deletions
diff --git a/index.html b/index.html
index 64f4e4e..60954ad 100644
--- a/index.html
+++ b/index.html
@@ -55,8 +55,9 @@
<li><a href="#" data-toggle="modal" data-target="#modalChangePassword" data-tkey="change_pass" id="change-password">Change password</a></li>
</ul>
</li>
- <li class="dropdown" id="settings_dropdown_menu">
+ <li id="settings_dropdown_menu"> <!-- class="dropdown"-->
<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>
+ <!--<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">
@@ -79,7 +80,7 @@
</div>
</div>
</form>
- </div>
+ </div>-->
</li>
</ul>
</div><!--/.nav-collapse -->
@@ -395,6 +396,33 @@
</div><!--row-->
</div><!--container-->
+ <!-- Settings screen -->
+ <div class="container" id="screen_settings" style="display: none;">
+ <div class="row">
+ <form class="form col-sm-4 col-md-offset-4" id="settingsForm">
+ <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-tkey-data-content="ui_language_title" data-content="Select the UI language." data-original-title="" title=""><i class="glyphicon glyphicon-question-sign"></i></a><br>
+ <select class="form-control" id="gui_lang_select">
+ <option value="sl">Slovensko</option>
+ <option value="en">English</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-tkey-data-content="robot_address_title" data-content="Set the robot's IPv4 or IPv6 address." data-original-title="" title=""><i class="glyphicon glyphicon-question-sign"></i></a><br>
+ <input type="text" class="form-control" id="robot_address_input" data-tkey-placeholder="robot_address_placeholder" placeholder="IP address" pattern="(((^|\.)((25[0-5])|(2[0-4]\d)|(1\d\d)|([1-9]?\d))){4}$)|(((^|:)([0-9a-fA-F]{0,4})){1,8}$)" data-tkey-title="robot_address_title" title="Set the robot's IPv4 or IPv6 address.">
+ </div>
+ <div class="form-group">
+ <div class="text-right">
+ <button type="button" class="btn btn-default" id="settings_cancel_btn">Close</button>
+ <input type="submit" class="btn btn-primary" id="settings_save_btn" value="Save"/>
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+
<!-- Modals -->
<!-- Covers the whole screen with a semi-transparent block, so no input events can be triggered below.
diff --git a/js/codeq/navigation.js b/js/codeq/navigation.js
index 5dbbf1e..9483e05 100644
--- a/js/codeq/navigation.js
+++ b/js/codeq/navigation.js
@@ -130,5 +130,9 @@
codeq.globalStateMachine.transition('changePassword');
e.preventDefault();//prevent this since we'll trigger a page reload otherwise
});
+ $('#settingsTrigger').on('click',function(e){
+ codeq.globalStateMachine.transition('settings');
+ e.preventDefault();
+ });
})();
diff --git a/js/codeq/settings.js b/js/codeq/settings.js
index dd844a5..1c15ad0 100644
--- a/js/codeq/settings.js
+++ b/js/codeq/settings.js
@@ -5,37 +5,48 @@
var guiLangSelect = $('#gui_lang_select'),
robotAddressInput = $('#robot_address_input'),
- previousGuiLang = guiLangSelect.val(),
- closedWithSave = false;
+ jqDisabledOverlay = $('#disabled'),
+ jqSettForm = $("#settingsForm"),
+ jqSettCancelBtn = $("#settings_cancel_btn"),
+ jqScreenSettings = $('#screen_settings');
- guiLangSelect.on("change",function() {
- var lang = guiLangSelect.val();
- if (lang in codeq.supportedLangs) {
- codeq.setLang(lang);
- }
- });
-
- $("#settings_save_btn").on("click", function() {
- closedWithSave = true;
- });
-
- $("#settings_dropdown_menu").on("shown.bs.dropdown", function() {
- closedWithSave = false;
- previousGuiLang = codeq.settings['gui_lang'];
- }).on("hidden.bs.dropdown", function() {
- if(closedWithSave){
- 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{
- guiLangSelect.val(previousGuiLang);
- if (previousGuiLang in codeq.supportedLangs) codeq.setLang(previousGuiLang);
- robotAddressInput.val(codeq.settings['robot_address']);
+ codeq.globalStateMachine.register('settings',{
+ 'enter':function(){
+ jqDisabledOverlay.css('display', '');
+ robotAddressInput.val(codeq.settings['robot_address']);//set the robot address once we enter the state
+ var previousGuiLang = codeq.settings['gui_lang'];
+ jqSettForm.on("submit", function() {
+ 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();
+ history.back();
+ return false;
+ });
+ jqSettCancelBtn.on("click",function(){
+ guiLangSelect.val(previousGuiLang);
+ if (previousGuiLang in codeq.supportedLangs) codeq.setLang(previousGuiLang);
+ history.back();
+ });
+ guiLangSelect.on("change",function() {
+ var lang = guiLangSelect.val();
+ if (lang in codeq.supportedLangs) {
+ codeq.setLang(lang);
+ }
+ });
+ jqScreenSettings.css('display', '');
+ jqDisabledOverlay.css('display', 'none');
+ },
+ 'exit':function(){
+ jqSettForm.off('submit');
+ jqSettCancelBtn.off('click');
+ guiLangSelect.off('select');
+ robotAddressInput.val('');
+ jqScreenSettings.css('display', 'none');
}
});
})();