@jbrowse/plugin-alignments 3.7.0 → 4.0.1

package/dist/LinearPileupDisplay/model.js

@@ -1,399 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = require("react");
-const configuration_1 = require("@jbrowse/core/configuration");
-const util_1 = require("@jbrowse/core/util");
-const ColorLens_1 = __importDefault(require("@mui/icons-material/ColorLens"));
-const SwapVert_1 = __importDefault(require("@mui/icons-material/SwapVert"));
-const Visibility_1 = __importDefault(require("@mui/icons-material/Visibility"));
-const Workspaces_1 = __importDefault(require("@mui/icons-material/Workspaces"));
-const mobx_1 = require("mobx");
-const mobx_state_tree_1 = require("mobx-state-tree");
-const SharedLinearPileupDisplayMixin_1 = require("./SharedLinearPileupDisplayMixin");
-const modificationData_1 = require("../shared/modificationData");
-const util_2 = require("../util");
-const SortByTagDialog = (0, react_1.lazy)(() => Promise.resolve().then(() => __importStar(require('./components/SortByTagDialog'))));
-const GroupByDialog = (0, react_1.lazy)(() => Promise.resolve().then(() => __importStar(require('./components/GroupByDialog'))));
-const SetModificationThresholdDialog = (0, react_1.lazy)(() => Promise.resolve().then(() => __importStar(require('./components/SetModificationThresholdDialog'))));
-function stateModelFactory(configSchema) {
-    return mobx_state_tree_1.types
-        .compose('LinearPileupDisplay', (0, SharedLinearPileupDisplayMixin_1.SharedLinearPileupDisplayMixin)(configSchema), mobx_state_tree_1.types.model({
-        type: mobx_state_tree_1.types.literal('LinearPileupDisplay'),
-        configuration: (0, configuration_1.ConfigurationReference)(configSchema),
-        showSoftClipping: false,
-        mismatchAlpha: mobx_state_tree_1.types.maybe(mobx_state_tree_1.types.boolean),
-        sortedBy: mobx_state_tree_1.types.frozen(),
-    }))
-        .volatile(() => ({
-        sortReady: false,
-        currSortBpPerPx: 0,
-        visibleModifications: mobx_1.observable.map({}),
-        simplexModifications: new Set(),
-        modificationsReady: false,
-    }))
-        .actions(self => ({
-        setCurrSortBpPerPx(n) {
-            self.currSortBpPerPx = n;
-        },
-        updateVisibleModifications(uniqueModifications) {
-            for (const value of uniqueModifications) {
-                if (!self.visibleModifications.has(value.type)) {
-                    self.visibleModifications.set(value.type, {
-                        ...value,
-                        color: (0, util_2.getColorForModification)(value.type),
-                    });
-                }
-            }
-        },
-        setSimplexModifications(simplex) {
-            for (const entry of simplex) {
-                self.simplexModifications.add(entry);
-            }
-        },
-        setModificationsReady(flag) {
-            self.modificationsReady = flag;
-        },
-        setSortReady(flag) {
-            self.sortReady = flag;
-        },
-        clearSelected() {
-            self.sortedBy = undefined;
-        },
-        toggleSoftClipping() {
-            self.showSoftClipping = !self.showSoftClipping;
-        },
-        toggleMismatchAlpha() {
-            self.mismatchAlpha = !self.mismatchAlpha;
-        },
-        setSortedBy(type, tag) {
-            const { centerLineInfo } = (0, util_1.getContainingView)(self);
-            if (!centerLineInfo) {
-                return;
-            }
-            const { refName, assemblyName, offset } = centerLineInfo;
-            const centerBp = Math.round(offset) + 1;
-            if (centerBp < 0 || !refName) {
-                return;
-            }
-            self.sortReady = false;
-            self.sortedBy = {
-                type,
-                pos: centerBp,
-                refName,
-                assemblyName,
-                tag,
-            };
-        },
-        setFeatureHeight(n) {
-            self.sortReady = false;
-            self.featureHeight = n;
-        },
-    }))
-        .actions(self => {
-        const superReload = self.reload;
-        return {
-            reload() {
-                self.clearSelected();
-                superReload();
-            },
-        };
-    })
-        .views(self => ({
-        get visibleModificationTypes() {
-            return [...self.visibleModifications.keys()];
-        },
-        get modificationThreshold() {
-            var _a, _b, _c;
-            return (_c = (_b = (_a = self.colorBy) === null || _a === void 0 ? void 0 : _a.modifications) === null || _b === void 0 ? void 0 : _b.threshold) !== null && _c !== void 0 ? _c : 10;
-        },
-        get rendererConfig() {
-            const { featureHeight, noSpacing, trackMaxHeight, mismatchAlpha, rendererTypeName, hideSmallIndels, } = self;
-            const configBlob = (0, configuration_1.getConf)(self, ['renderers', rendererTypeName]) || {};
-            return self.rendererType.configSchema.create({
-                ...configBlob,
-                ...(featureHeight !== undefined ? { height: featureHeight } : {}),
-                ...(hideSmallIndels !== undefined ? { hideSmallIndels } : {}),
-                ...(noSpacing !== undefined ? { noSpacing } : {}),
-                ...(mismatchAlpha !== undefined ? { mismatchAlpha } : {}),
-                ...(trackMaxHeight !== undefined
-                    ? { maxHeight: trackMaxHeight }
-                    : {}),
-            }, (0, util_1.getEnv)(self));
-        },
-    }))
-        .views(self => {
-        const { renderReady: superRenderReady } = self;
-        return {
-            get mismatchAlphaSetting() {
-                return (0, configuration_1.readConfObject)(self.rendererConfig, 'mismatchAlpha');
-            },
-            renderReady() {
-                const view = (0, util_1.getContainingView)(self);
-                return (self.modificationsReady &&
-                    self.currSortBpPerPx === view.bpPerPx &&
-                    superRenderReady());
-            },
-        };
-    })
-        .views(self => {
-        const { trackMenuItems: superTrackMenuItems, renderPropsPre: superRenderPropsPre, renderProps: superRenderProps, colorSchemeSubMenuItems: superColorSchemeSubMenuItems, } = self;
-        return {
-            renderPropsPre() {
-                const { sortedBy, showSoftClipping, visibleModifications, simplexModifications, } = self;
-                const superProps = superRenderPropsPre();
-                return {
-                    ...superProps,
-                    showSoftClip: showSoftClipping,
-                    sortedBy,
-                    visibleModifications: Object.fromEntries(visibleModifications.toJSON()),
-                    simplexModifications: [...simplexModifications],
-                };
-            },
-            renderProps() {
-                const { sortReady } = self;
-                const result = superRenderProps();
-                return {
-                    ...result,
-                    notReady: result.notReady || !sortReady,
-                };
-            },
-            trackMenuItems() {
-                return [
-                    ...superTrackMenuItems(),
-                    {
-                        label: 'Sort by...',
-                        icon: SwapVert_1.default,
-                        disabled: self.showSoftClipping,
-                        subMenu: [
-                            ...['Start location', 'Read strand', 'Base pair'].map(option => ({
-                                label: option,
-                                onClick: () => {
-                                    self.setSortedBy(option);
-                                },
-                            })),
-                            {
-                                label: 'Sort by tag...',
-                                onClick: () => {
-                                    (0, util_1.getSession)(self).queueDialog(handleClose => [
-                                        SortByTagDialog,
-                                        {
-                                            model: self,
-                                            handleClose,
-                                        },
-                                    ]);
-                                },
-                            },
-                            {
-                                label: 'Clear sort',
-                                onClick: () => {
-                                    self.clearSelected();
-                                },
-                            },
-                        ],
-                    },
-                    {
-                        label: 'Color by...',
-                        icon: ColorLens_1.default,
-                        subMenu: [
-                            {
-                                label: 'Pair orientation',
-                                onClick: () => {
-                                    self.setColorScheme({
-                                        type: 'pairOrientation',
-                                    });
-                                },
-                            },
-                            {
-                                label: 'Modifications',
-                                type: 'subMenu',
-                                subMenu: self.modificationsReady
-                                    ? [
-                                        {
-                                            label: `All modifications (>= ${self.modificationThreshold}% prob)`,
-                                            onClick: () => {
-                                                self.setColorScheme({
-                                                    type: 'modifications',
-                                                    modifications: {
-                                                        threshold: self.modificationThreshold,
-                                                    },
-                                                });
-                                            },
-                                        },
-                                        ...self.visibleModificationTypes.map(key => {
-                                            var _a;
-                                            return ({
-                                                label: `Show only ${((_a = modificationData_1.modificationData[key]) === null || _a === void 0 ? void 0 : _a.name) || key}  (>= ${self.modificationThreshold}% prob)`,
-                                                onClick: () => {
-                                                    self.setColorScheme({
-                                                        type: 'modifications',
-                                                        modifications: {
-                                                            isolatedModification: key,
-                                                            threshold: self.modificationThreshold,
-                                                        },
-                                                    });
-                                                },
-                                            });
-                                        }),
-                                        { type: 'divider' },
-                                        {
-                                            label: 'All modifications (<50% prob colored blue)',
-                                            onClick: () => {
-                                                self.setColorScheme({
-                                                    type: 'modifications',
-                                                    modifications: {
-                                                        twoColor: true,
-                                                        threshold: self.modificationThreshold,
-                                                    },
-                                                });
-                                            },
-                                        },
-                                        ...self.visibleModificationTypes.map(key => {
-                                            var _a;
-                                            return ({
-                                                label: `Show only ${((_a = modificationData_1.modificationData[key]) === null || _a === void 0 ? void 0 : _a.name) || key} (<50% prob colored blue)`,
-                                                onClick: () => {
-                                                    self.setColorScheme({
-                                                        type: 'modifications',
-                                                        modifications: {
-                                                            isolatedModification: key,
-                                                            twoColor: true,
-                                                            threshold: self.modificationThreshold,
-                                                        },
-                                                    });
-                                                },
-                                            });
-                                        }),
-                                        { type: 'divider' },
-                                        {
-                                            label: 'All reference CpGs',
-                                            onClick: () => {
-                                                self.setColorScheme({
-                                                    type: 'methylation',
-                                                    modifications: {
-                                                        threshold: self.modificationThreshold,
-                                                    },
-                                                });
-                                            },
-                                        },
-                                        { type: 'divider' },
-                                        {
-                                            label: `Adjust threshold (${self.modificationThreshold}%)`,
-                                            onClick: () => {
-                                                (0, util_1.getSession)(self).queueDialog(handleClose => [
-                                                    SetModificationThresholdDialog,
-                                                    {
-                                                        model: self,
-                                                        handleClose,
-                                                    },
-                                                ]);
-                                            },
-                                        },
-                                    ]
-                                    : [
-                                        {
-                                            label: 'Loading modifications...',
-                                            onClick: () => { },
-                                        },
-                                    ],
-                            },
-                            {
-                                label: 'Insert size',
-                                onClick: () => {
-                                    self.setColorScheme({
-                                        type: 'insertSize',
-                                    });
-                                },
-                            },
-                            ...superColorSchemeSubMenuItems(),
-                        ],
-                    },
-                    {
-                        label: 'Group by...',
-                        icon: Workspaces_1.default,
-                        onClick: () => {
-                            (0, util_1.getSession)(self).queueDialog(handleClose => [
-                                GroupByDialog,
-                                {
-                                    model: self,
-                                    handleClose,
-                                },
-                            ]);
-                        },
-                    },
-                    {
-                        label: 'Show soft clipping',
-                        icon: Visibility_1.default,
-                        type: 'checkbox',
-                        checked: self.showSoftClipping,
-                        onClick: () => {
-                            self.toggleSoftClipping();
-                            if (self.showSoftClipping) {
-                                self.clearSelected();
-                            }
-                        },
-                    },
-                    {
-                        label: 'Fade mismatches by quality',
-                        type: 'checkbox',
-                        checked: self.mismatchAlphaSetting,
-                        onClick: () => {
-                            self.toggleMismatchAlpha();
-                        },
-                    },
-                ];
-            },
-        };
-    })
-        .actions(self => ({
-        afterAttach() {
-            ;
-            (async () => {
-                try {
-                    const { doAfterAttach } = await Promise.resolve().then(() => __importStar(require('./doAfterAttach')));
-                    doAfterAttach(self);
-                }
-                catch (e) {
-                    (0, util_1.getSession)(self).notifyError(`${e}`, e);
-                    console.error(e);
-                }
-            })();
-        },
-    }));
-}
-exports.default = stateModelFactory;

