@jbrowse/plugin-alignments 3.7.0 → 4.0.1

package/esm/RenderLinearReadCloudDisplayRPC/drawFeatsCommon.js

@@ -0,0 +1,277 @@
+import Flatbush from '@jbrowse/core/util/flatbush';
+import { CLIP_RECT_HEIGHT, chainIsPairedEnd, collectNonSupplementary, } from "./drawChainsUtil.js";
+import { drawLongReadChains } from "./drawLongReadChains.js";
+import { drawPairChains } from "./drawPairChains.js";
+import { PairType, getPairedType } from "../shared/color.js";
+import { SAM_FLAG_PAIRED, SAM_FLAG_SUPPLEMENTARY } from "../shared/samFlags.js";
+import { shouldRenderChevrons } from "../shared/util.js";
+const TLEN_CONSISTENCY_FACTOR = 100;
+export function filterChains(chains, drawSingletons, drawProperPairs, type, chainData) {
+    const filtered = [];
+    for (const chain of chains) {
+        if (!drawSingletons && chain.length === 1) {
+            continue;
+        }
+        const isPairedEnd = chainIsPairedEnd(chain);
+        if (!drawProperPairs && isPairedEnd) {
+            const nonSupplementary = collectNonSupplementary(chain);
+            if (nonSupplementary.length === 2) {
+                const v0 = nonSupplementary[0];
+                const pairType = getPairedType({
+                    type,
+                    f: {
+                        refName: v0.get('refName'),
+                        next_ref: v0.get('next_ref'),
+                        pair_orientation: v0.get('pair_orientation'),
+                        tlen: v0.get('template_length'),
+                        flags: v0.get('flags'),
+                    },
+                    stats: chainData.stats,
+                });
+                if (pairType === PairType.PROPER_PAIR) {
+                    continue;
+                }
+            }
+        }
+        filtered.push(chain);
+    }
+    return filtered;
+}
+export function computeChainBounds(chains, view) {
+    const computedChains = [];
+    const { bpPerPx } = view;
+    for (const chain of chains) {
+        let minX = Number.MAX_VALUE;
+        let maxX = Number.MIN_VALUE;
+        let chainId = '';
+        let tlenDistance = 0;
+        let isPairedEnd = false;
+        const nonSupplementary = [];
+        const chainLength = chain.length;
+        for (let j = 0; j < chainLength; j++) {
+            const elt = chain[j];
+            const start = elt.get('start');
+            const end = elt.get('end');
+            const flags = elt.get('flags');
+            if (flags & SAM_FLAG_PAIRED) {
+                isPairedEnd = true;
+            }
+            if (!(flags & SAM_FLAG_SUPPLEMENTARY)) {
+                nonSupplementary.push(elt);
+            }
+            const rs = view.bpToPx({
+                refName: elt.get('refName'),
+                coord: start,
+            })?.offsetPx;
+            if (rs !== undefined) {
+                const re = rs + (end - start) / bpPerPx;
+                minX = Math.min(minX, rs);
+                maxX = Math.max(maxX, re);
+            }
+            if (!chainId) {
+                chainId = elt.id();
+            }
+            const tlen = elt.get('template_length');
+            if (tlenDistance === 0 && tlen) {
+                tlenDistance = Math.abs(tlen);
+            }
+        }
+        if (minX === Number.MAX_VALUE || maxX === Number.MIN_VALUE) {
+            continue;
+        }
+        let distance = 0;
+        if (tlenDistance > 0) {
+            const bpSpan = (maxX - minX) * bpPerPx;
+            if (tlenDistance <= bpSpan * TLEN_CONSISTENCY_FACTOR) {
+                distance = tlenDistance;
+            }
+        }
+        computedChains.push({
+            distance,
+            minX,
+            maxX,
+            chain,
+            id: chainId,
+            isPairedEnd,
+            nonSupplementary,
+        });
+    }
+    return computedChains;
+}
+export function sortComputedChains(computedChains) {
+    computedChains.sort((a, b) => {
+        const aIsSingleton = a.chain.length === 1 ? 1 : 0;
+        const bIsSingleton = b.chain.length === 1 ? 1 : 0;
+        if (bIsSingleton !== aIsSingleton) {
+            return bIsSingleton - aIsSingleton;
+        }
+        return a.distance - b.distance;
+    });
+}
+export function buildFlatbushIndex(featuresForFlatbush, self) {
+    const finalFlatbush = new Flatbush(Math.max(featuresForFlatbush.length, 1));
+    const length = featuresForFlatbush.length;
+    if (length) {
+        for (let i = 0; i < length; i++) {
+            const { x1, y1, x2, y2 } = featuresForFlatbush[i];
+            finalFlatbush.add(x1, y1, x2, y2);
+        }
+    }
+    else {
+        finalFlatbush.add(0, 0);
+    }
+    finalFlatbush.finish();
+    self.setFeatureLayout(finalFlatbush);
+    self.setFeaturesForFlatbush(featuresForFlatbush);
+}
+export function addChainMouseoverRects(computedChains, chainYOffsets, featureHeight, view, featuresForFlatbush) {
+    for (const computedChain of computedChains) {
+        const { id, chain, minX, maxX, nonSupplementary } = computedChain;
+        const chainY = chainYOffsets.get(id);
+        if (chainY === undefined) {
+            continue;
+        }
+        const chainMinXPx = minX - view.offsetPx;
+        const chainMaxXPx = maxX - view.offsetPx;
+        if (chain.length > 0) {
+            const primaryFeat = nonSupplementary[0] || chain[0];
+            const hasSupplementary = nonSupplementary.length < chain.length;
+            featuresForFlatbush.push({
+                x1: chainMinXPx,
+                y1: chainY,
+                x2: chainMaxXPx,
+                y2: chainY + featureHeight,
+                data: {
+                    name: primaryFeat.get('name'),
+                    refName: primaryFeat.get('refName'),
+                    start: primaryFeat.get('start'),
+                    end: primaryFeat.get('end'),
+                    strand: primaryFeat.get('strand'),
+                    flags: primaryFeat.get('flags'),
+                    id: primaryFeat.id(),
+                    tlen: primaryFeat.get('template_length') || 0,
+                    pair_orientation: primaryFeat.get('pair_orientation') || '',
+                    clipLengthAtStartOfRead: primaryFeat.get('clipLengthAtStartOfRead') || 0,
+                    next_ref: primaryFeat.get('next_ref'),
+                },
+                chainId: id,
+                chainMinX: chainMinXPx,
+                chainMaxX: chainMaxXPx,
+                hasSupplementary,
+                chain: chain.map(f => ({
+                    name: f.get('name'),
+                    refName: f.get('refName'),
+                    start: f.get('start'),
+                    end: f.get('end'),
+                    strand: f.get('strand'),
+                    flags: f.get('flags'),
+                    id: f.id(),
+                    tlen: f.get('template_length') || 0,
+                    pair_orientation: f.get('pair_orientation') || '',
+                    clipLengthAtStartOfRead: f.get('clipLengthAtStartOfRead') || 0,
+                    next_ref: f.get('next_ref'),
+                })),
+            });
+        }
+    }
+}
+export function drawFeatsCore({ ctx, params, view, calculateYOffsets, }) {
+    const { chainData, featureHeight, colorBy, drawSingletons, drawProperPairs, flipStrandLongReadChains, stopToken, } = params;
+    const type = colorBy.type || 'insertSizeAndOrientation';
+    const { chains } = chainData;
+    const filteredChains = filterChains(chains, drawSingletons, drawProperPairs, type, chainData);
+    const computedChains = computeChainBounds(filteredChains, view);
+    sortComputedChains(computedChains);
+    const { chainYOffsets, layoutHeight, cloudMaxDistance } = calculateYOffsets(computedChains);
+    const featuresForFlatbush = [];
+    const renderChevrons = shouldRenderChevrons(view.bpPerPx, featureHeight);
+    const viewOffsetPx = view.offsetPx;
+    const mismatchCoords = [];
+    const mismatchItems = [];
+    for (const region of params.regions) {
+        ctx.save();
+        const regionStartPx = region.offsetPx - viewOffsetPx;
+        ctx.beginPath();
+        ctx.rect(regionStartPx, 0, region.widthPx, CLIP_RECT_HEIGHT);
+        ctx.clip();
+        ctx.translate(regionStartPx, 0);
+        const pairMismatches = drawPairChains({
+            ctx,
+            type,
+            chainData,
+            chainYOffsets,
+            renderChevrons,
+            featureHeight,
+            computedChains,
+            config: params.config,
+            theme: params.theme,
+            region,
+            regionStartPx,
+            bpPerPx: params.bpPerPx,
+            colorBy: params.colorBy,
+            visibleModifications: params.visibleModifications,
+            stopToken,
+            hideSmallIndels: params.hideSmallIndels,
+            hideMismatches: params.hideMismatches,
+            hideLargeIndels: params.hideLargeIndels,
+            showOutline: params.showOutline,
+        });
+        const longReadMismatches = drawLongReadChains({
+            ctx,
+            chainData,
+            chainYOffsets,
+            renderChevrons,
+            featureHeight,
+            computedChains,
+            flipStrandLongReadChains,
+            config: params.config,
+            theme: params.theme,
+            region,
+            regionStartPx,
+            bpPerPx: params.bpPerPx,
+            colorBy: params.colorBy,
+            visibleModifications: params.visibleModifications,
+            stopToken,
+            hideSmallIndels: params.hideSmallIndels,
+            hideMismatches: params.hideMismatches,
+            hideLargeIndels: params.hideLargeIndels,
+            showOutline: params.showOutline,
+        });
+        for (const coord of pairMismatches.coords) {
+            mismatchCoords.push(coord);
+        }
+        for (const coord of longReadMismatches.coords) {
+            mismatchCoords.push(coord);
+        }
+        for (const item of pairMismatches.items) {
+            mismatchItems.push(item);
+        }
+        for (const item of longReadMismatches.items) {
+            mismatchItems.push(item);
+        }
+        ctx.restore();
+    }
+    addChainMouseoverRects(computedChains, chainYOffsets, featureHeight, view, featuresForFlatbush);
+    const mismatchFlatbush = new Flatbush(Math.max(mismatchItems.length, 1));
+    if (mismatchCoords.length) {
+        for (let i = 0; i < mismatchCoords.length; i += 4) {
+            mismatchFlatbush.add(mismatchCoords[i], mismatchCoords[i + 1], mismatchCoords[i + 2], mismatchCoords[i + 3]);
+        }
+    }
+    else {
+        mismatchFlatbush.add(0, 0, 0, 0);
+    }
+    mismatchFlatbush.finish();
+    return {
+        featuresForFlatbush,
+        layoutHeight,
+        cloudMaxDistance,
+        mismatchFlatbush: mismatchFlatbush.data,
+        mismatchItems,
+    };
+}
+export function buildMismatchFlatbushIndex(mismatchFlatbushData, mismatchItems, self) {
+    const mismatchFlatbush = Flatbush.from(mismatchFlatbushData);
+    self.setMismatchLayout(mismatchFlatbush);
+    self.setMismatchItems(mismatchItems);
+}

