genoverse 3.2.0

package/test/track_config/config-settings.test.js

@@ -0,0 +1,321 @@
+const { Genoverse, afterTest } = require('../utils');
+
+describe('Config settings', () => {
+  afterEach(afterTest);
+
+  const trackDef = {
+    data: [
+      { chr: 1, start: 1,  end: 10, type: 'A', subtype: 1, label: 'A1', color: 'black'  },
+      { chr: 1, start: 21, end: 30, type: 'A', subtype: 2, label: 'A2', color: 'blue'   },
+      { chr: 1, start: 41, end: 50, type: 'B', subtype: 1, label: 'B1', color: 'orange' },
+      { chr: 1, start: 61, end: 70, type: 'B', subtype: 2, label: 'B2', color: 'purple' },
+    ],
+    configSettings: {
+      type: {
+        all : { featureFilter: false },
+        a   : { featureFilter: feature => feature.type === 'A' },
+        b   : { featureFilter: feature => feature.type === 'B' },
+      },
+      subtype: {
+        all : { featureFilter: false },
+        1   : { featureFilter: feature => feature.subtype === 1 },
+        2   : { featureFilter: feature => feature.subtype === 2 },
+      },
+      colorscheme: {
+        default : { beforeDrawFeature: false },
+        red     : { beforeDrawFeature: (f) => { f.color = 'red';   } },
+        green   : { beforeDrawFeature: (f) => { f.color = 'green'; } },
+      },
+      squish: {
+        true: {
+          featureHeight : 2,
+          featureMargin : { top: 1, right: 1, bottom: 1, left: 0 },
+          labels        : false,
+        },
+        false: {
+          featureHeight : 6,
+          featureMargin : { top: 2, right: 2, bottom: 2, left: 0 },
+          labels        : true,
+        },
+      },
+    },
+    defaultConfig: {
+      type        : 'all',
+      subtype     : 'all',
+      colorscheme : 'default',
+      squish      : false,
+    },
+  };
+
+  describe('Track attributes are set correctly', () => {
+    const [ track ] = new Genoverse({
+      chr            : 1,
+      start          : 1,
+      end            : 100,
+      chromosomeSize : 100,
+      tracks         : [ Genoverse.Track.extend($.extend(true, {}, trackDef)) ],
+    }).tracks;
+
+    const checkSettings = ($track, confType) => {
+      const conf = $track[confType] || $track.config;
+
+      Object.keys(conf).forEach(
+        (type) => {
+          const settings = $track.configSettings[type][conf[type]];
+
+          Object.entries(settings).forEach(
+            ([ key, value ]) => {
+              if (key === 'featureFilter') {
+                expect(
+                  $track.prop('featureFilters').filter(f => f === value).length
+                ).toBe(
+                  value === false ? 0 : 1
+                );
+              } else {
+                expect($track.prop(key)).toEqual(value);
+              }
+            }
+          );
+        }
+      );
+    };
+
+    it('Initial settings are determined by defaultConfig', () => { checkSettings(track, 'defaultConfig'); });
+
+    describe('Changing config settings', () => {
+      Object.entries(track.configSettings).forEach(
+        ([ type, configSetting ]) => {
+          Object.keys(configSetting).forEach(
+            (config) => {
+              it(`${type} = ${config}`, () => {
+                track.setConfig(type, config);
+                expect(track.config[type]).toBe(config);
+                checkSettings(track);
+              });
+            }
+          );
+        }
+      );
+    });
+  });
+
+  describe('Track, model, view and controller can all have properties and functions set by config', () => {
+    let testNow = false;
+
+    const test = (obj, a, b) => {
+      if (testNow) {
+        expect(a).toEqual(b);
+      }
+    };
+
+    const [ track ] = new Genoverse({
+      chr            : 1,
+      start          : 1,
+      end            : 100,
+      chromosomeSize : 100,
+      tracks         : [
+        Genoverse.Track.extend({
+          afterDraw: function () {
+            const d = this.prop('_testDeferred');
+
+            if (d) {
+              d.resolve();
+            }
+          },
+          data           : [],
+          name           : 'test',
+          configSettings : {
+            test: {
+              1: {
+                name           : 1,                      // track property
+                clickTolerance : 1,                      // controller property
+                dataBuffer     : { start: 100, end: 0 }, // model property that gets used by setDefaults to set dataBufferStart
+                dataType       : 1,                      // model property that isn't touched by setDefaults
+                featureMargin  : { top: 1 },             // view property that gets modified by setDefaults
+                minScaledWidth : 1,                      // view property that isn't touched by setDefaults
+                setMVC         : function (...args) {
+                  const rtn = this.base(...args);
+
+                  test('track', this.name, 'test - 1');
+
+                  return rtn;
+                },
+                render: function (...args) {
+                  test('controller', this.clickTolerance,  1);
+
+                  return this.base(...args);
+                },
+                findFeatures: function (...args) {
+                  test('model', this.dataBufferStart, 100);
+                  test('model', this.dataType,        1);
+
+                  return this.base(...args);
+                },
+                draw: function (...args) {
+                  test('view', this.featureMargin,  { top: 1, right: 0, bottom: 0, left: 0 });
+                  test('view', this.minScaledWidth, 1);
+
+                  return this.base(...args);
+                },
+                _testDeferred: $.Deferred(),
+              },
+              2: {
+                name           : 2,
+                clickTolerance : 2,
+                dataBuffer     : { start: 200, end: 100 },
+                dataType       : 2,
+                featureMargin  : { right: 1, left: 2 },
+                minScaledWidth : 2,
+                setMVC         : function (...args) {
+                  const rtn = this.base(...args);
+
+                  test('track', this.name, 'test - 2');
+
+                  return rtn;
+                },
+                render: function (...args) {
+                  test('controller', this.clickTolerance, 2);
+
+                  return this.base(...args);
+                },
+                findFeatures: function (...args) {
+                  test('model', this.dataBuffer, { start: 200, end: 100 });
+                  test('model', this.dataType,   2);
+
+                  return this.base(...args);
+                },
+                draw: function (...args) {
+                  test('view',  this.featureMargin, { top: 0, right: 1, bottom: 0, left: 2 });
+                  test('view', this.minScaledWidth, 2);
+
+                  return this.base(...args);
+                },
+                _testDeferred: $.Deferred(),
+              },
+            },
+          },
+        }),
+      ],
+    }).tracks;
+
+    it('config 1', () => {
+      testNow = true;
+      track.setConfig('test', 1);
+
+      return track._testDeferred;
+    });
+
+    it('config 2', () => {
+      track.setConfig('test', 2);
+
+      return track._testDeferred;
+    });
+  });
+
+  describe('Config and zoom settings interact correctly', () => {
+    const genoverse = new Genoverse({
+      chr            : 1,
+      start          : 1,
+      end            : 20,
+      chromosomeSize : 9e99,
+      tracks         : [
+        Genoverse.Track.extend({
+          data           : [],
+          url            : false,
+          legend         : false,
+          configSettings : {
+            test: {
+              1 : { xhrFields: { test: 1 }, depth: 1 },
+              2 : { xhrFields: { test: 2 }, depth: 2 },
+              3 : { xhrFields: { test: 3 }, depth: 3 },
+            },
+          },
+          defaultConfig : { test: 1 },
+          1             : { view: Genoverse.Track.View.extend({ _testId: 1    }), model: Genoverse.Track.Model.extend({ _testId: 1    }) },
+          1000          : { view: Genoverse.Track.View.extend({ _testId: 1000 }), model: Genoverse.Track.Model.extend({ _testId: 1000 }) },
+        }),
+      ],
+    });
+
+    const [ track ] = genoverse.tracks;
+
+    it('Initial properties are correct', () => {
+      expect(track.prop('xhrFields')).toEqual({ test: 1 });
+      expect(track.prop('depth')).toBe(1);
+
+      expect(track.model._testId).toBe(1);
+      expect(track.view._testId).toBe(1);
+    });
+
+    it('After setConfig and then zooming out to a new model/view, properties defined in setConfig are still used', () => {
+      track.setConfig('test', 2);
+      genoverse.moveTo(1, 1, 1001);
+
+      expect(track.prop('xhrFields')).toEqual({ test: 2 });
+      expect(track.prop('depth')).toBe(2);
+
+      expect(track.model._testId).toBe(1000);
+      expect(track.view._testId).toBe(1000);
+    });
+
+    it('After zooming back in to an existing model/view, properties defined in previous setConfig are still used', () => {
+      genoverse.moveTo(1, 1, 20);
+
+      expect(track.prop('xhrFields')).toEqual({ test: 2 });
+      expect(track.prop('depth')).toBe(2);
+
+      expect(track.model._testId).toBe(1);
+      expect(track.view._testId).toBe(1);
+    });
+
+    it('After setConfig and then zooming out to an existing model/view, properties defined in setConfig are still used', () => {
+      track.setConfig('test', 3);
+      genoverse.moveTo(1, 1, 1001);
+
+      expect(track.prop('xhrFields')).toEqual({ test: 3 });
+      expect(track.prop('depth')).toBe(3);
+
+      expect(track.model._testId).toBe(1000);
+      expect(track.view._testId).toBe(1000);
+    });
+  });
+
+  describe('Features are drawn correctly', () => {
+    const [ track ] = new Genoverse({
+      chr            : 1,
+      start          : 1,
+      end            : 100,
+      width          : 100,
+      chromosomeSize : 1000,
+      isStatic       : true,
+      tracks         : [ Genoverse.Track.extend(trackDef) ],
+    }).tracks;
+
+    [
+      { type: 'a',   subtype: 'all' },
+      { type: 'b',   subtype: 'all' },
+      { type: 'all', subtype: 1     },
+      { type: 'a',   subtype: 1     },
+      { type: 'a',   subtype: 2     },
+      { type: 'b',   subtype: 1     },
+      { type: 'b',   subtype: 2     },
+
+      { squish: true                        },
+      { squish: true,  colorscheme: 'red'   },
+      { squish: false, colorscheme: 'green' },
+
+      { type: 'all', subtype: 'all', colorscheme: 'default' },
+    ].forEach(
+      (config) => {
+        it(`when ${Object.entries(config).map(([ k, v ]) => `${k} = ${v}`).join(', ')}`, (done) => {
+          track.afterRender = function (f, image) {
+            expect(image[0].src).toMatchSnapshot();
+            done();
+          };
+
+          track.setConfig(config);
+        });
+      }
+    );
+  });
+});

