X-Git-Url: https://git-public.kairo.at/?p=lantea.git;a=blobdiff_plain;f=js%2Fmap.js;h=ec60e01d905c6093cf8c6641feb8a98b2cfb637b;hp=b5fe9e2a088607063160a1be0d54cbd252c3b09d;hb=400c082d33d2600d2e5567801290966fd068ef61;hpb=4040eb820dbde99bf35ddebf05720c7582a2ad48 diff --git a/js/map.js b/js/map.js index b5fe9e2..ec60e01 100644 --- a/js/map.js +++ b/js/map.js @@ -146,9 +146,7 @@ function initMap() { gTrackCanvas.addEventListener("touchcancel", mapEvHandler, false); gTrackCanvas.addEventListener("touchleave", mapEvHandler, false); - // XXX deprecated? see https://groups.google.com/forum/?fromgroups#!topic/mozilla.dev.planning/kuhrORubaRY[1-25] - gTrackCanvas.addEventListener("DOMMouseScroll", mapEvHandler, false); - gTrackCanvas.addEventListener("mousewheel", mapEvHandler, false); + gTrackCanvas.addEventListener("wheel", mapEvHandler, false); document.getElementById("copyright").innerHTML = gMapStyles[gActiveMap].copyright; @@ -483,17 +481,13 @@ var mapEvHandler = { case "touchleave": //gDragging = false; break; - case "DOMMouseScroll": - case "mousewheel": - var delta = 0; - if (aEvent.wheelDelta) { - delta = aEvent.wheelDelta / 120; - if (window.opera) - delta = -delta; - } - else if (aEvent.detail) { - delta = -aEvent.detail / 3; - } + case "wheel": + // If we'd want pixels, we'd need to calc up using aEvent.deltaMode. + // See https://developer.mozilla.org/en-US/docs/Mozilla_event_reference/wheel + + // Only accept (non-null) deltaY values + if (!aEvent.deltaY) + break; // Debug output: "coordinates" of the point the mouse was over. /* @@ -506,7 +500,7 @@ var mapEvHandler = { pt2Coord.x + "/" + pt2Coord.y); */ - var newZoomLevel = gPos.z + (delta > 0 ? 1 : -1); + var newZoomLevel = gPos.z + (aEvent.deltaY < 0 ? 1 : -1); if ((newZoomLevel >= 0) && (newZoomLevel <= gMaxZoom)) { // Calculate new center of the map - same point stays under the mouse. // This means that the pixel distance between the old center and point @@ -519,9 +513,9 @@ var mapEvHandler = { gPos.x -= (x - gMapCanvas.width / 2) * (newZoomFactor - gZoomFactor); gPos.y -= (y - gMapCanvas.height / 2) * (newZoomFactor - gZoomFactor); - if (delta > 0) + if (aEvent.deltaY < 0) zoomIn(); - else if (delta < 0) + else zoomOut(); } break; @@ -643,42 +637,47 @@ function endTracking() { function clearTrack() { gTrack = []; gTrackStore.clear(); - drawMap(); + drawMap({left: 0, right: 0, top: 0, bottom: 0}); } var gTileService = { objStore: "tilecache", + ageLimit: 14 * 86400 * 1000, // 2 weeks (in ms) + 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 + gTileService.ageLimit > Date.now()) + return; + // Reload cached tile otherwise. + var oldDate = new Date(aResult.timestamp); + console.log("reload cached tile: " + dbkey + " - " + oldDate.toUTCString()); } - 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; + aCallback(blob, aStyle, aCoords); + gTileService.setDBCache(dbkey, {image: blob, timestamp: Date.now()}); + } + }, false); + XHR.send(); }); }, @@ -731,5 +730,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); + } } };