igv 2.12.3 → 2.12.6

package/README.md

@@ -12,19 +12,19 @@ Below are examples and a quickstart guide.  See the [Wiki](https://github.com/ig
 
 # Examples
  
-***[Alignments](https://igv.org/web/release/2.12.3/examples/cram-vcf.html)***
+***[Alignments](https://igv.org/web/release/2.12.6/examples/cram-vcf.html)***
 
-***[Interactions](https://igv.org/web/release/2.12.3/examples/interact.html)***
+***[Interactions](https://igv.org/web/release/2.12.6/examples/interact.html)***
 
-***[Copy number](https://igv.org/web/release/2.12.3/examples/copyNumber.html)***
+***[Copy number](https://igv.org/web/release/2.12.6/examples/copyNumber.html)***
 
-***[Multiple regions](https://igv.org/web/release/2.12.3/examples/multi-locus.html)***
+***[Multiple regions](https://igv.org/web/release/2.12.6/examples/multi-locus.html)***
 
-***[Mutation Annotation Format (MAF)](https://igv.org/web/release/2.12.3/examples/maf-tcga.html)***
+***[Mutation Annotation Format (MAF)](https://igv.org/web/release/2.12.6/examples/maf-tcga.html)***
 
-***[Variant color options](https://igv.org/web/release/2.12.3/examples/variant-colors.html)***
+***[Variant color options](https://igv.org/web/release/2.12.6/examples/variant-colors.html)***
 
-***[More](https://igv.org/web/release/2.12.3/examples/)***
+***[More](https://igv.org/web/release/2.12.6/examples/)***
 
  
 # Quickstart
@@ -33,18 +33,18 @@ Below are examples and a quickstart guide.  See the [Wiki](https://github.com/ig
 igv.js consists of a single javascript file with no external dependencies.  
 
 Pre-built files for ES5 (igv.min.js) and ES6 (igv.esm.min.js)
-can be downloaded from [https://cdn.jsdelivr.net/npm/igv@2.12.3/dist/](https://cdn.jsdelivr.net/npm/igv@2.12.3/dist/). 
+can be downloaded from [https://cdn.jsdelivr.net/npm/igv@2.12.6/dist/](https://cdn.jsdelivr.net/npm/igv@2.12.6/dist/). 
 
 To import igv as an ES6 module
 
 ```javascript
-import igv from "https://cdn.jsdelivr.net/npm/igv@2.12.3/dist/igv.esm.min.js"
+import igv from "https://cdn.jsdelivr.net/npm/igv@2.12.6/dist/igv.esm.min.js"
 ``` 
 
 Or as a script include (defines the "igv" global)
 
 ```html
-<script src="https://cdn.jsdelivr.net/npm/igv@2.12.3/dist/igv.min.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/igv@2.12.6/dist/igv.min.js"></script>
 ```   
  
 Alternatively you can install with npm  

package/dist/igv.esm.js

@@ -16468,8 +16468,12 @@ const IGVColor = {
 
 let dragData$1;   // Its assumed we are only dragging one element at a time.
 
+let bbox = undefined;
 
-function makeDraggable$1(target, handle) {
+function makeDraggable$1(target, handle, constraint) {
+    if (constraint) {
+        bbox = Object.assign({}, constraint);
+    }
     handle.addEventListener('mousedown', dragStart$1.bind(target));
 }
 
@@ -16512,8 +16516,13 @@ function drag$1(event) {
     event.preventDefault();
     const dx = event.screenX - dragData$1.screenX;
     const dy = event.screenY - dragData$1.screenY;
-    this.style.left = `${dragData$1.left + dx}px`;
-    this.style.top = `${dragData$1.top + dy}px`;
+
+    // const left = bbox ? Math.max(bbox.minX, dragData.left + dx) : dragData.left + dx
+    const left = dragData$1.left + dx;
+    const  top = bbox ? Math.max(bbox.minY, dragData$1.top  + dy) : dragData$1.top  + dy;
+
+    this.style.left = `${ left }px`;
+    this.style.top  = `${  top }px`;
 }
 
 function dragEnd$1(event) {
@@ -16801,9 +16810,9 @@ const igvxhr = {
             options.responseType = "arraybuffer";
         }
         if (isFile(url)) {
-            return loadFileSlice(url, options);
+            return loadFileSlice(url, options)
         } else {
-            return load(url, options);
+            return load(url, options)
         }
     },
 
@@ -16815,18 +16824,18 @@ const igvxhr = {
         }
         const result = await this.loadString(url, options);
         if (result) {
-            return JSON.parse(result);
+            return JSON.parse(result)
         } else {
-            return result;
+            return result
         }
     },
 
     loadString: async function (path, options) {
         options = options || {};
         if (path instanceof File) {
-            return loadStringFromFile(path, options);
+            return loadStringFromFile(path, options)
         } else {
-            return loadStringFromUrl(path, options);
+            return loadStringFromUrl(path, options)
         }
     }
 };
@@ -16840,15 +16849,15 @@ async function load(url, options) {
     url = await (typeof url === 'function' ? url() : url);
 
     if (isFile(url)) {
-        return loadFileSlice(url, options);
+        return loadFileSlice(url, options)
     } else if (typeof url.startsWith === 'function') {   // Test for string
         if (url.startsWith("data:")) {
             const buffer = decodeDataURI$1(url).buffer;
-            if(options.range) {
+            if (options.range) {
                 const rangeEnd = options.range.size ? options.range.start + options.range.size : buffer.byteLength;
-                return buffer.slice(options.range.start, rangeEnd);
+                return buffer.slice(options.range.start, rangeEnd)
             } else {
-                return buffer;
+                return buffer
             }
         } else {
             if (url.startsWith("https://drive.google.com")) {
@@ -16859,11 +16868,11 @@ async function load(url, options) {
                     return loadURL(url, options)
                 })
             } else {
-                return loadURL(url, options);
+                return loadURL(url, options)
             }
         }
     } else {
-        throw Error(`url must be either a 'File', 'string', 'function', or 'Promise'.  Actual type: ${urlType}`);
+        throw Error(`url must be either a 'File', 'string', 'function', or 'Promise'.  Actual type: ${urlType}`)
     }
 }
 
@@ -16882,7 +16891,7 @@ async function loadURL(url, options) {
     return new Promise(function (resolve, reject) {
 
         // Various Google tansformations
-        if (isGoogleURL(url)) {
+        if (isGoogleURL(url) && !isGoogleStorageSigned(url)) {
             if (isGoogleStorageURL(url)) {
                 url = translateGoogleCloudURL(url);
             }
@@ -16906,7 +16915,7 @@ async function loadURL(url, options) {
         const isChrome = navigator.userAgent.indexOf('Chrome') > -1;
         navigator.vendor.indexOf("Apple") === 0 && /\sSafari\//.test(navigator.userAgent);
 
-        if (range && isChrome && !isAmazonV4Signed(url)) {
+        if (range && isChrome && !isAmazonV4Signed(url) && !isGoogleStorageSigned(url)) {
             // Hack to prevent caching for byte-ranges. Attempt to fix net:err-cache errors in Chrome
             url += url.includes("?") ? "&" : "?";
             url += "someRandomSeed=" + Math.random().toString(36);
@@ -17011,7 +17020,7 @@ async function loadURL(url, options) {
             if (reject) {
                 reject(error);
             } else {
-                throw error;
+                throw error
             }
         }
 
@@ -17043,60 +17052,38 @@ async function loadFileSlice(localfile, options) {
         localfile.slice(options.range.start, options.range.start + options.range.size) :
         localfile;
 
+    const arrayBuffer = await blob.arrayBuffer();
+
     if ("arraybuffer" === options.responseType) {
-        return blobToArrayBuffer(blob);
+        return arrayBuffer
     } else {
-        // binary string format, shouldn't be used anymore
-        return new Promise(function (resolve, reject) {
-            const fileReader = new FileReader();
-            fileReader.onload = function (e) {
-                resolve(fileReader.result);
-            };
-            fileReader.onerror = function (e) {
-                console.error("reject uploading local file " + localfile.name);
-                reject(null, fileReader);
-            };
-            fileReader.readAsBinaryString(blob);
-            console.warn("Deprecated method used: readAsBinaryString");
-        })
+        return arrayBufferToString(arrayBuffer)
     }
 }
 
 async function loadStringFromFile(localfile, options) {
 
     const blob = options.range ? localfile.slice(options.range.start, options.range.start + options.range.size) : localfile;
-    const arrayBuffer = await blobToArrayBuffer(blob);
-    return arrayBufferToString(arrayBuffer);
+    const arrayBuffer = await blob.arrayBuffer();
+    return arrayBufferToString(arrayBuffer)
 }
 
-async function blobToArrayBuffer(blob) {
-    if (typeof blob.arrayBuffer === 'function') {
-        return blob.arrayBuffer();
-    }
-    return new Promise(function (resolve, reject) {
-        const fileReader = new FileReader();
-        fileReader.onload = function (e) {
-            resolve(fileReader.result);
-        };
-        fileReader.onerror = function (e) {
-            console.error("reject uploading local file " + localfile.name);
-            reject(null, fileReader);
-        };
-        fileReader.readAsArrayBuffer(blob);
-    })
-}
 
 async function loadStringFromUrl(url, options) {
 
     options = options || {};
     options.responseType = "arraybuffer";
     const data = await igvxhr.load(url, options);
-    return arrayBufferToString(data);
+    return arrayBufferToString(data)
 }
 
 
 function isAmazonV4Signed(url) {
-    return url.indexOf("X-Amz-Signature") > -1;
+    return url.indexOf("X-Amz-Signature") > -1
+}
+
+function isGoogleStorageSigned(url) {
+    return url.indexOf("X-Goog-Signature") > -1
 }
 
 function getOauthToken(url) {
@@ -17107,11 +17094,11 @@ function getOauthToken(url) {
         parseUri(url).host;
     let token = oauth.getToken(host);
     if (token) {
-        return token;
+        return token
     } else if (host === undefined) {
         const googleToken = getCurrentGoogleAccessToken();
         if (googleToken && googleToken.expires_at > Date.now()) {
-            return googleToken.access_token;
+            return googleToken.access_token
         }
     }
 }
@@ -17127,7 +17114,7 @@ async function fetchGoogleAccessToken(url) {
     if (isInitialized()) {
         const scope = getScopeForURL(url);
         const googleToken = await getAccessToken(scope);
-        return googleToken ? googleToken.access_token : undefined;
+        return googleToken ? googleToken.access_token : undefined
     } else {
         throw Error(
             `Authorization is required, but Google oAuth has not been initalized. Contact your site administrator for assistance.`)
@@ -17141,9 +17128,9 @@ async function fetchGoogleAccessToken(url) {
 function getCurrentGoogleAccessToken() {
     if (isInitialized()) {
         const googleToken = getCurrentAccessToken();
-        return googleToken ? googleToken.access_token : undefined;
+        return googleToken ? googleToken.access_token : undefined
     } else {
-        return undefined;
+        return undefined
     }
 }
 
@@ -17152,7 +17139,7 @@ function addOauthHeaders(headers, acToken) {
         headers["Cache-Control"] = "no-cache";
         headers["Authorization"] = "Bearer " + acToken;
     }
-    return headers;
+    return headers
 }
 
 
@@ -17165,12 +17152,12 @@ function addApiKey(url) {
         const paramSeparator = url.includes("?") ? "&" : "?";
         url = url + paramSeparator + "key=" + apiKey;
     }
-    return url;
+    return url
 }
 
 function addTeamDrive(url) {
     if (url.includes("supportsTeamDrive")) {
-        return url;
+        return url
     } else {
         const paramSeparator = url.includes("?") ? "&" : "?";
         url = url + paramSeparator + "supportsTeamDrive=true";
@@ -17184,17 +17171,17 @@ function addTeamDrive(url) {
 function mapUrl(url) {
 
     if (url.includes("//www.dropbox.com")) {
-        return url.replace("//www.dropbox.com", "//dl.dropboxusercontent.com");
+        return url.replace("//www.dropbox.com", "//dl.dropboxusercontent.com")
     } else if (url.includes("//drive.google.com")) {
-        return driveDownloadURL(url);
+        return driveDownloadURL(url)
     } else if (url.includes("//www.broadinstitute.org/igvdata")) {
-        return url.replace("//www.broadinstitute.org/igvdata", "//data.broadinstitute.org/igvdata");
+        return url.replace("//www.broadinstitute.org/igvdata", "//data.broadinstitute.org/igvdata")
     } else if (url.includes("//igvdata.broadinstitute.org")) {
         return url.replace("//igvdata.broadinstitute.org", "https://dn7ywbm9isq8j.cloudfront.net")
     } else if (url.startsWith("ftp://ftp.ncbi.nlm.nih.gov/geo")) {
         return url.replace("ftp://", "https://")
     } else {
-        return url;
+        return url
     }
 }
 
@@ -17209,9 +17196,9 @@ function arrayBufferToString(arraybuffer) {
     }
 
     if ('TextDecoder' in getGlobalObject()) {
-        return new TextDecoder().decode(plain);
+        return new TextDecoder().decode(plain)
     } else {
-        return decodeUTF8(plain);
+        return decodeUTF8(plain)
     }
 }
 
@@ -17263,12 +17250,12 @@ function decodeUTF8(octets) {
 
 function getGlobalObject() {
     if (typeof self !== 'undefined') {
-        return self;
+        return self
     }
     if (typeof global !== 'undefined') {
-        return global;
+        return global
     } else {
-        return window;
+        return window
     }
 }
 
@@ -20506,10 +20493,15 @@ class SequenceTrack {
      * @returns {*|{}}
      */
     getState() {
-
-        const config = typeof super.getState === 'function' ? super.getState() : {};
-        if (this.reversed) config.revealed = true;
-        if (this.frameTranslate) config.frameTranslate = true;
+        const config = {
+            type: "sequence"
+        };
+        if (this.order !== defaultSequenceTrackOrder) {
+            config.order = this.order;
+        }
+        if (this.reversed) {
+            config.revealed = true;
+        }
         return config
     }
 
@@ -22809,7 +22801,7 @@ const Cytoband = function (start, end, name, typestain) {
     }
 };
 
-const _version = "2.12.3";
+const _version = "2.12.6";
 function version() {
     return _version
 }
@@ -23873,7 +23865,7 @@ class TrackViewport extends Viewport {
                 menuItems.push({label: $$1('<HR>')});
             }
 
-            menuItems.push({label: 'Save Image (PNG)', click: () => this.saveImage()});
+            menuItems.push({label: 'Save Image (PNG)', click: () => this.savePNG()});
             menuItems.push({label: 'Save Image (SVG)', click: () => this.saveSVG()});
 
             this.browser.menuPopup.presentTrackContextMenu(event, menuItems);
@@ -29048,8 +29040,12 @@ class BamSource {
  */
 
 const fixColor = (colorString) => {
-    return (colorString.indexOf(",") > 0 && !colorString.startsWith("rgb")) ?
-        `rgb(${colorString})` : colorString
+    if(isString$3(colorString)) {
+        return (colorString.indexOf(",") > 0 && !colorString.startsWith("rgb(")) ?
+            `rgb(${colorString})` : colorString
+    } else {
+        return colorString;
+    }
 };
 
 /**
@@ -29203,7 +29199,7 @@ class TrackBase {
     }
 
     get supportsWholeGenome() {
-        return false
+        return this.config.supportsWholeGenome === true
     }
 
     /**
@@ -39459,7 +39455,7 @@ function pack(featureList, maxRows) {
         let r = 0;
         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
@@ -40976,7 +40972,7 @@ class BWSource {
     }
 
     supportsWholeGenome() {
-        return this.reader.type === "bigwig" || this.defaultVisibilityWindow() <= 0
+        return this.reader.type === "bigwig"
     }
 
     async trackType() {
@@ -42211,7 +42207,15 @@ class FeatureTrack extends TrackBase {
     }
 
     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) {
@@ -42268,7 +42272,7 @@ class FeatureTrack extends TrackBase {
             options.rowLastX = [];
             options.rowLastLabelX = [];
             for (let feature of featureList) {
-                if(feature.start > bpStart && feature.end < bpEnd) {
+                if (feature.start > bpStart && feature.end < bpEnd) {
                     const row = this.displayMode === "COLLAPSED" ? 0 : feature.row || 0;
                     if (rowFeatureCount[row] === undefined) {
                         rowFeatureCount[row] = 1;
@@ -44532,6 +44536,8 @@ const isString = isString$3;
 
 const DEFAULT_VISIBILITY_WINDOW = 1000000;
 const TOP_MARGIN = 10;
+const STANDARD_FIELDS = new Map([["REF", "referenceBases"], ["ALT", "alternateBases"], ["QUAL", "quality"], ["FILTER", "filter"]]);
+
 
 class VariantTrack extends TrackBase {
 
@@ -44573,7 +44579,6 @@ class VariantTrack extends TrackBase {
             this.colorTables = new Map();
             this.colorTables.set(config.colorBy, new ColorTable(config.colorTable));
         }
-        this._color = config.color;
 
         this.showGenotypes = config.showGenotypes === undefined ? true : config.showGenotypes;
 
@@ -44682,9 +44687,9 @@ class VariantTrack extends TrackBase {
         IGVGraphics.fillRect(context, 0, pixelTop, pixelWidth, pixelHeight, {'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();
@@ -44784,14 +44789,21 @@ class VariantTrack extends TrackBase {
         let variantColor;
 
         if (this.colorBy) {
-            const value = v.info[this.colorBy];
-            variantColor = this.getVariantColorTable(this.colorBy).getColor(value);
+            const colorBy = this.colorBy;
+            let value;
+            if (v.info.hasOwnProperty(colorBy)) {
+                value = v.info[colorBy];
+            } else if (STANDARD_FIELDS.has(colorBy)) {
+                const key = STANDARD_FIELDS.get(colorBy);
+                value = v[key];
+            }
+            variantColor = this.getVariantColorTable(colorBy).getColor(value);
             if (!variantColor) {
                 variantColor = "gray";
             }
 
         } else if (this._color) {
-            variantColor = this.color;
+            variantColor = (typeof this._color === "function") ? this._color(variant) : this._color;
         } else if ("NONVARIANT" === v.type) {
             variantColor = this.nonRefColor;
         } else if ("MIXED" === v.type) {
@@ -44802,9 +44814,6 @@ class VariantTrack extends TrackBase {
         return variantColor
     }
 
-    get color() {
-        return this._color ? ((typeof this._color === "function") ? this._color(v) : this._color) : this.defaultColor
-    }
 
     clickedFeatures(clickState, features) {
 
@@ -44817,15 +44826,17 @@ class VariantTrack extends TrackBase {
         if (yOffset <= this.variantBandHeight) {
             // 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);
+            const variantRow = Math.floor((yOffset - TOP_MARGIN) / (variantHeight + vGap));
+            if ("COLLAPSED" !== this.displayMode) {
+                featureList = featureList.filter(f => f.row === variantRow);
+            }
         } else if (this.callSets) {
             const callSets = this.callSets;
             const sampleY = yOffset - this.variantBandHeight;
             const sampleRow = Math.floor(sampleY / this.sampleHeight);
             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];
@@ -45039,7 +45050,7 @@ class VariantTrack extends TrackBase {
                 label: 'Add SVs to circular view',
                 click: () => {
                     for (let viewport of this.trackView.viewports) {
-                       this.sendChordsForViewport(viewport);
+                        this.sendChordsForViewport(viewport);
                     }
                 }
             });