package/test/track_config/zoom-level-settings.test.js

@@ -0,0 +1,98 @@
+const { afterTest } = require('../utils');
+
+describe('Zoom level settings', () => {
+  afterEach(afterTest);
+
+  const genoverse = new Genoverse({
+    chr            : 1,
+    start          : 1,
+    end            : 20,
+    chromosomeSize : 9e99,
+    tracks         : [ Genoverse.Track.Gene.extend({ data: [], url: false, legend: false }) ],
+  });
+
+  const track = genoverse.tracks[0];
+
+  it('Initial models and views are correct', () => {
+    track.model.__id = 1;
+    track.view.__id  = 1;
+
+    expect(track.lengthMap.length).toBe(4);
+    expect(track.lengthMap.map(l => l[0])).toEqual([ 2000000, 100000, 1, -1 ]);
+
+    expect(track.model).toBeInstanceOf(Genoverse.Track.Model.Transcript);
+    expect(track.view).toBeInstanceOf(Genoverse.Track.View.Transcript);
+
+    expect(track.model).toEqual(track.models[1]);
+    expect(track.view).toEqual(track.views[1]);
+
+    expect(track.view.labels).toBe(true);
+  });
+
+  it('Model and view changed after zoom out', () => {
+    genoverse.moveTo(1, 1, 100001);
+
+    track.model.__id = 2;
+    track.view.__id  = 2;
+
+    expect(genoverse.length).toBe(100001);
+
+    expect(track.model).toBeInstanceOf(Genoverse.Track.Model.Gene);
+    expect(track.view).toBeInstanceOf(Genoverse.Track.View.Gene);
+
+    expect(track.model).toEqual(track.models[100000]);
+    expect(track.view).toEqual(track.views[100000]);
+
+    expect(track.view.labels).toBe(true);
+  });
+
+  it('View changed after zoom out further', () => {
+    genoverse.moveTo(1, 1, 2000001);
+
+    track.view.__id = 3;
+
+    expect(genoverse.length).toBe(2000001);
+
+    expect(track.model.__id).toBe(2);
+    expect(track.model).toEqual(track.models[100000]);
+
+    expect(track.view).not.toBeInstanceOf(Genoverse.Track.View.Gene);
+
+    const proto1 = track.view.constructor.prototype;
+    const proto2 = track.lengthMap[1][1].view.constructor.prototype;
+
+    for (const i in proto1) { // eslint-disable-line no-restricted-syntax
+      if (typeof proto1[i] === 'function') {
+        expect(proto1[i].toString()).toBe(proto2[i].toString());
+      } else {
+        expect(proto1[i]).toBe(proto2[i]);
+      }
+    }
+
+    expect(track.model).toEqual(track.models[2000000]);
+    expect(track.view).toEqual(track.views[2000000]);
+
+    expect(track.view.labels).toBe(false);
+  });
+
+  it('View changed after zooming in', () => {
+    genoverse.moveTo(1, 200000, 300000);
+
+    expect(track.model.__id).toBe(2);
+    expect(track.view.__id).toBe(2);
+  });
+
+  it('Model and view changed after zooming in further', () => {
+    genoverse.moveTo(1, 200000, 200001);
+
+    expect(track.model.__id).toBe(1);
+    expect(track.view.__id).toBe(1);
+  });
+
+  it('Model and view changed after zooming out as far as possible', () => {
+    genoverse.moveTo(1, 1, 9e99);
+
+    expect(track.model.__id).toBe(2);
+    expect(track.view.__id).toBe(3);
+  });
+});

