fix: move to new tween library. Smaller bundle for same result

farfromrefug · farfromrefug · commit b41fddee7ecd · 2021-10-12T21:29:13.000+02:00
diff --git a/src/charting/animation/ChartAnimator.ts b/src/charting/animation/ChartAnimator.ts
@@ -1,48 +1,58 @@
-import TWEEN from '@nativescript-community/tween';
-const Easing = TWEEN.Easing;
-export type EasingFunction = (k: number) => number;
-export { Easing };
-/**
- * Object responsible for all animations in the Chart. Animations require API level 11.
- *
+import { time } from '@nativescript/core/profiling';
+import { AdditiveTweening, EasingFunction } from 'additween';
+export { EasingFunction };
+if (!global.window) {
+    window = global.window = {
+        requestAnimationFrame,
+        cancelAnimationFrame,
+        performance: {
+            now: time
+        }
+    } as any;
+}
 
- */
+function clamp(value) {
+    return Math.min(1, Math.max(0, value));
+}
+
+class Tween<T extends Record<string, number>> extends AdditiveTweening<T> {}
 export class ChartAnimator {
     /** object that is updated upon animation update */
-    private mListener: () => void;
+    private mListener: (state) => void;
 
     /** The phase of drawn values on the y-axis. 0 - 1 */
     protected mPhaseY = 1;
 
     /** The phase of drawn values on the x-axis. 0 - 1 */
     protected mPhaseX = 1;
 
-    constructor(listener?: () => void) {
+    constructor(listener?: (state) => void) {
         this.mListener = listener;
     }
 
-    private xAnimator(duration, easing: EasingFunction = Easing.Linear.None, listener?: () => void) {
-        return new TWEEN.Tween({ value: 0 })
-            .to({ value: 1 }, duration)
-            .easing(easing)
-            .onUpdate((obj) => {
-                this.setPhaseX(obj.value);
+    private startAnim(duration, easing?: EasingFunction, listener?: (state) => void) {
+        const anim = new Tween({
+            onRender: (state) => {
                 if (listener) {
-                    listener();
+                    listener(state);
                 }
-            });
+            }
+        });
+        anim.tween({ value: 0 }, { value: 1 }, duration);
+        return anim;
+    }
+    private startXAnim(duration, easing?: EasingFunction, listener?: (state) => void) {
+        return this.startAnim(duration, easing, (state) => {
+            this.setPhaseX(state.value);
+            listener?.(state);
+        });
     }
 
-    private yAnimator(duration, easing: EasingFunction = Easing.Linear.None, listener?: () => void) {
-        return new TWEEN.Tween({ value: 0 })
-            .to({ value: 1 }, duration)
-            .easing(easing)
-            .onUpdate((obj) => {
-                this.setPhaseY(obj.value);
-                if (listener) {
-                    listener();
-                }
-            });
+    private startYAnim(duration, easing?: EasingFunction, listener?: (state) => void) {
+        return this.startAnim(duration, easing, (state) => {
+            this.setPhaseY(state.value);
+            listener?.(state);
+        });
     }
 
     /**
@@ -51,9 +61,8 @@ export class ChartAnimator {
      * @param durationMillis animation duration
      * @param easing EasingFunction
      */
-    public animateX(durationMillis, easing: EasingFunction = Easing.Linear.None) {
-        const animatorX = this.xAnimator(durationMillis, easing, this.mListener);
-        animatorX.start(0);
+    public animateX(durationMillis, easing?: EasingFunction) {
+        this.startXAnim(durationMillis, easing, this.mListener);
     }
 
     /**
@@ -64,11 +73,9 @@ export class ChartAnimator {
      * @param easingX EasingFunction for the X axis
      * @param easingY EasingFunction for the Y axis
      */
-    public animateXY(durationMillisX, durationMillisY, easingX: EasingFunction = Easing.Linear.None, easingY: EasingFunction = Easing.Linear.None) {
-        const xAnimator = this.xAnimator(durationMillisX, easingX, durationMillisX > durationMillisY ? this.mListener : undefined);
-        const yAnimator = this.yAnimator(durationMillisY, easingY || easingX, durationMillisX > durationMillisY ? undefined : this.mListener);
-        xAnimator.start(0);
-        yAnimator.start(0);
+    public animateXY(durationMillisX, durationMillisY, easingX?: EasingFunction, easingY?: EasingFunction) {
+        this.startXAnim(durationMillisX, easingX, durationMillisX > durationMillisY ? this.mListener : undefined);
+        this.startYAnim(durationMillisY, easingY || easingX, durationMillisX > durationMillisY ? undefined : this.mListener);
     }
 
     /**
@@ -77,9 +84,8 @@ export class ChartAnimator {
      * @param durationMillis animation duration
      * @param easing EasingFunction
      */
-    public animateY(durationMillis, easing: EasingFunction = Easing.Linear.None) {
-        const animatorY = this.yAnimator(durationMillis, easing, this.mListener);
-        animatorY.start(0);
+    public animateY(durationMillis, easing?: EasingFunction) {
+        this.startYAnim(durationMillis, easing, this.mListener);
     }
 
     /**
@@ -97,12 +103,7 @@ export class ChartAnimator {
      * @param phase let value between 0 - 1
      */
     public setPhaseY(phase) {
-        if (phase > 1) {
-            phase = 1;
-        } else if (phase < 0) {
-            phase = 0;
-        }
-        this.mPhaseY = phase;
+        this.mPhaseY = clamp(phase);
     }
 
     /**
@@ -120,11 +121,6 @@ export class ChartAnimator {
      * @param phase let value between 0 - 1
      */
     public setPhaseX(phase) {
-        if (phase > 1) {
-            phase = 1;
-        } else if (phase < 0) {
-            phase = 0;
-        }
-        this.mPhaseX = phase;
+        this.mPhaseX = clamp(phase);
     }
 }
diff --git a/src/charting/charts/Chart.ts b/src/charting/charts/Chart.ts
@@ -1,29 +1,25 @@
-import { IDataSet } from '../interfaces/datasets/IDataSet';
-import { DataSet } from '../data/DataSet';
-import { Entry } from '../data/Entry';
-import { ChartData } from '../data/ChartData';
-import { ChartInterface } from '../interfaces/dataprovider/ChartInterface';
+import { PanGestureHandlerOptions, PinchGestureHandlerOptions, TapGestureHandlerOptions } from '@nativescript-community/gesturehandler';
 import { Align, Canvas, CanvasView, Paint } from '@nativescript-community/ui-canvas';
-import { DefaultValueFormatter } from '../formatter/DefaultValueFormatter';
-import { CLog, CLogTypes, Utils } from '../utils/Utils';
-import { Color } from '@nativescript/core/color';
-import { Highlight } from '../highlight/Highlight';
-import { Legend } from '../components/Legend';
-import { ViewPortHandler } from '../utils/ViewPortHandler';
-import { XAxis } from '../components/XAxis';
+import { EventData, Trace } from '@nativescript/core';
+import { layout } from '@nativescript/core/utils/utils';
+import { ChartAnimator, EasingFunction } from '../animation/ChartAnimator';
 import { Description } from '../components/Description';
-import { DataRenderer } from '../renderer/DataRenderer';
 import { IMarker } from '../components/IMarker';
-import { LegendRenderer } from '../renderer/LegendRenderer';
+import { Legend } from '../components/Legend';
+import { XAxis } from '../components/XAxis';
+import { ChartData } from '../data/ChartData';
+import { Entry } from '../data/Entry';
+import { DefaultValueFormatter } from '../formatter/DefaultValueFormatter';
+import { Highlight } from '../highlight/Highlight';
 import { IHighlighter } from '../highlight/IHighlighter';
-import { profile } from '@nativescript/core/profiling';
-import { ChartAnimator, EasingFunction } from '../animation/ChartAnimator';
+import { ChartInterface } from '../interfaces/dataprovider/ChartInterface';
+import { IDataSet } from '../interfaces/datasets/IDataSet';
 import { ViewPortJob } from '../jobs/ViewPortJob';
 import { ChartTouchListener } from '../listener/ChartTouchListener';
-import { layout } from '@nativescript/core/utils/utils';
-import { EventData, Trace } from '@nativescript/core';
-import { addWeakEventListener, removeWeakEventListener } from '@nativescript/core/ui/core/weak-event-listener';
-import { PanGestureHandlerOptions, PinchGestureHandlerOptions, TapGestureHandlerOptions } from '@nativescript-community/gesturehandler';
+import { DataRenderer } from '../renderer/DataRenderer';
+import { LegendRenderer } from '../renderer/LegendRenderer';
+import { CLog, CLogTypes, Utils } from '../utils/Utils';
+import { ViewPortHandler } from '../utils/ViewPortHandler';
 
 const LOG_TAG = 'NSChart';
 
@@ -47,11 +43,6 @@ export abstract class Chart<U extends Entry, D extends IDataSet<U>, T extends Ch
     abstract getYChartMax();
     abstract getMaxVisibleCount();
 
-    /**
-     * flag that indicates if logging is enabled or not
-     */
-    protected mLogEnabled;
-
     /**
      * object that holds all data that was originally set for the chart, before
      * it was modified or any filtering algorithms had been applied
@@ -176,7 +167,7 @@ export abstract class Chart<U extends Entry, D extends IDataSet<U>, T extends Ch
     /**
      * tasks to be done after the view is setup
      */
-     protected mJobs = [];
+    protected mJobs = [];
 
     /**
      * default constructor for initialization in code
@@ -199,7 +190,7 @@ export abstract class Chart<U extends Entry, D extends IDataSet<U>, T extends Ch
      * initialize all paints and stuff
      */
     protected init() {
-        this.mAnimator = new ChartAnimator(() => {
+        this.mAnimator = new ChartAnimator((state) => {
             // during animations we dont need to compute axis things
             this.noComputeOnNextDraw = true;
             this.invalidate();
@@ -918,27 +909,6 @@ export abstract class Chart<U extends Entry, D extends IDataSet<U>, T extends Ch
         return this.mExtraLeftOffset;
     }
 
-    /**
-     * Set this to true to enable logcat outputs for the chart. Beware that
-     * logcat output decreases rendering performance. Default: disabled.
-     *
-     * @deprecated use Nativescript Trace with ChartTraceCategory
-     * @param enabled
-     */
-    public setLogEnabled(enabled) {
-        this.mLogEnabled = enabled;
-    }
-
-    /**
-     * Returns true if log-output is enabled for the chart, fals if not.
-     *
-     * @deprecated use Nativescript Trace with ChartTraceCategory
-     * @return
-     */
-    public isLogEnabled() {
-        return this.mLogEnabled;
-    }
-
     /**
      * Sets the text that informs the user that there is no data available with
      * which to draw the chart.
@@ -1304,7 +1274,6 @@ export abstract class Chart<U extends Entry, D extends IDataSet<U>, T extends Ch
     //     return saveToGallery(fileName, "", "MPAndroidChart-Library Save", Bitmap.CompressFormat.PNG, 40);
     // }
 
-
     public removeViewportJob(job) {
         const index = this.mJobs.indexOf(job);
         if (index >= 0) {
