@jbrowse/plugin-alignments 3.6.5 → 4.0.0

package/esm/shared/menuItems.js

@@ -0,0 +1,252 @@
+import { lazy } from 'react';
+import { getSession } from '@jbrowse/core/util';
+import FilterListIcon from '@mui/icons-material/ClearAll';
+import PaletteIcon from '@mui/icons-material/Palette';
+import { modificationData } from "./modificationData.js";
+const FilterByTagDialog = lazy(() => import("./components/FilterByTagDialog.js"));
+const SetModificationThresholdDialog = lazy(() => import("./components/SetModificationThresholdDialog.js"));
+export function hasModificationsSupport(model) {
+    return 'modificationsReady' in model && 'visibleModificationTypes' in model;
+}
+export function getModificationsSubMenu(model, options = {}) {
+    const { includeMethylation = false } = options;
+    const { modificationThreshold, modificationsReady, visibleModificationTypes, } = model;
+    if (!modificationsReady) {
+        return [
+            {
+                label: 'Loading modifications...',
+                onClick: () => { },
+            },
+        ];
+    }
+    else {
+        return visibleModificationTypes.length
+            ? [
+                {
+                    label: `All modifications (>= ${modificationThreshold}% prob)`,
+                    onClick: () => {
+                        model.setColorScheme({
+                            type: 'modifications',
+                            modifications: {
+                                threshold: modificationThreshold,
+                            },
+                        });
+                    },
+                },
+                ...model.visibleModificationTypes.map(key => ({
+                    label: `Show only ${modificationData[key]?.name || key} (>= ${modificationThreshold}% prob)`,
+                    onClick: () => {
+                        model.setColorScheme({
+                            type: 'modifications',
+                            modifications: {
+                                isolatedModification: key,
+                                threshold: modificationThreshold,
+                            },
+                        });
+                    },
+                })),
+                { type: 'divider' },
+                {
+                    label: 'All modifications (<50% prob colored blue)',
+                    onClick: () => {
+                        model.setColorScheme({
+                            type: 'modifications',
+                            modifications: {
+                                twoColor: true,
+                                threshold: modificationThreshold,
+                            },
+                        });
+                    },
+                },
+                ...model.visibleModificationTypes.map(key => ({
+                    label: `Show only ${modificationData[key]?.name || key} (<50% prob colored blue)`,
+                    onClick: () => {
+                        model.setColorScheme({
+                            type: 'modifications',
+                            modifications: {
+                                isolatedModification: key,
+                                twoColor: true,
+                                threshold: modificationThreshold,
+                            },
+                        });
+                    },
+                })),
+                ...(includeMethylation
+                    ? [
+                        { type: 'divider' },
+                        {
+                            label: 'All reference CpGs',
+                            onClick: () => {
+                                model.setColorScheme({
+                                    type: 'methylation',
+                                    modifications: {
+                                        threshold: modificationThreshold,
+                                    },
+                                });
+                            },
+                        },
+                    ]
+                    : []),
+                { type: 'divider' },
+                {
+                    label: `Adjust threshold (${modificationThreshold}%)`,
+                    onClick: () => {
+                        getSession(model).queueDialog(handleClose => [
+                            SetModificationThresholdDialog,
+                            {
+                                model,
+                                handleClose,
+                            },
+                        ]);
+                    },
+                },
+            ]
+            : [{ label: 'No modifications currently visible' }];
+    }
+}
+export function getModificationsMenuItem(model, options = {}) {
+    return {
+        label: 'Modifications',
+        type: 'subMenu',
+        subMenu: getModificationsSubMenu(model, options),
+    };
+}
+export function getColorSchemeMenuItem(model) {
+    const baseItems = [
+        {
+            label: 'Insert size ± 3σ and orientation',
+            onClick: () => {
+                model.setColorScheme({ type: 'insertSizeAndOrientation' });
+            },
+        },
+        {
+            label: 'Insert size ± 3σ',
+            onClick: () => {
+                model.setColorScheme({ type: 'insertSize' });
+            },
+        },
+        {
+            label: 'Orientation',
+            onClick: () => {
+                model.setColorScheme({ type: 'orientation' });
+            },
+        },
+        {
+            label: 'Insert size gradient',
+            onClick: () => {
+                model.setColorScheme({ type: 'gradient' });
+            },
+        },
+    ];
+    const modificationsItem = hasModificationsSupport(model) && model.visibleModificationTypes.length > 0
+        ? [getModificationsMenuItem(model)]
+        : [];
+    return {
+        label: 'Color scheme',
+        icon: PaletteIcon,
+        subMenu: [...baseItems, ...modificationsItem],
+    };
+}
+export function getFilterByMenuItem(model) {
+    return {
+        label: 'Filter by',
+        icon: FilterListIcon,
+        onClick: () => {
+            getSession(model).queueDialog((handleClose) => [
+                FilterByTagDialog,
+                { model, handleClose },
+            ]);
+        },
+    };
+}
+export function getEditFiltersMenuItem(model) {
+    return {
+        label: 'Edit filters',
+        icon: FilterListIcon,
+        type: 'subMenu',
+        subMenu: [
+            {
+                label: 'Show singletons',
+                type: 'checkbox',
+                checked: model.drawSingletons,
+                onClick: () => {
+                    model.setDrawSingletons(!model.drawSingletons);
+                },
+            },
+            {
+                label: 'Show proper pairs',
+                type: 'checkbox',
+                checked: model.drawProperPairs,
+                onClick: () => {
+                    model.setDrawProperPairs(!model.drawProperPairs);
+                },
+            },
+            { type: 'divider' },
+            {
+                label: 'Edit filters...',
+                onClick: () => {
+                    getSession(model).queueDialog((handleClose) => [
+                        FilterByTagDialog,
+                        { model, handleClose },
+                    ]);
+                },
+            },
+        ],
+    };
+}
+export function getMismatchDisplayMenuItem(model) {
+    return {
+        label: 'Mismatch/indel display',
+        type: 'subMenu',
+        subMenu: [
+            {
+                label: 'Show all mismatches',
+                type: 'radio',
+                checked: !model.hideMismatches &&
+                    !model.hideSmallIndels &&
+                    !model.hideLargeIndels,
+                onClick: () => {
+                    model.setHideMismatches(false);
+                    model.setHideSmallIndels(false);
+                    model.setHideLargeIndels(false);
+                },
+            },
+            {
+                label: 'Show mismatches and large indels+clipping',
+                type: 'radio',
+                checked: !model.hideMismatches &&
+                    model.hideSmallIndels &&
+                    !model.hideLargeIndels,
+                onClick: () => {
+                    model.setHideMismatches(false);
+                    model.setHideSmallIndels(true);
+                    model.setHideLargeIndels(false);
+                },
+            },
+            {
+                label: 'Show just large indels',
+                type: 'radio',
+                checked: model.hideMismatches &&
+                    model.hideSmallIndels &&
+                    !model.hideLargeIndels,
+                onClick: () => {
+                    model.setHideMismatches(true);
+                    model.setHideSmallIndels(true);
+                    model.setHideLargeIndels(false);
+                },
+            },
+            {
+                label: 'Show none',
+                type: 'radio',
+                checked: model.hideMismatches &&
+                    model.hideSmallIndels &&
+                    model.hideLargeIndels,
+                onClick: () => {
+                    model.setHideMismatches(true);
+                    model.setHideSmallIndels(true);
+                    model.setHideLargeIndels(true);
+                },
+            },
+        ],
+    };
+}