package/dist/LinearReadArcsDisplay/components/ReactComponent.d.ts

@@ -1,5 +0,0 @@
-import type { LinearReadArcsDisplayModel } from '../model';
-declare const LinearReadArcsReactComponent: ({ model, }: {
-    model: LinearReadArcsDisplayModel;
-}) => import("react/jsx-runtime").JSX.Element;
-export default LinearReadArcsReactComponent;

package/dist/LinearReadArcsDisplay/components/ReactComponent.js

@@ -1,23 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const util_1 = require("@jbrowse/core/util");
-const mobx_react_1 = require("mobx-react");
-const BaseDisplayComponent_1 = __importDefault(require("../../shared/components/BaseDisplayComponent"));
-const Arcs = (0, mobx_react_1.observer)(function ({ model, }) {
-    const view = (0, util_1.getContainingView)(model);
-    const width = Math.round(view.dynamicBlocks.totalWidthPx);
-    const height = model.height;
-    const cb = (0, react_1.useCallback)((ref) => {
-        model.setRef(ref);
-    }, [model, width, height]);
-    return ((0, jsx_runtime_1.jsx)("canvas", { "data-testid": "arc-canvas", ref: cb, style: { width, height, position: 'absolute' }, width: width * 2, height: height * 2 }));
-});
-const LinearReadArcsReactComponent = (0, mobx_react_1.observer)(function ({ model, }) {
-    return ((0, jsx_runtime_1.jsx)(BaseDisplayComponent_1.default, { model: model, children: (0, jsx_runtime_1.jsx)(Arcs, { model: model }) }));
-});
-exports.default = LinearReadArcsReactComponent;