package/esm/RenderLinearReadCloudDisplayRPC/drawFeatsStack.d.ts

@@ -0,0 +1,5 @@
+import type { ComputedChain } from './drawFeatsCommon.ts';
+export declare function calculateStackYOffsetsUtil(computedChains: ComputedChain[], featureHeight: number, noSpacing: boolean, maxHeight: number): {
+    chainYOffsets: Map<string, number>;
+    layoutHeight: number;
+};

package/esm/RenderLinearReadCloudDisplayRPC/drawFeatsStack.js

@@ -0,0 +1,16 @@
+import { PileupLayout } from '@jbrowse/core/util/layouts';
+export function calculateStackYOffsetsUtil(computedChains, featureHeight, noSpacing, maxHeight) {
+    const layout = new PileupLayout({
+        featureHeight,
+        spacing: noSpacing ? 0 : 2,
+        maxHeight,
+    });
+    const chainYOffsets = new Map();
+    for (const { id, minX, maxX } of computedChains) {
+        const topPx = layout.addRect(id, minX, maxX, featureHeight);
+        if (topPx !== null) {
+            chainYOffsets.set(id, topPx);
+        }
+    }
+    return { chainYOffsets, layoutHeight: layout.getTotalHeight() };
+}

package/esm/RenderLinearReadCloudDisplayRPC/drawLongReadChains.d.ts