package/esm/shared/modificationData.d.ts

@@ -0,0 +1,6 @@
+export interface ModificationData {
+    color: string;
+    name: string;
+}
+export declare const modificationData: Record<string, ModificationData>;
+export declare function getModificationName(type: string): string;

package/esm/shared/modificationData.js

@@ -0,0 +1,17 @@
+export const modificationData = {
+    m: { color: 'rgb(255,0,0)', name: '5mC' },
+    h: { color: 'rgb(255,0,255)', name: '5hmC' },
+    o: { color: 'rgb(111, 78, 129)', name: '8oxoG' },
+    f: { color: 'rgb(246, 200, 95)', name: '5fC' },
+    c: { color: 'rgb(157, 216, 102)', name: '5cac' },
+    g: { color: 'rgb(255, 160, 86)', name: '5hmu' },
+    e: { color: 'rgb(141, 221, 208)', name: '5fU' },
+    b: { color: 'rgb(0,100,47)', name: '5caU' },
+    a: { color: 'rgb(51,0,111)', name: '6mA' },
+    17082: { color: 'rgb(51,153,255)', name: 'pseU' },
+    17596: { color: 'rgb(102,153,0)', name: 'inosine' },
+    21839: { color: 'rgb(153,0,153)', name: '4mC' },
+};
+export function getModificationName(type) {
+    return modificationData[type]?.name || type;
+}

