react-msaview 5.6.1 → 5.6.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bundle/index.js +95 -95
- package/bundle/index.js.map +4 -4
- package/dist/clustalX.d.ts +4 -3
- package/dist/clustalX.js +25 -4
- package/dist/clustalX.js.map +1 -1
- package/dist/columnCounts.d.ts +37 -0
- package/dist/columnCounts.js +148 -0
- package/dist/columnCounts.js.map +1 -0
- package/dist/components/MSAView.js +1 -8
- package/dist/components/MSAView.js.map +1 -1
- package/dist/components/getVisibleLeaves.d.ts +6 -0
- package/dist/components/getVisibleLeaves.js.map +1 -0
- package/dist/components/msa/MSACanvasBlock.js +17 -54
- package/dist/components/msa/MSACanvasBlock.js.map +1 -1
- package/dist/components/msa/renderBoxFeatureCanvasBlock.d.ts +2 -1
- package/dist/components/msa/renderBoxFeatureCanvasBlock.js +21 -19
- package/dist/components/msa/renderBoxFeatureCanvasBlock.js.map +1 -1
- package/dist/components/msa/renderMSABlock.js +97 -96
- package/dist/components/msa/renderMSABlock.js.map +1 -1
- package/dist/components/msa/renderMSAMouseover.js +9 -32
- package/dist/components/msa/renderMSAMouseover.js.map +1 -1
- package/dist/components/msa/useMsaBlockMouse.d.ts +23 -0
- package/dist/components/msa/useMsaBlockMouse.js +45 -0
- package/dist/components/msa/useMsaBlockMouse.js.map +1 -0
- package/dist/components/tree/TreeCanvas.js +14 -19
- package/dist/components/tree/TreeCanvas.js.map +1 -1
- package/dist/components/tree/TreeCanvasBlock.js +40 -111
- package/dist/components/tree/TreeCanvasBlock.js.map +1 -1
- package/dist/components/tree/renderTreeCanvas.d.ts +2 -0
- package/dist/components/tree/renderTreeCanvas.js +15 -3
- package/dist/components/tree/renderTreeCanvas.js.map +1 -1
- package/dist/components/tree/useTreeHover.d.ts +24 -0
- package/dist/components/tree/useTreeHover.js +44 -0
- package/dist/components/tree/useTreeHover.js.map +1 -0
- package/dist/hierarchy.js +15 -9
- package/dist/hierarchy.js.map +1 -1
- package/dist/index.d.ts +2 -1
- package/dist/model/msaModel.js +4 -3
- package/dist/model/msaModel.js.map +1 -1
- package/dist/model/treeModel.js +9 -8
- package/dist/model/treeModel.js.map +1 -1
- package/dist/model.d.ts +52 -10
- package/dist/model.js +208 -93
- package/dist/model.js.map +1 -1
- package/dist/propertyConservation.d.ts +2 -1
- package/dist/propertyConservation.js +36 -25
- package/dist/propertyConservation.js.map +1 -1
- package/dist/seqPosToGlobalCol.d.ts +7 -0
- package/dist/seqPosToGlobalCol.js +17 -0
- package/dist/seqPosToGlobalCol.js.map +1 -1
- package/dist/stripDefault.d.ts +21 -0
- package/dist/stripDefault.js +26 -0
- package/dist/stripDefault.js.map +1 -0
- package/dist/types.d.ts +16 -0
- package/dist/version.d.ts +1 -1
- package/dist/version.js +1 -1
- package/package.json +3 -3
- package/src/clustalX.test.ts +9 -11
- package/src/clustalX.ts +27 -28
- package/src/columnCounts.test.ts +58 -0
- package/src/columnCounts.ts +170 -0
- package/src/components/MSAView.tsx +1 -9
- package/src/components/{msa/getVisibleLeaves.ts → getVisibleLeaves.ts} +1 -1
- package/src/components/msa/MSACanvasBlock.tsx +42 -110
- package/src/components/msa/renderBoxFeatureCanvasBlock.ts +25 -18
- package/src/components/msa/renderMSABlock.ts +113 -125
- package/src/components/msa/renderMSAMouseover.ts +11 -34
- package/src/components/msa/useMsaBlockMouse.ts +81 -0
- package/src/components/tree/TreeCanvas.tsx +16 -23
- package/src/components/tree/TreeCanvasBlock.tsx +62 -143
- package/src/components/tree/renderTreeCanvas.test.ts +100 -190
- package/src/components/tree/renderTreeCanvas.ts +14 -3
- package/src/components/tree/useTreeHover.ts +69 -0
- package/src/domainBands.test.ts +98 -0
- package/src/hierarchy.ts +15 -9
- package/src/index.ts +7 -0
- package/src/model/msaModel.ts +4 -6
- package/src/model/treeModel.ts +9 -14
- package/src/model.ts +241 -112
- package/src/propertyConservation.test.ts +2 -13
- package/src/propertyConservation.ts +40 -31
- package/src/rowSpace.test.ts +46 -0
- package/src/seqPosToGlobalCol.ts +18 -0
- package/src/stripDefault.test.ts +48 -0
- package/src/stripDefault.ts +35 -0
- package/src/types.ts +23 -0
- package/src/version.ts +1 -1
- package/dist/components/msa/getVisibleLeaves.d.ts +0 -6
- package/dist/components/msa/getVisibleLeaves.js.map +0 -1
- package/dist/useDevicePixelRatio.d.ts +0 -1
- package/dist/useDevicePixelRatio.js +0 -27
- package/dist/useDevicePixelRatio.js.map +0 -1
- package/src/useDevicePixelRatio.ts +0 -29
- /package/dist/components/{msa/getVisibleLeaves.js → getVisibleLeaves.js} +0 -0
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { getVisibleLeaves } from "./getVisibleLeaves.js";
|
|
2
1
|
import { visibleColRange } from "./visibleColRange.js";
|
|
3
2
|
import { setFontSize } from "../../setFontSize.js";
|
|
4
3
|
import { adjustColorForContrast } from "../../util.js";
|
|
4
|
+
import { getVisibleLeaves } from "../getVisibleLeaves.js";
|
|
5
5
|
export function renderMSABlock({ model, offsetX, offsetY, contrastScheme, ctx, theme, highResScaleFactorOverride, blockSizeXOverride, blockSizeYOverride, }) {
|
|
6
6
|
const { colWidth, blockSize, rowHeight, fontSize, highResScaleFactor, actuallyShowDomains, bgColor, } = model;
|
|
7
7
|
const k = highResScaleFactorOverride ?? highResScaleFactor;
|
|
@@ -23,28 +23,19 @@ export function renderMSABlock({ model, offsetX, offsetY, contrastScheme, ctx, t
|
|
|
23
23
|
const referenceSeq = relativeTo
|
|
24
24
|
? columns.get(relativeTo)?.slice(xStart, xEnd)
|
|
25
25
|
: null;
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
drawText({
|
|
40
|
-
model,
|
|
41
|
-
ctx,
|
|
42
|
-
xStart,
|
|
43
|
-
xEnd,
|
|
44
|
-
visibleLeaves,
|
|
45
|
-
referenceSeq,
|
|
46
|
-
});
|
|
47
|
-
}
|
|
26
|
+
drawTilesAndText({
|
|
27
|
+
model,
|
|
28
|
+
ctx,
|
|
29
|
+
theme,
|
|
30
|
+
contrastScheme,
|
|
31
|
+
xStart,
|
|
32
|
+
xEnd,
|
|
33
|
+
visibleLeaves,
|
|
34
|
+
referenceSeq,
|
|
35
|
+
// when domains are shown the background tiles come from
|
|
36
|
+
// renderBoxFeatureCanvasBlock, so only the letters are drawn here
|
|
37
|
+
drawTiles: !actuallyShowDomains,
|
|
38
|
+
});
|
|
48
39
|
drawInsertionIndicators({
|
|
49
40
|
model,
|
|
50
41
|
ctx,
|
|
@@ -54,82 +45,92 @@ export function renderMSABlock({ model, offsetX, offsetY, contrastScheme, ctx, t
|
|
|
54
45
|
});
|
|
55
46
|
ctx.resetTransform();
|
|
56
47
|
}
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
48
|
+
// Per-cell tile color for the active scheme. The scheme is fixed for the whole
|
|
49
|
+
// block, so resolve which rule applies once rather than re-testing the scheme
|
|
50
|
+
// name inside the innermost loop.
|
|
51
|
+
function tileColorFn(model) {
|
|
52
|
+
const { colorSchemeName, colorScheme, colClustalX, colConsensus } = model;
|
|
53
|
+
if (colorSchemeName === 'clustalx_protein_dynamic') {
|
|
54
|
+
return (col, letter) => colClustalX[col][letter];
|
|
63
55
|
}
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
const { name } = node.data;
|
|
70
|
-
const y = node.x;
|
|
71
|
-
const str = columns.get(name)?.slice(xStart, xEnd);
|
|
72
|
-
if (!str) {
|
|
73
|
-
continue;
|
|
74
|
-
}
|
|
75
|
-
const tileY = y - rowHeight;
|
|
76
|
-
const textY = y - quarterRowHeight;
|
|
77
|
-
for (let j = 0, l2 = str.length; j < l2; j++) {
|
|
78
|
-
const letter = str[j];
|
|
79
|
-
const x = j * colWidth + offsetXAligned;
|
|
80
|
-
const isMatchingReference = referenceSeq && name !== relativeTo && letter === referenceSeq[j];
|
|
81
|
-
let color;
|
|
82
|
-
if (isClustalX) {
|
|
83
|
-
color = colClustalX[xStart + j][letter];
|
|
84
|
-
}
|
|
85
|
-
else if (isPercentIdentity) {
|
|
86
|
-
const consensus = colConsensus[xStart + j];
|
|
87
|
-
color = letter === consensus.letter ? consensus.color : undefined;
|
|
88
|
-
}
|
|
89
|
-
else {
|
|
90
|
-
color = colorScheme[letter];
|
|
91
|
-
}
|
|
92
|
-
if (bgColor) {
|
|
93
|
-
ctx.fillStyle = isMatchingReference
|
|
94
|
-
? theme.palette.action.hover
|
|
95
|
-
: color || theme.palette.background.default;
|
|
96
|
-
ctx.fillRect(x, tileY, colWidth, rowHeight);
|
|
97
|
-
}
|
|
98
|
-
if (showMsaLetters) {
|
|
99
|
-
ctx.fillStyle = bgColor
|
|
100
|
-
? (contrastScheme[letter] ?? 'black')
|
|
101
|
-
: color
|
|
102
|
-
? adjustColorForContrast(color, theme.palette.background.default)
|
|
103
|
-
: theme.palette.text.primary;
|
|
104
|
-
ctx.fillText(isMatchingReference ? '.' : letter, x + halfColWidth, textY);
|
|
105
|
-
}
|
|
106
|
-
}
|
|
56
|
+
if (colorSchemeName === 'percent_identity_dynamic') {
|
|
57
|
+
return (col, letter) => {
|
|
58
|
+
const consensus = colConsensus[col];
|
|
59
|
+
return letter === consensus.letter ? consensus.color : undefined;
|
|
60
|
+
};
|
|
107
61
|
}
|
|
62
|
+
return (_col, letter) => colorScheme[letter];
|
|
108
63
|
}
|
|
109
|
-
//
|
|
110
|
-
//
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
const
|
|
123
|
-
const
|
|
124
|
-
const
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
64
|
+
// Letter color to use over a domain box, keyed by accession. Domain fills come
|
|
65
|
+
// from a categorical palette that has no fixed lightness, so ask the theme for a
|
|
66
|
+
// readable text color per fill instead of assuming dark-on-light.
|
|
67
|
+
function domainLetterColors(model, theme) {
|
|
68
|
+
return new Map(Object.entries(model.fillPalette).map(([accession, fill]) => [
|
|
69
|
+
accession,
|
|
70
|
+
theme.palette.getContrastText(fill),
|
|
71
|
+
]));
|
|
72
|
+
}
|
|
73
|
+
function drawTilesAndText({ model, ctx, theme, contrastScheme, visibleLeaves, xStart, xEnd, referenceSeq, drawTiles, }) {
|
|
74
|
+
const { bgColor, columns, colWidth, rowHeight, relativeTo, showMsaLetters, subFeatureRows, domainBandsByStart, } = model;
|
|
75
|
+
const tiles = drawTiles && bgColor;
|
|
76
|
+
if (tiles || showMsaLetters) {
|
|
77
|
+
const tileColor = tileColorFn(model);
|
|
78
|
+
const offsetXAligned = xStart * colWidth;
|
|
79
|
+
const halfColWidth = colWidth / 2;
|
|
80
|
+
// note: -rowHeight/4 matches +rowHeight/4 in tree
|
|
81
|
+
const quarterRowHeight = rowHeight / 4;
|
|
82
|
+
// with the tiles coming from the domain overlay instead, letters sit either
|
|
83
|
+
// on a domain box or on the plain background; sub-row layout stacks the boxes
|
|
84
|
+
// above the letters, so those rows are all plain background
|
|
85
|
+
const overDomains = !drawTiles && !subFeatureRows;
|
|
86
|
+
const domainColors = overDomains
|
|
87
|
+
? domainLetterColors(model, theme)
|
|
88
|
+
: undefined;
|
|
89
|
+
for (let i = 0, l1 = visibleLeaves.length; i < l1; i++) {
|
|
90
|
+
const node = visibleLeaves[i];
|
|
91
|
+
const { name } = node.data;
|
|
92
|
+
const y = node.x;
|
|
93
|
+
const str = columns.get(name)?.slice(xStart, xEnd);
|
|
94
|
+
if (str) {
|
|
95
|
+
const tileY = y - rowHeight;
|
|
96
|
+
const textY = y - quarterRowHeight;
|
|
97
|
+
const bands = overDomains ? domainBandsByStart.get(name) : undefined;
|
|
98
|
+
let band = 0;
|
|
99
|
+
for (let j = 0, l2 = str.length; j < l2; j++) {
|
|
100
|
+
const col = xStart + j;
|
|
101
|
+
const letter = str[j];
|
|
102
|
+
const x = j * colWidth + offsetXAligned;
|
|
103
|
+
const isMatchingReference = referenceSeq && name !== relativeTo && letter === referenceSeq[j];
|
|
104
|
+
const color = tileColor(col, letter);
|
|
105
|
+
if (tiles) {
|
|
106
|
+
ctx.fillStyle = isMatchingReference
|
|
107
|
+
? theme.palette.action.hover
|
|
108
|
+
: color || theme.palette.background.default;
|
|
109
|
+
ctx.fillRect(x, tileY, colWidth, rowHeight);
|
|
110
|
+
}
|
|
111
|
+
if (showMsaLetters) {
|
|
112
|
+
// bands are sorted by start column and the sweep is left to right,
|
|
113
|
+
// so one forward-only cursor finds the band covering each column
|
|
114
|
+
while (bands && band < bands.length && bands[band].endCol <= col) {
|
|
115
|
+
band++;
|
|
116
|
+
}
|
|
117
|
+
const covering = bands?.[band];
|
|
118
|
+
ctx.fillStyle =
|
|
119
|
+
covering && covering.startCol <= col
|
|
120
|
+
? // on top of a domain box: contrast against the box fill
|
|
121
|
+
domainColors.get(covering.annotation.accession)
|
|
122
|
+
: tiles
|
|
123
|
+
? // on top of a colored tile
|
|
124
|
+
(contrastScheme[letter] ?? 'black')
|
|
125
|
+
: !drawTiles || !color
|
|
126
|
+
? // plain background, uncolored letters
|
|
127
|
+
theme.palette.text.primary
|
|
128
|
+
: // letter-color mode: darken/lighten to stay readable
|
|
129
|
+
adjustColorForContrast(color, theme.palette.background.default);
|
|
130
|
+
ctx.fillText(isMatchingReference ? '.' : letter, x + halfColWidth, textY);
|
|
131
|
+
}
|
|
132
|
+
}
|
|
133
|
+
}
|
|
133
134
|
}
|
|
134
135
|
}
|
|
135
136
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"renderMSABlock.js","sourceRoot":"","sources":["../../../src/components/msa/renderMSABlock.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"renderMSABlock.js","sourceRoot":"","sources":["../../../src/components/msa/renderMSABlock.ts"],"names":[],"mappings":"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"}
|
|
@@ -6,52 +6,29 @@ const highlightColor = 'rgba(128,128,0,0.2)';
|
|
|
6
6
|
// faint hover-style wash alone is invisible against clustalx coloring)
|
|
7
7
|
const highlightColumnsFill = 'rgba(255,140,0,0.28)';
|
|
8
8
|
const highlightColumnsBorder = 'rgba(210,90,0,0.95)';
|
|
9
|
-
// Collapse sorted column indices into contiguous [start,end] runs so a run of
|
|
10
|
-
// highlighted columns draws as one bordered band rather than per-column slices
|
|
11
|
-
// (which would draw internal borders).
|
|
12
|
-
function contiguousRuns(columns) {
|
|
13
|
-
const sorted = [...columns].sort((a, b) => a - b);
|
|
14
|
-
const runs = [];
|
|
15
|
-
for (const col of sorted) {
|
|
16
|
-
const last = runs.at(-1);
|
|
17
|
-
if (last && col === last.end + 1) {
|
|
18
|
-
last.end = col;
|
|
19
|
-
}
|
|
20
|
-
else {
|
|
21
|
-
runs.push({ start: col, end: col });
|
|
22
|
-
}
|
|
23
|
-
}
|
|
24
|
-
return runs;
|
|
25
|
-
}
|
|
26
9
|
export function renderMouseover({ ctx, model, }) {
|
|
27
|
-
const { mouseCol, colWidth, msaAreaWidth, verticalScrollbarWidth, height, rowHeight, scrollX, scrollY, mouseRow, mouseClickRow, mouseClickCol,
|
|
10
|
+
const { mouseCol, colWidth, msaAreaWidth, verticalScrollbarWidth, height, rowHeight, scrollX, scrollY, mouseRow, mouseClickRow, mouseClickCol, highResScaleFactor, referenceRowIndex, hoveredRowIndices, highlightedColumnRuns, } = model;
|
|
28
11
|
const width = msaAreaWidth - verticalScrollbarWidth;
|
|
29
12
|
ctx.resetTransform();
|
|
30
13
|
ctx.clearRect(0, 0, width * highResScaleFactor, height * highResScaleFactor);
|
|
31
14
|
ctx.scale(highResScaleFactor, highResScaleFactor);
|
|
32
15
|
// Highlight reference row (relativeTo) persistently
|
|
33
|
-
if (
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
ctx.fillStyle = referenceColor;
|
|
37
|
-
ctx.fillRect(0, referenceRowIndex * rowHeight + scrollY, width, rowHeight);
|
|
38
|
-
}
|
|
16
|
+
if (referenceRowIndex !== undefined) {
|
|
17
|
+
ctx.fillStyle = referenceColor;
|
|
18
|
+
ctx.fillRect(0, referenceRowIndex * rowHeight + scrollY, width, rowHeight);
|
|
39
19
|
}
|
|
40
20
|
// Highlight multiple rows when hovering over tree nodes with children
|
|
41
|
-
if (
|
|
21
|
+
if (hoveredRowIndices.length > 0) {
|
|
42
22
|
ctx.fillStyle = multiRowHoverColor;
|
|
43
|
-
for (const
|
|
44
|
-
|
|
45
|
-
if (rowIndex !== undefined) {
|
|
46
|
-
ctx.fillRect(0, rowIndex * rowHeight + scrollY, width, rowHeight);
|
|
47
|
-
}
|
|
23
|
+
for (const rowIndex of hoveredRowIndices) {
|
|
24
|
+
ctx.fillRect(0, rowIndex * rowHeight + scrollY, width, rowHeight);
|
|
48
25
|
}
|
|
49
26
|
}
|
|
50
27
|
// Highlight multiple columns — draw each contiguous run as a filled, bordered
|
|
51
28
|
// band so a domain/motif highlight is clearly visible over the alignment
|
|
52
|
-
if (
|
|
29
|
+
if (highlightedColumnRuns.length > 0) {
|
|
53
30
|
ctx.lineWidth = 2;
|
|
54
|
-
for (const { start, end } of
|
|
31
|
+
for (const { start, end } of highlightedColumnRuns) {
|
|
55
32
|
const x = start * colWidth + scrollX;
|
|
56
33
|
const w = (end - start + 1) * colWidth;
|
|
57
34
|
ctx.fillStyle = highlightColumnsFill;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"renderMSAMouseover.js","sourceRoot":"","sources":["../../../src/components/msa/renderMSAMouseover.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAA;AAIxE,MAAM,UAAU,GAAG,kBAAkB,CAAA;AACrC,MAAM,cAAc,GAAG,qBAAqB,CAAA;AAC5C,+EAA+E;AAC/E,6EAA6E;AAC7E,uEAAuE;AACvE,MAAM,oBAAoB,GAAG,sBAAsB,CAAA;AACnD,MAAM,sBAAsB,GAAG,qBAAqB,CAAA;AAEpD,
|
|
1
|
+
{"version":3,"file":"renderMSAMouseover.js","sourceRoot":"","sources":["../../../src/components/msa/renderMSAMouseover.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import type React from 'react';
|
|
2
|
+
import type { MsaViewModel } from '../../model.ts';
|
|
3
|
+
/**
|
|
4
|
+
* Translates pointer events over one MSA block into model column/row hover and
|
|
5
|
+
* click state, and reports where a tooltip should be anchored.
|
|
6
|
+
*
|
|
7
|
+
* The anchor is only tracked when there is something to show (an insertion, a
|
|
8
|
+
* domain under the cursor, or column stats), so plain mouse movement over the
|
|
9
|
+
* alignment updates the canvas overlay without re-rendering this component.
|
|
10
|
+
*/
|
|
11
|
+
export declare function useMsaBlockMouse({ model, offsetX, offsetY, }: {
|
|
12
|
+
model: MsaViewModel;
|
|
13
|
+
offsetX: number;
|
|
14
|
+
offsetY: number;
|
|
15
|
+
}): {
|
|
16
|
+
tooltipPoint: {
|
|
17
|
+
x: number;
|
|
18
|
+
y: number;
|
|
19
|
+
} | undefined;
|
|
20
|
+
onMouseMove: (event: React.MouseEvent, el: HTMLElement) => void;
|
|
21
|
+
onClick: (event: React.MouseEvent, el: HTMLElement) => void;
|
|
22
|
+
onMouseLeave: () => void;
|
|
23
|
+
};
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
import { useState } from 'react';
|
|
2
|
+
function eventToColRow({ event, el, offsetX, offsetY, colWidth, rowHeight, }) {
|
|
3
|
+
const { left, top } = el.getBoundingClientRect();
|
|
4
|
+
return {
|
|
5
|
+
col: Math.floor((event.clientX - left + offsetX) / colWidth),
|
|
6
|
+
row: Math.floor((event.clientY - top + offsetY) / rowHeight),
|
|
7
|
+
};
|
|
8
|
+
}
|
|
9
|
+
/**
|
|
10
|
+
* Translates pointer events over one MSA block into model column/row hover and
|
|
11
|
+
* click state, and reports where a tooltip should be anchored.
|
|
12
|
+
*
|
|
13
|
+
* The anchor is only tracked when there is something to show (an insertion, a
|
|
14
|
+
* domain under the cursor, or column stats), so plain mouse movement over the
|
|
15
|
+
* alignment updates the canvas overlay without re-rendering this component.
|
|
16
|
+
*/
|
|
17
|
+
export function useMsaBlockMouse({ model, offsetX, offsetY, }) {
|
|
18
|
+
const [tooltipPoint, setTooltipPoint] = useState();
|
|
19
|
+
function colRow(event, el) {
|
|
20
|
+
const { colWidth, rowHeight } = model;
|
|
21
|
+
return eventToColRow({ event, el, offsetX, offsetY, colWidth, rowHeight });
|
|
22
|
+
}
|
|
23
|
+
function onMouseMove(event, el) {
|
|
24
|
+
const { col, row } = colRow(event, el);
|
|
25
|
+
const inBounds = col >= 0 && col < model.numColumns && row >= 0 && row < model.numRows;
|
|
26
|
+
model.setMousePos(inBounds ? col : undefined, inBounds ? row : undefined);
|
|
27
|
+
const hasTooltip = !!model.hoveredInsertion ||
|
|
28
|
+
model.mouseOverDomains.length > 0 ||
|
|
29
|
+
(model.showColumnStats && !!model.mouseOverColumnStats);
|
|
30
|
+
setTooltipPoint(hasTooltip ? { x: event.clientX, y: event.clientY } : undefined);
|
|
31
|
+
}
|
|
32
|
+
function onClick(event, el) {
|
|
33
|
+
const { col, row } = colRow(event, el);
|
|
34
|
+
const { mouseClickCol, mouseClickRow } = model;
|
|
35
|
+
// clicking the same cell again clears the pinned crosshair
|
|
36
|
+
const same = col === mouseClickCol && row === mouseClickRow;
|
|
37
|
+
model.setMouseClickPos(same ? undefined : col, same ? undefined : row);
|
|
38
|
+
}
|
|
39
|
+
function onMouseLeave() {
|
|
40
|
+
model.setMousePos();
|
|
41
|
+
setTooltipPoint(undefined);
|
|
42
|
+
}
|
|
43
|
+
return { tooltipPoint, onMouseMove, onClick, onMouseLeave };
|
|
44
|
+
}
|
|
45
|
+
//# sourceMappingURL=useMsaBlockMouse.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useMsaBlockMouse.js","sourceRoot":"","sources":["../../../src/components/msa/useMsaBlockMouse.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAKhC,SAAS,aAAa,CAAC,EACrB,KAAK,EACL,EAAE,EACF,OAAO,EACP,OAAO,EACP,QAAQ,EACR,SAAS,GAQV;IACC,MAAM,EAAE,IAAI,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,qBAAqB,EAAE,CAAA;IAChD,OAAO;QACL,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,OAAO,GAAG,IAAI,GAAG,OAAO,CAAC,GAAG,QAAQ,CAAC;QAC5D,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,OAAO,GAAG,GAAG,GAAG,OAAO,CAAC,GAAG,SAAS,CAAC;KAC7D,CAAA;AACH,CAAC;AAED;;;;;;;GAOG;AACH,MAAM,UAAU,gBAAgB,CAAC,EAC/B,KAAK,EACL,OAAO,EACP,OAAO,GAKR;IACC,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,EAA4B,CAAA;IAE5E,SAAS,MAAM,CAAC,KAAuB,EAAE,EAAe;QACtD,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,CAAA;QACrC,OAAO,aAAa,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,CAAC,CAAA;IAC5E,CAAC;IAED,SAAS,WAAW,CAAC,KAAuB,EAAE,EAAe;QAC3D,MAAM,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,MAAM,CAAC,KAAK,EAAE,EAAE,CAAC,CAAA;QACtC,MAAM,QAAQ,GACZ,GAAG,IAAI,CAAC,IAAI,GAAG,GAAG,KAAK,CAAC,UAAU,IAAI,GAAG,IAAI,CAAC,IAAI,GAAG,GAAG,KAAK,CAAC,OAAO,CAAA;QACvE,KAAK,CAAC,WAAW,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,SAAS,EAAE,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,SAAS,CAAC,CAAA;QAEzE,MAAM,UAAU,GACd,CAAC,CAAC,KAAK,CAAC,gBAAgB;YACxB,KAAK,CAAC,gBAAgB,CAAC,MAAM,GAAG,CAAC;YACjC,CAAC,KAAK,CAAC,eAAe,IAAI,CAAC,CAAC,KAAK,CAAC,oBAAoB,CAAC,CAAA;QACzD,eAAe,CACb,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,KAAK,CAAC,OAAO,EAAE,CAAC,EAAE,KAAK,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,SAAS,CAChE,CAAA;IACH,CAAC;IAED,SAAS,OAAO,CAAC,KAAuB,EAAE,EAAe;QACvD,MAAM,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,MAAM,CAAC,KAAK,EAAE,EAAE,CAAC,CAAA;QACtC,MAAM,EAAE,aAAa,EAAE,aAAa,EAAE,GAAG,KAAK,CAAA;QAC9C,2DAA2D;QAC3D,MAAM,IAAI,GAAG,GAAG,KAAK,aAAa,IAAI,GAAG,KAAK,aAAa,CAAA;QAC3D,KAAK,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,GAAG,EAAE,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,GAAG,CAAC,CAAA;IACxE,CAAC;IAED,SAAS,YAAY;QACnB,KAAK,CAAC,WAAW,EAAE,CAAA;QACnB,eAAe,CAAC,SAAS,CAAC,CAAA;IAC5B,CAAC;IAED,OAAO,EAAE,YAAY,EAAE,WAAW,EAAE,OAAO,EAAE,YAAY,EAAE,CAAA;AAC7D,CAAC"}
|
|
@@ -15,31 +15,26 @@ const TreeCanvas = observer(function ({ model }) {
|
|
|
15
15
|
const { onMouseDown, onMouseUp } = useWheelScroll({ ref, onScrollY });
|
|
16
16
|
const mouseoverRef = useCanvasAutorun(ctx => {
|
|
17
17
|
if (isAlive(model)) {
|
|
18
|
-
const {
|
|
18
|
+
const { rowHeight, treeAreaWidth: w, height: h, scrollY: sy, mouseRow, referenceRowIndex, hoveredRowIndices, } = model;
|
|
19
19
|
ctx.resetTransform();
|
|
20
20
|
ctx.clearRect(0, 0, w, h);
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
ctx.fillRect(0, leaf.x + sy - rowHeight / 2, w, rowHeight);
|
|
26
|
-
}
|
|
21
|
+
// rows are laid out at a fixed pitch, so a row index is all that is
|
|
22
|
+
// needed to place its band (leaf.x is rowHeight*(index+0.5))
|
|
23
|
+
const fillRow = (index) => {
|
|
24
|
+
ctx.fillRect(0, index * rowHeight + sy, w, rowHeight);
|
|
27
25
|
};
|
|
28
|
-
if (
|
|
26
|
+
if (referenceRowIndex !== undefined) {
|
|
29
27
|
ctx.fillStyle = referenceColor;
|
|
30
|
-
fillRow(
|
|
28
|
+
fillRow(referenceRowIndex);
|
|
31
29
|
}
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
fillRow(descendantName);
|
|
36
|
-
}
|
|
30
|
+
ctx.fillStyle = treeHoverColor;
|
|
31
|
+
for (const index of hoveredRowIndices) {
|
|
32
|
+
fillRow(index);
|
|
37
33
|
}
|
|
38
|
-
if (
|
|
39
|
-
|
|
40
|
-
!
|
|
41
|
-
|
|
42
|
-
fillRow(mouseOverRowName);
|
|
34
|
+
if (mouseRow !== undefined &&
|
|
35
|
+
mouseRow !== referenceRowIndex &&
|
|
36
|
+
!hoveredRowIndices.includes(mouseRow)) {
|
|
37
|
+
fillRow(mouseRow);
|
|
43
38
|
}
|
|
44
39
|
}
|
|
45
40
|
}, [model]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TreeCanvas.js","sourceRoot":"","sources":["../../../src/components/tree/TreeCanvas.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAElD,OAAO,EAAE,OAAO,EAAE,MAAM,0BAA0B,CAAA;AAClD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,eAAe,MAAM,sBAAuB,CAAA;AACnD,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAC/C,OAAO,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAA;AAC5D,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAA;AACxD,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAA;AAIpE,MAAM,UAAU,GAAG,QAAQ,CAAC,UAAU,EAAE,KAAK,EAA2B;IACtE,MAAM,GAAG,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAA;IACxC,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,OAAO,EAAE,aAAa,EAAE,GAAG,KAAK,CAAA;IAC3D,MAAM,SAAS,GAAG,WAAW,CAC3B,CAAC,CAAS,EAAE,EAAE;QACZ,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,CAAA;IACpB,CAAC,EACD,CAAC,KAAK,CAAC,CACR,CAAA;IACD,MAAM,EAAE,WAAW,EAAE,SAAS,EAAE,GAAG,cAAc,CAAC,EAAE,GAAG,EAAE,SAAS,EAAE,CAAC,CAAA;IAErE,MAAM,YAAY,GAAG,gBAAgB,CACnC,GAAG,CAAC,EAAE;QACJ,IAAI,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC;YACnB,MAAM,EACJ,
|
|
1
|
+
{"version":3,"file":"TreeCanvas.js","sourceRoot":"","sources":["../../../src/components/tree/TreeCanvas.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAElD,OAAO,EAAE,OAAO,EAAE,MAAM,0BAA0B,CAAA;AAClD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,eAAe,MAAM,sBAAuB,CAAA;AACnD,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAC/C,OAAO,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAA;AAC5D,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAA;AACxD,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAA;AAIpE,MAAM,UAAU,GAAG,QAAQ,CAAC,UAAU,EAAE,KAAK,EAA2B;IACtE,MAAM,GAAG,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAA;IACxC,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,OAAO,EAAE,aAAa,EAAE,GAAG,KAAK,CAAA;IAC3D,MAAM,SAAS,GAAG,WAAW,CAC3B,CAAC,CAAS,EAAE,EAAE;QACZ,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,CAAA;IACpB,CAAC,EACD,CAAC,KAAK,CAAC,CACR,CAAA;IACD,MAAM,EAAE,WAAW,EAAE,SAAS,EAAE,GAAG,cAAc,CAAC,EAAE,GAAG,EAAE,SAAS,EAAE,CAAC,CAAA;IAErE,MAAM,YAAY,GAAG,gBAAgB,CACnC,GAAG,CAAC,EAAE;QACJ,IAAI,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC;YACnB,MAAM,EACJ,SAAS,EACT,aAAa,EAAE,CAAC,EAChB,MAAM,EAAE,CAAC,EACT,OAAO,EAAE,EAAE,EACX,QAAQ,EACR,iBAAiB,EACjB,iBAAiB,GAClB,GAAG,KAAK,CAAA;YACT,GAAG,CAAC,cAAc,EAAE,CAAA;YACpB,GAAG,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAA;YAEzB,oEAAoE;YACpE,6DAA6D;YAC7D,MAAM,OAAO,GAAG,CAAC,KAAa,EAAE,EAAE;gBAChC,GAAG,CAAC,QAAQ,CAAC,CAAC,EAAE,KAAK,GAAG,SAAS,GAAG,EAAE,EAAE,CAAC,EAAE,SAAS,CAAC,CAAA;YACvD,CAAC,CAAA;YAED,IAAI,iBAAiB,KAAK,SAAS,EAAE,CAAC;gBACpC,GAAG,CAAC,SAAS,GAAG,cAAc,CAAA;gBAC9B,OAAO,CAAC,iBAAiB,CAAC,CAAA;YAC5B,CAAC;YAED,GAAG,CAAC,SAAS,GAAG,cAAc,CAAA;YAC9B,KAAK,MAAM,KAAK,IAAI,iBAAiB,EAAE,CAAC;gBACtC,OAAO,CAAC,KAAK,CAAC,CAAA;YAChB,CAAC;YACD,IACE,QAAQ,KAAK,SAAS;gBACtB,QAAQ,KAAK,iBAAiB;gBAC9B,CAAC,iBAAiB,CAAC,QAAQ,CAAC,QAAQ,CAAC,EACrC,CAAC;gBACD,OAAO,CAAC,QAAQ,CAAC,CAAA;YACnB,CAAC;QACH,CAAC;IACH,CAAC,EACD,CAAC,KAAK,CAAC,CACR,CAAA;IAED,OAAO,CACL,6BACE,GAAG,EAAE,GAAG,EACR,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,SAAS,EACpB,YAAY,EAAE,KAAK,CAAC,EAAE;YACpB,KAAK,CAAC,cAAc,EAAE,CAAA;QACxB,CAAC,EACD,KAAK,EAAE;YACL,MAAM;YACN,QAAQ,EAAE,UAAU;YACpB,KAAK,EAAE,SAAS,GAAG,OAAO;SAC3B;QAEA,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE,CAAC,CACpB,oBAAC,eAAe,IAAC,GAAG,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,GAAI,CAC9D,CAAC;QACF,gCACE,GAAG,EAAE,YAAY,EACjB,KAAK,EAAE,aAAa,EACpB,MAAM,EAAE,MAAM,EACd,KAAK,EAAE;gBACL,QAAQ,EAAE,UAAU;gBACpB,GAAG,EAAE,CAAC;gBACN,IAAI,EAAE,CAAC;gBACP,KAAK,EAAE,aAAa;gBACpB,MAAM;gBACN,MAAM,EAAE,IAAI;gBACZ,aAAa,EAAE,MAAM;aACtB,GACD,CACE,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,UAAU,CAAA"}
|