@@ -0,0 +1,27 @@
+import type { MismatchData } from './drawChainsUtil.ts';
+import type { ComputedChain } from './drawFeatsCommon.ts';
+import type { ChainData, ColorBy, ModificationTypeWithColor } from '../shared/types.ts';
+import type { AnyConfigurationModel } from '@jbrowse/core/configuration';
+import type { BaseBlock } from '@jbrowse/core/util/blockTypes';
+import type { ThemeOptions } from '@mui/material';
+export declare function drawLongReadChains({ ctx, chainData, chainYOffsets, renderChevrons, featureHeight, computedChains, flipStrandLongReadChains, config, theme: configTheme, region, regionStartPx, bpPerPx, colorBy, visibleModifications, stopToken, hideSmallIndels, hideMismatches, hideLargeIndels, showOutline, }: {
+    ctx: CanvasRenderingContext2D;
+    chainData: ChainData;
+    chainYOffsets: Map<string, number>;
+    renderChevrons: boolean;
+    featureHeight: number;
+    computedChains: ComputedChain[];
+    flipStrandLongReadChains: boolean;
+    config: AnyConfigurationModel;
+    theme: ThemeOptions;
+    region: BaseBlock;
+    regionStartPx: number;
+    bpPerPx: number;
+    colorBy: ColorBy;
+    visibleModifications?: Record<string, ModificationTypeWithColor>;
+    stopToken?: string;
+    hideSmallIndels?: boolean;
+    hideMismatches?: boolean;
+    hideLargeIndels?: boolean;
+    showOutline?: boolean;
+}): MismatchData;