package/esm/shared/primaryStrand.d.ts

@@ -0,0 +1,3 @@
+import type { Feature } from '@jbrowse/core/util';
+export declare function getPrimaryStrand(feat: Feature): any;
+export declare function getPrimaryStrandFromFlags(feat: Feature): 1 | -1;

package/esm/shared/primaryStrand.js

@@ -0,0 +1,22 @@
+export function getPrimaryStrand(feat) {
+    const flags = feat.get('flags');
+    if (!(flags & 2048)) {
+        return feat.get('strand');
+    }
+    else {
+        const SA = feat.get('tags')?.SA;
+        const res = SA?.split(';')[0]?.split(',')[2];
+        return res === '-' ? -1 : 1;
+    }
+}
+export function getPrimaryStrandFromFlags(feat) {
+    const flags = feat.get('flags');
+    if (!(flags & 2048)) {
+        return flags & 16 ? -1 : 1;
+    }
+    else {
+        const SA = feat.get('tags')?.SA;
+        const res = SA?.split(';')[0]?.split(',')[2];
+        return res === '-' ? -1 : 1;
+    }
+}

package/esm/shared/samFlags.d.ts

@@ -0,0 +1,12 @@
+export declare const SAM_FLAG_PAIRED = 1;
+export declare const SAM_FLAG_PROPER_PAIR = 2;
+export declare const SAM_FLAG_UNMAPPED = 4;
+export declare const SAM_FLAG_MATE_UNMAPPED = 8;
+export declare const SAM_FLAG_REVERSE = 16;
+export declare const SAM_FLAG_MATE_REVERSE = 32;
+export declare const SAM_FLAG_FIRST_IN_PAIR = 64;
+export declare const SAM_FLAG_SECOND_IN_PAIR = 128;
+export declare const SAM_FLAG_SECONDARY = 256;
+export declare const SAM_FLAG_FAILS_QC = 512;
+export declare const SAM_FLAG_DUPLICATE = 1024;
+export declare const SAM_FLAG_SUPPLEMENTARY = 2048;

package/esm/shared/samFlags.js

@@ -0,0 +1,12 @@
+export const SAM_FLAG_PAIRED = 1;
+export const SAM_FLAG_PROPER_PAIR = 2;
+export const SAM_FLAG_UNMAPPED = 4;
+export const SAM_FLAG_MATE_UNMAPPED = 8;
+export const SAM_FLAG_REVERSE = 16;
+export const SAM_FLAG_MATE_REVERSE = 32;
+export const SAM_FLAG_FIRST_IN_PAIR = 64;
+export const SAM_FLAG_SECOND_IN_PAIR = 128;
+export const SAM_FLAG_SECONDARY = 256;
+export const SAM_FLAG_FAILS_QC = 512;
+export const SAM_FLAG_DUPLICATE = 1024;
+export const SAM_FLAG_SUPPLEMENTARY = 2048;

package/esm/shared/setupModificationsAutorun.d.ts

