kinetic/momemtum dragging support, p=camptocamp, r=me (closes #2999)

git-svn-id: http://svn.openlayers.org/trunk/openlayers@11220 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf

lib/OpenLayers/Control/DragPan.js

@@ -43,16 +43,48 @@ OpenLayers.Control.DragPan = OpenLayers.Class(OpenLayers.Control, {
      *     mouse cursor leaves the map viewport. Default is false.
      */
     documentDrag: false,
-    
+
+    /**
+     * Property: kinetic
+     * {OpenLayers.Kinetic} The OpenLayers.Kinetic object.
+     */
+    kinetic: null,
+
+    /**
+     * APIProperty: enableKinetic
+     * {Boolean} Set this option to enable "kinetic dragging". Can be
+     *     set to true or to an object. If set to an object this
+     *     object will be passed to the {<OpenLayers.Kinetic>}
+     *     constructor. Defaults to false.
+     */
+    enableKinetic: false,
+
+    /**
+     * APIProperty: kineticInterval
+     * {Integer} Interval in milliseconds between 2 steps in the "kinetic
+     *     scrolling". Applies only if enableKinetic is set. Defaults
+     *     to 10 milliseconds.
+     */
+    kineticInterval: 10,
+
+
     /**
      * Method: draw
      * Creates a Drag handler, using <panMap> and
      * <panMapDone> as callbacks.
      */    
     draw: function() {
+        if(this.enableKinetic) {
+            var config = {interval: this.kineticInterval};
+            if(typeof this.enableKinetic === "object") {
+                config = OpenLayers.Util.extend(config, this.enableKinetic);
+            }
+            this.kinetic = new OpenLayers.Kinetic(config);
+        }
         this.handler = new OpenLayers.Handler.Drag(this, {
                 "move": this.panMap,
-                "done": this.panMapDone
+                "done": this.panMapDone,
+                "down": this.panMapStart
             }, {
                 interval: this.interval,
                 documentDrag: this.documentDrag
@@ -60,6 +92,15 @@ OpenLayers.Control.DragPan = OpenLayers.Class(OpenLayers.Control, {
         );
     },
 
+    /**
+     * Method: panMapStart
+     */
+    panMapStart: function() {
+        if(this.kinetic) {
+            this.kinetic.begin();
+        }
+    },
+
     /**
     * Method: panMap
     *
@@ -67,11 +108,14 @@ OpenLayers.Control.DragPan = OpenLayers.Class(OpenLayers.Control, {
     * xy - {<OpenLayers.Pixel>} Pixel of the mouse position
     */
     panMap: function(xy) {
+        if(this.kinetic) {
+            this.kinetic.update(xy);
+        }
         this.panned = true;
         this.map.pan(
             this.handler.last.x - xy.x,
             this.handler.last.y - xy.y,
-            {dragging: this.handler.dragging, animate: false}
+            {dragging: true, animate: false}
         );
     },
     
@@ -85,7 +129,21 @@ OpenLayers.Control.DragPan = OpenLayers.Class(OpenLayers.Control, {
      */
     panMapDone: function(xy) {
         if(this.panned) {
-            this.panMap(xy);
+            var res = null;
+            if (this.kinetic) {
+                res = this.kinetic.end(xy);
+            }
+            this.map.pan(
+                this.handler.last.x - xy.x,
+                this.handler.last.y - xy.y,
+                {dragging: !!res, animate: false}
+            );
+            if (res) {
+                var self = this;
+                this.kinetic.move(res, function(x, y, end) {
+                    self.map.pan(x, y, {dragging: !end, animate: false});
+                });
+            }
             this.panned = false;
         }
     },