package/esm/RenderLinearReadCloudDisplayRPC/drawLongReadChains.js

@@ -0,0 +1,101 @@
+import { checkStopToken2, createStopTokenChecker, } from '@jbrowse/core/util/stopToken';
+import { calculateFeaturePositionPx, featureOverlapsRegion, getChainBoundsOnRef, getConnectingLineColor, getMismatchRenderingConfig, getStrandColorKey, renderFeatureMismatchesAndModifications, renderFeatureShape, } from "./drawChainsUtil.js";
+import { lineToCtx } from "../shared/canvasUtils.js";
+import { fillColor, getSingletonColor, strokeColor } from "../shared/color.js";
+import { getPrimaryStrandFromFlags } from "../shared/primaryStrand.js";
+export function drawLongReadChains({ ctx, chainData, chainYOffsets, renderChevrons, featureHeight, computedChains, flipStrandLongReadChains, config, theme: configTheme, region, regionStartPx, bpPerPx, colorBy, visibleModifications, stopToken, hideSmallIndels, hideMismatches, hideLargeIndels, showOutline, }) {
+    const mismatchConfig = getMismatchRenderingConfig(ctx, config, configTheme, colorBy, { hideSmallIndels, hideMismatches, hideLargeIndels });
+    const canvasWidth = region.widthPx;
+    const regionStart = region.start;
+    const allCoords = [];
+    const allItems = [];
+    const lastCheck = createStopTokenChecker(stopToken);
+    for (const computedChain of computedChains) {
+        checkStopToken2(lastCheck);
+        const { id, chain, isPairedEnd, nonSupplementary } = computedChain;
+        if (isPairedEnd) {
+            continue;
+        }
+        const chainY = chainYOffsets.get(id);
+        if (chainY === undefined) {
+            continue;
+        }
+        const isSingleton = chain.length === 1;
+        const c1 = nonSupplementary[0] || chain[0];
+        const primaryStrand = getPrimaryStrandFromFlags(c1);
+        if (!isSingleton) {
+            const bounds = getChainBoundsOnRef(chain, region.refName);
+            if (bounds &&
+                bounds.minStart < region.end &&
+                bounds.maxEnd > region.start) {
+                const firstPx = (bounds.minStart - regionStart) / bpPerPx;
+                const lastPx = (bounds.maxEnd - regionStart) / bpPerPx;
+                const lineY = chainY + featureHeight / 2;
+                lineToCtx(firstPx, lineY, lastPx, lineY, ctx, getConnectingLineColor(configTheme));
+            }
+        }
+        const layoutFeats = [];
+        for (let i = 0, l = chain.length; i < l; i++) {
+            const feat = chain[i];
+            const featRefName = feat.get('refName');
+            const featStart = feat.get('start');
+            const featEnd = feat.get('end');
+            if (!featureOverlapsRegion(featRefName, featStart, featEnd, region)) {
+                continue;
+            }
+            const featStrand = feat.get('strand');
+            const effectiveStrand = isSingleton || !flipStrandLongReadChains
+                ? featStrand
+                : featStrand * primaryStrand;
+            const [featureFill, featureStroke] = isSingleton
+                ? getSingletonColor({
+                    tlen: feat.get('template_length'),
+                    pair_orientation: feat.get('pair_orientation'),
+                    flags: feat.get('flags'),
+                }, chainData.stats)
+                : [
+                    fillColor[getStrandColorKey(effectiveStrand)],
+                    strokeColor[getStrandColorKey(effectiveStrand)],
+                ];
+            const { xPos, width } = calculateFeaturePositionPx(featStart, featEnd, regionStart, region.end, bpPerPx);
+            layoutFeats.push(feat);
+            renderFeatureShape({
+                ctx,
+                xPos,
+                yPos: chainY,
+                width,
+                height: featureHeight,
+                strand: effectiveStrand,
+                fillStyle: featureFill,
+                strokeStyle: featureStroke,
+                renderChevrons,
+                showOutline,
+            });
+        }
+        for (const feat of layoutFeats) {
+            const layoutFeat = {
+                feature: feat,
+                heightPx: featureHeight,
+                topPx: chainY,
+            };
+            renderFeatureMismatchesAndModifications({
+                ctx,
+                feat,
+                layoutFeat,
+                region,
+                regionStartPx,
+                bpPerPx,
+                canvasWidth,
+                colorBy,
+                visibleModifications,
+                mismatchConfig,
+                allCoords,
+                allItems,
+            });
+        }
+    }
+    return {
+        coords: allCoords,
+        items: allItems,
+    };
+}

