Migrate transform event to TS

DevExpress · Jul 19, 2024 · 9d4fc76 · 9d4fc76
1 parent 5a4441e
commit 9d4fc76
Show file tree

Hide file tree

Showing 2 changed files with 135 additions and 130 deletions.
diff --git a/packages/devextreme/js/__internal/events/m_transform.ts b/packages/devextreme/js/__internal/events/m_transform.ts
@@ -1,8 +1,13 @@
-import { sign as mathSign, fitIntoRange } from '../core/utils/math';
-import * as iteratorUtils from '../core/utils/iterator';
-import { hasTouches } from './utils/index';
-import Emitter from './core/emitter';
-import registerEmitter from './core/emitter_registrator';
+import * as iteratorUtils from '@js/core/utils/iterator';
+import { fitIntoRange, sign as mathSign } from '@js/core/utils/math';
+import Emitter from '@js/events/core/emitter';
+import registerEmitter from '@js/events/core/emitter_registrator';
+import { hasTouches } from '@js/events/utils/index';
+
+interface EventAlias {
+  name: string;
+  args: any;
+}
 
 const DX_PREFIX = 'dx';
 
@@ -15,140 +20,138 @@ const START_POSTFIX = 'start';
 const UPDATE_POSTFIX = '';
 const END_POSTFIX = 'end';
 