package/dist/LinearReadArcsDisplay/configSchema.d.ts

@@ -1,61 +0,0 @@
-import type PluginManager from '@jbrowse/core/PluginManager';
-declare function configSchemaF(pluginManager: PluginManager): import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaType<{
-    maxFeatureScreenDensity: {
-        type: string;
-        description: string;
-        defaultValue: number;
-    };
-    lineWidth: {
-        type: string;
-        description: string;
-        defaultValue: number;
-    };
-    jitter: {
-        type: string;
-        description: string;
-        defaultValue: number;
-    };
-    colorBy: {
-        type: string;
-        defaultValue: {
-            type: string;
-        };
-    };
-    filterBy: {
-        type: string;
-        defaultValue: {
-            flagInclude: number;
-            flagExclude: number;
-        };
-    };
-}, import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaOptions<import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaType<{
-    renderer: import("mobx-state-tree").IAnyModelType;
-}, import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaOptions<import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaType<{
-    maxFeatureScreenDensity: {
-        type: string;
-        description: string;
-        defaultValue: number;
-    };
-    fetchSizeLimit: {
-        type: string;
-        defaultValue: number;
-        description: string;
-    };
-    height: {
-        type: string;
-        defaultValue: number;
-        description: string;
-    };
-    mouseover: {
-        type: string;
-        description: string;
-        defaultValue: string;
-        contextVariable: string[];
-    };
-    jexlFilters: {
-        type: string;
-        description: string;
-        defaultValue: never[];
-    };
-}, import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaOptions<undefined, "displayId">>, undefined>>, undefined>>;
-export default configSchemaF;