package/esm/RenderLinearReadCloudDisplayRPC/drawPairChains.d.ts

@@ -0,0 +1,27 @@
+import type { MismatchData } from './drawChainsUtil.ts';
+import type { ComputedChain } from './drawFeatsCommon.ts';
+import type { ChainData, ColorBy, ModificationTypeWithColor } from '../shared/types.ts';
+import type { AnyConfigurationModel } from '@jbrowse/core/configuration';
+import type { BaseBlock } from '@jbrowse/core/util/blockTypes';
+import type { ThemeOptions } from '@mui/material';
+export declare function drawPairChains({ ctx, type, chainData, chainYOffsets, renderChevrons, featureHeight, computedChains, config, theme: configTheme, region, regionStartPx, bpPerPx, colorBy, visibleModifications, stopToken, hideSmallIndels, hideMismatches, hideLargeIndels, showOutline, }: {
+    ctx: CanvasRenderingContext2D;
+    type: string;
+    chainData: ChainData;
+    chainYOffsets: Map<string, number>;
+    renderChevrons: boolean;
+    featureHeight: number;
+    computedChains: ComputedChain[];
+    config: AnyConfigurationModel;
+    theme: ThemeOptions;
+    region: BaseBlock;
+    regionStartPx: number;
+    bpPerPx: number;
+    colorBy: ColorBy;
+    visibleModifications?: Record<string, ModificationTypeWithColor>;
+    stopToken?: string;
+    hideSmallIndels?: boolean;
+    hideMismatches?: boolean;
+    hideLargeIndels?: boolean;
+    showOutline?: boolean;
+}): MismatchData;

package/esm/RenderLinearReadCloudDisplayRPC/drawPairChains.js