package/test/utils.js

@@ -0,0 +1,80 @@
+require('../index'); // Genoverse library
+
+Genoverse.ready.resolve();
+
+const getTrackConfig = features => ({
+  data: features,
+
+  beforeRender: function (f, image) {
+    const params = image.data();
+
+    params._testDeferred = {
+      features   : $.Deferred(),
+      labels     : this.prop('labels') === 'separate' ? $.Deferred() : undefined,
+      background : params.background                  ? $.Deferred() : undefined,
+      legend     : this.prop('legendTrack')           ? $.Deferred() : undefined,
+    };
+
+    this.browser._testDeferreds = [ this.browser._testDeferreds, ...Object.values(params._testDeferred) ];
+  },
+
+  afterRender: function (f, image) {
+    const separate = this.prop('labels') === 'separate';
+    const tests    = [{ img: image, type: 'features', instructionType: separate || image.data('background') ? 'features' : '' }];
+
+    if (separate) {
+      tests.push({ img: image.next(), type: 'labels' });
+    }
+
+    if (this.prop('legendTrack')) {
+      tests.push({ img: this.prop('legendTrack').prop('image'), type: 'legend' });
+    }
+
+    tests.forEach((test) => {
+      if (test.img.length) {
+        expect(test.img[0].src).toMatchSnapshot();
+      }
+
+      image.data('_testDeferred')[test.type].resolve();
+    });
+  },
+
+  afterRenderBackground: function (f, image) {
+    expect(image.src).toMatchSnapshot();
+
+    image.next().data('_testDeferred').background.resolve();
+  },
+});
+
+const testTrackRender = (features, track, genoverseConfig) =>  {
+  const trackConfig = { ...track, ...getTrackConfig(features) };
+  const genoverse   = new Genoverse({
+    chr            : 1,
+    start          : 1,
+    end            : 20,
+    width          : 100,
+    chromosomeSize : 1000,
+    _testDeferreds : [],
+    tracks         : [ (trackConfig._testClass || Genoverse.Track).extend(trackConfig) ],
+    ...genoverseConfig,
+  });
+
+  const d = $.Deferred();
+
+  setTimeout(() => { $.when(...genoverse._testDeferreds).done(d.resolve); }, 1);
+
+  return d;
+};
+
+const testTrackRenderStatic = (features, track, genoverseConfig) => testTrackRender(features, track, { ...genoverseConfig, isStatic: true });
+
+const afterTest = () => {
+  $('body').empty();
+};
+
+module.exports = {
+  Genoverse,
+  testTrackRender,
+  testTrackRenderStatic,
+  afterTest,
+};