package/dist/LinearReadArcsDisplay/configSchema.js

@@ -1,36 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const configuration_1 = require("@jbrowse/core/configuration");
-const plugin_linear_genome_view_1 = require("@jbrowse/plugin-linear-genome-view");
-const util_1 = require("../shared/util");
-function configSchemaF(pluginManager) {
-    return (0, configuration_1.ConfigurationSchema)('LinearReadArcsDisplay', {
-        maxFeatureScreenDensity: {
-            type: 'number',
-            description: 'maximum features per pixel that is displayed in the view',
-            defaultValue: 5,
-        },
-        lineWidth: {
-            type: 'number',
-            description: 'set arc line width',
-            defaultValue: 1,
-        },
-        jitter: {
-            type: 'number',
-            description: 'jitters the x position so e.g. if many reads map to exact same x position, jittering makes it easy to see that there are many of them',
-            defaultValue: 0,
-        },
-        colorBy: {
-            type: 'frozen',
-            defaultValue: { type: 'insertSizeAndOrientation' },
-        },
-        filterBy: {
-            type: 'frozen',
-            defaultValue: util_1.defaultFilterFlags,
-        },
-    }, {
-        baseConfiguration: (0, plugin_linear_genome_view_1.linearBasicDisplayConfigSchemaFactory)(pluginManager),
-        explicitlyTyped: true,
-    });
-}
-exports.default = configSchemaF;

