diff --git a/js/serial_backend.js b/js/serial_backend.js index 45dd92a6d6..3174370ddd 100644 --- a/js/serial_backend.js +++ b/js/serial_backend.js @@ -50,7 +50,7 @@ $(document).ready(function () { $('#content').empty(); // load default html - TABS.default.initialize(); + TABS.landing.initialize(); } $(this).data("clicks", !clicks); diff --git a/main.html b/main.html index a1b04da30a..66ebc15fe8 100644 --- a/main.html +++ b/main.html @@ -6,8 +6,8 @@ - - + + @@ -40,8 +40,8 @@ - - + + @@ -104,7 +104,7 @@
diff --git a/main.js b/main.js index 01ba865982..0a791fabc7 100644 --- a/main.js +++ b/main.js @@ -85,8 +85,8 @@ $(document).ready(function () { } switch (tab) { - case 'tab_initial_setup': - TABS.initial_setup.initialize(content_ready); + case 'tab_setup': + TABS.setup.initialize(content_ready); break; case 'tab_configuration': TABS.configuration.initialize(content_ready); @@ -112,18 +112,21 @@ $(document).ready(function () { case 'tab_sensors': TABS.sensors.initialize(content_ready); break; - case 'tab_cli': - TABS.cli.initialize(content_ready); - break; case 'tab_logging': TABS.logging.initialize(content_ready); break; + case 'tab_cli': + TABS.cli.initialize(content_ready); + break; + + default: + console.log('Tab not found'); } }); } }); - TABS.default.initialize(); + TABS.landing.initialize(); // options $('a#options').click(function () { diff --git a/tabs/default.css b/tabs/default.css deleted file mode 100644 index 5b1145c326..0000000000 --- a/tabs/default.css +++ /dev/null @@ -1,160 +0,0 @@ -.tab-default .left { - width: 60%; -} -.tab-default .right { - float: left; - - margin-left: 10px; - - width: calc(40% - 10px); -} -.tab-default .optional_permissions { - display: none; - - margin-bottom: 10px; - - border: 1px solid silver; -} - .tab-default .optional_permissions .title { - line-height: 20px; - - text-align: center; - font-weight: bold; - color: white; - - border-bottom: 1px solid silver; - background-color: #cd4c4c; - } - .tab-default .optional_permissions p { - padding: 5px; - } - .tab-default .optional_permissions a { - display: block; - float: left; - - height: 28px; - line-height: 28px; - - margin: 0 0 5px 5px; - padding: 0 15px 0 15px; - - text-align: center; - font-weight: bold; - - border: 1px solid silver; - background-color: #ececec; - } - .tab-default .optional_permissions a:hover { - background-color: #dedcdc; - } - .welcome { - margin-bottom: 10px; - - padding: 5px; - - border: 1px solid silver; - } - .welcome a { - font-weight: bold; - } - .welcome a:hover { - text-decoration: underline; - } - .changelog { - margin: 0 0 10px 0; - - border: 1px solid silver; - } - .changelog .title { - line-height: 20px; - - text-align: center; - font-weight: bold; - color: white; - - border-bottom: 1px solid silver; - background-color: #3f4241; - } - .changelog .wrapper { - height: 150px; - - padding: 5px; - - overflow-y: scroll; - overflow-x: hidden; - - -webkit-user-select: text; - } - .changelog .wrapper span { - font-weight: bold; - } - .changelog .wrapper p { - margin-bottom: 5px; - } - .donate { - padding: 0 0 5px 0; - - border: 1px solid silver; - } - .donate .title { - line-height: 20px; - - text-align: center; - font-weight: bold; - color: white; - - border-bottom: 1px solid silver; - background-color: #3f4241; - } - .donate p { - padding: 5px; - } - .donate a { - display: block; - - width: 74px; - height: 21px; - - 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-default .sponsors { - margin-top: 10px; - border: 1px solid silver; - } - .tab-default .sponsors .title { - line-height: 20px; - - text-align: center; - font-weight: bold; - color: white; - - border-bottom: 1px solid silver; - background-color: #3f4241; - } - .tab-default .sponsors p { - padding: 5px; - } - .tab-default .sponsors p a { - font-weight: bold; - } - .tab-default .sponsors p a:hover { - text-decoration: underline; - } \ No newline at end of file diff --git a/tabs/firmware_flasher.js b/tabs/firmware_flasher.js index 3d74ecb188..064fe6db0c 100644 --- a/tabs/firmware_flasher.js +++ b/tabs/firmware_flasher.js @@ -316,7 +316,7 @@ TABS.firmware_flasher.initialize = function (callback) { $('a.back').click(function () { if (!GUI.connect_lock) { // button disabled while flashing is in progress GUI.tab_switch_cleanup(function () { - TABS.default.initialize(); + TABS.landing.initialize(); }); } else { GUI.log(chrome.i18n.getMessage('firmwareFlasherWaitForFinish')); diff --git a/tabs/initial_setup.css b/tabs/initial_setup.css deleted file mode 100644 index 48aaa43a90..0000000000 --- a/tabs/initial_setup.css +++ /dev/null @@ -1,388 +0,0 @@ -/* temporary styles that are used during compatibility period */ -.tab-initial_setup .CAP_BASEFLIGHT_CONFIG, -.tab-initial_setup .COMPATIBILITY { - display: none; - height: calc(100% - 138px); -} -.tab-initial_setup .CAP_BASEFLIGHT_CONFIG #interactive_block { - width: calc(100% - 199px); -} -.tab-initial_setup .CAP_BASEFLIGHT_CONFIG .gps { - width: 185px; -} -.tab-initial_setup .CAP_BASEFLIGHT_CONFIG .gps .fields { - padding: 5px 5px 3px 5px; -} -.tab-initial_setup .CAP_BASEFLIGHT_CONFIG .gps dt { - float: left; - - width: 85px; - height: 20px; - - margin-bottom: 2px; - - line-height: 20px; -} -.tab-initial_setup .CAP_BASEFLIGHT_CONFIG .gps dd { - height: 20px; - - margin-left: 85px; - margin-bottom: 2px; - - line-height: 20px; -} -/* temporary styles end*/ - -.tab-initial_setup { - height: 100%; -} - .tab-initial_setup .section { - clear: both; - padding-bottom: 8px; - } - .tab-initial_setup .section a { - display: block; - - float: left; - - width: 170px; - height: 24px; - line-height: 24px; - - text-align: center; - font-weight: bold; - - border: 1px solid silver; - background-color: #ececec; - } - .tab-initial_setup .section a:hover { - background-color: #dedcdc; - } - .tab-initial_setup .section a.calibrating { - background-color: #c1c1c1; - } - .tab-initial_setup .section a.calibrating:hover { - cursor: default; - background-color: #c1c1c1; - } - .tab-initial_setup .section a.disabled { - background-color: #c1c1c1; - } - .tab-initial_setup .section a.disabled:hover { - cursor: default; - } - .tab-initial_setup .section a.backup { - width: 80px; - margin-right: 10px; - } - .tab-initial_setup .section a.restore { - width: 80px; - } - .tab-initial_setup .section p { - margin-left: 180px; - - padding: 0 0 0 5px; - - height: 25px; - line-height: 25px; - - border-bottom: 1px solid #e5e5e5; - } -#interactive_block { - float: left; - position: relative; - - height: 100%; - width: calc(100% - 522px); - - border: 1px solid silver; - background-color: white; -} - #interactive_block .model { - float: left; - height: 15px; - margin: 10px 0 0 10px; - - font-weight: bold; - } - #interactive_block .modelMixDiagram { - position: absolute; - - top: 32px; - left: 10px; - - height: 95px; - } - #interactive_block .modelMixAirplane { /* Position airplane correctly */ - height: 115px; - padding-left: 0px; - } - #interactive_block .modelMixCustom { /* Position question mark correctly */ - height: 75px; - padding-left: 25px; - } - #interactive_block .heading { - float: right; - height: 15px; - - margin: 10px 10px 0 0; - font-weight: bold; - } - #interactive_block a.reset { - position: absolute; - display: block; - - bottom: 10px; - right: 10px; - - height: 28px; - line-height: 28px; - - padding: 0 15px 0 15px; - - text-align: center; - font-weight: bold; - - border: 1px solid silver; - background-color: #ececec; - - z-index: 100; - } - #interactive_block a.reset:hover { - background-color: #dedcdc; - } - #canvas_wrapper { - position: absolute; - - width: 100%; - height: 100%; - - top: 0; - left: 0; - } - .tab-initial_setup .block_wrapper { - font-size: 0; - } - -.tab-initial_setup .block { - float: left; - display: block; - - margin-left: 10px; - - border: 1px solid silver; -} -.tab-initial_setup .block .head { - display: block; - - text-align: center; - line-height: 20px; - font-weight: bold; - - border-bottom: 1px solid silver; - background-color: #ececec; -} -.tab-initial_setup .mixer { - width: 200px; -} -.tab-initial_setup .mixer .preview { - display: block; - - width: 200px; - height: 140px; - - margin: 5px 0 5px 0; -} -.tab-initial_setup .mixer select { - display: block; - - padding-left: 5px; - - width: 100%; - height: 20px; - line-height: 20px; - - font-weight: bold; - - border-top: 1px solid silver; -} -.tab-initial_setup .block .info { - width: 200px; -} - .tab-initial_setup .battery, - .tab-initial_setup .throttle, - .tab-initial_setup .acc-trim, - .tab-initial_setup .magnetometer, - .tab-initial_setup .info { - display: inline-block; - vertical-align: top; - - margin: 0 0 10px 10px; - - font-size: 12px; - - border: 1px solid silver; - } - .tab-initial_setup .battery .head, - .tab-initial_setup .throttle .head, - .tab-initial_setup .acc-trim .head, - .tab-initial_setup .magnetometer .head, - .tab-initial_setup .info .head { - display: block; - - text-align: center; - line-height: 20px; - font-weight: bold; - - border-bottom: 1px solid silver; - background-color: #ececec; - } - .tab-initial_setup .battery .fields, - .tab-initial_setup .throttle .fields, - .tab-initial_setup .magnetometer .fields, - .tab-initial_setup .info .fields { - padding: 5px 5px 3px 5px; - } - .tab-initial_setup .acc-trim .fields { - padding: 5px 5px 3px 5px; - } - .tab-initial_setup .magnetometer .fields { - padding: 5px 5px 5px 5px; - } - .tab-initial_setup .battery dt { - float: left; - - width: 105px; - height: 22px; - - margin-bottom: 2px; - - line-height: 22px; - } - .tab-initial_setup .battery dd { - height: 22px; - - margin-left: 105px; - margin-bottom: 2px; - - line-height: 22px; - } - .tab-initial_setup .battery input { - width: 68px; - height: 20px; - line-height: 20px; - - border: 1px solid silver; - text-align: center; - } - .tab-initial_setup .throttle dt { - float: left; - - width: 90px; - height: 22px; - - margin-bottom: 2px; - - line-height: 22px; - } - .tab-initial_setup .throttle dd { - height: 22px; - - margin-left: 90px; - margin-bottom: 2px; - - line-height: 22px; - } - .tab-initial_setup .throttle input { - width: 60px; - height: 20px; - line-height: 20px; - - border: 1px solid silver; - text-align: center; - } - .tab-initial_setup .acc-trim dt { - float: left; - - width: 65px; - height: 22px; - line-height: 22px; - - margin-bottom: 2px; - } - .tab-initial_setup .acc-trim dd { - height: 22px; - - margin-left: 65px; - margin-bottom: 2px; - } - .tab-initial_setup .acc-trim input { - width: 60px; - height: 20px; - line-height: 20px; - - border: 1px solid silver; - text-align: center; - } - .tab-initial_setup .magnetometer dt { - float: left; - - width: 90px; - height: 20px; - line-height: 22px; - - margin-bottom: 2px; - } - .tab-initial_setup .magnetometer dd { - height: 20px; - line-height: 22px; - - margin-left: 90px; - margin-bottom: 2px; - } - .tab-initial_setup .magnetometer input { - width: 60px; - height: 20px; - line-height: 20px; - - border: 1px solid silver; - text-align: center; - } - .tab-initial_setup .info dt { - float: left; - - width: 99px; - height: 20px; - line-height: 20px; - } - .tab-initial_setup .info dd { - width: 76px; - height: 20px; - line-height: 20px; - - margin-left: 99px; - } - .tab-initial_setup .buttons { - width: calc(100% - 20px); - - position: absolute; - bottom: 10px; - } - .tab-initial_setup .update { - 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; - } - .tab-initial_setup .update:hover { - background-color: #dedcdc; - } \ No newline at end of file diff --git a/tabs/landing.css b/tabs/landing.css new file mode 100644 index 0000000000..91d89ab3f9 --- /dev/null +++ b/tabs/landing.css @@ -0,0 +1,160 @@ +.tab-landing .left { + width: 60%; +} +.tab-landing .right { + float: left; + + margin-left: 10px; + + width: calc(40% - 10px); +} +.tab-landing .optional_permissions { + display: none; + + margin-bottom: 10px; + + border: 1px solid silver; +} +.tab-landing .optional_permissions .title { + line-height: 20px; + + text-align: center; + font-weight: bold; + color: white; + + border-bottom: 1px solid silver; + background-color: #cd4c4c; +} +.tab-landing .optional_permissions p { + padding: 5px; +} +.tab-landing .optional_permissions a { + display: block; + float: left; + + height: 28px; + line-height: 28px; + + margin: 0 0 5px 5px; + padding: 0 15px 0 15px; + + text-align: center; + font-weight: bold; + + border: 1px solid silver; + background-color: #ececec; +} +.tab-landing .optional_permissions a:hover { + background-color: #dedcdc; +} +.welcome { + margin-bottom: 10px; + + padding: 5px; + + border: 1px solid silver; +} +.welcome a { + font-weight: bold; +} +.welcome a:hover { + text-decoration: underline; +} +.changelog { + margin: 0 0 10px 0; + + border: 1px solid silver; +} +.changelog .title { + line-height: 20px; + + text-align: center; + font-weight: bold; + color: white; + + border-bottom: 1px solid silver; + background-color: #3f4241; +} +.changelog .wrapper { + height: 150px; + + padding: 5px; + + overflow-y: scroll; + overflow-x: hidden; + + -webkit-user-select: text; +} +.changelog .wrapper span { + font-weight: bold; +} +.changelog .wrapper p { + margin-bottom: 5px; +} +.donate { + padding: 0 0 5px 0; + + border: 1px solid silver; +} +.donate .title { + line-height: 20px; + + text-align: center; + font-weight: bold; + color: white; + + border-bottom: 1px solid silver; + background-color: #3f4241; +} +.donate p { + padding: 5px; +} +.donate a { + display: block; + + width: 74px; + height: 21px; + + 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; +} +.tab-landing .sponsors .title { + line-height: 20px; + + text-align: center; + font-weight: bold; + color: white; + + border-bottom: 1px solid silver; + background-color: #3f4241; +} +.tab-landing .sponsors p { + padding: 5px; +} +.tab-landing .sponsors p a { + font-weight: bold; +} +.tab-landing .sponsors p a:hover { + text-decoration: underline; +} \ No newline at end of file diff --git a/tabs/default.html b/tabs/landing.html similarity index 98% rename from tabs/default.html rename to tabs/landing.html index 4004327963..b27c0c532f 100644 --- a/tabs/default.html +++ b/tabs/landing.html @@ -1,4 +1,4 @@ -