genoverse 4.0.0 → 4.0.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "genoverse",
-  "version": "4.0.0",
+  "version": "4.0.3",
   "description": "Genoverse is a portable, customizable, back-end independent JavaScript and HTML5 based genome browser which allows the user to explore data in a dynamic and interactive manner.",
   "main": "src/js/Genoverse.js",
   "directories": {

package/src/js/Genoverse.js

@@ -146,17 +146,20 @@ const Genoverse = Base.extend({
       this.loadedPlugins[plugin.name] = true;
     };
 
-    const pluginImports = Object.keys(pluginsByName).map(pluginName => import(`./plugins/${pluginName}`).then(
-      (imported) => {
-        initializePlugin({
-          name    : pluginName,
-          conf    : pluginsByName[pluginName].conf,
-          exports : imported.default,
-        });
-      }
-    ));
+    const pluginImports = Object.keys(pluginsByName).reduce(
+      (ready, pluginName) => ready.then(
+        () => import(`./plugins/${pluginName}`).then(
+          imported => initializePlugin({
+            name    : pluginName,
+            conf    : pluginsByName[pluginName].conf,
+            exports : imported.default,
+          })
+        )
+      ),
+      this.jQuery.Deferred().resolve()
+    );
 
-    return this.jQuery.when(...pluginImports);
+    return this.jQuery.when(pluginImports);
   },
 
   init: function () {
@@ -543,7 +546,7 @@ const Genoverse = Base.extend({
   onTracks: function (func, ...args) {
     this.tracks.forEach(
       (track) => {
-        if (track.disabled) {
+        if (track.disabled || !track._interface) { // if track._interface is undefined, the track has not been fully initialized yet
           return;
         }
 

package/src/js/Track/Model.js

@@ -100,7 +100,6 @@ export default Base.extend({
       return deferred.resolve();
     }
 
-    const model  = this;
     const bins   = [];
     const length = end - start + 1;
 
@@ -123,26 +122,30 @@ export default Base.extend({
       ...bins.map(
         (bin) => {
           const request = jQuery.ajax({
-            url       : model.parseURL(chr, bin[0], bin[1]),
-            data      : model.urlParams,
-            dataType  : model.dataType,
-            context   : model,
-            xhrFields : model.xhrFields,
-            success   : function (data) {
+            url       : this.parseURL(chr, bin[0], bin[1]),
+            data      : this.urlParams,
+            dataType  : this.dataType,
+            xhrFields : this.xhrFields,
+          }).done(
+            (data) => {
               this.receiveData(data, chr, bin[0], bin[1]);
-            },
-            error: function (xhr, statusText, ...args) {
-              this.track.controller.showError(
-                this.showServerErrors && (xhr.responseJSON || {}).message
-                  ? xhr.responseJSON.message
-                  : `${statusText} while getting the data, see console for more details`,
-                [ xhr, statusText, ...args ]
-              );
-            },
-            complete: function (xhr) {
-              this.dataLoading = this.dataLoading.filter(loading => xhr !== loading);
-            },
-          });
+            }
+          ).fail(
+            (xhr, statusText, ...args) => {
+              if (this.track?.controller?.showError) {
+                this.track.controller.showError(
+                  this.showServerErrors && xhr.responseJSON?.message
+                    ? xhr.responseJSON.message
+                    : `${statusText} while getting the data, see console for more details`,
+                  [ xhr, statusText, ...args ]
+                );
+              }
+            }
+          ).always(
+            () => {
+              this.dataLoading = this.dataLoading.filter(loading => request !== loading);
+            }
+          );
 
           request.coords = [ chr, bin[0], bin[1] ]; // store actual chr, start and end on the request, in case they are needed
 
@@ -150,7 +153,7 @@ export default Base.extend({
             request.done(done);
           }
 
-          model.dataLoading.push(request);
+          this.dataLoading.push(request);
 
           return request;
         }

package/src/js/Track.js

@@ -615,7 +615,9 @@ const Track = Base.extend({
   },
 
   reset: function (...args) {
-    this.setLengthMap();
+    if (args[0] !== 'resizing') {
+      this.setLengthMap();
+    }
 
     Object.values(this.models).filter(model => model.url !== false).forEach(model => model.init(true));
     Object.values(this.views).forEach(view => view.init(true));

package/src/js/plugins/focusRegion.js

@@ -1,13 +1,13 @@
-import './controlPanel';
+import controlPanel from './controlPanel';
 
 const plugin = function () {
   this.controls.push({
-    icon    : '<i class="fas fa-map-marker-alt"></i>',
-    'class' : 'gv-button-large',
-    name    : `Reset focus to ${this.focusRegion && this.focusRegion.name ? this.focusRegion.name : `${this.chr}:${this.start}-${this.end}`}`,
-    action  : (browser) => { browser.moveTo(browser.focusRegion.chr, browser.focusRegion.start, browser.focusRegion.end, true); },
-    init    : (browser) => { browser.focusRegion = browser.focusRegion || { chr: browser.chr, start: browser.start, end: browser.end }; },
+    icon   : '<i class="fas fa-map-marker-alt"></i>',
+    class  : 'gv-button-large',
+    name   : `Reset focus to ${this.focusRegion && this.focusRegion.name ? this.focusRegion.name : `${this.chr}:${this.start}-${this.end}`}`,
+    action : (browser) => { browser.moveTo(browser.focusRegion.chr, browser.focusRegion.start, browser.focusRegion.end, true); },
+    init   : (browser) => { browser.focusRegion = browser.focusRegion || { chr: browser.chr, start: browser.start, end: browser.end }; },
   });
 };
 
-export default { focusRegion: plugin };
+export default { focusRegion: plugin, requires: controlPanel };

package/test/change-width.test.js

@@ -0,0 +1,71 @@
+const { afterTest } = require('./utils');
+
+describe('Changing width', () => {
+  afterEach(afterTest);
+
+  const genoverse = new Genoverse({
+    chr            : 1,
+    start          : 1,
+    end            : 20,
+    chromosomeSize : 9e99,
+    width          : 100,
+    tracks         : [ Genoverse.Track.extend({ 10: false, model: Genoverse.Track.Model.extend({ __test: true }) }) ],
+  });
+
+  const track = genoverse.tracks[0];
+
+  it('Initial settings are correct', () => {
+    expect(track.lengthMap.length).toBe(2);
+    expect(track.lengthMap.map(l => l[0])).toEqual([ 10, -1 ]);
+
+    expect(track.model).toEqual(track.models[10]);
+    expect(track.model.__test).toBe(undefined);
+
+    expect(genoverse.width).toBe(100);
+  });
+
+  it('Settings are correct after width change', (done) => {
+    genoverse.setWidth(1000);
+
+    setTimeout( // setWidth causes tracks to be reset after a 1ms delay, which we need to wait for here
+      () => {
+        try {
+          expect(track.lengthMap.length).toBe(2);
+          expect(track.lengthMap.map(l => l[0])).toEqual([ 10, -1 ]);
+
+          expect(track.model).toEqual(track.models[10]);
+          expect(track.model.__test).toBe(undefined);
+
+          expect(genoverse.width).toBe(1000);
+
+          done();
+        } catch (e) {
+          done(e);
+        }
+      },
+      100
+    );
+  });
+
+  it('Model changes correctly after width change + zoom out', (done) => {
+    genoverse.setWidth(1000);
+
+    setTimeout( // setWidth causes tracks to be reset after a 1ms delay, which we need to wait for here
+      () => {
+        genoverse.moveTo(1, 1, 5);
+
+        try {
+          expect(genoverse.width).toBe(1000);
+          expect(genoverse.length).toBe(5);
+          expect(track.model).toEqual(track.models[-1]);
+          expect(track.model.__test).toBe(true);
+
+          done();
+        } catch (e) {
+          done(e);
+        }
+      },
+      100
+    );
+  });
+});