@@ -0,0 +1,11 @@
+import type { ModificationType } from './types.ts';
+import type { AnyConfigurationModel } from '@jbrowse/core/configuration';
+export interface ModificationsAutorunModel {
+    adapterConfig: AnyConfigurationModel;
+    updateVisibleModifications: (arg: ModificationType[]) => void;
+    setSimplexModifications: (arg: string[]) => void;
+    setModificationsReady: (arg: boolean) => void;
+    setStatusMessage: (arg: string) => void;
+    effectiveRpcDriverName?: string;
+}
+export declare function setupModificationsAutorun(model: ModificationsAutorunModel, isReady: () => boolean): void;

package/esm/shared/setupModificationsAutorun.js

@@ -0,0 +1,27 @@
+import { getContainingView } from '@jbrowse/core/util';
+import { isAlive } from '@jbrowse/mobx-state-tree';
+import { getUniqueModifications } from "./getUniqueModifications.js";
+import { createAutorun } from "../util.js";
+export function setupModificationsAutorun(model, isReady) {
+    createAutorun(model, async () => {
+        if (!isReady()) {
+            return;
+        }
+        const view = getContainingView(model);
+        const { adapterConfig } = model;
+        const { staticBlocks } = view;
+        const { modifications, simplexModifications } = await getUniqueModifications({
+            model,
+            adapterConfig,
+            blocks: staticBlocks,
+        });
+        if (isAlive(model)) {
+            model.updateVisibleModifications(modifications);
+            model.setSimplexModifications(simplexModifications);
+            model.setModificationsReady(true);
+        }
+    }, {
+        delay: 1000,
+        name: 'GetModInfo',
+    });
+}

package/esm/shared/types.d.ts

