From 68afcd960381dcd51be0161c69cad4161313c6d0 Mon Sep 17 00:00:00 2001 From: Robert Kaiser Date: Sun, 16 Dec 2012 15:48:29 +0100 Subject: [PATCH] display actions, adjust mapquest open arial URLs, don't overwrite real tiles with the loading tile --- TODO | 2 +- index.html | 9 ++++++--- js/map.js | 19 ++++++++++++++++--- js/ui.js | 6 ++++++ style/lantea.css | 11 ++++++----- 5 files changed, 35 insertions(+), 12 deletions(-) diff --git a/TODO b/TODO index 166303d..bc104a0 100644 --- a/TODO +++ b/TODO @@ -6,7 +6,7 @@ Required: ** Use an intelligent algorithm to automatically try (async) updating tiles if they have a certain age *** If they have changed, possibly also try (async) updates of other cached zoom levels covering this area ** Clear cached tiles option -* Find the bug that messes up the display when panning on not fully loaded tiles (web connection down) +** Pre-cache tiles in adjecent areas and possibly zoom levels * Show a notification when we are loading tiles or saved data * Display length and duration of track * Display movement speed diff --git a/index.html b/index.html index a3cb130..2a73e5a 100644 --- a/index.html +++ b/index.html @@ -6,9 +6,9 @@ - - + Lantea Maps @@ -59,7 +59,10 @@ Map style: onclick="toggleFullscreen();"> -

+

+ + Loading… +

diff --git a/js/map.js b/js/map.js index a8105ae..b5fe9e2 100644 --- a/js/map.js +++ b/js/map.js @@ -35,7 +35,7 @@ var gMapStyles = { copyright: 'Map data © OpenStreetMap and contributors (ODbL/CC-BY-SA), tiles Courtesy of MapQuest.'}, mapquest_aerial: {name: "MapQuest Open Aerial", - url: "http://oatile[1-4].mqcdn.com/tiles/1.0.0/sat/{z}/{x}/{y}.jpg", + url: "http://otile[1-4].mqcdn.com/tiles/1.0.0/sat/{z}/{x}/{y}.jpg", copyright: 'Tiles Courtesy of MapQuest, portions Courtesy NASA/JPL-Caltech and U.S. Depart. of Agriculture, Farm Service Agency.'}, opengeoserver_arial: {name: "OpenGeoServer Aerial", @@ -297,13 +297,16 @@ function drawMap(aPixels, aOverdraw) { for (var x = Math.floor(xMin / size); x < Math.ceil(xMax / size); x++) { for (var y = Math.floor(yMin / size); y < Math.ceil(yMax / size); y++) { // slow script warnings on the tablet appear here! // Only go to the drawing step if we need to draw this tile. - if (x < tiles.left || x > tiles.right || y < tiles.top || y > tiles.bottom) { + if (x < tiles.left || x > tiles.right || + y < tiles.top || y > tiles.bottom) { // Round here is **CRUCIAL** otherwise the images are filtered // and the performance sucks (more than expected). var xoff = Math.round((x * size - xMin) / gZoomFactor); var yoff = Math.round((y * size - yMin) / gZoomFactor); // Draw placeholder tile unless we overdraw. - if (!aOverdraw) + if (!aOverdraw && + (x < tiles.left -1 || x > tiles.right + 1 || + y < tiles.top -1 || y > tiles.bottom + 1)) gMapContext.drawImage(gLoadingTile, xoff, yoff); // Initiate loading/drawing of the actual tile. @@ -575,8 +578,14 @@ function setTracking(aCheckbox) { function startTracking() { if (gGeolocation) { + gActionLabel.textContent = "Establishing Position"; + gAction.style.display = "block"; gGeoWatchID = gGeolocation.watchPosition( function(position) { + if (gActionLabel.textContent) { + gActionLabel.textContent = ""; + gAction.style.display = "none"; + } // Coords spec: https://developer.mozilla.org/en/XPCOM_Interface_Reference/NsIDOMGeoPositionCoords var tPoint = {time: position.timestamp, coords: {latitude: position.coords.latitude, @@ -622,6 +631,10 @@ function startTracking() { } function endTracking() { + if (gActionLabel.textContent) { + gActionLabel.textContent = ""; + gAction.style.display = "none"; + } if (gGeoWatchID) { gGeolocation.clearWatch(gGeoWatchID); } diff --git a/js/ui.js b/js/ui.js index bc3303d..2ff241f 100644 --- a/js/ui.js +++ b/js/ui.js @@ -8,8 +8,12 @@ var mainDB; var gUIHideCountdown = 0; var gWaitCounter = 0; +var gAction, gActionLabel; window.onload = function() { + gAction = document.getElementById("action"); + gActionLabel = document.getElementById("actionlabel"); + var mSel = document.getElementById("mapSelector"); for (var mapStyle in gMapStyles) { var opt = document.createElement("option"); @@ -51,6 +55,8 @@ window.onload = function() { gMapPrefsLoaded = true; resizeAndDraw(); + gActionLabel.textContent = ""; + gAction.style.display = "none"; setTracking(document.getElementById("trackCheckbox")); } else diff --git a/style/lantea.css b/style/lantea.css index 03af2d1..3d2aa8c 100644 --- a/style/lantea.css +++ b/style/lantea.css @@ -5,6 +5,7 @@ body { font-family: sans-serif; margin: 0; + background: url("loading.png") repeat; } h1 { @@ -85,11 +86,7 @@ h1 { z-index: 1; } -#map { - background: url("style/loading.png") repeat; -} - -#debug { +#action { position: absolute; bottom: 5px; left: .5em; @@ -100,6 +97,10 @@ h1 { padding: 0 3px; } +#actionimg { + vertical-align: text-bottom; +} + .debugHide { display: none; } -- 2.43.0