proper cleanup when layer is removed

lib/torque/animator.js

@@ -39,6 +39,10 @@
       requestAnimationFrame(this._tick);
     },
 
+    isRunning: function() {
+      return this.running;
+    },
+
     stop: function() {
       this.pause();
       this.time(0);

lib/torque/gmaps/gmaps_tileloader_mixin.js

@@ -14,15 +14,20 @@ GMapsTileLoader.prototype = {
     this._tiles = {};
     this._tilesToLoad = 0;
     this._updateTiles = this._updateTiles.bind(this);
-    google.maps.event.addListener(this._map, 'dragend', this._updateTiles);
-    google.maps.event.addListener(this._map, 'zoom_changed', this._updateTiles);
+    this._listeners = [];
+    this._listeners.push(
+      google.maps.event.addListener(this._map, 'dragend', this._updateTiles),
+      google.maps.event.addListener(this._map, 'zoom_changed', this._updateTiles)
+    );
     this.tileSize = 256;
     this._updateTiles();
   },
 
   _removeTileLoader: function() {
-    //TODO: unbind events
-    //TODO: remove tiles
+    for(var i in this._listeners) {
+      google.maps.event.removeListener(this._listeners[i]);
+    }
+    this._removeTiles();
   },
 
   _removeTiles: function () {

lib/torque/gmaps/torque.js

@@ -71,7 +71,6 @@ GMapsTorqueLayer.prototype = _.extend({},
 
     this.provider = new this.providers[this.options.provider](this.options);
     this.renderer = new this.renderers[this.options.renderer](this.getCanvas(), this.options);
-    this.setBlendMode = this.renderer.setBlendMode.bind(this.renderer);
 
     this._initTileLoader(this.options.map, this.getProjection());
 
@@ -81,6 +80,11 @@ GMapsTorqueLayer.prototype = _.extend({},
 
   },
 
+  setBlendMode: function(_) {
+    this.renderer.setBlendMode(_);
+    this.redraw();
+  },
+
   setSteps: function(steps) {
     this.provider.setSteps(steps);
     this._reloadTiles();
@@ -188,6 +192,7 @@ GMapsTorqueLayer.prototype = _.extend({},
   onRemove: function() {
     CanvasLayer.prototype.onRemove.call(this);
     this.animator.stop();
+    this._removeTileLoader();
   }
 
 });

lib/torque/leaflet/torque.js

@@ -44,7 +44,6 @@ L.TorqueLayer = L.CanvasLayer.extend({
     this.provider = new this.providers[this.options.provider](options);
     this.renderer = new this.renderers[this.options.renderer](this.getCanvas(), options);
 
-    this.setBlendMode = this.renderer.setBlendMode.bind(this.renderer);
 
     // for each tile shown on the map request the data
     this.on('tileAdded', function(t) {
@@ -55,6 +54,15 @@ L.TorqueLayer = L.CanvasLayer.extend({
     }, this);
   },
 
+  onRemove: function() {
+    this._removeTileLoader();
+  },
+
+  setBlendMode: function(_) {
+    this.renderer.setBlendMode(_);
+    this.redraw();
+  },
+
   setSteps: function(steps) {
     this.provider.setSteps(steps);
     this._reloadTiles();