DragPan.js 4.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156
  1. /* Copyright (c) 2006-2013 by OpenLayers Contributors (see authors.txt for
  2. * full list of contributors). Published under the 2-clause BSD license.
  3. * See license.txt in the OpenLayers distribution or repository 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 0 milliseconds, which means that
  31. * no separate cycle is used for panning. In most cases you won't want
  32. * to change this value. For slow machines/devices larger values can be
  33. * tried out.
  34. */
  35. interval: 0,
  36. /**
  37. * APIProperty: documentDrag
  38. * {Boolean} If set to true, mouse dragging will continue even if the
  39. * mouse cursor leaves the map viewport. Default is false.
  40. */
  41. documentDrag: false,
  42. /**
  43. * Property: kinetic
  44. * {<OpenLayers.Kinetic>} The OpenLayers.Kinetic object.
  45. */
  46. kinetic: null,
  47. /**
  48. * APIProperty: enableKinetic
  49. * {Boolean} Set this option to enable "kinetic dragging". Can be
  50. * set to true or to an object. If set to an object this
  51. * object will be passed to the {<OpenLayers.Kinetic>}
  52. * constructor. Defaults to true.
  53. * To get kinetic dragging, ensure that OpenLayers/Kinetic.js is
  54. * included in your build config.
  55. */
  56. enableKinetic: true,
  57. /**
  58. * APIProperty: kineticInterval
  59. * {Integer} Interval in milliseconds between 2 steps in the "kinetic
  60. * scrolling". Applies only if enableKinetic is set. Defaults
  61. * to 10 milliseconds.
  62. */
  63. kineticInterval: 10,
  64. /**
  65. * Method: draw
  66. * Creates a Drag handler, using <panMap> and
  67. * <panMapDone> as callbacks.
  68. */
  69. draw: function() {
  70. if (this.enableKinetic && OpenLayers.Kinetic) {
  71. var config = {interval: this.kineticInterval};
  72. if(typeof this.enableKinetic === "object") {
  73. config = OpenLayers.Util.extend(config, this.enableKinetic);
  74. }
  75. this.kinetic = new OpenLayers.Kinetic(config);
  76. }
  77. this.handler = new OpenLayers.Handler.Drag(this, {
  78. "move": this.panMap,
  79. "done": this.panMapDone,
  80. "down": this.panMapStart
  81. }, {
  82. interval: this.interval,
  83. documentDrag: this.documentDrag
  84. }
  85. );
  86. },
  87. /**
  88. * Method: panMapStart
  89. */
  90. panMapStart: function() {
  91. if(this.kinetic) {
  92. this.kinetic.begin();
  93. }
  94. },
  95. /**
  96. * Method: panMap
  97. *
  98. * Parameters:
  99. * xy - {<OpenLayers.Pixel>} Pixel of the mouse position
  100. */
  101. panMap: function(xy) {
  102. if(this.kinetic) {
  103. this.kinetic.update(xy);
  104. }
  105. this.panned = true;
  106. this.map.pan(
  107. this.handler.last.x - xy.x,
  108. this.handler.last.y - xy.y,
  109. {dragging: true, animate: false}
  110. );
  111. },
  112. /**
  113. * Method: panMapDone
  114. * Finish the panning operation. Only call setCenter (through <panMap>)
  115. * if the map has actually been moved.
  116. *
  117. * Parameters:
  118. * xy - {<OpenLayers.Pixel>} Pixel of the mouse position
  119. */
  120. panMapDone: function(xy) {
  121. if(this.panned) {
  122. var res = null;
  123. if (this.kinetic) {
  124. res = this.kinetic.end(xy);
  125. }
  126. this.map.pan(
  127. this.handler.last.x - xy.x,
  128. this.handler.last.y - xy.y,
  129. {dragging: !!res, animate: false}
  130. );
  131. if (res) {
  132. var self = this;
  133. this.kinetic.move(res, function(x, y, end) {
  134. self.map.pan(x, y, {dragging: !end, animate: false});
  135. });
  136. }
  137. this.panned = false;
  138. }
  139. },
  140. CLASS_NAME: "OpenLayers.Control.DragPan"
  141. });