projects / lantea.git / commitdiff
? search:
summary | shortlog | log | commit | commitdiff | tree
raw | patch | inline | side by side (parent: b5e49b9)
display actions, adjust mapquest open arial URLs, don't overwrite real tiles with...
authorRobert Kaiser <kairo@kairo.at>
Sun, 16 Dec 2012 14:48:29 +0000 (15:48 +0100)
committerRobert Kaiser <kairo@kairo.at>
Sun, 16 Dec 2012 14:48:29 +0000 (15:48 +0100)
TODO patch | blob | blame | history
index.html patch | blob | blame | history
js/map.js patch | blob | blame | history
js/ui.js patch | blob | blame | history
style/lantea.css patch | blob | blame | history

diff --git a/TODO b/TODO
index 166303d780fba31c213e5c77077d66d9323d29bc..bc104a08fee95ee7a9c13ef55585efd3e26a624e 100644 (file)
--- 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
 ** 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
 * 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 a3cb130b2c2a7b8546c65199566585fd7715159e..2a73e5a071d169e76d9cb06ad0baa09a0d856307 100644 (file)
--- a/index.html
+++ b/index.html
@@ -6,9 +6,9 @@
 <html manifest="manifest.appcache">
 <head>
   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
 <html manifest="manifest.appcache">
 <head>
   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
-  <!-- try to counts default scaling on mobile, see 
+  <!-- try to force a 1:1 scaling on mobile, see
        https://developer.mozilla.org/en/Mobile/Viewport_meta_tag -->
        https://developer.mozilla.org/en/Mobile/Viewport_meta_tag -->
-  <meta name="viewport" content="width=device-width, height=device-height, initial-scale=.6667, maximum-scale=.6667">
+  <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1, maximum-scale=1">
   <title>Lantea Maps</title>
   <script src="js/map.js" type="application/javascript;version=1.8"></script>
   <script src="js/ui.js" type="application/javascript;version=1.8"></script>
   <title>Lantea Maps</title>
   <script src="js/map.js" type="application/javascript;version=1.8"></script>
   <script src="js/ui.js" type="application/javascript;version=1.8"></script>
@@ -59,7 +59,10 @@ Map style:
        onclick="toggleFullscreen();">
 </div>
 
        onclick="toggleFullscreen();">
 </div>
 
-<p id="debug" class="debugHide"></p>
+<p id="action">
+  <img id="actionimg" src="style/loading_action.png">
+  <span id="actionlabel">Loading</span>&hellip;
+</p>
 <p id="copyright" class="overlayArea"></p>
 
 <canvas id="map" width="500" height="500">
 <p id="copyright" class="overlayArea"></p>
 
 <canvas id="map" width="500" height="500">
diff --git a/js/map.js b/js/map.js
index a8105ae48f0bbb0845162a32ec85bc97e2b655dd..b5fe9e2a088607063160a1be0d54cbd252c3b09d 100644 (file)
--- a/js/map.js
+++ b/js/map.js
@@ -35,7 +35,7 @@ var gMapStyles = {
      copyright: 'Map data &copy; <a href="http://www.openstreetmap.org/">OpenStreetMap</a> and contributors (<a href="http://www.openstreetmap.org/copyright">ODbL/CC-BY-SA</a>), tiles Courtesy of <a href="http://www.mapquest.com/">MapQuest</a>.'},
   mapquest_aerial:
     {name: "MapQuest Open Aerial",
      copyright: 'Map data &copy; <a href="http://www.openstreetmap.org/">OpenStreetMap</a> and contributors (<a href="http://www.openstreetmap.org/copyright">ODbL/CC-BY-SA</a>), tiles Courtesy of <a href="http://www.mapquest.com/">MapQuest</a>.'},
   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 <a href="http://www.mapquest.com/">MapQuest</a>, portions Courtesy NASA/JPL-Caltech and U.S. Depart. of Agriculture, Farm Service Agency.'},
   opengeoserver_arial:
     {name: "OpenGeoServer Aerial",
      copyright: 'Tiles Courtesy of <a href="http://www.mapquest.com/">MapQuest</a>, 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.
   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.
         // 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.
           gMapContext.drawImage(gLoadingTile, xoff, yoff);
 
         // Initiate loading/drawing of the actual tile.
@@ -575,8 +578,14 @@ function setTracking(aCheckbox) {
 
 function startTracking() {
   if (gGeolocation) {
 
 function startTracking() {
   if (gGeolocation) {
+    gActionLabel.textContent = "Establishing Position";
+    gAction.style.display = "block";
     gGeoWatchID = gGeolocation.watchPosition(
       function(position) {
     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,
         // 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() {
 }
 
 function endTracking() {
+  if (gActionLabel.textContent) {
+    gActionLabel.textContent = "";
+    gAction.style.display = "none";
+  }
   if (gGeoWatchID) {
     gGeolocation.clearWatch(gGeoWatchID);
   }
   if (gGeoWatchID) {
     gGeolocation.clearWatch(gGeoWatchID);
   }
diff --git a/js/ui.js b/js/ui.js
index bc3303d8474674363375f89e8f02060c1c823a0e..2ff241f7a231aaf27b8b010dd3870a1ab620d77e 100644 (file)
--- a/js/ui.js
+++ b/js/ui.js
@@ -8,8 +8,12 @@ var mainDB;
 
 var gUIHideCountdown = 0;
 var gWaitCounter = 0;
 
 var gUIHideCountdown = 0;
 var gWaitCounter = 0;
+var gAction, gActionLabel;
 
 window.onload = function() {
 
 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");
   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();
 
       gMapPrefsLoaded = true;
       resizeAndDraw();
+      gActionLabel.textContent = "";
+      gAction.style.display = "none";
       setTracking(document.getElementById("trackCheckbox"));
     }
     else
       setTracking(document.getElementById("trackCheckbox"));
     }
     else
diff --git a/style/lantea.css b/style/lantea.css
index 03af2d1af38bd6fd3bc1294d8f885e41c7d651b1..3d2aa8cc1c333299adf14e5a647d2881aebca3f3 100644 (file)
--- a/style/lantea.css
+++ b/style/lantea.css
@@ -5,6 +5,7 @@
 body {
   font-family: sans-serif;
   margin: 0;
 body {
   font-family: sans-serif;
   margin: 0;
+  background: url("loading.png") repeat;
 }
 
 h1 {
 }
 
 h1 {
@@ -85,11 +86,7 @@ h1 {
   z-index: 1;
 }
 
   z-index: 1;
 }
 
-#map {
-  background: url("style/loading.png") repeat;
-}
-
-#debug {
+#action {
   position: absolute;
   bottom: 5px;
   left: .5em;
   position: absolute;
   bottom: 5px;
   left: .5em;
@@ -100,6 +97,10 @@ h1 {
   padding: 0 3px;
 }
 
   padding: 0 3px;
 }
 
+#actionimg {
+  vertical-align: text-bottom;
+}
+
 .debugHide {
   display: none;
 }
 .debugHide {
   display: none;
 }
Lantea Maps web app - display maps and record (GPS) tracks