@@ -1,3 +1,5 @@
+import type { MismatchCallback } from './forEachMismatchTypes.ts';
+import type { Feature } from '@jbrowse/core/util';
 export type SkipMap = Record<string, {
     score: number;
     feature: unknown;
@@ -12,6 +14,10 @@ export interface BinEntry {
     '0': number;
     '1': number;
     avgProbability?: number;
+    avgLength?: number;
+    minLength?: number;
+    maxLength?: number;
+    topSequence?: string;
 }
 type BinType = Record<string, BinEntry>;
 export interface BaseCoverageBin {
@@ -30,7 +36,18 @@ export interface PreBinEntry {
     '-1': number;
     '0': number;
     '1': number;
-    probabilities: number[];
+    probabilityTotal: number;
+    probabilityCount: number;
+    lengthTotal: number;
+    lengthCount: number;
+    lengthMin: number;
+    lengthMax: number;
+    sequenceCounts?: Map<string, number>;
+    avgProbability?: number;
+    avgLength?: number;
+    minLength?: number;
+    maxLength?: number;
+    topSequence?: string;
 }
 type PreBinType = Record<string, PreBinEntry>;
 export interface PreBaseCoverageBin extends PreBaseCoverageBinSubtypes {
@@ -63,6 +80,7 @@ export interface ColorBy {
     modifications?: {
         twoColor?: boolean;
         isolatedModification?: string;
+        threshold?: number;
     };
 }
 export interface FilterBy {
@@ -81,14 +99,59 @@ export interface SortedBy {
     assemblyName: string;
     tag?: string;
 }
-export interface Mismatch {
-    qual?: number;
+interface BaseMismatch {
     start: number;
     length: number;
-    type: string;
+}
+export interface SNPMismatch extends BaseMismatch {
+    type: 'mismatch';
     base: string;
+    qual?: number;
     altbase?: string;
-    seq?: string;
-    cliplen?: number;
+}
+export interface InsertionMismatch extends BaseMismatch {
+    type: 'insertion';
+    insertlen: number;
+    insertedBases?: string;
+}
+export interface DeletionMismatch extends BaseMismatch {
+    type: 'deletion';
+}
+export interface SkipMismatch extends BaseMismatch {
+    type: 'skip';
+}
+export interface ClipMismatch extends BaseMismatch {
+    type: 'softclip' | 'hardclip';
+    cliplen: number;
+}
+export type Mismatch = SNPMismatch | InsertionMismatch | DeletionMismatch | SkipMismatch | ClipMismatch;
+export interface ReducedFeature {
+    name: string;
+    strand: number;
+    refName: string;
+    start: number;
+    end: number;
+    id: string;
+    flags: number;
+    tlen: number;
+    pair_orientation: string;
+    next_ref?: string;
+    next_pos?: number;
+    clipLengthAtStartOfRead: number;
+    SA?: string;
+}
+export interface ChainStats {
+    max: number;
+    min: number;
+    upper: number;
+    lower: number;
+}
+export interface ChainData {
+    stats?: ChainStats;
+    chains: Feature[][];
+}
+export type MismatchType = 'mismatch' | 'insertion' | 'deletion' | 'skip' | 'softclip' | 'hardclip';
+export interface FeatureWithMismatchIterator extends Feature {
+    forEachMismatch(callback: MismatchCallback): void;
 }
 export {};

package/esm/shared/util.d.ts

@@ -1,10 +1,18 @@
-import type { ChainData } from './fetchChains';
+import type { ChainData } from './types.ts';
+import type { Feature } from '@jbrowse/core/util';
+import type { Theme } from '@mui/material';
 export declare function hasPairedReads(features: ChainData): boolean;
 export declare function alphaColor(baseColor: string, p: number): string;
 export declare const defaultFilterFlags: {
     flagInclude: number;
     flagExclude: number;
 };
+export declare function isDefaultFilterFlags(filterBy: {
+    flagInclude?: number;
+    flagExclude?: number;
+    readName?: string;
+    tagFilter?: unknown;
+} | undefined): boolean;
 export declare const negFlags: {
     flagInclude: number;
     flagExclude: number;
@@ -18,3 +26,48 @@ export declare function cacheGetter<T>(ctor: {
 }, prop: keyof T): void;
 export declare function filterReadFlag(flags: number, flagInclude: number, flagExclude: number): boolean;
 export declare function filterTagValue(readVal: unknown, filterVal?: string): boolean;
+export declare function shouldRenderChevrons(bpPerPx: number, featureHeight: number): boolean;
+export declare const CHEVRON_WIDTH = 5;
+interface SamHeaderLine {
+    tag: string;
+    data: {
+        tag: string;
+        value: string;
+    }[];
+}
+export interface ParsedSamHeader {
+    idToName: string[];
+    nameToId: Record<string, number>;
+    readGroups: string[];
+}
+export declare function parseSamHeader(samHeader: SamHeaderLine[]): ParsedSamHeader;
+export declare function getColorBaseMap(theme: Theme): {
+    A: string;
+    C: string;
+    G: string;
+    T: string;
+    deletion: string;
+    insertion: string;
+    hardclip: string;
+    softclip: string;
+    skip: string;
+};
+export declare function getContrastBaseMap(theme: Theme): {
+    [k: string]: string;
+};
+export declare function shouldDrawSNPsMuted(type?: string): boolean;
+export declare function shouldDrawIndels(): boolean;
+export interface LayoutFeature {
+    heightPx: number;
+    topPx: number;
+    feature: Feature;
+}
+export declare function setAlignmentFont(ctx: CanvasRenderingContext2D): void;
+export declare function getCharWidthHeight(): {
+    charWidth: number;
+    charHeight: number;
+};
+export declare function measureTextSmallNumber(n: number, fontSize?: number): number;
+export declare function convertTagsToPlainArrays(tags: Record<string, unknown>): Record<string, unknown>;
+export declare function buildMismatchMap(feature: Feature, featureStart: number): Map<number, string>;
+export {};

package/esm/shared/util.js

@@ -1,7 +1,10 @@
+import { measureText } from '@jbrowse/core/util';
 import { colord } from '@jbrowse/core/util/colord';
+import { MISMATCH_TYPE } from "./forEachMismatchTypes.js";
+import { SAM_FLAG_PAIRED } from "./samFlags.js";
 export function hasPairedReads(features) {
     for (const f of features.chains.values()) {
-        if (f[0].flags & 1) {
+        if (f[0].get('flags') & SAM_FLAG_PAIRED) {
             return true;
         }
     }
@@ -18,6 +21,15 @@ export const defaultFilterFlags = {
     flagInclude: 0,
     flagExclude: 1540,
 };
+export function isDefaultFilterFlags(filterBy) {
+    if (!filterBy) {
+        return true;
+    }
+    return (filterBy.flagInclude === 0 &&
+        filterBy.flagExclude === 1540 &&
+        !filterBy.readName &&
+        !filterBy.tagFilter);
+}
 export const negFlags = {
     flagInclude: 16,
     flagExclude: 1540,
@@ -53,3 +65,112 @@ export function filterTagValue(readVal, filterVal) {
         ? readVal === undefined
         : `${readVal}` !== `${filterVal}`;
 }
+export function shouldRenderChevrons(bpPerPx, featureHeight) {
+    return bpPerPx < 50 && featureHeight >= 3;
+}
+export const CHEVRON_WIDTH = 5;
+export function parseSamHeader(samHeader) {
+    const idToName = [];
+    const nameToId = {};
+    const readGroups = [];
+    let refId = 0;
+    let rgId = 0;
+    for (const element of samHeader) {
+        const line = element;
+        if (line.tag === 'SQ') {
+            const data = line.data;
+            for (const datum of data) {
+                const item = datum;
+                if (item.tag === 'SN') {
+                    const refName = item.value;
+                    nameToId[refName] = refId;
+                    idToName[refId] = refName;
+                    break;
+                }
+            }
+            refId++;
+        }
+        else if (line.tag === 'RG') {
+            const data = line.data;
+            for (const datum of data) {
+                const item = datum;
+                if (item.tag === 'ID') {
+                    readGroups[rgId] = item.value;
+                    break;
+                }
+            }
+            rgId++;
+        }
+    }
+    return { idToName, nameToId, readGroups };
+}
+export function getColorBaseMap(theme) {
+    const { skip, deletion, insertion, hardclip, softclip, bases } = theme.palette;
+    return {
+        A: bases.A.main,
+        C: bases.C.main,
+        G: bases.G.main,
+        T: bases.T.main,
+        deletion,
+        insertion,
+        hardclip,
+        softclip,
+        skip,
+    };
+}
+export function getContrastBaseMap(theme) {
+    return Object.fromEntries(Object.entries(getColorBaseMap(theme)).map(([key, value]) => [
+        key,
+        theme.palette.getContrastText(value),
+    ]));
+}
+export function shouldDrawSNPsMuted(type) {
+    return ['methylation', 'modifications'].includes(type || '');
+}
+export function shouldDrawIndels() {
+    return true;
+}
+export function setAlignmentFont(ctx) {
+    ctx.font = 'bold 10px Courier New,monospace';
+}
+export function getCharWidthHeight() {
+    const charWidth = measureText('A');
+    const charHeight = measureText('M') - 2;
+    return { charWidth, charHeight };
+}
+const smallNumberWidthCache10 = new Map();
+const smallNumberWidthCache = new Map();
+export function measureTextSmallNumber(n, fontSize) {
+    const cache = fontSize === 10 ? smallNumberWidthCache10 : smallNumberWidthCache;
+    if (n >= 0 && n < 100) {
+        let width = cache.get(n);
+        if (width === undefined) {
+            width = measureText(String(n), fontSize);
+            cache.set(n, width);
+        }
+        return width;
+    }
+    return measureText(String(n), fontSize);
+}
+function isTypedArray(val) {
+    return ArrayBuffer.isView(val) && !(val instanceof DataView);
+}
+export function convertTagsToPlainArrays(tags) {
+    const result = {};
+    for (const [key, value] of Object.entries(tags)) {
+        result[key] = isTypedArray(value) ? [...value] : value;
+    }
+    return result;
+}
+export function buildMismatchMap(feature, featureStart) {
+    const mismatchMap = new Map();
+    if ('forEachMismatch' in feature) {
+        const feat = feature;
+        feat.forEachMismatch((type, mismatchStart, _len, base) => {
+            if (type === MISMATCH_TYPE) {
+                mismatchMap.set(featureStart + mismatchStart, base);
+            }
+        });
+    }
+    return mismatchMap;
+}