DragPan.js 4.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153
  1. /* Copyright (c) 2006-2011 by OpenLayers Contributors (see authors.txt for
  2. * full list of contributors). Published under the Clear BSD license.
  3. * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
  4. * full text of the license. */
  5. /**
  6. * @requires OpenLayers/Control.js
  7. * @requires OpenLayers/Handler/Drag.js
  8. */
  9. /**
  10. * Class: OpenLayers.Control.DragPan
  11. * The DragPan control pans the map with a drag of the mouse.
  12. *
  13. * Inherits from:
  14. * - <OpenLayers.Control>
  15. */
  16. OpenLayers.Control.DragPan = OpenLayers.Class(OpenLayers.Control, {
  17. /**
  18. * Property: type
  19. * {OpenLayers.Control.TYPES}
  20. */
  21. type: OpenLayers.Control.TYPE_TOOL,
  22. /**
  23. * Property: panned
  24. * {Boolean} The map moved.
  25. */
  26. panned: false,
  27. /**
  28. * Property: interval
  29. * {Integer} The number of milliseconds that should ellapse before
  30. * panning the map again. Defaults to 1 millisecond. In most cases
  31. * you won't want to change this value. For slow machines/devices
  32. * larger values can be tried out.
  33. */
  34. interval: 1,
  35. /**
  36. * APIProperty: documentDrag
  37. * {Boolean} If set to true, mouse dragging will continue even if the
  38. * mouse cursor leaves the map viewport. Default is false.
  39. */
  40. documentDrag: false,
  41. /**
  42. * Property: kinetic
  43. * {OpenLayers.Kinetic} The OpenLayers.Kinetic object.
  44. */
  45. kinetic: null,
  46. /**
  47. * APIProperty: enableKinetic
  48. * {Boolean} Set this option to enable "kinetic dragging". Can be
  49. * set to true or to an object. If set to an object this
  50. * object will be passed to the {<OpenLayers.Kinetic>}
  51. * constructor. Defaults to false.
  52. */
  53. enableKinetic: false,
  54. /**
  55. * APIProperty: kineticInterval
  56. * {Integer} Interval in milliseconds between 2 steps in the "kinetic
  57. * scrolling". Applies only if enableKinetic is set. Defaults
  58. * to 10 milliseconds.
  59. */
  60. kineticInterval: 10,
  61. /**
  62. * Method: draw
  63. * Creates a Drag handler, using <panMap> and
  64. * <panMapDone> as callbacks.
  65. */
  66. draw: function() {
  67. if(this.enableKinetic) {
  68. var config = {interval: this.kineticInterval};
  69. if(typeof this.enableKinetic === "object") {
  70. config = OpenLayers.Util.extend(config, this.enableKinetic);
  71. }
  72. this.kinetic = new OpenLayers.Kinetic(config);
  73. }
  74. this.handler = new OpenLayers.Handler.Drag(this, {
  75. "move": this.panMap,
  76. "done": this.panMapDone,
  77. "down": this.panMapStart
  78. }, {
  79. interval: this.interval,
  80. documentDrag: this.documentDrag
  81. }
  82. );
  83. },
  84. /**
  85. * Method: panMapStart
  86. */
  87. panMapStart: function() {
  88. if(this.kinetic) {
  89. this.kinetic.begin();
  90. }
  91. },
  92. /**
  93. * Method: panMap
  94. *
  95. * Parameters:
  96. * xy - {<OpenLayers.Pixel>} Pixel of the mouse position
  97. */
  98. panMap: function(xy) {
  99. if(this.kinetic) {
  100. this.kinetic.update(xy);
  101. }
  102. this.panned = true;
  103. this.map.pan(
  104. this.handler.last.x - xy.x,
  105. this.handler.last.y - xy.y,
  106. {dragging: true, animate: false}
  107. );
  108. },
  109. /**
  110. * Method: panMapDone
  111. * Finish the panning operation. Only call setCenter (through <panMap>)
  112. * if the map has actually been moved.
  113. *
  114. * Parameters:
  115. * xy - {<OpenLayers.Pixel>} Pixel of the mouse position
  116. */
  117. panMapDone: function(xy) {
  118. if(this.panned) {
  119. var res = null;
  120. if (this.kinetic) {
  121. res = this.kinetic.end(xy);
  122. }
  123. this.map.pan(
  124. this.handler.last.x - xy.x,
  125. this.handler.last.y - xy.y,
  126. {dragging: !!res, animate: false}
  127. );
  128. if (res) {
  129. var self = this;
  130. this.kinetic.move(res, function(x, y, end) {
  131. self.map.pan(x, y, {dragging: !end, animate: false});
  132. });
  133. }
  134. this.panned = false;
  135. }
  136. },
  137. CLASS_NAME: "OpenLayers.Control.DragPan"
  138. });