@@ -0,0 +1,95 @@
+import { checkStopToken2, createStopTokenChecker, } from '@jbrowse/core/util/stopToken';
+import { calculateFeaturePositionPx, featureOverlapsRegion, getChainBoundsOnRef, getConnectingLineColor, getMismatchRenderingConfig, renderFeatureMismatchesAndModifications, renderFeatureShape, } from "./drawChainsUtil.js";
+import { lineToCtx } from "../shared/canvasUtils.js";
+import { fillColor, getPairedColor, strokeColor } from "../shared/color.js";
+export function drawPairChains({ ctx, type, chainData, chainYOffsets, renderChevrons, featureHeight, computedChains, config, theme: configTheme, region, regionStartPx, bpPerPx, colorBy, visibleModifications, stopToken, hideSmallIndels, hideMismatches, hideLargeIndels, showOutline, }) {
+    const mismatchConfig = getMismatchRenderingConfig(ctx, config, configTheme, colorBy, { hideSmallIndels, hideMismatches, hideLargeIndels });
+    const canvasWidth = region.widthPx;
+    const regionStart = region.start;
+    const allCoords = [];
+    const allItems = [];
+    const lastCheck = createStopTokenChecker(stopToken);
+    for (const computedChain of computedChains) {
+        checkStopToken2(lastCheck);
+        const { id, chain, isPairedEnd, nonSupplementary } = computedChain;
+        if (!isPairedEnd) {
+            continue;
+        }
+        const chainY = chainYOffsets.get(id);
+        if (chainY === undefined) {
+            continue;
+        }
+        const hasBothMates = nonSupplementary.length === 2;
+        const feat = nonSupplementary[0] || chain[0];
+        const [pairedFill, pairedStroke] = getPairedColor({
+            type,
+            v0: feat,
+            stats: chainData.stats,
+        }) || ['lightgrey', '#888'];
+        const lineY = chainY + featureHeight / 2;
+        const hasSupplementary = chain.length > nonSupplementary.length;
+        if (hasBothMates) {
+            const bounds = getChainBoundsOnRef(chain, region.refName);
+            if (bounds &&
+                bounds.minStart < region.end &&
+                bounds.maxEnd > region.start) {
+                const r1s = (bounds.minStart - regionStart) / bpPerPx;
+                const r2s = (bounds.maxEnd - regionStart) / bpPerPx;
+                const lineColor = hasSupplementary
+                    ? fillColor.color_supplementary
+                    : getConnectingLineColor(configTheme);
+                lineToCtx(r1s, lineY, r2s, lineY, ctx, lineColor);
+            }
+        }
+        const layoutFeats = [];
+        for (let i = 0, l = chain.length; i < l; i++) {
+            const feat = chain[i];
+            const featRefName = feat.get('refName');
+            const featStart = feat.get('start');
+            const featEnd = feat.get('end');
+            if (!featureOverlapsRegion(featRefName, featStart, featEnd, region)) {
+                continue;
+            }
+            const { xPos, width } = calculateFeaturePositionPx(featStart, featEnd, regionStart, region.end, bpPerPx);
+            layoutFeats.push(feat);
+            const [featFill, featStroke] = hasSupplementary
+                ? [fillColor.color_supplementary, strokeColor.color_supplementary]
+                : [pairedFill, pairedStroke];
+            renderFeatureShape({
+                ctx,
+                xPos,
+                yPos: chainY,
+                width,
+                height: featureHeight,
+                strand: feat.get('strand'),
+                fillStyle: featFill,
+                strokeStyle: featStroke,
+                renderChevrons,
+                showOutline,
+            });
+        }
+        for (const feat of layoutFeats) {
+            const layoutFeat = {
+                feature: feat,
+                heightPx: featureHeight,
+                topPx: chainY,
+            };
+            renderFeatureMismatchesAndModifications({
+                ctx,
+                feat,
+                layoutFeat,
+                region,
+                regionStartPx,
+                bpPerPx,
+                canvasWidth,
+                colorBy,
+                visibleModifications,
+                mismatchConfig,
+                allCoords,
+                allItems,
+            });
+        }
+        checkStopToken2(lastCheck);
+    }
+    return { coords: allCoords, items: allItems };
+}

package/esm/RenderLinearReadCloudDisplayRPC/executeRenderLinearReadCloudDisplay.d.ts

@@ -0,0 +1,6 @@
+import type { RenderLinearReadCloudDisplayArgs } from './RenderLinearReadCloudDisplay.ts';
+import type PluginManager from '@jbrowse/core/PluginManager';
+export declare function executeRenderLinearReadCloudDisplay({ pluginManager, args, }: {
+    pluginManager: PluginManager;
+    args: RenderLinearReadCloudDisplayArgs;
+}): Promise<import("librpc-web-mod").RpcResult>;