Merge pull request #289 from hammerlab/data-canvas-dep

Pull in data-canvas from NPM and add pileup.destroy()

.flowconfig

@@ -15,11 +15,13 @@
 .*node_modules/jshint.*
 .*node_modules/jstransformify.*
 .*node_modules/uglify.*
+.*node_modules/data-canvas.*
 
 [include]
 
 [libs]
 lib
 types
+node_modules/data-canvas/flowtype
 
 [options]

package.json

@@ -61,6 +61,7 @@
   "dependencies": {
     "backbone": "1.1.2",
     "d3": "^3.5.5",
+    "data-canvas": "0.0.0",
     "jbinary": "^2.1.3",
     "jdataview": "^2.5.0",
     "pako": "^0.2.5",

src/main/CoverageTrack.js

@@ -13,7 +13,7 @@ var React = require('./react-shim'),
     types = require('./react-types'),
     d3utils = require('./d3utils'),
     _ = require("underscore"),
-    dataCanvas = require('./data-canvas'),
+    dataCanvas = require('data-canvas'),
     style = require('./style'),
     ContigInterval = require('./ContigInterval');
 

src/main/GeneTrack.js

@@ -17,7 +17,7 @@ var React = require('./react-shim'),
     d3utils = require('./d3utils'),
     ContigInterval = require('./ContigInterval'),
     canvasUtils = require('./canvas-utils'),
-    dataCanvas = require('./data-canvas'),
+    dataCanvas = require('data-canvas'),
     style = require('./style');
 
 

src/main/GenomeTrack.js

@@ -11,7 +11,7 @@ var React = require('./react-shim'),
     types = require('./react-types'),
     utils = require('./utils'),
     canvasUtils = require('./canvas-utils'),
-    dataCanvas = require('./data-canvas'),
+    dataCanvas = require('data-canvas'),
     d3utils = require('./d3utils'),
     DisplayMode = require('./DisplayMode'),
     style = require('./style');

src/main/LocationTrack.js

@@ -9,7 +9,7 @@ var React = require('./react-shim'),
     EmptySource = require('./EmptySource'),
     types = require('./react-types'),
     canvasUtils = require('./canvas-utils'),
-    dataCanvas = require('./data-canvas'),
+    dataCanvas = require('data-canvas'),
     style = require('./style'),
     d3utils = require('./d3utils');
 

src/main/PileupTrack.js

@@ -8,6 +8,7 @@ import type {Strand, Alignment, AlignmentDataSource} from './Alignment';
 import type {TwoBitSource} from './TwoBitDataSource';
 import type {BasePair} from './pileuputils';
 import type {VisualAlignment, VisualGroup} from './PileupCache';
+import type {DataCanvasRenderingContext2D} from 'data-canvas';
 
 var React = require('./react-shim'),
     d3 = require('d3'),
@@ -22,7 +23,7 @@ var React = require('./react-shim'),
     DisplayMode = require('./DisplayMode'),
     PileupCache = require('./PileupCache'),
     canvasUtils = require('./canvas-utils'),
-    dataCanvas = require('./data-canvas'),
+    dataCanvas = require('data-canvas'),
     style = require('./style');
 
 

src/main/ScaleTrack.js

@@ -15,7 +15,7 @@ var React = require('./react-shim'),
     EmptySource = require('./EmptySource'),
     types = require('./react-types'),
     canvasUtils = require('./canvas-utils'),
-    dataCanvas = require('./data-canvas'),
+    dataCanvas = require('data-canvas'),
     style = require('./style'),
     d3utils = require('./d3utils');
 

src/main/VariantTrack.js

@@ -6,6 +6,7 @@
 
 import type {VcfDataSource} from './VcfDataSource';
 import type {Variant} from './vcf';
+import type {DataCanvasRenderingContext2D} from 'data-canvas';
 
 var React = require('./react-shim'),
     _ = require('underscore'),
@@ -15,7 +16,7 @@ var React = require('./react-shim'),
     types = require('./react-types'),
     ContigInterval = require('./ContigInterval'),
     canvasUtils = require('./canvas-utils'),
-    dataCanvas = require('./data-canvas'),
+    dataCanvas = require('data-canvas'),
     style = require('./style');
 
 

src/main/pileup.js

@@ -32,8 +32,9 @@ type GenomeRange = {
 }
 
 type Pileup = {
-  setRange: (range: GenomeRange)=>void;
+  setRange(range: GenomeRange): void;
   getRange(): GenomeRange;
+  destroy(): void;
 }
 
 type PileupParams = {
@@ -78,10 +79,28 @@ function create(elOrId: string|Element, params: PileupParams): Pileup {
                          initialRange={params.range} />, el);
   return {
     setRange(range: GenomeRange) {
+      if (reactElement == null) {
+        throw 'Cannot call setRange on a destroyed pileup';
+      }
       reactElement.handleRangeChange(range);
     },
     getRange(): GenomeRange {
+      if (reactElement == null) {
+        throw 'Cannot call setRange on a destroyed pileup';
+      }
       return _.clone(reactElement.state.range);
+    },
+    destroy(): void {
+      if (!vizTracks) {
+        throw 'Cannot call destroy() twice on the same pileup';
+      }
+      vizTracks.forEach(({source}) => {
+        source.off();
+      });
+      React.unmountComponentAtNode(el);
+      reactElement = null;
+      referenceTrack = null;
+      vizTracks = null;
     }
   };
 }