package/utils/createGenome.js

@@ -0,0 +1,52 @@
+/* eslint-disable no-console */
+const fs   = require('fs');
+const http = require('http');
+
+// nodejs example of how to create a genomes file from the Ensembl REST API
+http.get(
+  {
+    hostname : 'rest.ensembl.org',
+    path     : '/info/assembly/homo_sapiens?bands=1',
+    headers  : { 'Content-Type': 'application/json' },
+  },
+  (response) => {
+    let str = '';
+
+    response.on('data', (chunk) => { str += chunk; });
+
+    response.on('end', () => {
+      try {
+        fs.writeFile(
+          'js/genomes/human.js',
+          JSON.stringify(
+            JSON.parse(str).top_level_region.filter(d => d.coord_system === 'chromosome').map(
+              d => [
+                d.name,
+                {
+                  size  : d.length,
+                  bands : (d.bands || [{ start: 1, end: d.length }]).map(
+                    b => ({
+                      id    : b.id,
+                      start : b.start,
+                      end   : b.end,
+                      type  : b.stain,
+                    })
+                  ),
+                },
+              ]
+            ).reduce(
+              (acc, d) => Object.assign(acc, { [d[0]]: d[1] }),
+              {}
+            ),
+            null,
+            2
+          )
+        );
+      } catch (e) {
+        console.log(e.message);
+      }
+    });
+  }
+).on('error', (e) => {
+  console.log(`Got error: ${e.message}`);
+}).end();

