igv 2.12.1 → 2.12.4

package/dist/igv.js

@@ -20413,6 +20413,12 @@
       complement[t1[i].toLowerCase()] = t2[i].toLowerCase();
     }
 
+    const DEFAULT_HEIGHT = 25;
+    const TRANSLATED_HEIGHT = 115;
+    const SEQUENCE_HEIGHT = 15;
+    const FRAME_HEIGHT = 25;
+    const FRAME_BORDER = 5;
+
     class SequenceTrack {
       constructor(config, browser) {
         this.type = "sequence";
@@ -20423,12 +20429,12 @@
         this.id = "sequence";
         this.sequenceType = config.sequenceType || "dna"; //   dna | rna | prot
 
-        this.height = 25;
         this.disableButtons = false;
         this.order = config.order || defaultSequenceTrackOrder;
         this.ignoreTrackMenu = false;
-        this.reversed = false;
-        this.frameTranslate = false;
+        this.reversed = config.reversed === true;
+        this.frameTranslate = config.frameTranslate === true;
+        this.height = this.frameTranslate ? TRANSLATED_HEIGHT : DEFAULT_HEIGHT;
       }
 
       menuItemList() {
@@ -20445,16 +20451,16 @@
 
             if (this.frameTranslate) {
               for (let vp of this.trackView.viewports) {
-                vp.setContentHeight(115);
+                vp.setContentHeight(TRANSLATED_HEIGHT);
               }
 
-              this.trackView.setTrackHeight(115);
+              this.trackView.setTrackHeight(TRANSLATED_HEIGHT);
             } else {
               for (let vp of this.trackView.viewports) {
-                vp.setContentHeight(25);
+                vp.setContentHeight(DEFAULT_HEIGHT);
               }
 
-              this.trackView.setTrackHeight(25);
+              this.trackView.setTrackHeight(DEFAULT_HEIGHT);
             }
 
             this.trackView.repaintViews();
@@ -20537,6 +20543,9 @@
       }
 
       async getFeatures(chr, start, end, bpPerPixel) {
+        start = Math.floor(start);
+        end = Math.floor(end);
+
         if (bpPerPixel && bpPerPixel > 1) {
           return null;
         } else {
@@ -20552,33 +20561,35 @@
         const ctx = options.context;
 
         if (options.features) {
-          const sequence = options.features.sequence;
-          const sequenceBpStart = options.features.bpStart;
-          const bpEnd = 1 + options.bpStart + options.pixelWidth * options.bpPerPixel;
-          let height = 15;
+          let sequence = options.features.sequence;
+
+          if (this.reversed) {
+            sequence = sequence.split('').map(function (cv) {
+              return complement[cv];
+            }).join('');
+          }
 
-          for (let bp = sequenceBpStart; bp <= bpEnd; bp++) {
-            let seqOffsetBp = Math.floor(bp - sequenceBpStart);
+          const sequenceBpStart = options.features.bpStart; // genomic position at start of sequence
 
-            if (seqOffsetBp < sequence.length) {
-              let letter = sequence[seqOffsetBp];
+          const bpEnd = 1 + options.bpStart + options.pixelWidth * options.bpPerPixel;
 
-              if (this.reversed) {
-                letter = complement[letter] || "";
-              }
+          for (let bp = Math.floor(options.bpStart); bp <= bpEnd; bp++) {
+            const seqIdx = Math.floor(bp - sequenceBpStart);
 
-              let offsetBP = bp - options.bpStart;
-              let aPixel = offsetBP / options.bpPerPixel;
-              let bPixel = (offsetBP + 1) / options.bpPerPixel;
-              let color = this.fillColor(letter); // IGVGraphics.fillRect(ctx, aPixel, 5, bPixel - aPixel, height - 5, { fillStyle: randomRGBConstantAlpha(150, 255, 0.75) });
+            if (seqIdx >= 0 && seqIdx < sequence.length) {
+              const baseLetter = sequence[seqIdx];
+              const offsetBP = bp - options.bpStart;
+              const aPixel = offsetBP / options.bpPerPixel;
+              const pixelWidth = 1 / options.bpPerPixel;
+              const color = this.fillColor(baseLetter);
 
               if (options.bpPerPixel > 1 / 10) {
-                IGVGraphics.fillRect(ctx, aPixel, 5, bPixel - aPixel, height - 5, {
+                IGVGraphics.fillRect(ctx, aPixel, 5, pixelWidth, SEQUENCE_HEIGHT - 5, {
                   fillStyle: color
                 });
               } else {
-                let xPixel = 0.5 * (aPixel + bPixel - ctx.measureText(letter).width);
-                IGVGraphics.strokeText(ctx, letter, xPixel, height, {
+                let textPixel = aPixel + 0.5 * (pixelWidth - ctx.measureText(baseLetter).width);
+                IGVGraphics.strokeText(ctx, baseLetter, textPixel, SEQUENCE_HEIGHT, {
                   strokeStyle: color
                 });
               }
@@ -20586,55 +20597,48 @@
           }
 
           if (this.frameTranslate) {
-            let transSeq;
+            let y = SEQUENCE_HEIGHT + 2 * FRAME_BORDER;
+            const translatedSequence = this.translateSequence(sequence);
 
-            if (this.reversed) {
-              transSeq = sequence.split('').map(function (cv) {
-                return complement[cv];
-              });
-              transSeq = transSeq.join('');
-            } else {
-              transSeq = sequence;
-            }
+            for (let fNum = 0; fNum < translatedSequence.length; fNum++) {
+              // == 3, 1 for each frame
+              const aaSequence = translatedSequence[fNum]; // AA sequence for this frame
 
-            let y = height;
-            let translatedSequence = this.translateSequence(transSeq);
-
-            for (let arr of translatedSequence) {
-              let i = translatedSequence.indexOf(arr);
-              let fNum = i;
-              let h = 25;
-              y = i === 0 ? y + 10 : y + 30; //Little less room at first.
-
-              for (let cv of arr) {
-                let aaS;
-                let idx = arr.indexOf(cv);
-                let xSeed = idx + fNum + 2 * idx;
+              for (let idx = 0; idx < aaSequence.length; idx++) {
                 let color = 0 === idx % 2 ? 'rgb(160,160,160)' : 'rgb(224,224,224)';
-                let p0 = Math.floor(xSeed / options.bpPerPixel);
-                let p1 = Math.floor((xSeed + 3) / options.bpPerPixel);
-                let pc = Math.round((p0 + p1) / 2);
+                const cv = aaSequence[idx];
+                const bpPos = sequenceBpStart + fNum + idx * 3;
+                const bpOffset = bpPos - options.bpStart;
+                const p0 = Math.floor(bpOffset / options.bpPerPixel);
+                const p1 = Math.floor((bpOffset + 3) / options.bpPerPixel);
+                const pc = Math.round((p0 + p1) / 2);
+
+                if (p1 < 0) {
+                  continue; // off left edge
+                } else if (p0 > options.pixelWidth) {
+                  break; // off right edge
+                }
+
+                let aaLabel = cv.aminoA;
 
                 if (cv.aminoA.indexOf('STOP') > -1) {
                   color = 'rgb(255, 0, 0)';
-                  aaS = 'STOP'; //Color blind accessible
-                } else {
-                  aaS = cv.aminoA;
-                }
-
-                if (cv.aminoA === 'M') {
+                  aaLabel = 'STOP'; //Color blind accessible
+                } else if (cv.aminoA === 'M') {
                   color = 'rgb(0, 153, 0)';
-                  aaS = 'START'; //Color blind accessible
+                  aaLabel = 'START'; //Color blind accessible
                 }
 
-                IGVGraphics.fillRect(ctx, p0, y, p1 - p0, h, {
+                IGVGraphics.fillRect(ctx, p0, y, p1 - p0, FRAME_HEIGHT, {
                   fillStyle: color
                 });
 
                 if (options.bpPerPixel <= 1 / 10) {
-                  IGVGraphics.strokeText(ctx, aaS, pc - ctx.measureText(aaS).width / 2, y + 15);
+                  IGVGraphics.strokeText(ctx, aaLabel, pc - ctx.measureText(aaLabel).width / 2, y + 15);
                 }
               }
+
+              y += FRAME_HEIGHT + FRAME_BORDER;
             }
           }
         }
@@ -20645,6 +20649,7 @@
       }
 
       computePixelHeight(ignore) {
+        this.height = this.frameTranslate ? TRANSLATED_HEIGHT : DEFAULT_HEIGHT;
         return this.height;
       }
 
@@ -20657,6 +20662,28 @@
           return 'rgb(0, 0, 150)';
         }
       }
+      /**
+       * Return the current state of the track.  Used to create sessions and bookmarks.
+       *
+       * @returns {*|{}}
+       */
+
+
+      getState() {
+        const config = {
+          type: "sequence"
+        };
+
+        if (this.order !== defaultSequenceTrackOrder) {
+          config.order = this.order;
+        }
+
+        if (this.reversed) {
+          config.revealed = true;
+        }
+
+        return config;
+      }
 
     }
 
@@ -22623,7 +22650,9 @@
       }
 
       async getSequence(chr, start, end) {
-        if (!(this.interval && this.interval.contains(chr, start, end))) {
+        const hasCachedSquence = this.interval && this.interval.contains(chr, start, end);
+
+        if (!hasCachedSquence) {
           // Expand query, to minimum of 50kb
           let qstart = start;
           let qend = end;
@@ -23093,7 +23122,7 @@
       }
     };
 
-    const _version = "2.12.1";
+    const _version = "2.12.4";
 
     function version$1() {
       return _version;
@@ -23748,6 +23777,19 @@
           this.stopSpinner();
         }
       }
+
+      repaintDimensions() {
+        const isWGV = GenomeUtils.isWholeGenomeView(this.referenceFrame.chr);
+        const pixelWidth = isWGV ? this.$viewport.width() : 3 * this.$viewport.width();
+        const bpPerPixel = this.referenceFrame.bpPerPixel;
+        const startBP = this.referenceFrame.start - (isWGV ? 0 : pixelWidth / 3 * bpPerPixel);
+        const endBP = this.referenceFrame.end + (isWGV ? 0 : pixelWidth / 3 * bpPerPixel);
+        return {
+          startBP,
+          endBP,
+          pixelWidth
+        };
+      }
       /**
        * Repaint the canvas using the cached features
        *
@@ -23765,10 +23807,14 @@
         } = this.featureCache; //this.tile.bpPerPixel = this.referenceFrame.bpPerPixel
         // const isWGV = GenomeUtils.isWholeGenomeView(this.browser.referenceFrameList[0].chr)
 
-        const isWGV = GenomeUtils.isWholeGenomeView(this.referenceFrame.chr); // Canvas dimensions. There is no left-right panning for WGV so canvas width is viewport width.
+        GenomeUtils.isWholeGenomeView(this.referenceFrame.chr); // Canvas dimensions. There is no left-right panning for WGV so canvas width is viewport width.
         // For deep tracks we paint a canvas == 3*viewportHeight centered on the current vertical scroll position
 
-        const pixelWidth = isWGV ? this.$viewport.width() : 3 * this.$viewport.width();
+        const {
+          startBP,
+          endBP,
+          pixelWidth
+        } = this.repaintDimensions();
         const viewportHeight = this.$viewport.height();
         const contentHeight = this.getContentHeight();
         const minHeight = roiFeatures ? Math.max(contentHeight, viewportHeight) : contentHeight; // Need to fill viewport for ROIs.
@@ -23784,9 +23830,9 @@
         }
 
         const canvasTop = Math.max(0, -this.$content.position().top - viewportHeight);
-        const bpPerPixel = this.referenceFrame.bpPerPixel;
-        const startBP = this.referenceFrame.start - (isWGV ? 0 : pixelWidth / 3 * bpPerPixel);
-        const endBP = this.referenceFrame.end + (isWGV ? 0 : pixelWidth / 3 * bpPerPixel);
+        const bpPerPixel = this.referenceFrame.bpPerPixel; //const startBP = this.referenceFrame.start - (isWGV ? 0 : pixelWidth / 3 * bpPerPixel)
+        //const endBP = this.referenceFrame.end + (isWGV ? 0 : pixelWidth / 3 * bpPerPixel)
+
         const pixelXOffset = Math.round((startBP - this.referenceFrame.start) / bpPerPixel);
         const newCanvas = $$1('<canvas class="igv-canvas">').get(0);
         newCanvas.style.width = pixelWidth + "px";
@@ -24027,10 +24073,12 @@
         if (!this.featureCache) return true;
         const referenceFrame = this.referenceFrame;
         const chr = this.referenceFrame.chr;
-        const start = referenceFrame.start;
-        const end = start + referenceFrame.toBP($$1(this.contentDiv).width());
         const bpPerPixel = referenceFrame.bpPerPixel;
-        return !this.featureCache.containsRange(chr, start, end, bpPerPixel);
+        const {
+          startBP,
+          endBP
+        } = this.repaintDimensions();
+        return !this.featureCache.containsRange(chr, startBP, endBP, bpPerPixel);
       }
 
       createZoomInNotice($parent) {
@@ -24496,7 +24544,7 @@
     }; // https://github.com/zloirock/core-js/issues/86#issuecomment-115759028
 
 
-    var global$1 = // eslint-disable-next-line es/no-global-this -- safe
+    var global$1 = // eslint-disable-next-line es-x/no-global-this -- safe
     check(typeof globalThis == 'object' && globalThis) || check(typeof window == 'object' && window) || // eslint-disable-next-line no-restricted-globals -- safe
     check(typeof self == 'object' && self) || check(typeof commonjsGlobal == 'object' && commonjsGlobal) || // eslint-disable-next-line no-new-func -- fallback
     function () {
@@ -24512,6 +24560,7 @@
     };
 
     var functionBindNative = !fails(function () {
+      // eslint-disable-next-line es-x/no-function-prototype-bind -- safe
       var test = function () {
         /* empty */
       }.bind(); // eslint-disable-next-line no-prototype-builtins -- safe
@@ -24525,11 +24574,11 @@
       return call$2.apply(call$2, arguments);
     };
 
-    // eslint-disable-next-line es/no-typed-arrays -- safe
+    // eslint-disable-next-line es-x/no-typed-arrays -- safe
     var arrayBufferNative = typeof ArrayBuffer != 'undefined' && typeof DataView != 'undefined';
 
     var descriptors = !fails(function () {
-      // eslint-disable-next-line es/no-object-defineproperty -- required for testing
+      // eslint-disable-next-line es-x/no-object-defineproperty -- required for testing
       return Object.defineProperty({}, 1, {
         get: function () {
           return 7;
@@ -24576,6 +24625,7 @@
 
     var hasOwnProperty = functionUncurryThis({}.hasOwnProperty); // `HasOwnProperty` abstract operation
     // https://tc39.es/ecma262/#sec-hasownproperty
+    // eslint-disable-next-line es-x/no-object-hasown -- safe
 
     var hasOwnProperty_1 = Object.hasOwn || function hasOwn(it, key) {
       return hasOwnProperty(toObject(it), key);
@@ -24605,10 +24655,10 @@
       (module.exports = function (key, value) {
         return sharedStore[key] || (sharedStore[key] = value !== undefined ? value : {});
       })('versions', []).push({
-        version: '3.21.1',
+        version: '3.22.2',
         mode: 'global',
         copyright: '© 2014-2022 Denis Pushkarev (zloirock.ru)',
-        license: 'https://github.com/zloirock/core-js/blob/v3.21.1/LICENSE',
+        license: 'https://github.com/zloirock/core-js/blob/v3.22.2/LICENSE',
         source: 'https://github.com/zloirock/core-js'
       });
     });
@@ -24657,7 +24707,7 @@
 
     var engineV8Version = version;
 
-    /* eslint-disable es/no-symbol -- required for testing */
+    /* eslint-disable es-x/no-symbol -- required for testing */
 
     var nativeSymbol = !!Object.getOwnPropertySymbols && !fails(function () {
       var symbol = Symbol(); // Chrome 38 Symbol has incorrect toString conversion
@@ -24667,7 +24717,7 @@
       !Symbol.sham && engineV8Version && engineV8Version < 41;
     });
 
-    /* eslint-disable es/no-symbol -- required for testing */
+    /* eslint-disable es-x/no-symbol -- required for testing */
     var useSymbolAsUid = nativeSymbol && !Symbol.sham && typeof Symbol.iterator == 'symbol';
 
     var WellKnownSymbolsStore = shared('wks');
@@ -24746,7 +24796,7 @@
     };
 
     var ie8DomDefine = !descriptors && !fails(function () {
-      // eslint-disable-next-line es/no-object-defineproperty -- required for testing
+      // eslint-disable-next-line es-x/no-object-defineproperty -- required for testing
       return Object.defineProperty(documentCreateElement('div'), 'a', {
         get: function () {
           return 7;
@@ -24757,7 +24807,7 @@
     // https://bugs.chromium.org/p/v8/issues/detail?id=3334
 
     var v8PrototypeDefineBug = descriptors && fails(function () {
-      // eslint-disable-next-line es/no-object-defineproperty -- required for testing
+      // eslint-disable-next-line es-x/no-object-defineproperty -- required for testing
       return Object.defineProperty(function () {
         /* empty */
       }, 'prototype', {
@@ -24836,9 +24886,9 @@
       return isSymbol(key) ? key : key + '';
     };
 
-    var TypeError$5 = global$1.TypeError; // eslint-disable-next-line es/no-object-defineproperty -- safe
+    var TypeError$5 = global$1.TypeError; // eslint-disable-next-line es-x/no-object-defineproperty -- safe
 
-    var $defineProperty = Object.defineProperty; // eslint-disable-next-line es/no-object-getownpropertydescriptor -- safe
+    var $defineProperty = Object.defineProperty; // eslint-disable-next-line es-x/no-object-getownpropertydescriptor -- safe
 
     var $getOwnPropertyDescriptor$1 = Object.getOwnPropertyDescriptor;
     var ENUMERABLE = 'enumerable';
@@ -24988,7 +25038,7 @@
       getterFor: getterFor
     };
 
-    var FunctionPrototype$1 = Function.prototype; // eslint-disable-next-line es/no-object-getownpropertydescriptor -- safe
+    var FunctionPrototype$1 = Function.prototype; // eslint-disable-next-line es-x/no-object-getownpropertydescriptor -- safe
 
     var getDescriptor = descriptors && Object.getOwnPropertyDescriptor;
     var EXISTS = hasOwnProperty_1(FunctionPrototype$1, 'name'); // additional protection from minified / mangled / dropped function names
@@ -25052,7 +25102,7 @@
         /* empty */
       }
 
-      F.prototype.constructor = null; // eslint-disable-next-line es/no-object-getprototypeof -- required for testing
+      F.prototype.constructor = null; // eslint-disable-next-line es-x/no-object-getprototypeof -- required for testing
 
       return Object.getPrototypeOf(new F()) !== F.prototype;
     });
@@ -25085,7 +25135,7 @@
     /* eslint-disable no-proto -- safe */
     // https://tc39.es/ecma262/#sec-object.setprototypeof
     // Works with __proto__ only. Old v8 can't work with null proto objects.
-    // eslint-disable-next-line es/no-object-setprototypeof -- safe
+    // eslint-disable-next-line es-x/no-object-setprototypeof -- safe
 
     var objectSetPrototypeOf = Object.setPrototypeOf || ('__proto__' in {} ? function () {
       var CORRECT_SETTER = false;
@@ -25093,7 +25143,7 @@
       var setter;
 
       try {
-        // eslint-disable-next-line es/no-object-getownpropertydescriptor -- safe
+        // eslint-disable-next-line es-x/no-object-getownpropertydescriptor -- safe
         setter = functionUncurryThis(Object.getOwnPropertyDescriptor(Object.prototype, '__proto__').set);
         setter(test, []);
         CORRECT_SETTER = test instanceof Array;
@@ -25326,7 +25376,7 @@
     var aTypedArray = arrayBufferViewCore.aTypedArray;
     var exportTypedArrayMethod = arrayBufferViewCore.exportTypedArrayMethod;
     var WORKS_WITH_OBJECTS_AND_GEERIC_ON_TYPED_ARRAYS = !fails(function () {
-      // eslint-disable-next-line es/no-typed-arrays -- required for testing
+      // eslint-disable-next-line es-x/no-typed-arrays -- required for testing
       var array = new Uint8ClampedArray(2);
       functionCall($set, array, {
         length: 1,
@@ -25481,6 +25531,10 @@
         }
       }
 
+      hasTag(str) {
+        return this.firstAlignment.hasTag(str) || this.secondAlignment && this.secondAlignment.hasTag(str);
+      }
+
     }
 
     /*
@@ -28869,7 +28923,7 @@
 
     }
 
-    var $propertyIsEnumerable = {}.propertyIsEnumerable; // eslint-disable-next-line es/no-object-getownpropertydescriptor -- safe
+    var $propertyIsEnumerable = {}.propertyIsEnumerable; // eslint-disable-next-line es-x/no-object-getownpropertydescriptor -- safe
 
     var getOwnPropertyDescriptor$1 = Object.getOwnPropertyDescriptor; // Nashorn ~ JDK8 bug
 
@@ -28980,7 +29034,7 @@
 
     var hiddenKeys = enumBugKeys.concat('length', 'prototype'); // `Object.getOwnPropertyNames` method
     // https://tc39.es/ecma262/#sec-object.getownpropertynames
-    // eslint-disable-next-line es/no-object-getownpropertynames -- safe
+    // eslint-disable-next-line es-x/no-object-getownpropertynames -- safe
 
     var f$1 = Object.getOwnPropertyNames || function getOwnPropertyNames(O) {
       return objectKeysInternal(O, hiddenKeys);
@@ -28990,7 +29044,7 @@
       f: f$1
     };
 
-    // eslint-disable-next-line es/no-object-getownpropertysymbols -- safe
+    // eslint-disable-next-line es-x/no-object-getownpropertysymbols -- safe
     var f = Object.getOwnPropertySymbols;
     var objectGetOwnPropertySymbols = {
       f: f
@@ -29092,7 +29146,7 @@
 
     var FunctionPrototype = Function.prototype;
     var apply = FunctionPrototype.apply;
-    var call = FunctionPrototype.call; // eslint-disable-next-line es/no-reflect -- safe
+    var call = FunctionPrototype.call; // eslint-disable-next-line es-x/no-reflect -- safe
 
     var functionApply = typeof Reflect == 'object' && Reflect.apply || (functionBindNative ? call.bind(apply) : function () {
       return call.apply(apply, arguments);
@@ -29226,20 +29280,28 @@
       clear: clear
     };
 
-    var FORCED = !global$1.setImmediate || !global$1.clearImmediate; // http://w3c.github.io/setImmediate/
+    var clearImmediate = task.clear; // `clearImmediate` method
+    // http://w3c.github.io/setImmediate/#si-clearImmediate
 
     _export({
       global: true,
       bind: true,
       enumerable: true,
-      forced: FORCED
+      forced: global$1.clearImmediate !== clearImmediate
     }, {
-      // `setImmediate` method
-      // http://w3c.github.io/setImmediate/#si-setImmediate
-      setImmediate: task.set,
-      // `clearImmediate` method
-      // http://w3c.github.io/setImmediate/#si-clearImmediate
-      clearImmediate: task.clear
+      clearImmediate: clearImmediate
+    });
+
+    var setImmediate = task.set; // `setImmediate` method
+    // http://w3c.github.io/setImmediate/#si-setImmediate
+
+    _export({
+      global: true,
+      bind: true,
+      enumerable: true,
+      forced: global$1.setImmediate !== setImmediate
+    }, {
+      setImmediate: setImmediate
     });
 
     const eval2 = eval;
@@ -45592,7 +45654,7 @@
       }
 
       get supportsWholeGenome() {
-        return false;
+        return this.config.supportsWholeGenome === true;
       }
       /**
        * Does the track support sample names.  Current sample aware tracks include VCF (with genotypes), MUT, MAF, and SEG
@@ -48271,20 +48333,36 @@
       const chords = [];
 
       for (let a of alignments) {
-        const mate = a.mate;
-
-        if (mate && mate.chr && mate.position) {
-          chords.push({
-            uniqueId: a.readName,
-            refName: shortChrName(a.chr),
-            start: a.start,
-            end: a.end,
-            mate: {
-              refName: shortChrName(mate.chr),
-              start: mate.position - 1,
-              end: mate.position
-            }
-          });
+        if (a.paired) {
+          if (a.firstAlignment && a.secondAlignment) {
+            chords.push({
+              uniqueId: a.readName,
+              refName: shortChrName(a.firstAlignment.chr),
+              start: a.firstAlignment.start,
+              end: a.firstAlignment.end,
+              mate: {
+                refName: shortChrName(a.secondAlignment.chr),
+                start: a.secondAlignment.start,
+                end: a.secondAlignment.end
+              }
+            });
+          }
+        } else {
+          const mate = a.mate;
+
+          if (mate && mate.chr && mate.position) {
+            chords.push({
+              uniqueId: a.readName,
+              refName: shortChrName(a.chr),
+              start: a.start,
+              end: a.end,
+              mate: {
+                refName: shortChrName(mate.chr),
+                start: mate.position - 1,
+                end: mate.position
+              }
+            });
+          }
         }
       }
 
@@ -48292,9 +48370,7 @@
     };
 
     const makeSupplementalAlignmentChords = alignments => {
-      const chords = [];
-
-      for (let a of alignments) {
+      const makeChords = a => {
         const sa = a.tags()['SA'];
         const supAl = createSupplementaryAlignments(sa);
         let n = 0;
@@ -48314,6 +48390,20 @@
             });
           }
         }
+      };
+
+      const chords = [];
+
+      for (let a of alignments) {
+        if (a.paired) {
+          makeChords(a.firstAlignment);
+
+          if (a.secondAlignment) {
+            makeChords(a.secondAlignment);
+          }
+        } else {
+          makeChords(a);
+        }
       }
 
       return chords;
@@ -49040,8 +49130,16 @@
         const refFrame = viewport.referenceFrame;
 
         for (let a of viewport.cachedFeatures.allAlignments()) {
-          if (a.end >= refFrame.start && a.start <= refFrame.end && a.mate && a.mate.chr && (a.mate.chr !== a.chr || Math.max(a.fragmentLength) > maxTemplateLength)) {
-            inView.push(a);
+          if (a.end >= refFrame.start && a.start <= refFrame.end) {
+            if (a.paired) {
+              if (a.end - a.start > maxTemplateLength) {
+                inView.push(a);
+              }
+            } else {
+              if (a.mate && a.mate.chr && (a.mate.chr !== a.chr || Math.max(a.fragmentLength) > maxTemplateLength)) {
+                inView.push(a);
+              }
+            }
           }
         }
 
@@ -50566,7 +50664,7 @@
                 sampleNameViewport.setWidth(this.browser.sampleNameViewportWidth);
               }
 
-              this.browser.resize();
+              this.browser.layoutChange();
             }
           };
           this.browser.inputDialog.present(config, event);
@@ -56093,7 +56191,7 @@
         const len = Math.min(rows.length, maxRows);
 
         for (r = 0; r < len; r++) {
-          if (feature.start > rows[r]) {
+          if (feature.start >= rows[r]) {
             feature.row = r;
             rows[r] = feature.end;
             break;
@@ -57566,7 +57664,7 @@
       }
 
       supportsWholeGenome() {
-        return this.reader.type === "bigwig" || this.defaultVisibilityWindow() <= 0;
+        return this.reader.type === "bigwig";
       }
 
       async trackType() {
@@ -58824,7 +58922,15 @@
       }
 
       get supportsWholeGenome() {
-        return (this.config.indexed === false || !this.config.indexURL) && this.config.supportsWholeGenome !== false;
+        if (this.config.supportsWholeGenome !== undefined) {
+          return this.config.supportsWholeGenome;
+        } else if (this.featureSource && typeof this.featureSource.supportsWholeGenome === 'function') {
+          return this.featureSource.supportsWholeGenome();
+        } else {
+          if (this.visibilityWindow === undefined && (this.config.indexed === false || !this.config.indexURL)) {
+            return true;
+          }
+        }
       }
 
       async getFeatures(chr, start, end, bpPerPixel) {
@@ -61391,9 +61497,9 @@
           'fillStyle': "rgb(255, 255, 255)"
         });
         const vGap = "SQUISHED" === this.displayMode ? this.squishedVGap : this.expandedVGap;
-        const rc = "COLLAPSED" === this.displayMode ? 1 : this.nVariantRows;
+        const rowCount = "COLLAPSED" === this.displayMode ? 1 : this.nVariantRows;
         const variantHeight = "SQUISHED" === this.displayMode ? this.squishedVariantHeight : this.expandedVariantHeight;
-        this.variantBandHeight = TOP_MARGIN + rc * (variantHeight + vGap);
+        this.variantBandHeight = TOP_MARGIN + rowCount * (variantHeight + vGap);
         const callSets = this.callSets;
         const nCalls = this.getCallsetsLength();
 
@@ -61535,7 +61641,10 @@
           // Variant
           const variantHeight = "SQUISHED" === this.displayMode ? this.squishedVariantHeight : this.expandedVariantHeight;
           const variantRow = Math.floor((yOffset - TOP_MARGIN) / (variantHeight + vGap));
-          featureList = featureList.filter(f => f.row === variantRow);
+
+          if ("COLLAPSED" !== this.displayMode) {
+            featureList = featureList.filter(f => f.row === variantRow);
+          }
         } else if (this.callSets) {
           const callSets = this.callSets;
           const sampleY = yOffset - this.variantBandHeight;
@@ -61543,7 +61652,7 @@
 
           if (sampleRow >= 0 && sampleRow < callSets.length) {
             const variantRow = Math.floor((sampleY - sampleRow * this.sampleHeight) / callHeight);
-            const variants = featureList.filter(f => f.row === variantRow);
+            const variants = "COLLAPSED" === this.displayMode ? featureList : featureList.filter(f => f.row === variantRow);
             const cs = callSets[sampleRow];
             featureList = variants.map(v => {
               const call = v.calls[cs.id];
@@ -65409,7 +65518,7 @@
             }
           }
 
-          browser.resize();
+          browser.layoutChange();
         });
       }
 
@@ -67032,8 +67141,18 @@
           trackView.setTrackHeight(newHeight);
         });
       }
+      /**
+       * API function to signal that this browser visibility has changed, e.g. from hiding/showing in a tab interface.
+       *
+       * @returns {Promise<void>}
+       */
+
 
       async visibilityChange() {
+        this.layoutChange();
+      }
+
+      async layoutChange() {
         const status = this.referenceFrameList.find(referenceFrame => referenceFrame.bpPerPixel < 0);
 
         if (status) {