diff --git a/images/icons/cf_icon_position.png b/images/icons/cf_icon_position.png new file mode 100644 index 00000000..48f8c9da Binary files /dev/null and b/images/icons/cf_icon_position.png differ diff --git a/js/msp.js b/js/msp.js index cfde7dc0..50d1bf60 100644 --- a/js/msp.js +++ b/js/msp.js @@ -227,6 +227,7 @@ var MSP = { CONFIG.activeSensors = data.getUint16(4, 1); CONFIG.mode = data.getUint32(6, 1); CONFIG.profile = data.getUint8(10); + $('select[name="profilechange"]').val(CONFIG.profile); sensor_status(CONFIG.activeSensors); $('span.i2c-error').text(CONFIG.i2cError); @@ -822,6 +823,7 @@ var MSP = { DATAFLASH.totalSize = 0; DATAFLASH.usedSize = 0; } + update_dataflash_global(); break; case MSP_codes.MSP_DATAFLASH_READ: // No-op, let callback handle it diff --git a/js/serial_backend.js b/js/serial_backend.js index 57a02655..44d960eb 100755 --- a/js/serial_backend.js +++ b/js/serial_backend.js @@ -250,13 +250,21 @@ function onConnect() { $('div#connectbutton a.connect_state').text(chrome.i18n.getMessage('disconnect')).addClass('active'); $('div#connectbutton a.connect').addClass('active'); $('#tabs ul.mode-disconnected').hide(); - $('#tabs ul.mode-connected').show(); - + $('#tabs ul.mode-connected').show(); + + MSP.send_message(MSP_codes.MSP_STATUS, false, false); + + MSP.send_message(MSP_codes.MSP_DATAFLASH_SUMMARY, false, false); + var sensor_state = $('#sensor-status'); sensor_state.show(); - + var port_picker = $('#portsinput'); port_picker.hide(); + + var dataflash = $('#dataflash_wrapper_global'); + dataflash.show(); + } function onClosed(result) { @@ -269,12 +277,15 @@ function onClosed(result) { $('#tabs ul.mode-connected').hide(); $('#tabs ul.mode-disconnected').show(); + var sensor_state = $('#sensor-status'); + sensor_state.hide(); + var port_picker = $('#portsinput'); port_picker.show(); + + var dataflash = $('#dataflash_wrapper_global'); + dataflash.hide(); - var sensor_state = $('#sensor-status'); - sensor_state.hide(); - } function read_serial(info) { @@ -374,7 +385,34 @@ function highByte(num) { function lowByte(num) { return 0x00FF & num; -} +}function update_dataflash_global() { + var supportsDataflash = DATAFLASH.totalSize > 0; + if (supportsDataflash){ + + $(".noflash_global").css({ + display: 'none' + }); + + $(".dataflash-contents_global").css({ + display: 'block' + }); + + $(".dataflash-free_global").css({ + width: (100-(DATAFLASH.totalSize - DATAFLASH.usedSize) / DATAFLASH.totalSize * 100) + "%", + display: 'block' + }); + $(".dataflash-free_global div").text('Dataflash: free ' + formatFilesize(DATAFLASH.totalSize - DATAFLASH.usedSize)); + } else { + $(".noflash_global").css({ + display: 'block' + }); + + $(".dataflash-contents_global").css({ + display: 'none' + }); + } + + } function specificByte(num, pos) { return 0x000000FF & (num >> (8 * pos)); @@ -392,3 +430,45 @@ function bit_clear(num, bit) { return num & ~(1 << bit); } +function update_dataflash_global() { + function formatFilesize(bytes) { + if (bytes < 1024) { + return bytes + "B"; + } + var kilobytes = bytes / 1024; + + if (kilobytes < 1024) { + return Math.round(kilobytes) + "kB"; + } + + var megabytes = kilobytes / 1024; + + return megabytes.toFixed(1) + "MB"; + } + + var supportsDataflash = DATAFLASH.totalSize > 0; + + if (supportsDataflash){ + $(".noflash_global").css({ + display: 'none' + }); + + $(".dataflash-contents_global").css({ + display: 'block' + }); + + $(".dataflash-free_global").css({ + width: (100-(DATAFLASH.totalSize - DATAFLASH.usedSize) / DATAFLASH.totalSize * 100) + "%", + display: 'block' + }); + $(".dataflash-free_global div").text('Dataflash: free ' + formatFilesize(DATAFLASH.totalSize - DATAFLASH.usedSize)); + } else { + $(".noflash_global").css({ + display: 'block' + }); + + $(".dataflash-contents_global").css({ + display: 'none' + }); + } +} diff --git a/main.css b/main.css index b16ce9a8..0f5384e5 100644 --- a/main.css +++ b/main.css @@ -489,12 +489,16 @@ input[type="number"]::-webkit-inner-spin-button { width: 200px; border-right: 4px solid #59aa29; background-color: #2e2e2e; + transition: all 0.2s; + } .tab_container.logopen { height: calc(100% - 235px); overflow-x: hidden; overflow-y: auto; + transition: all 0.5s; + } @@ -1123,6 +1127,7 @@ dialog { line-height: 13px; display: block; transition: all ease 0.2s; + text-decoration:none; } .default_btn a:hover { @@ -1130,6 +1135,8 @@ dialog { color: #fff; text-shadow: 0px 1px rgba(0, 0, 0, 0.25); transition: all ease 0.2s; + text-decoration:none; + } .default_btn a:active { @@ -1330,7 +1337,8 @@ dialog { border-radius: 3px; color: #fff; font-size: 10px; - } +} + .fixfalse { background-color: #e60000; @@ -1341,19 +1349,111 @@ dialog { color: #fff; font-size: 10px; } +/* Dataflash element styling*/ + +#dataflash_wrapper_global { + color:white; + font-size:10px; + margin-top: 20px; + width:125px; + float: right; + margin-right: 20px; + line-height: 12px; + height: 33px; + border-radius: 5px; + border: 1px solid #272727; + box-shadow: 0px 1px 0px rgba(92, 92, 92, 0.5); + background-color: #434343; + background-image: -webkit-linear-gradient(top, transparent, rgba(0, 0, 0, 0.55)); + padding-top:5px; + display:none; + text-shadow: 0px 1px rgba(0, 0, 0, 1.0); + +} + +#profile_change { + color:white; + margin-top: 16px; + width:125px; + float: right; + margin-right: 0px; + line-height: 12px; +} + +.dataflash-contents_global { + margin-top: 18px; + border: 1px solid #4A4A4A; + background-color: #4A4A4A; + display: flex; + flex-direction: row; + flex-wrap: nowrap; + justify-content: flex-start; + border-radius: 3px; + margin-left: 5px; + margin-right: 5px; +} + + +.dataflash-free_global { + background-color: #59AA29; + border-radius: 4px; +} + + +.dataflash-contents_global .notsupported_global { + display: none; +} + +.dataflash-contents_global li { + height: 5px; + position: relative; + box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.20); + border-radius: 2px; + +} + +.dataflash-contents_global li div { + position: absolute; + top: -18px; + margin-top: 0px; + text-align: center; + left: 0; + right: 0; + width:120px; + text-align:left; + color:silver; +} + +.dataflash-contents_global progress::-webkit-progress-bar { + height: 8px; + background-color: #eee; +} + +.dataflash-contents progress::-webkit-progress-value { + background-color: #bcf; +} + +.noflash_global { + display:none; + color: #868686; + text-align: center; + text-shadow: 0px 1px rgba(0, 0, 0, 1.0); + margin-top:2px; +} + + @media only screen and (max-width: 1055px) , only screen and (max-device-width: 1055px) { .content_wrapper { padding: 15px; - /*width:calc(100% - 30px);*/ - } +} .tab_title { font-size: 16px; line-height: 18px; font-family: 'open_sanslight', Arial; margin-bottom: 10px; height: 22px; - } +} .cf_doc_version_bt a { padding: 1px 5px 1px 5px; margin-top: -35px; diff --git a/main.html b/main.html index 88320b86..9f042554 100755 --- a/main.html +++ b/main.html @@ -126,6 +126,25 @@
+
+
No dataflash
chip found
+ +
+
+
+ +
+
+
+
diff --git a/main.js b/main.js index 29613a01..2bd3ea24 100644 --- a/main.js +++ b/main.js @@ -42,6 +42,13 @@ $(document).ready(function () { console.log('Application version expired'); GUI.log('You are using an old version of ' + chrome.runtime.getManifest().name + '. There may be a more recent version with improvements and fixes.'); } + + chrome.storage.local.get('logopen', function (result) { + if (result.logopen) { + $("#showlog").trigger('click'); + } + }); + // log webgl capability // it would seem the webgl "enabling" through advanced settings will be ignored in the future @@ -304,6 +311,45 @@ $(document).ready(function () { } } }); + + $("#showlog").on('click', function() { + var state = $(this).data('state'); + if ( state ) { + $("#log").animate({height: 27}, 200, function() { + var command_log = $('div#log'); + command_log.scrollTop($('div.wrapper', command_log).height()); + }); + $("#log").removeClass('active'); + $("#content").removeClass('logopen'); + $(".tab_container").removeClass('logopen'); + $("#scrollicon").removeClass('active'); + chrome.storage.local.set({'logopen': false}); + + state = false; + }else{ + $("#log").animate({height: 111}, 200); + $("#log").addClass('active'); + $("#content").addClass('logopen'); + $(".tab_container").addClass('logopen'); + $("#scrollicon").addClass('active'); + chrome.storage.local.set({'logopen': true}); + + state = true; + } + $(this).text(state ? 'Hide Log' : 'Show Log'); + $(this).data('state', state); + + }); + + var profile_e = $('select[name="profilechange"]'); + + profile_e.change(function () { + var profile = parseInt($(this).val()); + MSP.send_message(MSP_codes.MSP_SELECT_SETTING, [profile], false, function () { + GUI.log(chrome.i18n.getMessage('pidTuningLoadedProfile', [profile + 1])); + updateActivatedTab(); + }); + }); }); function catch_startup_time(startTime) { @@ -359,31 +405,10 @@ String.prototype.format = function () { }); }; -/** log trigger **/ -$(document).ready(function () { - -$("#showlog").on('click', function() { - var state = $(this).data('state'); - if ( state ) { - $("#log").animate({height: 27}, 200); - $("#log").removeClass('active'); - $("#content").removeClass('logopen'); - $(".tab_container").removeClass('logopen'); - $("#scrollicon").removeClass('active'); - - state = false; - }else{ - $("#log").animate({height: 111}, 200); - $("#log").addClass('active'); - $("#content").addClass('logopen'); - $(".tab_container").addClass('logopen'); - $("#scrollicon").addClass('active'); - state = true; - } - $(this).text(state ? 'Hide Log' : 'Show Log'); - $(this).data('state', state); - -}); -}); \ No newline at end of file +function updateActivatedTab() { + var activeTab = $('#tabs > ul li.active'); + activeTab.removeClass('active'); + $('a', activeTab).trigger('click'); +} \ No newline at end of file diff --git a/manifest.json b/manifest.json index 41c97a62..6eff7b39 100644 --- a/manifest.json +++ b/manifest.json @@ -18,8 +18,13 @@ } }, - "permissions": [ + "sandbox": { + "pages": ["tabs/map.html"] + }, + + "permissions": [ "https://www.google-analytics.com/", + "https://maps.googleapis.com/*", "https://*.github.com/", "https://*.githubusercontent.com/", "http://*.baseflight.net/", diff --git a/tabs/configuration.css b/tabs/configuration.css index 6dfb33ce..79c2debb 100644 --- a/tabs/configuration.css +++ b/tabs/configuration.css @@ -260,7 +260,7 @@ .tab-configuration .gps .gui_box, .tab-configuration .other .gui_box { min-height: 355px; float: left; - margin-bottom: 0px; + margin-bottom: 10px; } .tab-configuration .current .gui_box { diff --git a/tabs/dataflash.css b/tabs/dataflash.css index 01ebdb04..653f3c04 100644 --- a/tabs/dataflash.css +++ b/tabs/dataflash.css @@ -98,6 +98,8 @@ text-align: center; left: 0; right: 0; + width: 100%; + color: black; } .tab-dataflash .dataflash-used { diff --git a/tabs/dataflash.js b/tabs/dataflash.js index 60e9214e..91f5f8e2 100644 --- a/tabs/dataflash.js +++ b/tabs/dataflash.js @@ -54,26 +54,26 @@ TABS.dataflash.initialize = function (callback) { function update_html() { if (DATAFLASH.usedSize > 0) { - $(".tab-dataflash .dataflash-used").css({ + $(".dataflash-used").css({ width: (DATAFLASH.usedSize / DATAFLASH.totalSize * 100) + "%", display: 'block' }); - $(".tab-dataflash .dataflash-used div").text('Used space ' + formatFilesize(DATAFLASH.usedSize)); + $(".dataflash-used div").text('Used space ' + formatFilesize(DATAFLASH.usedSize)); } else { - $(".tab-dataflash .dataflash-used").css({ + $(".dataflash-used").css({ display: 'none' }); } if (DATAFLASH.totalSize - DATAFLASH.usedSize > 0) { - $(".tab-dataflash .dataflash-free").css({ + $(".dataflash-free").css({ width: ((DATAFLASH.totalSize - DATAFLASH.usedSize) / DATAFLASH.totalSize * 100) + "%", display: 'block' }); - $(".tab-dataflash .dataflash-free div").text('Free space ' + formatFilesize(DATAFLASH.totalSize - DATAFLASH.usedSize)); + $(".dataflash-free div").text('Free space ' + formatFilesize(DATAFLASH.totalSize - DATAFLASH.usedSize)); } else { - $(".tab-dataflash .dataflash-free").css({ + $(".dataflash-free").css({ display: 'none' }); } diff --git a/tabs/gps.css b/tabs/gps.css index 59f147b2..d5e78ab3 100644 --- a/tabs/gps.css +++ b/tabs/gps.css @@ -16,14 +16,104 @@ background-color: #ececec; } -.tab-gps a { +.tab-gps .gps_map { + height: 460px; +} + + +.tab-gps #connect { + display:none; + text-align:center; + padding-top:40%; +} + +.tab-gps #waiting { + margin-top: 0px; + display: none; + text-align: center; + padding-top: 0px; + background-image: url(../images/loading-bars.svg); + background-position: center 40%; + background-size: 15%; + height: 100%; + background-repeat: no-repeat; + float: left; + width: 100%; +} + +.tab-gps #waiting .info { + margin-top: 50%; +} + +.tab-gps #loadmap { + margin-top:0px; + display:none; +} + +.tab-gps #connect a { font-weight: bold; + margin-top:10px; +} + + +.tab-gps #loadmap { + height: 100%; + width: 100%; + float: left; } -.tab-gps a:hover { - text-decoration: underline; + +.tab-gps #loadmap .controls { + width: 100%; + float: left; + height: 33px; + border-bottom-left-radius: 3px; + border-bottom-right-radius: 3px; + background-color: #D1D1D1; +} + +.tab-gps #loadmap .controls a { + background-color: white; + border-radius: 4px; + border: 1px silver solid; + color: grey; + height: 10px; + width: 10px; + text-align: center; + font-size: 20px; + line-height: 10px; + padding: 6px; + margin-top: 5px; + float: right; } +.tab-gps #loadmap .controls a:hover { + background-color: #f5f5f5; +} + +.tab-gps #loadmap .controls a:active { + background-color: #e6e6e6; +} + +.tab-gps #loadmap .controls a:first-child { + margin-left: -1px; + margin-right: 5px; + border-bottom-left-radius: 0px; + border-top-left-radius: 0px; +} +.tab-gps #loadmap .controls a:last-child { + margin-right: 0px; + border-bottom-right-radius: 0px; + border-top-right-radius: 0px; +} + +.tab-gps iframe { + height: 400px; + width: 100%; + float: left; +} + + progress[value]::-webkit-progress-bar { background-color: #d2d2d2; border-radius: 2px; @@ -36,4 +126,19 @@ progress[value]::-webkit-progress-value { -webkit-linear-gradient(left, #59aa29, #59aa29); border-radius: 2px; box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.25) inset; -} \ No newline at end of file +} + + +@media only screen and (max-width: 1055px) , only screen and (max-device-width: 1055px) { + +.tab-gps iframe { + height: 347px; + width: 100%; + float: left; +} + +.tab-gps .gps_map { + height: 403px; +} + +} diff --git a/tabs/gps.html b/tabs/gps.html index 5276868e..e2ad57e6 100644 --- a/tabs/gps.html +++ b/tabs/gps.html @@ -145,6 +145,27 @@
+
+
+
+
+
+
+
retry
+
+
+
+
+
+
+ +
+ + + – +
+
+
+
\ No newline at end of file diff --git a/tabs/gps.js b/tabs/gps.js index b6657f61..f0e4967f 100644 --- a/tabs/gps.js +++ b/tabs/gps.js @@ -14,9 +14,21 @@ TABS.gps.initialize = function (callback) { } MSP.send_message(MSP_codes.MSP_STATUS, false, false, load_html); - + + function set_online(){ + $('#connect').hide(); + $('#waiting').show(); + $('#loadmap').hide(); + } + + function set_offline(){ + $('#connect').show(); + $('#waiting').hide(); + $('#loadmap').hide(); + } + function process_html() { - // translate to user-selected language + // translate to user-selected languageconsole.log('Online'); localize(); function get_raw_gps_data() { @@ -54,13 +66,39 @@ TABS.gps.initialize = function (callback) { $('td', row).eq(1).text(GPS_DATA.quality[i]); $('td', row).eq(2).find('progress').val(GPS_DATA.cno[i]); } + + + var message = { + action: 'center', + lat: lat, + lon: lon, + }; + + var frame = document.getElementById('map'); + if (navigator.onLine) { + $('#connect').hide(); + + //if(lat != 0 && lon != 0){ + if(GPS_DATA.fix){ + frame.contentWindow.postMessage(message, '*'); + $('#loadmap').show(); + $('#waiting').hide(); + }else{ + $('#loadmap').hide(); + $('#waiting').show(); + } + }else{ + $('#connect').show(); + $('#waiting').hide(); + $('#loadmap').hide(); + } } // enable data pulling GUI.interval_add('gps_pull', function gps_update() { // avoid usage of the GPS commands until a GPS sensor is detected for targets that are compiled without GPS support. if (!have_sensor(CONFIG.activeSensors, 'gps')) { - return; + //return; } get_raw_gps_data(); @@ -71,10 +109,51 @@ TABS.gps.initialize = function (callback) { MSP.send_message(MSP_codes.MSP_STATUS); }, 250, true); + + //check for internet connection on load + if (navigator.onLine) { + console.log('Online'); + set_online(); + } else { + console.log('Offline'); + set_offline(); + } + + $("#check").on('click',function(){ + if (navigator.onLine) { + console.log('Online'); + set_online(); + } else { + console.log('Offline'); + set_offline(); + } + }); + + var frame = document.getElementById('map'); + + $('#zoom_in').click(function() { + console.log('zoom in'); + var message = { + action: 'zoom_in', + }; + frame.contentWindow.postMessage(message, '*'); + }); + + $('#zoom_out').click(function() { + console.log('zoom out'); + var message = { + action: 'zoom_out' + }; + frame.contentWindow.postMessage(message, '*'); + }); + GUI.content_ready(callback); } + }; + + TABS.gps.cleanup = function (callback) { if (callback) callback(); }; \ No newline at end of file diff --git a/tabs/help.css b/tabs/help.css index 2793355e..15af925b 100644 --- a/tabs/help.css +++ b/tabs/help.css @@ -6,4 +6,31 @@ .tab-help .gui_box { min-height: 500px; margin-bottom: 0px; +} + +.tab-help ul { + margin-bottom:15px; +} + +.tab-help li { + border-top: 1px dotted silver; + padding-top: 5px; + padding-bottom: 5px; + background-image: url(../images/arrow.svg); + background-repeat: no-repeat; + background-position: 0px 8px; + background-size: 12px; +} + +.tab-help li span { + margin-left: 17px; + display:block; +} + +.tab-help li span a { + color: #59aa29; +} + +.tab-help .subline { + margin-bottom: 5px; } \ No newline at end of file diff --git a/tabs/help.html b/tabs/help.html index 59bc0eb1..e5323895 100644 --- a/tabs/help.html +++ b/tabs/help.html @@ -7,6 +7,10 @@

+
@@ -16,7 +20,20 @@
-

+

+
+ + +
+ +
diff --git a/tabs/map.html b/tabs/map.html new file mode 100644 index 00000000..27bb7698 --- /dev/null +++ b/tabs/map.html @@ -0,0 +1,99 @@ + + + + Asynchronous Loading + + + + + + +
+ \ No newline at end of file diff --git a/tabs/pid_tuning.css b/tabs/pid_tuning.css index 313bafc3..b4bc6009 100644 --- a/tabs/pid_tuning.css +++ b/tabs/pid_tuning.css @@ -144,8 +144,8 @@ .tab-pid_tuning .controller { float: left; - width: calc(50% - 12px); - margin-left: 10px; + width: calc(50% - 2px); + margin-left: 0px; margin-bottom: 10px; border-radius: 3px; border: 1px solid #ccc; diff --git a/tabs/pid_tuning.html b/tabs/pid_tuning.html index b4ebb768..1bae8d14 100755 --- a/tabs/pid_tuning.html +++ b/tabs/pid_tuning.html @@ -6,14 +6,6 @@
-
- - -