From d269d603913e2988b5f3d3f4ca54c4d0869cad6d Mon Sep 17 00:00:00 2001 From: Dominic Clifton Date: Sun, 25 Jan 2015 17:37:47 +0100 Subject: [PATCH] Improve user experience by adding tabs for the welcome and firmware flasher. The welcome (aka 'landing') and firmware flasher were already modelled as tabs but were never displayed as tabs. The UI didn't make sense when the whether the welcome message or firmware flasher was displayed since there was no active tab or other indication. --- _locales/en/messages.json | 15 +++++++++++---- js/gui.js | 6 +++++- js/serial_backend.js | 7 ++++++- main.css | 6 ++++++ main.html | 6 +++++- main.js | 21 ++++++++++++++++++--- tabs/firmware_flasher.html | 1 - tabs/firmware_flasher.js | 11 ----------- tabs/landing.css | 18 ------------------ tabs/landing.html | 1 - tabs/landing.js | 5 ----- 11 files changed, 51 insertions(+), 46 deletions(-) diff --git a/_locales/en/messages.json b/_locales/en/messages.json index 41649f0954..20bc9f876d 100755 --- a/_locales/en/messages.json +++ b/_locales/en/messages.json @@ -56,6 +56,13 @@ "message": "Configuration migration complete, migrations applied: $1" }, + "tabFirmwareFlasher": { + "message": "Firmware Flasher" + }, + "tabLanding": { + "message": "Welcome" + }, + "tabSetup": { "message": "Setup" }, @@ -126,6 +133,9 @@ "tabSwitchConnectionRequired": { "message": "You need to connect before you can view any of the tabs." }, + "tabSwitchWaitForOperation": { + "message": "You can't do this right now, please wait for current operation to finish ..." + }, "tabSwitchUpgradeRequired": { "message": "You need to upgrade your firmware before you can view any of the tabs." @@ -196,7 +206,7 @@ "message": "Request Optional Permissions" }, "defaultWelcomeText": { - "message": "Welcome to Cleanflight - Configurator, utility designed to simplify updating, configuring and tuning of your flight controller.

Application supports hardware that run cleanflight (sparky, cc3d, acro naze, naze, afromini, flip32, flip32+, cjmcu, chebuzz f3, stm32f3discovery, naze32pro, etc)

The firmware source code can be downloaded from here
The newest binary firmware image is available here

Latest CP210x Drivers can be downloaded from here
" + "message": "Welcome to Cleanflight - Configurator, a utility designed to simplify updating, configuring and tuning of your flight controller.

The application supports all hardware that can run cleanflight (sparky, cc3d, acro naze, naze, afromini, flip32, flip32+, cjmcu, chebuzz f3, stm32f3discovery, naze32pro, etc)

The firmware source code can be downloaded from here
The newest binary firmware image is available here

