prevent map zoom snapback effect

Overload PinchZoom control to check if we are at the limits of zoom and
if so ignore any pinch zoom that tries to go past those limits. This
stops the visual glitch of the zoom sort of working and then snaping back
and also gives a visual indication of when the zoom limits have been
reached.

Fixes #118

1 files changed, 25 insertions, 0 deletions

diff --git a/src/js/map-OpenLayers.js b/src/js/map-OpenLayers.js
index f120391..f6bc663 100644
--- a/src/js/map-OpenLayers.js
+++ b/src/js/map-OpenLayers.js
@@ -406,3 +406,28 @@ OpenLayers.Control.ActionAfterDrag = OpenLayers.Class(OpenLayers.Control, {
         }
     }
 });
+
+
+// Overload the PinchZoom control so we can stop zoom snapback when we
+// reach the limit of zooming
+OpenLayers.Control.PinchZoom = OpenLayers.Class(OpenLayers.Control.PinchZoom,{
+    pinchMove: function(evt,pinchData) {
+        var maxZoom = fixmystreet.numZoomLevels - 1;
+        var scale = pinchData.scale;
+        var containerOrigin = this.containerOrigin;
+        var pinchOrigin = this.pinchOrigin;
+        var current = evt.xy;
+        var dx = Math.round((current.x-pinchOrigin.x) + (scale-1) * (containerOrigin.x-pinchOrigin.x));
+        var dy = Math.round((current.y-pinchOrigin.y) + (scale-1) * (containerOrigin.y-pinchOrigin.y));
+
+        // if we are at the limits of the zoom then do nothing to stop zoom snapback effect
+        var mapZoom = this.map.getZoom();
+        if ( ( ( dx < 0 || dy < 0 ) && mapZoom == maxZoom ) || ( ( dx > 0 || dy > 0 ) && mapZoom == 0 ) ) {
+            return false;
+        }
+
+        this.applyTransform("translate("+dx+"px, "+dy+"px) scale("+scale+")");
+        this.currentCenter=current;
+    },
+    CLASS_NAME: "OpenLayers.Control.PinchZoom"
+});