diff options
| -rw-r--r-- | css/codeq.css | 5 | ||||
| -rw-r--r-- | index.html | 7 | ||||
| -rw-r--r-- | js/codeq/core.js | 17 | ||||
| -rw-r--r-- | js/codeq/login.js | 4 | ||||
| -rw-r--r-- | js/codeq/settings.js | 20 |
5 files changed, 51 insertions, 2 deletions
diff --git a/css/codeq.css b/css/codeq.css index 67af384..1c5eccc 100644 --- a/css/codeq.css +++ b/css/codeq.css @@ -397,6 +397,11 @@ body { .block.block4 { border-bottom: 1px solid #ddd; } + + /*layout selection is disable on small screens*/ + #gui_layout_select_form_group { + display: none; + } } /* codeq hints */ @@ -412,6 +412,13 @@ <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" id="gui_layout_select_form_group"> + <span class="small" data-tkey="layout_select" >Layout</span> + <select class="form-control" id="gui_layout_select"> + <option value="line-layout">Line</option> + <option value="square-layout">Square</option> + </select> + </div> <div class="form-group"> <div class="text-right"> <button type="button" class="btn btn-default" id="settings_cancel_btn">Close</button> diff --git a/js/codeq/core.js b/js/codeq/core.js index 6d3a5dc..a3e9589 100644 --- a/js/codeq/core.js +++ b/js/codeq/core.js @@ -378,7 +378,8 @@ 'log': log, 'settings': { - 'gui_lang': 'en' // boot sequence overrides this if the browser uses a supported language + 'gui_lang': 'en', // boot sequence overrides this if the browser uses a supported language + 'gui_layout': 'line-layout' }, 'availableLangs': [], // filled at boot from 'supportedLangs' @@ -386,7 +387,21 @@ 'en': 'English', 'sl': 'Slovenščina' }, + 'supportedLayouts':[ + 'line-layout', + 'square-layout' + ], 'isWebApp': false, // this is a PhoneGap/Cordova build, will be overridden in cordova.js for webapp + + 'setLayout': function(newLayout){ + codeq.settings['gui_layout'] = newLayout; + codeq.fire('layoutchange'); + }, + + 'getLayout': function(){ + return codeq.settings['gui_layout']; + }, + 'setLang': function (newLang) { codeq.settings['gui_lang'] = newLang; codeq.fire('langchange', {'lang': newLang}); diff --git a/js/codeq/login.js b/js/codeq/login.js index 48c13b2..9c71547 100644 --- a/js/codeq/login.js +++ b/js/codeq/login.js @@ -31,6 +31,10 @@ $("#gui_lang_select").val(sett['gui_lang']); } $('#robot_address_input').val(codeq.settings['robot_address'] || ''); + if('gui_layout' in sett && ($.inArray(sett['gui_layout'], codeq.supportedLayouts) >= 0) ){ + codeq.setLayout(sett['gui_layout']); + $("#gui_layout_select").val(sett['gui_layout']); + } codeq.globalStateMachine.transition('language'); //codeq.activateState('language'); diff --git a/js/codeq/settings.js b/js/codeq/settings.js index 5b57c49..f0e7ff0 100644 --- a/js/codeq/settings.js +++ b/js/codeq/settings.js @@ -8,15 +8,23 @@ jqDisabledOverlay = $('#disabled'), jqSettForm = $("#settingsForm"), jqSettCancelBtn = $("#settings_cancel_btn"), - jqScreenSettings = $('#screen_settings'); + jqScreenSettings = $('#screen_settings'), + jqLayoutSelect = $('#gui_layout_select'); + + codeq.on('layoutchange', function(){ + $("#screen_prolog").removeClass(codeq.supportedLayouts.join(" ")).addClass(codeq.getLayout()); + $("#screen_python").removeClass(codeq.supportedLayouts.join(" ")).addClass(codeq.getLayout()); + }); 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']; + var previousLayout = codeq.settings['gui_layout']; jqSettForm.on("submit", function(e) { codeq.settings['robot_address'] = robotAddressInput.val(); + codeq.log.debug("settings for update:"+JSON.stringify(codeq.settings)); codeq.comms.updateSettings(codeq.settings) .then(function (data) { if (data.code !== 0) { @@ -32,6 +40,8 @@ e.preventDefault(); }); jqSettCancelBtn.on("click",function(){ + jqLayoutSelect.val(previousLayout); + if ($.inArray(previousLayout, codeq.supportedLayouts) >= 0) codeq.setLayout(previousLayout); guiLangSelect.val(previousGuiLang); if (previousGuiLang in codeq.supportedLangs) codeq.setLang(previousGuiLang); history.back(); @@ -42,6 +52,14 @@ codeq.setLang(lang); } }); + jqLayoutSelect.on("change",function(){ + jqDisabledOverlay.css('display', ''); + var newLayout = jqLayoutSelect.val(); + if ($.inArray(newLayout, codeq.supportedLayouts) >= 0){ + codeq.setLayout(newLayout); + } + jqDisabledOverlay.css('display', 'none'); + }); jqScreenSettings.css('display', ''); jqDisabledOverlay.css('display', 'none'); }, |