Latest CP210x Drivers can be downloaded from here
" }, "defaultChangelogHead": { "message": "Configurator - Changelog" @@ -942,9 +952,6 @@ "firmwareFlasherFailedToLoadOnlineFirmware": { "message": "Failed to load remote firmware" }, - "firmwareFlasherWaitForFinish": { - "message": "You can't do this right now, please wait for current operation to finish ..." - }, "ledStripHelp": { "message": "The flight controller can control colors and effects of individual LEDs on a strip.
Configure LEDs on the grid, configure wiring order then attach LEDs on your aircraft according to grid positions." diff --git a/js/gui.js b/js/gui.js index 22aecffca2..4b2aa07667 100644 --- a/js/gui.js +++ b/js/gui.js @@ -198,7 +198,11 @@ GUI_control.prototype.tab_switch_cleanup = function (callback) { MSP.callbacks_cleanup(); // we don't care about any old data that might or might not arrive GUI.interval_kill_all(); // all intervals (mostly data pulling) needs to be removed on tab switch - TABS[this.active_tab].cleanup(callback); + if (this.active_tab) { + TABS[this.active_tab].cleanup(callback); + } else { + callback(); + } }; // initialize object into GUI variable diff --git a/js/serial_backend.js b/js/serial_backend.js index d6e678991c..9ae7d631e6 100755 --- a/js/serial_backend.js +++ b/js/serial_backend.js @@ -170,7 +170,9 @@ function onOpen(openInfo) { CONFIGURATOR.connectionValid = true; $('div#port-picker a.connect').text(chrome.i18n.getMessage('disconnect')).addClass('active'); - $('#tabs li a:first').click(); + $('#tabs ul.mode-disconnected').hide(); + $('#tabs ul.mode-connected').show(); + $('#tabs ul.mode-connected li a:first').click(); }); }); }); @@ -206,6 +208,9 @@ function onClosed(result) { } else { // Something went wrong GUI.log(chrome.i18n.getMessage('serialPortClosedFail')); } + $('#tabs ul.mode-disconnected').show(); + $('#tabs ul.mode-connected').hide(); + $('#tabs ul.mode-disconnected li a:first').click(); } function read_serial(info) { diff --git a/main.css b/main.css index 58089c45d4..4265f8373c 100644 --- a/main.css +++ b/main.css @@ -224,6 +224,11 @@ input[type="number"]::-webkit-inner-spin-button { font-weight: bold; } + +#tabs ul.mode-connected { + display: none; +} + #tabs li { float: left; margin-right: 5px; @@ -231,6 +236,7 @@ input[type="number"]::-webkit-inner-spin-button { border: 1px solid #848484; border-bottom: 0; } + #tabs li a { display: block; diff --git a/main.html b/main.html index f8fa5bafcd..829d2bb0b5 100755 --- a/main.html +++ b/main.html @@ -120,7 +120,11 @@
-
\ No newline at end of file diff --git a/tabs/firmware_flasher.js b/tabs/firmware_flasher.js index cfe34d1f30..a6434736f5 100644 --- a/tabs/firmware_flasher.js +++ b/tabs/firmware_flasher.js @@ -453,17 +453,6 @@ TABS.firmware_flasher.initialize = function (callback) { } }); - // back button - $('a.back').click(function () { - if (!GUI.connect_lock) { // button disabled while flashing is in progress - GUI.tab_switch_cleanup(function () { - TABS.landing.initialize(); - }); - } else { - GUI.log(chrome.i18n.getMessage('firmwareFlasherWaitForFinish')); - } - }); - if (callback) callback(); }); }; diff --git a/tabs/landing.css b/tabs/landing.css index 91d89ab3f9..4f462a6813 100644 --- a/tabs/landing.css +++ b/tabs/landing.css @@ -117,24 +117,6 @@ margin: auto; } -.firmware_flasher { - display: block; - float: right; - - height: 28px; - line-height: 28px; - - padding: 0 15px 0 15px; - - text-align: center; - font-weight: bold; - - border: 1px solid silver; - background-color: #ececec; -} -.firmware_flasher:hover { - background-color: #dedcdc; -} .tab-landing .sponsors { margin-top: 10px; border: 1px solid silver; diff --git a/tabs/landing.html b/tabs/landing.html index 843bb80d19..5853b37bdb 100644 --- a/tabs/landing.html +++ b/tabs/landing.html @@ -32,7 +32,6 @@ -
\ No newline at end of file diff --git a/tabs/landing.js b/tabs/landing.js index 4dc9ad901c..9845c0e05e 100644 --- a/tabs/landing.js +++ b/tabs/landing.js @@ -18,11 +18,6 @@ TABS.landing.initialize = function (callback) { // load changelog content $('div.changelog.configurator .wrapper').load('./changelog.html'); - // UI Hooks - $('a.firmware_flasher').click(function () { - TABS.firmware_flasher.initialize(); - }); - $('div.welcome a, div.sponsors a').click(function () { googleAnalytics.sendEvent('ExternalUrls', 'Click', $(this).prop('href')); });