MSPointer.js 4.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133
  1. /* *
  2. *
  3. * (c) 2010-2019 Torstein Honsi
  4. *
  5. * License: www.highcharts.com/license
  6. *
  7. * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!
  8. *
  9. * */
  10. 'use strict';
  11. import H from './Globals.js';
  12. /* globals MSPointerEvent, PointerEvent */
  13. import U from './Utilities.js';
  14. var extend = U.extend, objectEach = U.objectEach, wrap = U.wrap;
  15. import './Pointer.js';
  16. var addEvent = H.addEvent, charts = H.charts, css = H.css, doc = H.doc, hasTouch = H.hasTouch, noop = H.noop, Pointer = H.Pointer, removeEvent = H.removeEvent, win = H.win;
  17. if (!hasTouch && (win.PointerEvent || win.MSPointerEvent)) {
  18. // The touches object keeps track of the points being touched at all times
  19. var touches = {}, hasPointerEvent = !!win.PointerEvent, getWebkitTouches = function () {
  20. var fake = [];
  21. fake.item = function (i) {
  22. return this[i];
  23. };
  24. objectEach(touches, function (touch) {
  25. fake.push({
  26. pageX: touch.pageX,
  27. pageY: touch.pageY,
  28. target: touch.target
  29. });
  30. });
  31. return fake;
  32. }, translateMSPointer = function (e, method, wktype, func) {
  33. var p;
  34. if ((e.pointerType === 'touch' ||
  35. e.pointerType === e.MSPOINTER_TYPE_TOUCH) && charts[H.hoverChartIndex]) {
  36. func(e);
  37. p = charts[H.hoverChartIndex].pointer;
  38. p[method]({
  39. type: wktype,
  40. target: e.currentTarget,
  41. preventDefault: noop,
  42. touches: getWebkitTouches()
  43. });
  44. }
  45. };
  46. /* eslint-disable no-invalid-this, valid-jsdoc */
  47. // Extend the Pointer prototype with methods for each event handler and more
  48. extend(Pointer.prototype, /** @lends Pointer.prototype */ {
  49. /**
  50. * @private
  51. * @function Highcharts.Pointer#onContainerPointerDown
  52. *
  53. * @param {Highcharts.PointerEventObject} e
  54. *
  55. * @return {void}
  56. */
  57. onContainerPointerDown: function (e) {
  58. translateMSPointer(e, 'onContainerTouchStart', 'touchstart', function (e) {
  59. touches[e.pointerId] = {
  60. pageX: e.pageX,
  61. pageY: e.pageY,
  62. target: e.currentTarget
  63. };
  64. });
  65. },
  66. /**
  67. * @private
  68. * @function Highcharts.Pointer#onContainerPointerMove
  69. *
  70. * @param {Highcharts.PointerEventObject} e
  71. *
  72. * @return {void}
  73. */
  74. onContainerPointerMove: function (e) {
  75. translateMSPointer(e, 'onContainerTouchMove', 'touchmove', function (e) {
  76. touches[e.pointerId] = ({ pageX: e.pageX, pageY: e.pageY });
  77. if (!touches[e.pointerId].target) {
  78. touches[e.pointerId].target = e.currentTarget;
  79. }
  80. });
  81. },
  82. /**
  83. * @private
  84. * @function Highcharts.Pointer#onDocumentPointerUp
  85. *
  86. * @param {Highcharts.PointerEventObject} e
  87. *
  88. * @return {void}
  89. */
  90. onDocumentPointerUp: function (e) {
  91. translateMSPointer(e, 'onDocumentTouchEnd', 'touchend', function (e) {
  92. delete touches[e.pointerId];
  93. });
  94. },
  95. /**
  96. * Add or remove the MS Pointer specific events
  97. *
  98. * @private
  99. * @function Highcharts.Pointer#batchMSEvents
  100. *
  101. * @param {Function} fn
  102. *
  103. * @return {void}
  104. */
  105. batchMSEvents: function (fn) {
  106. fn(this.chart.container, hasPointerEvent ? 'pointerdown' : 'MSPointerDown', this.onContainerPointerDown);
  107. fn(this.chart.container, hasPointerEvent ? 'pointermove' : 'MSPointerMove', this.onContainerPointerMove);
  108. fn(doc, hasPointerEvent ? 'pointerup' : 'MSPointerUp', this.onDocumentPointerUp);
  109. }
  110. });
  111. // Disable default IE actions for pinch and such on chart element
  112. wrap(Pointer.prototype, 'init', function (proceed, chart, options) {
  113. proceed.call(this, chart, options);
  114. if (this.hasZoom) { // #4014
  115. css(chart.container, {
  116. '-ms-touch-action': 'none',
  117. 'touch-action': 'none'
  118. });
  119. }
  120. });
  121. // Add IE specific touch events to chart
  122. wrap(Pointer.prototype, 'setDOMEvents', function (proceed) {
  123. proceed.apply(this);
  124. if (this.hasZoom || this.followTouchMove) {
  125. this.batchMSEvents(addEvent);
  126. }
  127. });
  128. // Destroy MS events also
  129. wrap(Pointer.prototype, 'destroy', function (proceed) {
  130. this.batchMSEvents(removeEvent);
  131. proceed.call(this);
  132. });
  133. }