-const eventAliases = [];
-const addAlias = function(eventName, eventArgs) {
-    eventAliases.push({
-        name: eventName,
-        args: eventArgs
-    });
+const eventAliases: EventAlias[] = [];
+const addAlias = function (eventName, eventArgs) {
+  eventAliases.push({
+    name: eventName,
+    args: eventArgs,
+  });
 };
 
 addAlias(TRANSFORM, {
-    scale: true,
-    deltaScale: true,
-    rotation: true,
-    deltaRotation: true,
-    translation: true,
-    deltaTranslation: true
+  scale: true,
+  deltaScale: true,
+  rotation: true,
+  deltaRotation: true,
+  translation: true,
+  deltaTranslation: true,
 });
 
 addAlias(TRANSLATE, {
-    translation: true,
-    deltaTranslation: true
+  translation: true,
+  deltaTranslation: true,
 });
 
 addAlias(PINCH, {
-    scale: true,
-    deltaScale: true
+  scale: true,
+  deltaScale: true,
 });
 
 addAlias(ROTATE, {
-    rotation: true,
-    deltaRotation: true
+  rotation: true,
+  deltaRotation: true,
 });
 
-
-const getVector = function(first, second) {
-    return {
-        x: second.pageX - first.pageX,
-        y: -second.pageY + first.pageY,
-        centerX: (second.pageX + first.pageX) * 0.5,
-        centerY: (second.pageY + first.pageY) * 0.5
-    };
+const getVector = function (first, second) {
+  return {
+    x: second.pageX - first.pageX,
+    y: -second.pageY + first.pageY,
+    centerX: (second.pageX + first.pageX) * 0.5,
+    centerY: (second.pageY + first.pageY) * 0.5,
+  };
 };
 
-const getEventVector = function(e) {
-    const pointers = e.pointers;
+const getEventVector = function (e) {
+  const { pointers } = e;
 
-    return getVector(pointers[0], pointers[1]);
+  return getVector(pointers[0], pointers[1]);
 };
 
-const getDistance = function(vector) {
-    return Math.sqrt(vector.x * vector.x + vector.y * vector.y);
+const getDistance = function (vector) {
+  return Math.sqrt(vector.x * vector.x + vector.y * vector.y);
 };
 
-const getScale = function(firstVector, secondVector) {
-    return getDistance(firstVector) / getDistance(secondVector);
+const getScale = function (firstVector, secondVector) {
+  return getDistance(firstVector) / getDistance(secondVector);
 };
 
-const getRotation = function(firstVector, secondVector) {
-    const scalarProduct = firstVector.x * secondVector.x + firstVector.y * secondVector.y;
-    const distanceProduct = getDistance(firstVector) * getDistance(secondVector);
+const getRotation = function (firstVector, secondVector) {
+  const scalarProduct = firstVector.x * secondVector.x + firstVector.y * secondVector.y;
+  const distanceProduct = getDistance(firstVector) * getDistance(secondVector);
 
-    if(distanceProduct === 0) {
-        return 0;
-    }
+  if (distanceProduct === 0) {
+    return 0;
+  }
 
-    const sign = mathSign(firstVector.x * secondVector.y - secondVector.x * firstVector.y);
-    const angle = Math.acos(fitIntoRange(scalarProduct / distanceProduct, -1, 1));
+  const sign = mathSign(firstVector.x * secondVector.y - secondVector.x * firstVector.y);
+  const angle = Math.acos(fitIntoRange(scalarProduct / distanceProduct, -1, 1));
 
-    return sign * angle;
+  return sign * angle;
 };
 
-const getTranslation = function(firstVector, secondVector) {
-    return {
-        x: firstVector.centerX - secondVector.centerX,
-        y: firstVector.centerY - secondVector.centerY
-    };
+const getTranslation = function (firstVector, secondVector) {
+  return {
+    x: firstVector.centerX - secondVector.centerX,
+    y: firstVector.centerY - secondVector.centerY,
+  };
 };
 
 const TransformEmitter = Emitter.inherit({
 
-    validatePointers: function(e) {
-        return hasTouches(e) > 1;
-    },
-
-    start: function(e) {
-        this._accept(e);
-
-        const startVector = getEventVector(e);
-        this._startVector = startVector;
-        this._prevVector = startVector;
-
-        this._fireEventAliases(START_POSTFIX, e);
-    },
-
-    move: function(e) {
-        const currentVector = getEventVector(e);
-        const eventArgs = this._getEventArgs(currentVector);
-
-        this._fireEventAliases(UPDATE_POSTFIX, e, eventArgs);
-        this._prevVector = currentVector;
-    },
-
-    end: function(e) {
-        const eventArgs = this._getEventArgs(this._prevVector);
-        this._fireEventAliases(END_POSTFIX, e, eventArgs);
-    },
-
-    _getEventArgs: function(vector) {
-        return {
-            scale: getScale(vector, this._startVector),
-            deltaScale: getScale(vector, this._prevVector),
-            rotation: getRotation(vector, this._startVector),
-            deltaRotation: getRotation(vector, this._prevVector),
-            translation: getTranslation(vector, this._startVector),
-            deltaTranslation: getTranslation(vector, this._prevVector)
-        };
-    },
-
-    _fireEventAliases: function(eventPostfix, originalEvent, eventArgs) {
-        eventArgs = eventArgs || {};
-
-        iteratorUtils.each(eventAliases, (function(_, eventAlias) {
-            const args = {};
-            iteratorUtils.each(eventAlias.args, function(name) {
-                if(name in eventArgs) {
-                    args[name] = eventArgs[name];
-                }
-            });
-
-            this._fireEvent(DX_PREFIX + eventAlias.name + eventPostfix, originalEvent, args);
-        }).bind(this));
-    }
+  validatePointers(e) {
+    return hasTouches(e) > 1;
+  },
 
-});
+  start(e) {
+    this._accept(e);
+
+    const startVector = getEventVector(e);
+    this._startVector = startVector;
+    this._prevVector = startVector;
+
+    this._fireEventAliases(START_POSTFIX, e);
+  },
+
+  move(e) {
+    const currentVector = getEventVector(e);
+    const eventArgs = this._getEventArgs(currentVector);
 
+    this._fireEventAliases(UPDATE_POSTFIX, e, eventArgs);
+    this._prevVector = currentVector;
+  },
+
+  end(e) {
+    const eventArgs = this._getEventArgs(this._prevVector);
+    this._fireEventAliases(END_POSTFIX, e, eventArgs);
+  },
+
+  _getEventArgs(vector) {
+    return {
+      scale: getScale(vector, this._startVector),
+      deltaScale: getScale(vector, this._prevVector),
+      rotation: getRotation(vector, this._startVector),
+      deltaRotation: getRotation(vector, this._prevVector),
+      translation: getTranslation(vector, this._startVector),
+      deltaTranslation: getTranslation(vector, this._prevVector),
+    };
+  },
+
+  _fireEventAliases(eventPostfix, originalEvent, eventArgs) {
+    eventArgs = eventArgs || {};
+
+    iteratorUtils.each(eventAliases, (_, eventAlias) => {
+      const args = {};
+      iteratorUtils.each(eventAlias.args, (name) => {
+        if (name in eventArgs) {
+          args[name] = eventArgs[name];
+        }
+      });
+
+      this._fireEvent(DX_PREFIX + eventAlias.name + eventPostfix, originalEvent, args);
+    });
+  },
+
+});
 
 /**
  * @name UI Events.dxtransformstart
@@ -262,36 +265,36 @@ const TransformEmitter = Emitter.inherit({
   * @module events/transform
 */
 
-const eventNames = eventAliases.reduce((result, eventAlias) => {
-    [START_POSTFIX, UPDATE_POSTFIX, END_POSTFIX].forEach(eventPostfix => {
-        result.push(DX_PREFIX + eventAlias.name + eventPostfix);
-    });
-    return result;
+const eventNames = eventAliases.reduce((result: string[], eventAlias) => {
+  [START_POSTFIX, UPDATE_POSTFIX, END_POSTFIX].forEach((eventPostfix) => {
+    result.push(DX_PREFIX + eventAlias.name + eventPostfix);
+  });
+  return result;
 }, []);
 
 registerEmitter({
-    emitter: TransformEmitter,
-    events: eventNames
+  emitter: TransformEmitter,
+  events: eventNames,
 });
-const exportNames = {};
-iteratorUtils.each(eventNames, function(_, eventName) {
-    exportNames[eventName.substring(DX_PREFIX.length)] = eventName;
+const exportNames: Record<string, any> = {};
+iteratorUtils.each(eventNames, (_, eventName: string) => {
+  exportNames[eventName.substring(DX_PREFIX.length)] = eventName;
 });
 /* eslint-disable spellcheck/spell-checker */
 export const {
-    transformstart,
-    transform,
-    transformend,
-    translatestart,
-    translate,
-    translateend,
-    zoomstart,
-    zoom,
-    zoomend,
-    pinchstart,
-    pinch,
-    pinchend,
-    rotatestart,
-    rotate,
-    rotateend
+  transformstart,
+  transform,
+  transformend,
+  translatestart,
+  translate,
+  translateend,
+  zoomstart,
+  zoom,
+  zoomend,
+  pinchstart,
+  pinch,
+  pinchend,
+  rotatestart,
+  rotate,
+  rotateend,
 } = exportNames;
diff --git a/packages/devextreme/js/events/transform.js b/packages/devextreme/js/events/transform.js
@@ -0,0 +1,2 @@
+export * from '../__internal/events/m_transform';
+
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,2 @@
		export * from '../__internal/events/m_transform';