Merge pull request #662 from CartoDB/fix/reset-animation-on-filter-change

fix: Airship VL Bridge: Restart animation when a filter is applied

Fix: CartoDB/cartoframes#1359

Author: elenatorro

package-lock.json

@@ -18,6 +18,7 @@
     "jest": "23.6.0",
     "ts-jest": "^23.10.5",
     "ts-loader": "^5.3.1",
+    "tslint": "^5.20.1",
     "typescript": "3.5.3",
     "webpack": "^4.27.0",
     "webpack-cli": "^3.1.2"

packages/bridge/package.json

@@ -485,6 +485,7 @@ export default class VLBridge {
 
     // Update the Visualization filter
     this._layer.viz.filter.blendTo(newFilter, 0);
+    this._animation.restart();
   }
 
   private _combineFilters(filters) {

packages/bridge/src/vl/VLBridge.ts

@@ -66,6 +66,10 @@ export class AnimationControls {
     this._propertyName = name;
   }
 
+  public restart() {
+    this._animation.setProgressPct(0);
+  }
+
   public setRange() {
     // TODO
   }

packages/bridge/src/vl/animation-controls/AnimationControls.ts

@@ -33,7 +33,7 @@ export abstract class BaseFilter {
    * @memberof BaseFilter
    */
   constructor(type: string, column: string, layer: any, source: any, readOnly: boolean = true) {
-    this._emitter = new mitt();
+    this._emitter = mitt();
 
     this._name = `asbind_${type}_${column}_${BaseFilter._counter}`;
     this._column = column;

packages/bridge/src/vl/base/BaseFilter.ts

@@ -133,6 +133,10 @@ export class TimeSeries {
     return this._animation;
   }
 
+  public restart() {
+    this._animation.setProgressPct(0);
+  }
+
   /**
    * This method sets up the events to handle animation updates and bind it to the TimeSeries widget:
    *  - Update the progress

packages/bridge/src/vl/time-series/TimeSeries.ts

@@ -56,9 +56,9 @@
   "dependencies": {
     "d3-array": "1.2.1",
     "d3-axis": "1.0.8",
-    "d3-brush": "1.0.4",
+    "d3-brush": "1.1.4",
     "d3-format": "1.3.2",
-    "d3-scale": "2.1.0",
+    "d3-scale": "2.2.0",
     "d3-scale-chromatic": "1.3.3",
     "d3-selection": "1.3.0",
     "d3-time-format": "2.1.3",