package/dist/LinearReadArcsDisplay/drawFeats.d.ts

@@ -1,2 +0,0 @@
-import type { LinearReadArcsDisplayModel } from './model';
-export declare function drawFeats(self: LinearReadArcsDisplayModel, ctx: CanvasRenderingContext2D, width: number, height: number): void;

package/dist/LinearReadArcsDisplay/drawFeats.js

@@ -1,152 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.drawFeats = drawFeats;
-const util_1 = require("@jbrowse/core/util");
-const MismatchParser_1 = require("../MismatchParser");
-const color_1 = require("../shared/color");
-const util_2 = require("../shared/util");
-function jitter(n) {
-    return Math.random() * 2 * n - n;
-}
-function drawLineAtOffset(ctx, offset, height, color) {
-    ctx.strokeStyle = color;
-    ctx.beginPath();
-    ctx.moveTo(offset, 0);
-    ctx.lineTo(offset, height);
-    ctx.stroke();
-}
-function drawFeats(self, ctx, width, height) {
-    const { chainData, colorBy, drawInter, drawLongRange, lineWidthSetting, jitterVal, } = self;
-    if (!chainData) {
-        return;
-    }
-    const view = (0, util_1.getContainingView)(self);
-    const { assemblyManager } = (0, util_1.getSession)(self);
-    const { chains, stats } = chainData;
-    const hasPaired = (0, util_2.hasPairedReads)(chainData);
-    const asm = assemblyManager.get(view.assemblyNames[0]);
-    const type = (colorBy === null || colorBy === void 0 ? void 0 : colorBy.type) || 'insertSizeAndOrientation';
-    if (!asm) {
-        return;
-    }
-    ctx.lineWidth = lineWidthSetting;
-    function draw(k1, k2, assembly, longRange) {
-        var _a, _b, _c;
-        const s1 = k1.strand;
-        const s2 = k2.strand;
-        const f1 = s1 === -1;
-        const f2 = s2 === -1;
-        const p1 = f1 ? k1.start : k1.end;
-        const p2 = hasPaired ? (f2 ? k2.start : k2.end) : f2 ? k2.end : k2.start;
-        const ra1 = assembly.getCanonicalRefName(k1.refName) || k1.refName;
-        const ra2 = assembly.getCanonicalRefName(k2.refName) || k2.refName;
-        const r1 = (_a = view.bpToPx({ refName: ra1, coord: p1 })) === null || _a === void 0 ? void 0 : _a.offsetPx;
-        const r2 = (_b = view.bpToPx({ refName: ra2, coord: p2 })) === null || _b === void 0 ? void 0 : _b.offsetPx;
-        if (r1 !== undefined && r2 !== undefined) {
-            const radius = (r2 - r1) / 2;
-            const absrad = Math.abs(radius);
-            const p = r1 - view.offsetPx;
-            const p2 = r2 - view.offsetPx;
-            const drawArcInsteadOfBezier = absrad > 10000;
-            if (longRange && drawArcInsteadOfBezier) {
-                ctx.moveTo(p, 0);
-                ctx.beginPath();
-            }
-            else {
-                ctx.beginPath();
-                ctx.moveTo(p, 0);
-            }
-            if (longRange && drawArcInsteadOfBezier) {
-                ctx.strokeStyle = 'red';
-            }
-            else {
-                if (hasPaired) {
-                    if (type === 'insertSizeAndOrientation') {
-                        ctx.strokeStyle = (0, color_1.getPairedInsertSizeAndOrientationColor)(k1, k2, stats)[0];
-                    }
-                    else if (type === 'orientation') {
-                        ctx.strokeStyle = (0, color_1.getPairedOrientationColor)(k1)[0];
-                    }
-                    else if (type === 'insertSize') {
-                        ctx.strokeStyle =
-                            ((_c = (0, color_1.getPairedInsertSizeColor)(k1, k2, stats)) === null || _c === void 0 ? void 0 : _c[0]) || 'grey';
-                    }
-                    else if (type === 'gradient') {
-                        ctx.strokeStyle = `hsl(${Math.log10(absrad) * 10},50%,50%)`;
-                    }
-                }
-                else {
-                    if (type === 'orientation' || type === 'insertSizeAndOrientation') {
-                        if (s1 === -1 && s2 === 1) {
-                            ctx.strokeStyle = 'navy';
-                        }
-                        else if (s1 === 1 && s2 === -1) {
-                            ctx.strokeStyle = 'green';
-                        }
-                        else {
-                            ctx.strokeStyle = 'grey';
-                        }
-                    }
-                    else if (type === 'gradient') {
-                        ctx.strokeStyle = `hsl(${Math.log10(absrad) * 10},50%,50%)`;
-                    }
-                }
-            }
-            const destX = p + radius * 2;
-            const destY = Math.min(height + jitter(jitterVal), absrad);
-            if (longRange) {
-                if (absrad > 100000) {
-                    drawLineAtOffset(ctx, p + jitter(jitterVal), height, 'red');
-                    drawLineAtOffset(ctx, p2 + jitter(jitterVal), height, 'red');
-                }
-                else if (drawArcInsteadOfBezier) {
-                    ctx.arc(p + radius + jitter(jitterVal), 0, absrad, 0, Math.PI);
-                    ctx.stroke();
-                }
-                else {
-                    ctx.bezierCurveTo(p + jitter(jitterVal), destY, destX, destY, destX + jitter(jitterVal), 0);
-                    ctx.stroke();
-                }
-            }
-            else {
-                ctx.bezierCurveTo(p + jitter(jitterVal), destY, destX, destY, destX + jitter(jitterVal), 0);
-                ctx.stroke();
-            }
-        }
-        else if (r1 && drawInter) {
-            drawLineAtOffset(ctx, r1 - view.offsetPx, height, 'purple');
-        }
-    }
-    for (const chain of chains) {
-        if (chain.length === 1 && drawLongRange) {
-            const f = chain[0];
-            if (hasPaired && !(f.flags & 8)) {
-                const mate = {
-                    refName: f.next_ref || '',
-                    start: f.next_pos || 0,
-                    end: f.next_pos || 0,
-                    strand: f.strand,
-                };
-                draw(f, mate, asm, true);
-            }
-            else {
-                const features = [f, ...(0, MismatchParser_1.featurizeSA)(f.SA, f.id, f.strand, f.name)].sort((a, b) => a.clipPos - b.clipPos);
-                for (let i = 0; i < features.length - 1; i++) {
-                    const f = features[i];
-                    const v1 = features[i + 1];
-                    draw(f, v1, asm, true);
-                }
-            }
-        }
-        else {
-            const res = hasPaired
-                ? chain.filter(f => !(f.flags & 2048) && !(f.flags & 8))
-                : chain
-                    .sort((a, b) => a.clipPos - b.clipPos)
-                    .filter(f => !(f.flags & 256));
-            for (let i = 0; i < res.length - 1; i++) {
-                draw(res[i], res[i + 1], asm, false);
-            }
-        }
-    }
-}