From: Robert Kaiser Date: Sun, 30 Dec 2012 20:50:56 +0000 (+0100) Subject: update cached tiles if they're older than two weeks; add a button to clear the cache X-Git-Tag: legacy-preGL~36 X-Git-Url: https://git-public.kairo.at/?a=commitdiff_plain;h=3431f496715ba63682a820ee8cf8a63dc0f86905;p=lantea.git update cached tiles if they're older than two weeks; add a button to clear the cache --- diff --git a/TODO b/TODO index bc104a0..e6ed5e7 100644 --- a/TODO +++ b/TODO @@ -3,10 +3,8 @@ Tasks to complete for Lantea Maps: Required: * Improve tile cache: -** 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 -** Pre-cache tiles in adjecent areas and possibly zoom levels +** If cached tiles have changed, possibly also try (async) updates of other cached zoom levels covering this area +** Pre-cache tiles in adjacent 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 2a73e5a..1f95b6e 100644 --- a/index.html +++ b/index.html @@ -41,7 +41,9 @@ Map style: +
+ diff --git a/js/map.js b/js/map.js index b5fe9e2..9ffc81c 100644 --- a/js/map.js +++ b/js/map.js @@ -649,36 +649,40 @@ function clearTrack() { var gTileService = { objStore: "tilecache", + ageLimit: 14 * 86400, // 2 weeks + get: function(aStyle, aCoords, aCallback) { var norm = normalizeCoords(aCoords); var dbkey = aStyle + "::" + norm.x + "," + norm.y + "," + norm.z; this.getDBCache(dbkey, function(aResult, aEvent) { if (aResult) { // We did get a cached object. - // TODO: Look at the timestamp and trigger a reload when it's too old. aCallback(aResult.image, aStyle, aCoords); + // Look at the timestamp and return if it's not too old. + if (aResult.timestamp + this.ageLimit > Date.now()) + return; + // Reload cached tile otherwise. + console.log("reload cached tile: " + dbkey); } - else { - // Retrieve image from the web and store it in the cache. - var XHR = new XMLHttpRequest(); - XHR.open("GET", - gMapStyles[aStyle].url - .replace("{x}", norm.x) - .replace("{y}", norm.y) - .replace("{z}", norm.z) - .replace("[a-c]", String.fromCharCode(97 + Math.floor(Math.random() * 2))) - .replace("[1-4]", 1 + Math.floor(Math.random() * 3)), - true); - XHR.responseType = "blob"; - XHR.addEventListener("load", function () { - if (XHR.status === 200) { - var blob = XHR.response; - gTileService.setDBCache(dbkey, {image: blob, timestamp: Date.now()}); - aCallback(blob, aStyle, aCoords); - } - }, false); - XHR.send(); - } + // Retrieve image from the web and store it in the cache. + var XHR = new XMLHttpRequest(); + XHR.open("GET", + gMapStyles[aStyle].url + .replace("{x}", norm.x) + .replace("{y}", norm.y) + .replace("{z}", norm.z) + .replace("[a-c]", String.fromCharCode(97 + Math.floor(Math.random() * 2))) + .replace("[1-4]", 1 + Math.floor(Math.random() * 3)), + true); + XHR.responseType = "blob"; + XHR.addEventListener("load", function () { + if (XHR.status === 200) { + var blob = XHR.response; + gTileService.setDBCache(dbkey, {image: blob, timestamp: Date.now()}); + aCallback(blob, aStyle, aCoords); + } + }, false); + XHR.send(); }); }, @@ -731,5 +735,23 @@ var gTileService = { if (aCallback) aCallback(success, event); } + }, + + clearDB: function(aCallback) { + if (!mainDB) + return; + var success = false; + var transaction = mainDB.transaction([this.objStore], "readwrite"); + var request = transaction.objectStore(this.objStore).clear(); + request.onsuccess = function(event) { + success = true; + if (aCallback) + aCallback(success, event); + }; + request.onerror = function(event) { + // Errors can be handled here. + if (aCallback) + aCallback(success, event); + } } }; diff --git a/manifest.appcache b/manifest.appcache index de51bb0..6a4d8c0 100644 --- a/manifest.appcache +++ b/manifest.appcache @@ -1,6 +1,6 @@ CACHE MANIFEST -# 2012-12-17 +# 2012-12-30 manifest.webapp js/map.js js/ui.js