diff --git a/manifest.json b/manifest.json index a1fe4295fc..8b919cba54 100644 --- a/manifest.json +++ b/manifest.json @@ -53,7 +53,8 @@ "js/tabs/map.js", "/js/libraries/openlayers/ol.css", "/js/libraries/openlayers/ol.js", - "/images/icons/cf_icon_position.png"] + "/images/icons/cf_icon_position.png", + "/images/icons/cf_icon_position_nofix.png"] } ] }, diff --git a/package.json b/package.json index 313c9748d0..52d3e8c8e2 100644 --- a/package.json +++ b/package.json @@ -29,7 +29,8 @@ "js/tabs/map.js", "/js/libraries/openlayers/ol.css", "/js/libraries/openlayers/ol.js", - "/images/icons/cf_icon_position.png" + "/images/icons/cf_icon_position.png", + "/images/icons/cf_icon_position_nofix.png" ] } ] diff --git a/src/images/icons/cf_icon_position_nofix.png b/src/images/icons/cf_icon_position_nofix.png new file mode 100644 index 0000000000..ccb4bd52ea Binary files /dev/null and b/src/images/icons/cf_icon_position_nofix.png differ diff --git a/src/js/tabs/gps.js b/src/js/tabs/gps.js index 1dc095e755..2429856de0 100644 --- a/src/js/tabs/gps.js +++ b/src/js/tabs/gps.js @@ -42,6 +42,9 @@ TABS.gps.initialize = function (callback) { MSP.send_message(MSPCodes.MSP_GPS_SV_INFO, false, false, update_ui); } + // To not flicker the divs while the fix is unstable + var gpsWasFixed = false; + function update_ui() { var lat = GPS_DATA.lat / 10000000; var lon = GPS_DATA.lon / 10000000; @@ -81,16 +84,20 @@ TABS.gps.initialize = function (callback) { if (navigator.onLine) { $('#connect').hide(); - //if(lat != 0 && lon != 0){ - if(GPS_DATA.fix){ + if (GPS_DATA.fix) { + gpsWasFixed = true; frame.contentWindow.postMessage(message, '*'); $('#loadmap').show(); $('#waiting').hide(); - }else{ + } else if (!gpsWasFixed) { $('#loadmap').hide(); $('#waiting').show(); + } else { + message.action = 'nofix'; + frame.contentWindow.postMessage(message, '*'); } }else{ + gpsWasFixed = false; $('#connect').show(); $('#waiting').hide(); $('#loadmap').hide(); diff --git a/src/js/tabs/map.js b/src/js/tabs/map.js index 22eab723d5..49aeae7f3b 100644 --- a/src/js/tabs/map.js +++ b/src/js/tabs/map.js @@ -1,12 +1,15 @@ const DEFAULT_ZOOM = 16, DEFAULT_LON = 0, DEFAULT_LAT = 0, - ICON_IMAGE = '/images/icons/cf_icon_position.png'; + ICON_IMAGE = '/images/icons/cf_icon_position.png', + ICON_IMAGE_NOFIX = '/images/icons/cf_icon_position_nofix.png'; var iconGeometry, map, mapView, - marker; + iconStyle, + iconStyleNoFix, + iconFeature; window.onload = initializeMap; @@ -30,17 +33,30 @@ function initializeMap() { controls: [] }); - var iconStyle = new ol.style.Style({ - image: new ol.style.Icon(({ - anchor: [0.5, 1], - opacity: 1, - scale: 0.5, - src: ICON_IMAGE - })) + var icon = new ol.style.Icon(({ + anchor: [0.5, 1], + opacity: 1, + scale: 0.5, + src: ICON_IMAGE + })); + + var iconNoFix = new ol.style.Icon(({ + anchor: [0.5, 1], + opacity: 1, + scale: 0.5, + src: ICON_IMAGE_NOFIX + })); + + iconStyle = new ol.style.Style({ + image: icon + }); + + iconStyleNoFix = new ol.style.Style({ + image: iconNoFix }); iconGeometry = new ol.geom.Point(lonLat); - var iconFeature = new ol.Feature({ + iconFeature = new ol.Feature({ geometry: iconGeometry }); @@ -73,11 +89,15 @@ function processMapEvents(e) { break; case 'center': + iconFeature.setStyle(iconStyle); var center = ol.proj.fromLonLat([e.data.lon, e.data.lat]); mapView.setCenter(center); iconGeometry.setCoordinates(center); break; + case 'nofix': + iconFeature.setStyle(iconStyleNoFix); + break; } } catch (e) {