X-Git-Url: https://git-public.kairo.at/?p=lantea.git;a=blobdiff_plain;f=js%2Fmap.js;h=5c93ae5741dbf71885253461fbe3e7b6e2a4cd32;hp=3cc00c5384c6fd6b97bbf00496a5d91404819f6b;hb=362a6833c5e41dc0d006667b4ef8bb15d898dc4b;hpb=6ddefbf98ebff13592de1d87a3bfc2796ac06d84 diff --git a/js/map.js b/js/map.js index 3cc00c5..5c93ae5 100644 --- a/js/map.js +++ b/js/map.js @@ -61,7 +61,7 @@ var gLoadingTile; var gMapPrefsLoaded = false; var gDragging = false; -var gDragTouchID; +var gDragTouchID, gPinchStartWidth; var gGeoWatchID; var gTrack = []; @@ -163,13 +163,17 @@ function loadPrefs(aEvent) { }); gWaitCounter++; var trackLoadStarted = false; + var redrawBase = 100; 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) + // Redraw track periodically, larger distance the longer it gets. + // Initial paint will do initial track drawing. + if (tracklen % redrawBase == 0) { drawTrack(); + redrawBase = tracklen; + } } else { // Last point received. @@ -482,6 +486,14 @@ var mapEvHandler = { 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); } @@ -497,6 +509,47 @@ var mapEvHandler = { 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) { @@ -525,6 +578,7 @@ var mapEvHandler = { break; case "mouseup": case "touchend": + gPinchStartWidth = null; gDragging = false; showUI(); break;