swipe.js 3.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143
  1. define("dojox/gesture/swipe", [
  2. "dojo/_base/kernel",
  3. "dojo/_base/declare",
  4. "./Base",
  5. "../main"
  6. ], function(kernel, declare, Base, dojox){
  7. // module:
  8. // dojox/gesture/swipe
  9. /*=====
  10. dojox.gesture.swipe = {
  11. // summary:
  12. // This module provides swipe gestures including:
  13. //
  14. // 1. dojox.gesture.swipe
  15. //
  16. // A series of 'swipe' will be fired during touchmove, this will mostly
  17. // be used to keep sliding the Dom target based on the swiped distance(dx, dy).
  18. //
  19. // 2. dojox.gesture.swipe.end
  20. //
  21. // Fired when a swipe is ended so that an bounce animation may be applied
  22. // to the dom target sliding to the final position.
  23. //
  24. // Following information will be included in the fired swipe events:
  25. //
  26. // 1. type: 'swipe'|'swipe.end'
  27. //
  28. // 2. time: an integer indicating the delta time(in milliseconds)
  29. //
  30. // 3. dx: delta distance on X axis, dx less than 0 - moving left, dx larger than 0 - moving right
  31. //
  32. // 4. dy: delta distance on Y axis, dy less than 0 - moving up, dY larger than 0 - moving down
  33. //
  34. // Note - dx and dy can also be used together for a hybrid swipe(both vertically and horizontally)
  35. //
  36. // example:
  37. // A. Used with dojo.connect()
  38. // | dojo.connect(node, dojox.gesture.swipe, function(e){});
  39. // | dojo.connect(node, dojox.gesture.swipe.end, function(e){});
  40. //
  41. // B. Used with dojo.on
  42. // | define(['dojo/on', 'dojox/gesture/swipe'], function(on, swipe){
  43. // | on(node, swipe, function(e){});
  44. // | on(node, swipe.end, function(e){});
  45. //
  46. // C. Used with dojox.gesture.swipe.* directly
  47. // | dojox.gesture.swipe(node, function(e){});
  48. // | dojox.gesture.swipe.end(node, function(e){});
  49. };
  50. =====*/
  51. kernel.experimental("dojox.gesture.swipe");
  52. // Declare an internal anonymous class which will only be exported
  53. // by module return value e.g. dojox.gesture.swipe.Swipe
  54. var clz = declare(/*===== "dojox.gesture.swipe", =====*/Base, {
  55. // defaultEvent: [readonly] String
  56. // Default event - 'swipe'
  57. defaultEvent: "swipe",
  58. // subEvents: [readonly] Array
  59. // List of sub events, used by
  60. // being combined with defaultEvent as 'swipe.end'
  61. subEvents: ["end"],
  62. press: function(/*Object*/data, /*Event*/e){
  63. // summary:
  64. // Overwritten, set initial swipe info
  65. if(e.touches && e.touches.length >= 2){
  66. //currently only support single-touch swipe
  67. delete data.context;
  68. return;
  69. }
  70. if(!data.context){
  71. data.context = {x: 0, y: 0, t: 0};
  72. }
  73. data.context.x = e.screenX;
  74. data.context.y = e.screenY;
  75. data.context.t = new Date().getTime();
  76. this.lock(e.currentTarget);
  77. },
  78. move: function(/*Object*/data, /*Event*/e){
  79. // summary:
  80. // Overwritten, fire matched 'swipe' during touchmove
  81. this._recognize(data, e, "swipe");
  82. },
  83. release: function(/*Object*/data, /*Event*/e){
  84. // summary:
  85. // Overwritten, fire matched 'swipe.end' when touchend
  86. this._recognize(data, e, "swipe.end");
  87. delete data.context;
  88. this.unLock();
  89. },
  90. cancel: function(data, e){
  91. // summary:
  92. // Overwritten
  93. delete data.context;
  94. this.unLock();
  95. },
  96. _recognize: function(/*Object*/data, /*Event*/e, /*String*/type){
  97. // summary:
  98. // Recognize and fire appropriate gesture events
  99. if(!data.context){
  100. return;
  101. }
  102. var info = this._getSwipeInfo(data, e);
  103. if(!info){
  104. // no swipe happened
  105. return;
  106. }
  107. info.type = type;
  108. this.fire(e.target, info);
  109. },
  110. _getSwipeInfo: function(/*Object*/data, /*Event*/e){
  111. // summary:
  112. // Calculate swipe information - time, dx and dy
  113. var dx, dy, info = {}, startData = data.context;
  114. info.time = new Date().getTime() - startData.t;
  115. dx = e.screenX - startData.x;
  116. dy = e.screenY - startData.y;
  117. if(dx === 0 && dy === 0){
  118. // no swipes happened
  119. return null;
  120. }
  121. info.dx = dx;
  122. info.dy = dy;
  123. return info;
  124. }
  125. });
  126. // the default swipe instance for handy use
  127. dojox.gesture.swipe = new clz();
  128. // Class for creating a new Swipe instance
  129. dojox.gesture.swipe.Swipe = clz;
  130. return dojox.gesture.swipe;
  131. });