touchEmulator.js 4.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197
  1. /* eslint-disable */
  2. /**
  3. * Emulate touch event
  4. * Source:https://github.com/hammerjs/touchemulator
  5. */
  6. var eventTarget;
  7. var supportTouch = 'ontouchstart' in window;
  8. // polyfills
  9. if (!document.createTouch) {
  10. document.createTouch = function(
  11. view,
  12. target,
  13. identifier,
  14. pageX,
  15. pageY,
  16. screenX,
  17. screenY
  18. ) {
  19. // auto set
  20. return new Touch(
  21. target,
  22. identifier,
  23. {
  24. pageX: pageX,
  25. pageY: pageY,
  26. screenX: screenX,
  27. screenY: screenY,
  28. clientX: pageX - window.pageXOffset,
  29. clientY: pageY - window.pageYOffset
  30. },
  31. 0,
  32. 0
  33. );
  34. };
  35. }
  36. if (!document.createTouchList) {
  37. document.createTouchList = function() {
  38. var touchList = TouchList();
  39. for (var i = 0; i < arguments.length; i++) {
  40. touchList[i] = arguments[i];
  41. }
  42. touchList.length = arguments.length;
  43. return touchList;
  44. };
  45. }
  46. /**
  47. * create an touch point
  48. * @constructor
  49. * @param target
  50. * @param identifier
  51. * @param pos
  52. * @param deltaX
  53. * @param deltaY
  54. * @returns {Object} touchPoint
  55. */
  56. var Touch = function Touch(target, identifier, pos, deltaX, deltaY) {
  57. deltaX = deltaX || 0;
  58. deltaY = deltaY || 0;
  59. this.identifier = identifier;
  60. this.target = target;
  61. this.clientX = pos.clientX + deltaX;
  62. this.clientY = pos.clientY + deltaY;
  63. this.screenX = pos.screenX + deltaX;
  64. this.screenY = pos.screenY + deltaY;
  65. this.pageX = pos.pageX + deltaX;
  66. this.pageY = pos.pageY + deltaY;
  67. };
  68. /**
  69. * create empty touchlist with the methods
  70. * @constructor
  71. * @returns touchList
  72. */
  73. function TouchList() {
  74. var touchList = [];
  75. touchList['item'] = function(index) {
  76. return this[index] || null;
  77. };
  78. // specified by Mozilla
  79. touchList['identifiedTouch'] = function(id) {
  80. return this[id + 1] || null;
  81. };
  82. return touchList;
  83. }
  84. /**
  85. * only trigger touches when the left mousebutton has been pressed
  86. * @param touchType
  87. * @returns {Function}
  88. */
  89. var initiated = false;
  90. function onMouse(touchType) {
  91. return function(ev) {
  92. // prevent mouse events
  93. if (ev.type === 'mousedown') {
  94. initiated = true;
  95. }
  96. if (ev.type === 'mouseup') {
  97. initiated = false;
  98. }
  99. if (ev.type === 'mousemove' && !initiated) {
  100. return;
  101. }
  102. // The EventTarget on which the touch point started when it was first placed on the surface,
  103. // even if the touch point has since moved outside the interactive area of that element.
  104. // also, when the target doesnt exist anymore, we update it
  105. if (
  106. ev.type === 'mousedown' ||
  107. !eventTarget ||
  108. (eventTarget && !eventTarget.dispatchEvent)
  109. ) {
  110. eventTarget = ev.target;
  111. }
  112. triggerTouch(touchType, ev);
  113. // reset
  114. if (ev.type === 'mouseup') {
  115. eventTarget = null;
  116. }
  117. };
  118. }
  119. /**
  120. * trigger a touch event
  121. * @param eventName
  122. * @param mouseEv
  123. */
  124. function triggerTouch(eventName, mouseEv) {
  125. var touchEvent = document.createEvent('Event');
  126. touchEvent.initEvent(eventName, true, true);
  127. touchEvent.altKey = mouseEv.altKey;
  128. touchEvent.ctrlKey = mouseEv.ctrlKey;
  129. touchEvent.metaKey = mouseEv.metaKey;
  130. touchEvent.shiftKey = mouseEv.shiftKey;
  131. touchEvent.touches = getActiveTouches(mouseEv);
  132. touchEvent.targetTouches = getActiveTouches(mouseEv);
  133. touchEvent.changedTouches = createTouchList(mouseEv);
  134. eventTarget.dispatchEvent(touchEvent);
  135. }
  136. /**
  137. * create a touchList based on the mouse event
  138. * @param mouseEv
  139. * @returns {TouchList}
  140. */
  141. function createTouchList(mouseEv) {
  142. var touchList = TouchList();
  143. touchList.push(new Touch(eventTarget, 1, mouseEv, 0, 0));
  144. return touchList;
  145. }
  146. /**
  147. * receive all active touches
  148. * @param mouseEv
  149. * @returns {TouchList}
  150. */
  151. function getActiveTouches(mouseEv) {
  152. // empty list
  153. if (mouseEv.type === 'mouseup') {
  154. return TouchList();
  155. }
  156. return createTouchList(mouseEv);
  157. }
  158. /**
  159. * TouchEmulator initializer
  160. */
  161. function TouchEmulator() {
  162. window.addEventListener('mousedown', onMouse('touchstart'), true);
  163. window.addEventListener('mousemove', onMouse('touchmove'), true);
  164. window.addEventListener('mouseup', onMouse('touchend'), true);
  165. }
  166. // start distance when entering the multitouch mode
  167. TouchEmulator['multiTouchOffset'] = 75;
  168. if (!supportTouch) {
  169. new TouchEmulator();
  170. }