var gMapPrefsLoaded = false;
var gDragging = false;
-var gDragTouchID;
+var gDragTouchID, gPinchStartWidth;
var gGeoWatchID;
var gTrack = [];
}
}
- var loopCnt = 0;
- var getPersistentPrefs = function() {
- if (mainDB) {
- gWaitCounter++;
- gPrefs.get("position", function(aValue) {
- if (aValue) {
- gPos = aValue;
- gWaitCounter--;
- }
- });
- gWaitCounter++;
- gPrefs.get("center_map", function(aValue) {
- if (aValue === undefined)
- document.getElementById("centerCheckbox").checked = true;
- else
- document.getElementById("centerCheckbox").checked = aValue;
- setCentering(document.getElementById("centerCheckbox"));
- gWaitCounter--;
- });
- gWaitCounter++;
- gPrefs.get("tracking_enabled", function(aValue) {
- if (aValue === undefined)
- document.getElementById("trackCheckbox").checked = true;
- else
- document.getElementById("trackCheckbox").checked = aValue;
- gWaitCounter--;
- });
- gWaitCounter++;
- gTrackStore.getList(function(aTPoints) {
- if (gDebug)
- console.log(aTPoints.length + " points loaded.");
- if (aTPoints.length) {
- gTrack = aTPoints;
- }
- gWaitCounter--;
- });
- }
- else
- setTimeout(getPersistentPrefs, 100);
- loopCnt++;
- if (loopCnt > 50) {
- console.log("Loading prefs failed.");
- }
- };
- getPersistentPrefs();
-
- gTrackCanvas.addEventListener("mouseup", mapEvHandler, false);
- gTrackCanvas.addEventListener("mousemove", mapEvHandler, false);
- gTrackCanvas.addEventListener("mousedown", mapEvHandler, false);
- gTrackCanvas.addEventListener("mouseout", mapEvHandler, false);
-
- gTrackCanvas.addEventListener("touchstart", mapEvHandler, false);
- gTrackCanvas.addEventListener("touchmove", mapEvHandler, false);
- gTrackCanvas.addEventListener("touchend", mapEvHandler, false);
- gTrackCanvas.addEventListener("touchcancel", mapEvHandler, false);
- gTrackCanvas.addEventListener("touchleave", mapEvHandler, false);
-
- gTrackCanvas.addEventListener("wheel", mapEvHandler, false);
-
- document.getElementById("body").addEventListener("keydown", mapEvHandler, false);
-
- document.getElementById("copyright").innerHTML =
- gMapStyles[gActiveMap].copyright;
+ console.log("map vars set, loading prefs...");
+ loadPrefs();
+}
- gLoadingTile = new Image();
- gLoadingTile.src = "style/loading.png";
- gWaitCounter++;
- gLoadingTile.onload = function() { gWaitCounter--; };
+function loadPrefs(aEvent) {
+ if (aEvent && aEvent.type == "prefs-step") {
+ console.log("wait: " + gWaitCounter);
+ if (gWaitCounter == 0) {
+ gAction.removeEventListener(aEvent.type, loadPrefs, false);
+ gMapPrefsLoaded = true;
+ console.log("prefs loaded.");
+
+ gTrackCanvas.addEventListener("mouseup", mapEvHandler, false);
+ gTrackCanvas.addEventListener("mousemove", mapEvHandler, false);
+ gTrackCanvas.addEventListener("mousedown", mapEvHandler, false);
+ gTrackCanvas.addEventListener("mouseout", mapEvHandler, false);
+
+ gTrackCanvas.addEventListener("touchstart", mapEvHandler, false);
+ gTrackCanvas.addEventListener("touchmove", mapEvHandler, false);
+ gTrackCanvas.addEventListener("touchend", mapEvHandler, false);
+ gTrackCanvas.addEventListener("touchcancel", mapEvHandler, false);
+ gTrackCanvas.addEventListener("touchleave", mapEvHandler, false);
+
+ gTrackCanvas.addEventListener("wheel", mapEvHandler, false);
+
+ document.getElementById("body").addEventListener("keydown", mapEvHandler, false);
+
+ document.getElementById("copyright").innerHTML =
+ gMapStyles[gActiveMap].copyright;
+
+ gLoadingTile = new Image();
+ gLoadingTile.src = "style/loading.png";
+ gLoadingTile.onload = function() {
+ var throwEv = new CustomEvent("mapinit-done");
+ gAction.dispatchEvent(throwEv);
+ };
+ }
+ }
+ else {
+ if (aEvent)
+ gAction.removeEventListener(aEvent.type, loadPrefs, false);
+ gAction.addEventListener("prefs-step", loadPrefs, false);
+ gWaitCounter++;
+ gPrefs.get("position", function(aValue) {
+ if (aValue) {
+ gPos = aValue;
+ }
+ gWaitCounter--;
+ var throwEv = new CustomEvent("prefs-step");
+ gAction.dispatchEvent(throwEv);
+ });
+ gWaitCounter++;
+ gPrefs.get("center_map", function(aValue) {
+ if (aValue === undefined)
+ document.getElementById("centerCheckbox").checked = true;
+ else
+ document.getElementById("centerCheckbox").checked = aValue;
+ setCentering(document.getElementById("centerCheckbox"));
+ gWaitCounter--;
+ var throwEv = new CustomEvent("prefs-step");
+ gAction.dispatchEvent(throwEv);
+ });
+ gWaitCounter++;
+ gPrefs.get("tracking_enabled", function(aValue) {
+ if (aValue === undefined)
+ document.getElementById("trackCheckbox").checked = true;
+ else
+ document.getElementById("trackCheckbox").checked = aValue;
+ gWaitCounter--;
+ var throwEv = new CustomEvent("prefs-step");
+ gAction.dispatchEvent(throwEv);
+ });
+ gWaitCounter++;
+ var trackLoadStarted = false;
+ gTrackStore.getListStepped(function(aTPoint) {
+ if (aTPoint) {
+ // Add in front and return new length.
+ var tracklen = gTrack.unshift(aTPoint);
+ // Redraw track every 100 values (initial paint will do first anyhow).
+ if (tracklen % 100 == 0)
+ drawTrack();
+ }
+ else {
+ // Last point received.
+ drawTrack();
+ }
+ if (!trackLoadStarted) {
+ // We have the most recent point, if present, rest will load async.
+ trackLoadStarted = true;
+ gWaitCounter--;
+ var throwEv = new CustomEvent("prefs-step");
+ gAction.dispatchEvent(throwEv);
+ }
+ });
+ }
}
function resizeAndDraw() {
}
}
}
+ drawTrack();
+}
+
+function drawTrack() {
gLastDrawnPoint = null;
gCurPosMapCache = undefined;
gTrackContext.clearRect(0, 0, gTrackCanvas.width, gTrackCanvas.height);
handleEvent: function(aEvent) {
var touchEvent = aEvent.type.indexOf('touch') != -1;
+ // Bail out if the event is happening on an input.
+ if (aEvent.target.tagName.toLowerCase() == "input")
+ return;
+
// Bail out on unwanted map moves, but not zoom or keyboard events.
if (aEvent.type.indexOf("mouse") === 0 || aEvent.type.indexOf("touch") === 0) {
// Bail out if this is neither a touch nor left-click.
case "mousedown":
case "touchstart":
if (touchEvent) {
+ if (aEvent.targetTouches.length == 2) {
+ gPinchStartWidth = Math.sqrt(
+ Math.pow(aEvent.targetTouches.item(1).clientX -
+ aEvent.targetTouches.item(0).clientX, 2) +
+ Math.pow(aEvent.targetTouches.item(1).clientY -
+ aEvent.targetTouches.item(0).clientY, 2)
+ );
+ }
gDragTouchID = aEvent.changedTouches.item(0).identifier;
coordObj = aEvent.changedTouches.identifiedTouch(gDragTouchID);
}
break;
case "mousemove":
case "touchmove":
+ if (touchEvent && aEvent.targetTouches.length == 2) {
+ curPinchStartWidth = Math.sqrt(
+ Math.pow(aEvent.targetTouches.item(1).clientX -
+ aEvent.targetTouches.item(0).clientX, 2) +
+ Math.pow(aEvent.targetTouches.item(1).clientY -
+ aEvent.targetTouches.item(0).clientY, 2)
+ );
+ if (!gPinchStartWidth)
+ gPinchStartWidth = curPinchStartWidth;
+
+ if (gPinchStartWidth / curPinchStartWidth > 1.7 ||
+ gPinchStartWidth / curPinchStartWidth < 0.6) {
+ var newZoomLevel = gPos.z + (gPinchStartWidth < curPinchStartWidth ? 1 : -1);
+ if ((newZoomLevel >= 0) && (newZoomLevel <= gMaxZoom)) {
+ // Calculate new center of the map - preserve middle of pinch.
+ // This means that pixel distance between old center and middle
+ // must equal pixel distance of new center and middle.
+ var x = (aEvent.targetTouches.item(1).clientX +
+ aEvent.targetTouches.item(0).clientX) / 2 -
+ gMapCanvas.offsetLeft;
+ var y = (aEvent.targetTouches.item(1).clientY +
+ aEvent.targetTouches.item(0).clientY) / 2 -
+ gMapCanvas.offsetTop;
+
+ // Zoom factor after this action.
+ var newZoomFactor = Math.pow(2, gMaxZoom - newZoomLevel);
+ gPos.x -= (x - gMapCanvas.width / 2) * (newZoomFactor - gZoomFactor);
+ gPos.y -= (y - gMapCanvas.height / 2) * (newZoomFactor - gZoomFactor);
+
+ if (gPinchStartWidth < curPinchStartWidth)
+ zoomIn();
+ else
+ zoomOut();
+
+ // Reset pinch start width and start another pinch gesture.
+ gPinchStartWidth = null;
+ }
+ }
+ // If we are in a pinch, do not drag.
+ break;
+ }
var x = coordObj.clientX - gMapCanvas.offsetLeft;
var y = coordObj.clientY - gMapCanvas.offsetTop;
if (gDragging === true) {
break;
case "mouseup":
case "touchend":
+ gPinchStartWidth = null;
gDragging = false;
showUI();
break;
function clearTrack() {
gTrack = [];
gTrackStore.clear();
- drawMap({left: 0, right: 0, top: 0, bottom: 0});
+ drawTrack();
}
var gTileService = {