package/utils/devServer.js

@@ -0,0 +1,36 @@
+/* eslint-disable no-console */
+
+// A server to use for development purposes. NOT RECOMMENDED FOR PRODUCTION.
+
+const fs   = require('fs');
+const http = require('http');
+const path = require('path');
+
+const dir          = path.resolve(__dirname, '..');
+const port         = process.env.PORT || 3000;
+const contentTypes = {
+  css  : 'text/css',
+  js   : 'text/javascript',
+  html : 'text/html',
+};
+
+http.createServer((req, res) => {
+  const file            = req.url.split('?')[0].replace(/^\//, '') || 'index.html';
+  const [ , extension ] = file.match(/\.(\w+)$/) || [];
+
+  fs.readFile(path.resolve(dir, file), (err, data) => {
+    try {
+      if (err) {
+        res.writeHead(404);
+        res.end(JSON.stringify(err));
+
+        return;
+      }
+
+      res.writeHead(200, { 'Content-Type': contentTypes[extension] || 'text/plain' });
+      res.end(data);
+    } catch (e) {
+      console.error(e);
+    }
+  });
+}).listen(port);

package/utils/expandedTemplate.html

@@ -0,0 +1,46 @@
+<!DOCTYPE HTML>
+<html>
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+
+    __CSS__
+  </head>
+  <body>
+    <div id="genoverse"></div>
+
+    __JS__
+
+    <script>
+      window.genoverse = new Genoverse({
+        container : '#genoverse',
+        width     : 800,
+        genome    : 'GRCh38',
+        chr       : 13,
+        start     : 32296945,
+        end       : 32370557,
+        plugins   : [ 'controlPanel', [ 'karyotype', { showAssembly: true }], 'trackControls', 'resizer', 'focusRegion', 'fullscreen', 'tooltips', 'fileDrop' ],
+        tracks    : [
+          Genoverse.Track.Scaleline.extend({ strand: false }),
+          Genoverse.Track.Scalebar,
+          Genoverse.Track.extend({
+            name       : 'Sequence',
+            controller : Genoverse.Track.Controller.Sequence,
+            model      : Genoverse.Track.Model.Sequence.Ensembl,
+            view       : Genoverse.Track.View.Sequence,
+            resizable  : 'auto',
+            100000     : false
+          }),
+          Genoverse.Track.Gene,
+          Genoverse.Track.extend({
+            name            : 'Regulatory Features',
+            url             : '//rest.ensembl.org/overlap/region/human/__CHR__:__START__-__END__?feature=regulatory;content-type=application/json',
+            resizable       : 'auto',
+            model           : Genoverse.Track.Model.extend({ dataRequestLimit : 5000000 }),
+            setFeatureColor : function (f) { f.color = '#AAA'; }
+          }),
+          Genoverse.Track.dbSNP
+        ]
+      });
+    </script>
+  </body>
+</html>

package/utils/git-hooks/post-commit

@@ -0,0 +1,9 @@
+#!/bin/bash
+
+git stash apply -q;
+git stash drop -q;
+
+if [[ $( git status | grep 'Unmerged paths' ) ]]
+then
+  git status
+fi

package/utils/git-hooks/pre-commit

@@ -0,0 +1,7 @@
+#!/bin/bash
+
+git stash -k -q
+yarn build || exit 1
+git add js/genoverse.min.js
+git add js/genoverse.min.js.map
+git add expanded.html

package/utils/git-hooks/setup

@@ -0,0 +1,6 @@
+#!/bin/bash
+
+cd "$( dirname "${BASH_SOURCE[0]}" )" && cd ../..; # cd to the Genoverse directory
+
+ln -sfT "$( pwd )/utils/git-hooks/pre-commit"  .git/hooks/pre-commit;
+ln -sfT "$( pwd )/utils/git-hooks/post-commit" .git/hooks/post-commit;

package/utils/makeExpanded.js

@@ -0,0 +1,19 @@
+const fs = require('fs');
+
+const dir = process.cwd();
+
+const jsFiles = fs.readFileSync(`${dir}/index.js`, 'utf8').split('\n').filter(
+  t => /require/.test(t)
+).map(
+  t => `<script type="text/javascript" src="${t.replace(/.*require\((.+)\).*/, '$1').replace(/__dirname/, '').replace(/[+\s\\']/g, '').replace(/^\//, '')}"></script>`
+);
+
+const cssFiles = fs.readdirSync(`${dir}/css`).sort(
+  (a, b) => (b.match(/^genoverse.css$/) || []).length - (a.match(/^genoverse.css$/) || []).length // genoverse.css must go first, but order is not important for other files since all plugins are namespaced
+).map(
+  file => `<link rel="stylesheet" type="text/css" href="css/${file}" />`
+);
+
+const html = fs.readFileSync(`${dir}/utils/expandedTemplate.html`, 'utf8').replace(/__JS__/, jsFiles.join('\n    ')).replace(/__CSS__/, cssFiles.join('\n    '));
+
+fs.writeFileSync(`${dir}/expanded.html`, html, 'utf8');