react-msaview 3.1.2 → 3.1.4
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 +31 -31
- package/dist/DialogQueue.js +2 -4
- package/dist/DialogQueue.js.map +1 -1
- package/dist/UniprotTrack.js +1 -1
- package/dist/UniprotTrack.js.map +1 -1
- package/dist/components/BoxTrackBlock.js +3 -4
- package/dist/components/BoxTrackBlock.js.map +1 -1
- package/dist/components/ExportSVGDialog.js +17 -4
- package/dist/components/ExportSVGDialog.js.map +1 -1
- package/dist/components/ImportForm/util.js +1 -0
- package/dist/components/ImportForm/util.js.map +1 -1
- package/dist/components/Loading.d.ts +6 -0
- package/dist/components/Loading.js +12 -0
- package/dist/components/Loading.js.map +1 -0
- package/dist/components/MSAPanel/MSABlock.js +3 -3
- package/dist/components/MSAPanel/MSABlock.js.map +1 -1
- package/dist/components/MSAPanel/MSAMouseoverCanvas.js +7 -9
- package/dist/components/MSAPanel/MSAMouseoverCanvas.js.map +1 -1
- package/dist/components/MSAPanel/index.js +1 -1
- package/dist/components/MSAPanel/index.js.map +1 -1
- package/dist/components/MSAPanel/renderMSABlock.d.ts +3 -1
- package/dist/components/MSAPanel/renderMSABlock.js +10 -10
- package/dist/components/MSAPanel/renderMSABlock.js.map +1 -1
- package/dist/components/MSAPanel/renderMSAMouseover.js +5 -8
- package/dist/components/MSAPanel/renderMSAMouseover.js.map +1 -1
- package/dist/components/MSAView.js +20 -16
- package/dist/components/MSAView.js.map +1 -1
- package/dist/components/TextTrack.js +1 -1
- package/dist/components/TextTrack.js.map +1 -1
- package/dist/components/TreePanel/TreeCanvasBlock.js +11 -13
- package/dist/components/TreePanel/TreeCanvasBlock.js.map +1 -1
- package/dist/components/TreePanel/TreeNodeMenu.js +4 -6
- package/dist/components/TreePanel/TreeNodeMenu.js.map +1 -1
- package/dist/components/TreePanel/renderTreeCanvas.js +12 -13
- package/dist/components/TreePanel/renderTreeCanvas.js.map +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +1 -1
- package/dist/layout.js +5 -0
- package/dist/layout.js.map +1 -1
- package/dist/measureTextCanvas.d.ts +1 -0
- package/dist/measureTextCanvas.js +13 -0
- package/dist/measureTextCanvas.js.map +1 -0
- package/dist/model.d.ts +53 -47
- package/dist/model.js +20 -40
- package/dist/model.js.map +1 -1
- package/dist/parseNewick.js +1 -2
- package/dist/parseNewick.js.map +1 -1
- package/dist/parsers/ClustalMSA.js +3 -4
- package/dist/parsers/ClustalMSA.js.map +1 -1
- package/dist/parsers/FastaMSA.js +3 -4
- package/dist/parsers/FastaMSA.js.map +1 -1
- package/dist/parsers/StockholmMSA.js +13 -19
- package/dist/parsers/StockholmMSA.js.map +1 -1
- package/dist/renderToSvg.d.ts +1 -0
- package/dist/renderToSvg.js +78 -22
- package/dist/renderToSvg.js.map +1 -1
- package/dist/util.js +7 -4
- package/dist/util.js.map +1 -1
- package/dist/version.d.ts +1 -1
- package/dist/version.js +1 -1
- package/package.json +1 -23
- package/src/components/ExportSVGDialog.tsx +48 -13
- package/src/components/ImportForm/util.ts +1 -0
- package/src/components/Loading.tsx +27 -0
- package/src/components/MSAPanel/MSABlock.tsx +2 -1
- package/src/components/MSAPanel/MSAMouseoverCanvas.tsx +6 -6
- package/src/components/MSAPanel/index.tsx +2 -2
- package/src/components/MSAPanel/renderMSABlock.ts +10 -1
- package/src/components/MSAPanel/renderMSAMouseover.ts +3 -17
- package/src/components/MSAView.tsx +28 -30
- package/src/components/TreePanel/TreeCanvasBlock.tsx +5 -6
- package/src/components/TreePanel/renderTreeCanvas.ts +4 -6
- package/src/index.ts +1 -1
- package/src/measureTextCanvas.ts +14 -0
- package/src/model.ts +14 -16
- package/src/renderToSvg.tsx +156 -40
- package/src/version.ts +1 -1
package/dist/DialogQueue.js
CHANGED
|
@@ -14,15 +14,13 @@ export function DialogQueueSessionMixin() {
|
|
|
14
14
|
* #getter
|
|
15
15
|
*/
|
|
16
16
|
get DialogComponent() {
|
|
17
|
-
|
|
18
|
-
return (_a = self.queueOfDialogs[0]) === null || _a === void 0 ? void 0 : _a[0];
|
|
17
|
+
return self.queueOfDialogs[0]?.[0];
|
|
19
18
|
},
|
|
20
19
|
/**
|
|
21
20
|
* #getter
|
|
22
21
|
*/
|
|
23
22
|
get DialogProps() {
|
|
24
|
-
|
|
25
|
-
return (_a = self.queueOfDialogs[0]) === null || _a === void 0 ? void 0 : _a[1];
|
|
23
|
+
return self.queueOfDialogs[0]?.[1];
|
|
26
24
|
},
|
|
27
25
|
}))
|
|
28
26
|
.actions(self => ({
|
package/dist/DialogQueue.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DialogQueue.js","sourceRoot":"","sources":["../src/DialogQueue.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAA;AAEvC;;GAEG;AACH,MAAM,UAAU,uBAAuB;IACrC,OAAO,KAAK;SACT,KAAK,CAAC,yBAAyB,EAAE,EAAE,CAAC;SACpC,QAAQ,CAAC,GAAG,EAAE,CAAC,CAAC;QACf,8DAA8D;QAC9D,cAAc,EAAE,EAAkC;KACnD,CAAC,CAAC;SACF,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;QACd;;WAEG;QACH,IAAI,eAAe
|
|
1
|
+
{"version":3,"file":"DialogQueue.js","sourceRoot":"","sources":["../src/DialogQueue.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAA;AAEvC;;GAEG;AACH,MAAM,UAAU,uBAAuB;IACrC,OAAO,KAAK;SACT,KAAK,CAAC,yBAAyB,EAAE,EAAE,CAAC;SACpC,QAAQ,CAAC,GAAG,EAAE,CAAC,CAAC;QACf,8DAA8D;QAC9D,cAAc,EAAE,EAAkC;KACnD,CAAC,CAAC;SACF,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;QACd;;WAEG;QACH,IAAI,eAAe;YACjB,OAAO,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAA;QACpC,CAAC;QACD;;WAEG;QACH,IAAI,WAAW;YACb,OAAO,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAA;QACpC,CAAC;KACF,CAAC,CAAC;SACF,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;QAChB;;WAEG;QACH,kBAAkB;YAChB,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC,CAAC,CAAA;QACpD,CAAC;QACD;;WAEG;QACH,WAAW,CACT,EAAgE;YAEhE,MAAM,CAAC,SAAS,EAAE,KAAK,CAAC,GAAG,EAAE,CAAC,GAAG,EAAE;gBACjC,IAAI,CAAC,kBAAkB,EAAE,CAAA;YAC3B,CAAC,CAAC,CAAA;YACF,IAAI,CAAC,cAAc,GAAG,CAAC,GAAG,IAAI,CAAC,cAAc,EAAE,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC,CAAA;QACpE,CAAC;KACF,CAAC,CAAC,CAAA;AACP,CAAC"}
|
package/dist/UniprotTrack.js
CHANGED
|
@@ -27,7 +27,7 @@ export const UniprotTrack = types
|
|
|
27
27
|
addDisposer(self, autorun(async () => {
|
|
28
28
|
try {
|
|
29
29
|
const { accession } = self;
|
|
30
|
-
const accessionSansVersion = accession
|
|
30
|
+
const accessionSansVersion = accession?.replace(/\.[^/.]+$/, '');
|
|
31
31
|
const url = `https://rest.uniprot.org/uniprotkb/${accessionSansVersion}.gff`;
|
|
32
32
|
const res = await fetch(url);
|
|
33
33
|
if (!res.ok) {
|
package/dist/UniprotTrack.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"UniprotTrack.js","sourceRoot":"","sources":["../src/UniprotTrack.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAA;AACpD,OAAO,EAAE,OAAO,EAAE,MAAM,MAAM,CAAA;AAE9B,SAAS;AACT,OAAO,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAA;AAEjC,MAAM,CAAC,MAAM,YAAY,GAAG,KAAK;KAC9B,KAAK,CAAC;IACL,EAAE,EAAE,KAAK,CAAC,MAAM;IAChB,SAAS,EAAE,KAAK,CAAC,MAAM;IACvB,IAAI,EAAE,KAAK,CAAC,MAAM;IAClB,iBAAiB,EAAE,KAAK,CAAC,MAAM;IAC/B,MAAM,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAM,EAAE,GAAG,CAAC;CAC1C,CAAC;KACD,QAAQ,CAAC,GAAG,EAAE,CAAC,CAAC;IACf,KAAK,EAAE,SAAoB;IAC3B,IAAI,EAAE,SAA+B;CACtC,CAAC,CAAC;KACF,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IAChB,QAAQ,CAAC,KAAc;QACrB,IAAI,CAAC,KAAK,GAAG,KAAK,CAAA;IACpB,CAAC;IACD,OAAO,CAAC,IAAY;QAClB,IAAI,CAAC,IAAI,GAAG,IAAI,CAAA;IAClB,CAAC;CACF,CAAC,CAAC;KACF,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IAChB,WAAW;QACT,WAAW,CACT,IAAI,EACJ,OAAO,CAAC,KAAK,IAAI,EAAE;YACjB,IAAI,CAAC;gBACH,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,CAAA;gBAC1B,MAAM,oBAAoB,GAAG,SAAS,
|
|
1
|
+
{"version":3,"file":"UniprotTrack.js","sourceRoot":"","sources":["../src/UniprotTrack.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAA;AACpD,OAAO,EAAE,OAAO,EAAE,MAAM,MAAM,CAAA;AAE9B,SAAS;AACT,OAAO,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAA;AAEjC,MAAM,CAAC,MAAM,YAAY,GAAG,KAAK;KAC9B,KAAK,CAAC;IACL,EAAE,EAAE,KAAK,CAAC,MAAM;IAChB,SAAS,EAAE,KAAK,CAAC,MAAM;IACvB,IAAI,EAAE,KAAK,CAAC,MAAM;IAClB,iBAAiB,EAAE,KAAK,CAAC,MAAM;IAC/B,MAAM,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAM,EAAE,GAAG,CAAC;CAC1C,CAAC;KACD,QAAQ,CAAC,GAAG,EAAE,CAAC,CAAC;IACf,KAAK,EAAE,SAAoB;IAC3B,IAAI,EAAE,SAA+B;CACtC,CAAC,CAAC;KACF,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IAChB,QAAQ,CAAC,KAAc;QACrB,IAAI,CAAC,KAAK,GAAG,KAAK,CAAA;IACpB,CAAC;IACD,OAAO,CAAC,IAAY;QAClB,IAAI,CAAC,IAAI,GAAG,IAAI,CAAA;IAClB,CAAC;CACF,CAAC,CAAC;KACF,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IAChB,WAAW;QACT,WAAW,CACT,IAAI,EACJ,OAAO,CAAC,KAAK,IAAI,EAAE;YACjB,IAAI,CAAC;gBACH,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,CAAA;gBAC1B,MAAM,oBAAoB,GAAG,SAAS,EAAE,OAAO,CAAC,WAAW,EAAE,EAAE,CAAC,CAAA;gBAChE,MAAM,GAAG,GAAG,sCAAsC,oBAAoB,MAAM,CAAA;gBAC5E,MAAM,GAAG,GAAG,MAAM,KAAK,CAAC,GAAG,CAAC,CAAA;gBAC5B,IAAI,CAAC,GAAG,CAAC,EAAE,EAAE,CAAC;oBACZ,MAAM,IAAI,KAAK,CACb,QAAQ,GAAG,CAAC,MAAM,aAAa,GAAG,KAAK,MAAM,GAAG,CAAC,IAAI,EAAE,EAAE,CAC1D,CAAA;gBACH,CAAC;gBACD,IAAI,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC,IAAI,EAAE,CAAC,CAAA;YAChC,CAAC;YAAC,OAAO,CAAC,EAAE,CAAC;gBACX,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAA;gBAChB,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAA;YAClB,CAAC;QACH,CAAC,CAAC,CACH,CAAA;IACH,CAAC;CACF,CAAC,CAAC;KACF,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IACd,IAAI,OAAO;QACT,OAAO,CAAC,IAAI,CAAC,IAAI,CAAA;IACnB,CAAC;IAED,IAAI,QAAQ;QACV,OAAO,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;IAC5B,CAAC;CACF,CAAC,CAAC,CAAA"}
|
|
@@ -11,7 +11,7 @@ const BoxTrackBlock = observer(function ({ track, model, offsetX, }) {
|
|
|
11
11
|
: features;
|
|
12
12
|
const layout = useMemo(() => {
|
|
13
13
|
const temp = new Layout();
|
|
14
|
-
feats
|
|
14
|
+
feats?.forEach((feature, index) => {
|
|
15
15
|
const { start, end } = feature;
|
|
16
16
|
if (associatedRowName) {
|
|
17
17
|
const s = model.rowSpecificBpToPx(associatedRowName, start - 1);
|
|
@@ -70,7 +70,6 @@ const BoxTrackBlock = observer(function ({ track, model, offsetX, }) {
|
|
|
70
70
|
blanks,
|
|
71
71
|
]);
|
|
72
72
|
useEffect(() => {
|
|
73
|
-
var _a, _b, _c, _d;
|
|
74
73
|
if (!labelRef.current) {
|
|
75
74
|
return;
|
|
76
75
|
}
|
|
@@ -94,8 +93,8 @@ const BoxTrackBlock = observer(function ({ track, model, offsetX, }) {
|
|
|
94
93
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
95
94
|
const feature = data;
|
|
96
95
|
if (x2 - x1 > 0) {
|
|
97
|
-
const note =
|
|
98
|
-
const name =
|
|
96
|
+
const note = feature.attributes?.Note?.[0];
|
|
97
|
+
const name = feature.attributes?.Name?.[0];
|
|
99
98
|
const type = feature.type;
|
|
100
99
|
ctx.fillText([type, name, note].filter(f => !!f).join(' - '), Math.max(Math.min(-scrollX, x2), x1), minY + (maxY - minY));
|
|
101
100
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BoxTrackBlock.js","sourceRoot":"","sources":["../../src/components/BoxTrackBlock.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACzD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AAI9D,OAAO,MAAM,MAAM,WAAW,CAAA;AAO9B,MAAM,aAAa,GAAG,QAAQ,CAAC,UAAU,EACvC,KAAK,EACL,KAAK,EACL,OAAO,GAKR;IACC,MAAM,EACJ,SAAS,EACT,QAAQ,EACR,MAAM,EACN,SAAS,EACT,kBAAkB,EAClB,QAAQ,EACR,OAAO,GACR,GAAG,KAAK,CAAA;IACT,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,iBAAiB,EAAE,GAAG,KAAK,CAAC,KAAK,CAAA;IAE3D,MAAM,KAAK,GAAW,eAAe,CAAC,QAAQ,CAAC;QAC7C,CAAC,CAAC,mBAAmB;YACnB,WAAW,CAAC,QAAQ,CAAC;QACvB,CAAC,CAAC,QAAQ,CAAA;IAEZ,MAAM,MAAM,GAAG,OAAO,CAAC,GAAG,EAAE;QAC1B,MAAM,IAAI,GAAG,IAAI,MAAM,EAAE,CAAA;QAEzB,KAAK,
|
|
1
|
+
{"version":3,"file":"BoxTrackBlock.js","sourceRoot":"","sources":["../../src/components/BoxTrackBlock.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,19 +1,32 @@
|
|
|
1
1
|
import React, { useState } from 'react';
|
|
2
2
|
import { Dialog, ErrorMessage } from '@jbrowse/core/ui';
|
|
3
|
-
import { DialogContent, DialogActions,
|
|
3
|
+
import { Button, Checkbox, DialogContent, DialogActions, FormControlLabel, FormControl, FormLabel, RadioGroup, Radio, Typography, useTheme, } from '@mui/material';
|
|
4
4
|
export default function ExportSVGDialog({ model, onClose, }) {
|
|
5
5
|
const [includeMinimap, setIncludeMinimap] = useState(true);
|
|
6
|
+
const [exportType, setExportType] = useState('viewport');
|
|
6
7
|
const [error, setError] = useState();
|
|
7
8
|
const theme = useTheme();
|
|
8
9
|
return (React.createElement(Dialog, { onClose: () => onClose(), open: true, title: "Export SVG" },
|
|
9
10
|
React.createElement(DialogContent, null,
|
|
10
|
-
React.createElement(Typography, null, "Export SVG of current view"),
|
|
11
11
|
error ? React.createElement(ErrorMessage, { error: error }) : null,
|
|
12
|
-
React.createElement(
|
|
12
|
+
React.createElement(Typography, null, "Settings:"),
|
|
13
|
+
React.createElement("div", null,
|
|
14
|
+
React.createElement(FormControl, null,
|
|
15
|
+
React.createElement(FormControlLabel, { control: React.createElement(Checkbox, { checked: includeMinimap, onChange: event => setIncludeMinimap(event.target.checked) }), disabled: exportType === 'entire', label: "Include minimap?" }))),
|
|
16
|
+
React.createElement("div", null,
|
|
17
|
+
React.createElement(FormControl, null,
|
|
18
|
+
React.createElement(FormLabel, null, "Export type"),
|
|
19
|
+
React.createElement(RadioGroup, { value: exportType, onChange: event => setExportType(event.target.value) },
|
|
20
|
+
React.createElement(FormControlLabel, { value: "entire", control: React.createElement(Radio, null), label: "Entire MSA" }),
|
|
21
|
+
React.createElement(FormControlLabel, { value: "viewport", control: React.createElement(Radio, null), label: "Current viewport only" }))))),
|
|
13
22
|
React.createElement(DialogActions, null,
|
|
14
23
|
React.createElement(Button, { variant: "contained", color: "primary", onClick: async () => {
|
|
15
24
|
try {
|
|
16
|
-
await model.exportSVG({
|
|
25
|
+
await model.exportSVG({
|
|
26
|
+
theme,
|
|
27
|
+
includeMinimap: exportType === 'entire' ? false : includeMinimap,
|
|
28
|
+
exportType,
|
|
29
|
+
});
|
|
17
30
|
}
|
|
18
31
|
catch (e) {
|
|
19
32
|
console.error(e);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ExportSVGDialog.js","sourceRoot":"","sources":["../../src/components/ExportSVGDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACvC,OAAO,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAA;AACvD,OAAO,EACL,aAAa,EACb,aAAa,EACb,
|
|
1
|
+
{"version":3,"file":"ExportSVGDialog.js","sourceRoot":"","sources":["../../src/components/ExportSVGDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACvC,OAAO,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAA;AACvD,OAAO,EACL,MAAM,EACN,QAAQ,EACR,aAAa,EACb,aAAa,EACb,gBAAgB,EAChB,WAAW,EACX,SAAS,EACT,UAAU,EACV,KAAK,EACL,UAAU,EACV,QAAQ,GACT,MAAM,eAAe,CAAA;AAGtB,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EACtC,KAAK,EACL,OAAO,GAIR;IACC,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAA;IAC1D,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,UAAU,CAAC,CAAA;IACxD,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,EAAW,CAAA;IAC7C,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAA;IACxB,OAAO,CACL,oBAAC,MAAM,IAAC,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,EAAE,EAAE,IAAI,QAAC,KAAK,EAAC,YAAY;QACvD,oBAAC,aAAa;YACX,KAAK,CAAC,CAAC,CAAC,oBAAC,YAAY,IAAC,KAAK,EAAE,KAAK,GAAI,CAAC,CAAC,CAAC,IAAI;YAC9C,oBAAC,UAAU,oBAAuB;YAClC;gBACE,oBAAC,WAAW;oBACV,oBAAC,gBAAgB,IACf,OAAO,EACL,oBAAC,QAAQ,IACP,OAAO,EAAE,cAAc,EACvB,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAAC,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAC1D,EAEJ,QAAQ,EAAE,UAAU,KAAK,QAAQ,EACjC,KAAK,EAAC,kBAAkB,GACxB,CACU,CACV;YACN;gBACE,oBAAC,WAAW;oBACV,oBAAC,SAAS,sBAAwB;oBAClC,oBAAC,UAAU,IACT,KAAK,EAAE,UAAU,EACjB,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;wBAEpD,oBAAC,gBAAgB,IACf,KAAK,EAAC,QAAQ,EACd,OAAO,EAAE,oBAAC,KAAK,OAAG,EAClB,KAAK,EAAC,YAAY,GAClB;wBACF,oBAAC,gBAAgB,IACf,KAAK,EAAC,UAAU,EAChB,OAAO,EAAE,oBAAC,KAAK,OAAG,EAClB,KAAK,EAAC,uBAAuB,GAC7B,CACS,CACD,CACV,CACQ;QAChB,oBAAC,aAAa;YACZ,oBAAC,MAAM,IACL,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,SAAS,EACf,OAAO,EAAE,KAAK,IAAI,EAAE;oBAClB,IAAI,CAAC;wBACH,MAAM,KAAK,CAAC,SAAS,CAAC;4BACpB,KAAK;4BACL,cAAc,EACZ,UAAU,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,cAAc;4BAClD,UAAU;yBACX,CAAC,CAAA;oBACJ,CAAC;oBAAC,OAAO,CAAC,EAAE,CAAC;wBACX,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAA;wBAChB,QAAQ,CAAC,CAAC,CAAC,CAAA;oBACb,CAAC;oBACD,OAAO,EAAE,CAAA;gBACX,CAAC,aAGM;YACT,oBAAC,MAAM,IAAC,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,WAAW,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,EAAE,aAE7D,CACK,CACT,CACV,CAAA;AACH,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"util.js","sourceRoot":"","sources":["../../../src/components/ImportForm/util.ts"],"names":[],"mappings":"AAGA,MAAM,CAAC,KAAK,UAAU,IAAI,CACxB,KAAmB,EACnB,OAAsB,EACtB,QAAuB;IAEvB,KAAK,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAA;IACzB,IAAI,CAAC;QACH,IAAI,OAAO,EAAE,CAAC;YACZ,MAAM,KAAK,CAAC,gBAAgB,CAAC,OAAO,CAAC,CAAA;QACvC,CAAC;QACD,IAAI,QAAQ,EAAE,CAAC;YACb,MAAM,KAAK,CAAC,iBAAiB,CAAC,QAAQ,CAAC,CAAA;QACzC,CAAC;IACH,CAAC;IAAC,OAAO,CAAC,EAAE,CAAC;QACX,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAA;IACnB,CAAC;AACH,CAAC"}
|
|
1
|
+
{"version":3,"file":"util.js","sourceRoot":"","sources":["../../../src/components/ImportForm/util.ts"],"names":[],"mappings":"AAGA,MAAM,CAAC,KAAK,UAAU,IAAI,CACxB,KAAmB,EACnB,OAAsB,EACtB,QAAuB;IAEvB,KAAK,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAA;IACzB,IAAI,CAAC;QACH,IAAI,OAAO,EAAE,CAAC;YACZ,MAAM,KAAK,CAAC,gBAAgB,CAAC,OAAO,CAAC,CAAA;QACvC,CAAC;QACD,IAAI,QAAQ,EAAE,CAAC;YACb,MAAM,KAAK,CAAC,iBAAiB,CAAC,QAAQ,CAAC,CAAA;QACzC,CAAC;IACH,CAAC;IAAC,OAAO,CAAC,EAAE,CAAC;QACX,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAA;QAChB,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAA;IACnB,CAAC;AACH,CAAC"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { observer } from 'mobx-react';
|
|
3
|
+
import { Typography } from '@mui/material';
|
|
4
|
+
// locals
|
|
5
|
+
import ImportForm from './ImportForm';
|
|
6
|
+
import MSAView from './MSAView';
|
|
7
|
+
const Loading = observer(function ({ model }) {
|
|
8
|
+
const { done, initialized } = model;
|
|
9
|
+
return (React.createElement("div", null, !initialized ? (React.createElement(ImportForm, { model: model })) : !done ? (React.createElement(Typography, { variant: "h4" }, "Loading...")) : (React.createElement(MSAView, { model: model }))));
|
|
10
|
+
});
|
|
11
|
+
export default Loading;
|
|
12
|
+
//# sourceMappingURL=Loading.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Loading.js","sourceRoot":"","sources":["../../src/components/Loading.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAE1C,SAAS;AACT,OAAO,UAAU,MAAM,cAAc,CAAA;AACrC,OAAO,OAAO,MAAM,WAAW,CAAA;AAG/B,MAAM,OAAO,GAAG,QAAQ,CAAC,UAAU,EAAE,KAAK,EAA2B;IACnE,MAAM,EAAE,IAAI,EAAE,WAAW,EAAE,GAAG,KAAK,CAAA;IAEnC,OAAO,CACL,iCACG,CAAC,WAAW,CAAC,CAAC,CAAC,CACd,oBAAC,UAAU,IAAC,KAAK,EAAE,KAAK,GAAI,CAC7B,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CACV,oBAAC,UAAU,IAAC,OAAO,EAAC,IAAI,iBAAwB,CACjD,CAAC,CAAC,CAAC,CACF,oBAAC,OAAO,IAAC,KAAK,EAAE,KAAK,GAAI,CAC1B,CACG,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,OAAO,CAAA"}
|
|
@@ -11,21 +11,21 @@ const MSABlock = observer(function ({ model, offsetX, offsetY, }) {
|
|
|
11
11
|
const contrastScheme = useMemo(() => colorContrast(colorScheme, theme), [colorScheme, theme]);
|
|
12
12
|
const ref = useRef(null);
|
|
13
13
|
useEffect(() => {
|
|
14
|
-
|
|
15
|
-
const ctx = (_a = ref.current) === null || _a === void 0 ? void 0 : _a.getContext('2d');
|
|
14
|
+
const ctx = ref.current?.getContext('2d');
|
|
16
15
|
if (!ctx) {
|
|
17
16
|
return;
|
|
18
17
|
}
|
|
19
18
|
return autorun(() => {
|
|
20
19
|
renderMSABlock({
|
|
21
20
|
ctx,
|
|
21
|
+
theme,
|
|
22
22
|
offsetX,
|
|
23
23
|
offsetY,
|
|
24
24
|
contrastScheme,
|
|
25
25
|
model,
|
|
26
26
|
});
|
|
27
27
|
});
|
|
28
|
-
}, [model, offsetX, offsetY, contrastScheme]);
|
|
28
|
+
}, [model, offsetX, offsetY, theme, contrastScheme]);
|
|
29
29
|
return (React.createElement("canvas", { ref: ref, onMouseMove: event => {
|
|
30
30
|
if (!ref.current) {
|
|
31
31
|
return;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MSABlock.js","sourceRoot":"","sources":["../../../src/components/MSAPanel/MSABlock.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;AACzD,OAAO,EAAE,OAAO,EAAE,MAAM,MAAM,CAAA;AAC9B,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AACxC,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,SAAS;AACT,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AAEjD,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAA;AAE1C,MAAM,QAAQ,GAAG,QAAQ,CAAC,UAAU,EAClC,KAAK,EACL,OAAO,EACP,OAAO,GAKR;IACC,MAAM,EACJ,QAAQ,EACR,SAAS,EACT,OAAO,EACP,OAAO,EACP,WAAW,EACX,SAAS,EACT,kBAAkB,GACnB,GAAG,KAAK,CAAA;IACT,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAA;IAExB,MAAM,cAAc,GAAG,OAAO,CAC5B,GAAG,EAAE,CAAC,aAAa,CAAC,WAAW,EAAE,KAAK,CAAC,EACvC,CAAC,WAAW,EAAE,KAAK,CAAC,CACrB,CAAA;IAED,MAAM,GAAG,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAA;IAC3C,SAAS,CAAC,GAAG,EAAE
|
|
1
|
+
{"version":3,"file":"MSABlock.js","sourceRoot":"","sources":["../../../src/components/MSAPanel/MSABlock.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;AACzD,OAAO,EAAE,OAAO,EAAE,MAAM,MAAM,CAAA;AAC9B,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AACxC,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,SAAS;AACT,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AAEjD,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAA;AAE1C,MAAM,QAAQ,GAAG,QAAQ,CAAC,UAAU,EAClC,KAAK,EACL,OAAO,EACP,OAAO,GAKR;IACC,MAAM,EACJ,QAAQ,EACR,SAAS,EACT,OAAO,EACP,OAAO,EACP,WAAW,EACX,SAAS,EACT,kBAAkB,GACnB,GAAG,KAAK,CAAA;IACT,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAA;IAExB,MAAM,cAAc,GAAG,OAAO,CAC5B,GAAG,EAAE,CAAC,aAAa,CAAC,WAAW,EAAE,KAAK,CAAC,EACvC,CAAC,WAAW,EAAE,KAAK,CAAC,CACrB,CAAA;IAED,MAAM,GAAG,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAA;IAC3C,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,GAAG,GAAG,GAAG,CAAC,OAAO,EAAE,UAAU,CAAC,IAAI,CAAC,CAAA;QACzC,IAAI,CAAC,GAAG,EAAE,CAAC;YACT,OAAM;QACR,CAAC;QACD,OAAO,OAAO,CAAC,GAAG,EAAE;YAClB,cAAc,CAAC;gBACb,GAAG;gBACH,KAAK;gBACL,OAAO;gBACP,OAAO;gBACP,cAAc;gBACd,KAAK;aACN,CAAC,CAAA;QACJ,CAAC,CAAC,CAAA;IACJ,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,cAAc,CAAC,CAAC,CAAA;IACpD,OAAO,CACL,gCACE,GAAG,EAAE,GAAG,EACR,WAAW,EAAE,KAAK,CAAC,EAAE;YACnB,IAAI,CAAC,GAAG,CAAC,OAAO,EAAE,CAAC;gBACjB,OAAM;YACR,CAAC;YACD,MAAM,EAAE,IAAI,EAAE,GAAG,EAAE,GAAG,GAAG,CAAC,OAAO,CAAC,qBAAqB,EAAE,CAAA;YACzD,MAAM,MAAM,GAAG,KAAK,CAAC,OAAO,GAAG,IAAI,GAAG,OAAO,CAAA;YAC7C,MAAM,MAAM,GAAG,KAAK,CAAC,OAAO,GAAG,GAAG,GAAG,OAAO,CAAA;YAC5C,KAAK,CAAC,WAAW,CACf,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,QAAQ,CAAC,GAAG,CAAC,EACjC,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,SAAS,CAAC,CAC/B,CAAA;QACH,CAAC,EACD,YAAY,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,WAAW,EAAE,EACvC,KAAK,EAAE,SAAS,GAAG,kBAAkB,EACrC,MAAM,EAAE,SAAS,GAAG,kBAAkB,EACtC,KAAK,EAAE;YACL,QAAQ,EAAE,UAAU;YACpB,GAAG,EAAE,OAAO,GAAG,OAAO;YACtB,IAAI,EAAE,OAAO,GAAG,OAAO;YACvB,KAAK,EAAE,SAAS;YAChB,MAAM,EAAE,SAAS;SAClB,GACD,CACH,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,QAAQ,CAAA"}
|
|
@@ -6,16 +6,14 @@ const MSAMouseoverCanvas = observer(function ({ model, }) {
|
|
|
6
6
|
const ref = useRef(null);
|
|
7
7
|
const { height, width } = model;
|
|
8
8
|
useEffect(() => {
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
renderMouseover({ ctx, model });
|
|
16
|
-
});
|
|
9
|
+
const ctx = ref.current?.getContext('2d');
|
|
10
|
+
return ctx
|
|
11
|
+
? autorun(() => {
|
|
12
|
+
renderMouseover({ ctx, model });
|
|
13
|
+
})
|
|
14
|
+
: undefined;
|
|
17
15
|
}, [model]);
|
|
18
|
-
return (React.createElement("canvas", { ref: ref, width: width, height: height, style: {
|
|
16
|
+
return (React.createElement("canvas", { ref: ref, id: "mouseover", width: width, height: height, style: {
|
|
19
17
|
position: 'absolute',
|
|
20
18
|
top: 0,
|
|
21
19
|
left: 0,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MSAMouseoverCanvas.js","sourceRoot":"","sources":["../../../src/components/MSAPanel/MSAMouseoverCanvas.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAChD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,OAAO,EAAE,OAAO,EAAE,MAAM,MAAM,CAAA;AAI9B,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAA;AAEtD,MAAM,kBAAkB,GAAG,QAAQ,CAAC,UAAU,EAC5C,KAAK,GAGN;IACC,MAAM,GAAG,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAA;IAC3C,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,KAAK,CAAA;IAC/B,SAAS,CAAC,GAAG,EAAE
|
|
1
|
+
{"version":3,"file":"MSAMouseoverCanvas.js","sourceRoot":"","sources":["../../../src/components/MSAPanel/MSAMouseoverCanvas.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAChD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,OAAO,EAAE,OAAO,EAAE,MAAM,MAAM,CAAA;AAI9B,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAA;AAEtD,MAAM,kBAAkB,GAAG,QAAQ,CAAC,UAAU,EAC5C,KAAK,GAGN;IACC,MAAM,GAAG,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAA;IAC3C,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,KAAK,CAAA;IAC/B,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,GAAG,GAAG,GAAG,CAAC,OAAO,EAAE,UAAU,CAAC,IAAI,CAAC,CAAA;QACzC,OAAO,GAAG;YACR,CAAC,CAAC,OAAO,CAAC,GAAG,EAAE;gBACX,eAAe,CAAC,EAAE,GAAG,EAAE,KAAK,EAAE,CAAC,CAAA;YACjC,CAAC,CAAC;YACJ,CAAC,CAAC,SAAS,CAAA;IACf,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAA;IAEX,OAAO,CACL,gCACE,GAAG,EAAE,GAAG,EACR,EAAE,EAAC,WAAW,EACd,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,MAAM,EACd,KAAK,EAAE;YACL,QAAQ,EAAE,UAAU;YACpB,GAAG,EAAE,CAAC;YACN,IAAI,EAAE,CAAC;YACP,KAAK;YACL,MAAM;YACN,MAAM,EAAE,IAAI;YACZ,aAAa,EAAE,MAAM;SACtB,GACD,CACH,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,kBAAkB,CAAA"}
|
|
@@ -2,7 +2,7 @@ import React from 'react';
|
|
|
2
2
|
import MSACanvas from './MSACanvas';
|
|
3
3
|
import MSAMouseoverCanvas from './MSAMouseoverCanvas';
|
|
4
4
|
export default function MSAPanel({ model }) {
|
|
5
|
-
return (React.createElement(
|
|
5
|
+
return (React.createElement("div", { style: { position: 'relative' } },
|
|
6
6
|
React.createElement(MSACanvas, { model: model }),
|
|
7
7
|
React.createElement(MSAMouseoverCanvas, { model: model })));
|
|
8
8
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/MSAPanel/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,SAAS,MAAM,aAAa,CAAA;AACnC,OAAO,kBAAkB,MAAM,sBAAsB,CAAA;AAGrD,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,EAAE,KAAK,EAA2B;IACjE,OAAO,CACL;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/MSAPanel/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,SAAS,MAAM,aAAa,CAAA;AACnC,OAAO,kBAAkB,MAAM,sBAAsB,CAAA;AAGrD,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,EAAE,KAAK,EAA2B;IACjE,OAAO,CACL,6BAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE;QAClC,oBAAC,SAAS,IAAC,KAAK,EAAE,KAAK,GAAI;QAC3B,oBAAC,kBAAkB,IAAC,KAAK,EAAE,KAAK,GAAI,CAChC,CACP,CAAA;AACH,CAAC"}
|
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
import { MsaViewModel } from '../../model';
|
|
2
|
-
|
|
2
|
+
import { Theme } from '@mui/material';
|
|
3
|
+
export declare function renderMSABlock({ model, offsetX, offsetY, contrastScheme, ctx, theme, highResScaleFactorOverride, blockSizeXOverride, blockSizeYOverride, }: {
|
|
3
4
|
offsetX: number;
|
|
4
5
|
offsetY: number;
|
|
6
|
+
theme: Theme;
|
|
5
7
|
model: MsaViewModel;
|
|
6
8
|
contrastScheme: Record<string, string>;
|
|
7
9
|
ctx: CanvasRenderingContext2D;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { getClustalXColor, getPercentIdentityColor } from '../../colorSchemes';
|
|
2
|
-
export function renderMSABlock({ model, offsetX, offsetY, contrastScheme, ctx, highResScaleFactorOverride, blockSizeXOverride, blockSizeYOverride, }) {
|
|
2
|
+
export function renderMSABlock({ model, offsetX, offsetY, contrastScheme, ctx, theme, highResScaleFactorOverride, blockSizeXOverride, blockSizeYOverride, }) {
|
|
3
3
|
const { hierarchy, colWidth, blockSize, rowHeight, fontSize, highResScaleFactor, } = model;
|
|
4
4
|
const k = highResScaleFactorOverride || highResScaleFactor;
|
|
5
5
|
const bx = blockSizeXOverride || blockSize;
|
|
@@ -19,6 +19,7 @@ export function renderMSABlock({ model, offsetX, offsetY, contrastScheme, ctx, h
|
|
|
19
19
|
drawTiles({
|
|
20
20
|
model,
|
|
21
21
|
ctx,
|
|
22
|
+
theme,
|
|
22
23
|
offsetX,
|
|
23
24
|
offsetY,
|
|
24
25
|
xStart,
|
|
@@ -30,20 +31,20 @@ export function renderMSABlock({ model, offsetX, offsetY, contrastScheme, ctx, h
|
|
|
30
31
|
ctx,
|
|
31
32
|
offsetX,
|
|
32
33
|
contrastScheme,
|
|
34
|
+
theme,
|
|
33
35
|
xStart,
|
|
34
36
|
xEnd,
|
|
35
37
|
visibleLeaves,
|
|
36
38
|
});
|
|
37
39
|
}
|
|
38
|
-
function drawTiles({ model, offsetX, ctx, visibleLeaves, xStart, xEnd, }) {
|
|
39
|
-
var _a;
|
|
40
|
+
function drawTiles({ model, offsetX, ctx, visibleLeaves, theme, xStart, xEnd, }) {
|
|
40
41
|
const { bgColor, colorSchemeName, colorScheme, colStats, columns, colWidth, rowHeight, } = model;
|
|
41
42
|
for (const node of visibleLeaves) {
|
|
42
43
|
const {
|
|
43
44
|
// @ts-expect-error
|
|
44
45
|
x: y, data: { name }, } = node;
|
|
45
|
-
const str =
|
|
46
|
-
for (let i = 0; i <
|
|
46
|
+
const str = columns[name]?.slice(xStart, xEnd);
|
|
47
|
+
for (let i = 0; i < str?.length; i++) {
|
|
47
48
|
const letter = str[i];
|
|
48
49
|
const color = colorSchemeName === 'clustalx_protein_dynamic'
|
|
49
50
|
? getClustalXColor(colStats[xStart + i], model, name, xStart + i)
|
|
@@ -52,22 +53,21 @@ function drawTiles({ model, offsetX, ctx, visibleLeaves, xStart, xEnd, }) {
|
|
|
52
53
|
: colorScheme[letter.toUpperCase()];
|
|
53
54
|
if (bgColor) {
|
|
54
55
|
const x = i * colWidth + offsetX - (offsetX % colWidth);
|
|
55
|
-
ctx.fillStyle = color ||
|
|
56
|
+
ctx.fillStyle = color || theme.palette.background.default;
|
|
56
57
|
ctx.fillRect(x, y - rowHeight, colWidth, rowHeight);
|
|
57
58
|
}
|
|
58
59
|
}
|
|
59
60
|
}
|
|
60
61
|
}
|
|
61
|
-
function drawText({ model, offsetX, contrastScheme, ctx, visibleLeaves, xStart, xEnd, }) {
|
|
62
|
-
var _a;
|
|
62
|
+
function drawText({ model, offsetX, contrastScheme, theme, ctx, visibleLeaves, xStart, xEnd, }) {
|
|
63
63
|
const { bgColor, colorScheme, columns, colWidth, rowHeight } = model;
|
|
64
64
|
if (rowHeight >= 5 && colWidth > rowHeight / 2) {
|
|
65
65
|
for (const node of visibleLeaves) {
|
|
66
66
|
const {
|
|
67
67
|
// @ts-expect-error
|
|
68
68
|
x: y, data: { name }, } = node;
|
|
69
|
-
const str =
|
|
70
|
-
for (let i = 0; i <
|
|
69
|
+
const str = columns[name]?.slice(xStart, xEnd);
|
|
70
|
+
for (let i = 0; i < str?.length; i++) {
|
|
71
71
|
const letter = str[i];
|
|
72
72
|
const color = colorScheme[letter.toUpperCase()];
|
|
73
73
|
const contrast = contrastScheme[letter.toUpperCase()] || 'black';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"renderMSABlock.js","sourceRoot":"","sources":["../../../src/components/MSAPanel/renderMSABlock.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,gBAAgB,EAAE,uBAAuB,EAAE,MAAM,oBAAoB,CAAA;
|
|
1
|
+
{"version":3,"file":"renderMSABlock.js","sourceRoot":"","sources":["../../../src/components/MSAPanel/renderMSABlock.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,23 +1,20 @@
|
|
|
1
1
|
export function renderMouseover({ ctx, model, }) {
|
|
2
|
-
const { mouseCol, colWidth,
|
|
2
|
+
const { mouseCol, colWidth, width, height, rowHeight, scrollX, scrollY, mouseRow,
|
|
3
3
|
// @ts-expect-error
|
|
4
|
-
mouseCol2,
|
|
4
|
+
mouseCol2, } = model;
|
|
5
5
|
ctx.resetTransform();
|
|
6
6
|
ctx.clearRect(0, 0, width, height);
|
|
7
7
|
if (mouseCol !== undefined) {
|
|
8
8
|
ctx.fillStyle = 'rgba(0,0,0,0.15)';
|
|
9
|
-
|
|
10
|
-
ctx.fillRect(x, minimapHeight, colWidth, height);
|
|
9
|
+
ctx.fillRect((mouseCol - 1) * colWidth + scrollX, 0, colWidth, height);
|
|
11
10
|
}
|
|
12
11
|
if (mouseRow !== undefined) {
|
|
13
12
|
ctx.fillStyle = 'rgba(0,0,0,0.15)';
|
|
14
|
-
|
|
15
|
-
ctx.fillRect(treeAreaWidth + resizeHandleWidth, y, width, rowHeight);
|
|
13
|
+
ctx.fillRect(0, mouseRow * rowHeight + scrollY, width, rowHeight);
|
|
16
14
|
}
|
|
17
15
|
if (mouseCol2 !== undefined) {
|
|
18
16
|
ctx.fillStyle = 'rgba(255,255,0,0.2)';
|
|
19
|
-
|
|
20
|
-
ctx.fillRect(x, 0, colWidth, height);
|
|
17
|
+
ctx.fillRect((mouseCol2 - 1) * colWidth + scrollX, 0, colWidth, height);
|
|
21
18
|
}
|
|
22
19
|
}
|
|
23
20
|
//# sourceMappingURL=renderMSAMouseover.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"renderMSAMouseover.js","sourceRoot":"","sources":["../../../src/components/MSAPanel/renderMSAMouseover.ts"],"names":[],"mappings":"AAEA,MAAM,UAAU,eAAe,CAAC,EAC9B,GAAG,EACH,KAAK,GAIN;IACC,MAAM,EACJ,QAAQ,EACR,QAAQ,EACR,
|
|
1
|
+
{"version":3,"file":"renderMSAMouseover.js","sourceRoot":"","sources":["../../../src/components/MSAPanel/renderMSAMouseover.ts"],"names":[],"mappings":"AAEA,MAAM,UAAU,eAAe,CAAC,EAC9B,GAAG,EACH,KAAK,GAIN;IACC,MAAM,EACJ,QAAQ,EACR,QAAQ,EACR,KAAK,EACL,MAAM,EACN,SAAS,EACT,OAAO,EACP,OAAO,EACP,QAAQ;IACR,mBAAmB;IACnB,SAAS,GACV,GAAG,KAAK,CAAA;IACT,GAAG,CAAC,cAAc,EAAE,CAAA;IACpB,GAAG,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,CAAC,CAAA;IAClC,IAAI,QAAQ,KAAK,SAAS,EAAE,CAAC;QAC3B,GAAG,CAAC,SAAS,GAAG,kBAAkB,CAAA;QAClC,GAAG,CAAC,QAAQ,CAAC,CAAC,QAAQ,GAAG,CAAC,CAAC,GAAG,QAAQ,GAAG,OAAO,EAAE,CAAC,EAAE,QAAQ,EAAE,MAAM,CAAC,CAAA;IACxE,CAAC;IACD,IAAI,QAAQ,KAAK,SAAS,EAAE,CAAC;QAC3B,GAAG,CAAC,SAAS,GAAG,kBAAkB,CAAA;QAClC,GAAG,CAAC,QAAQ,CAAC,CAAC,EAAE,QAAQ,GAAG,SAAS,GAAG,OAAO,EAAE,KAAK,EAAE,SAAS,CAAC,CAAA;IACnE,CAAC;IACD,IAAI,SAAS,KAAK,SAAS,EAAE,CAAC;QAC5B,GAAG,CAAC,SAAS,GAAG,qBAAqB,CAAA;QACrC,GAAG,CAAC,QAAQ,CAAC,CAAC,SAAS,GAAG,CAAC,CAAC,GAAG,QAAQ,GAAG,OAAO,EAAE,CAAC,EAAE,QAAQ,EAAE,MAAM,CAAC,CAAA;IACzE,CAAC;AACH,CAAC"}
|
|
@@ -1,8 +1,6 @@
|
|
|
1
1
|
import React, { Suspense } from 'react';
|
|
2
2
|
import { observer } from 'mobx-react';
|
|
3
|
-
import { Typography } from '@mui/material';
|
|
4
3
|
// locals
|
|
5
|
-
import ImportForm from './ImportForm';
|
|
6
4
|
import TreeRuler from './TreePanel/TreeRuler';
|
|
7
5
|
import Header from './Header';
|
|
8
6
|
import Track from './Track';
|
|
@@ -10,24 +8,30 @@ import { HorizontalResizeHandle, VerticalResizeHandle } from './ResizeHandles';
|
|
|
10
8
|
import MSAPanel from './MSAPanel';
|
|
11
9
|
import TreePanel from './TreePanel';
|
|
12
10
|
import Minimap from './Minimap';
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
11
|
+
function TopArea({ model }) {
|
|
12
|
+
return (React.createElement("div", { style: { display: 'flex' } },
|
|
13
|
+
React.createElement(TreeRuler, { model: model }),
|
|
14
|
+
React.createElement(Minimap, { model: model })));
|
|
15
|
+
}
|
|
16
|
+
function MainArea({ model }) {
|
|
17
|
+
return (React.createElement("div", { style: { display: 'flex' } },
|
|
18
|
+
React.createElement(TreePanel, { model: model }),
|
|
19
|
+
React.createElement(VerticalResizeHandle, { model: model }),
|
|
20
|
+
React.createElement(MSAPanel, { model: model })));
|
|
21
|
+
}
|
|
22
|
+
const View = observer(function ({ model }) {
|
|
23
|
+
const { turnedOnTracks } = model;
|
|
24
|
+
return (React.createElement("div", { style: { paddingLeft: 20, position: 'relative' } },
|
|
25
|
+
React.createElement(TopArea, { model: model }),
|
|
26
|
+
turnedOnTracks?.map(track => (React.createElement(Track, { key: track.model.id, model: model, track: track }))),
|
|
27
|
+
React.createElement(MainArea, { model: model })));
|
|
16
28
|
});
|
|
17
|
-
const
|
|
18
|
-
const { height,
|
|
29
|
+
const MSAView = observer(function ({ model }) {
|
|
30
|
+
const { height, DialogComponent, DialogProps } = model;
|
|
19
31
|
return (React.createElement("div", null,
|
|
20
32
|
React.createElement("div", { style: { height, overflow: 'hidden' } },
|
|
21
33
|
React.createElement(Header, { model: model }),
|
|
22
|
-
React.createElement(
|
|
23
|
-
React.createElement("div", { style: { display: 'flex' } },
|
|
24
|
-
React.createElement(TreeRuler, { model: model }),
|
|
25
|
-
React.createElement(Minimap, { model: model })), turnedOnTracks === null || turnedOnTracks === void 0 ? void 0 :
|
|
26
|
-
turnedOnTracks.map(track => (React.createElement(Track, { key: track.model.id, model: model, track: track }))),
|
|
27
|
-
React.createElement("div", { style: { display: 'flex' } },
|
|
28
|
-
React.createElement(TreePanel, { model: model }),
|
|
29
|
-
React.createElement(VerticalResizeHandle, { model: model }),
|
|
30
|
-
React.createElement(MSAPanel, { model: model })))),
|
|
34
|
+
React.createElement(View, { model: model })),
|
|
31
35
|
React.createElement(HorizontalResizeHandle, { model: model }),
|
|
32
36
|
DialogComponent ? (React.createElement(Suspense, { fallback: null },
|
|
33
37
|
React.createElement(DialogComponent, { ...DialogProps }))) : null));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MSAView.js","sourceRoot":"","sources":["../../src/components/MSAView.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"MSAView.js","sourceRoot":"","sources":["../../src/components/MSAView.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACvC,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,SAAS;AACT,OAAO,SAAS,MAAM,uBAAuB,CAAA;AAC7C,OAAO,MAAM,MAAM,UAAU,CAAA;AAC7B,OAAO,KAAK,MAAM,SAAS,CAAA;AAC3B,OAAO,EAAE,sBAAsB,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAA;AAE9E,OAAO,QAAQ,MAAM,YAAY,CAAA;AACjC,OAAO,SAAS,MAAM,aAAa,CAAA;AACnC,OAAO,OAAO,MAAM,WAAW,CAAA;AAE/B,SAAS,OAAO,CAAC,EAAE,KAAK,EAA2B;IACjD,OAAO,CACL,6BAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE;QAC7B,oBAAC,SAAS,IAAC,KAAK,EAAE,KAAK,GAAI;QAC3B,oBAAC,OAAO,IAAC,KAAK,EAAE,KAAK,GAAI,CACrB,CACP,CAAA;AACH,CAAC;AACD,SAAS,QAAQ,CAAC,EAAE,KAAK,EAA2B;IAClD,OAAO,CACL,6BAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE;QAC7B,oBAAC,SAAS,IAAC,KAAK,EAAE,KAAK,GAAI;QAC3B,oBAAC,oBAAoB,IAAC,KAAK,EAAE,KAAK,GAAI;QACtC,oBAAC,QAAQ,IAAC,KAAK,EAAE,KAAK,GAAI,CACtB,CACP,CAAA;AACH,CAAC;AAED,MAAM,IAAI,GAAG,QAAQ,CAAC,UAAU,EAAE,KAAK,EAA2B;IAChE,MAAM,EAAE,cAAc,EAAE,GAAG,KAAK,CAAA;IAChC,OAAO,CACL,6BAAK,KAAK,EAAE,EAAE,WAAW,EAAE,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE;QACnD,oBAAC,OAAO,IAAC,KAAK,EAAE,KAAK,GAAI;QACxB,cAAc,EAAE,GAAG,CAAC,KAAK,CAAC,EAAE,CAAC,CAC5B,oBAAC,KAAK,IAAC,GAAG,EAAE,KAAK,CAAC,KAAK,CAAC,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,GAAI,CAC3D,CAAC;QACF,oBAAC,QAAQ,IAAC,KAAK,EAAE,KAAK,GAAI,CACtB,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,MAAM,OAAO,GAAG,QAAQ,CAAC,UAAU,EAAE,KAAK,EAA2B;IACnE,MAAM,EAAE,MAAM,EAAE,eAAe,EAAE,WAAW,EAAE,GAAG,KAAK,CAAA;IACtD,OAAO,CACL;QACE,6BAAK,KAAK,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE;YACxC,oBAAC,MAAM,IAAC,KAAK,EAAE,KAAK,GAAI;YACxB,oBAAC,IAAI,IAAC,KAAK,EAAE,KAAK,GAAI,CAClB;QACN,oBAAC,sBAAsB,IAAC,KAAK,EAAE,KAAK,GAAI;QAEvC,eAAe,CAAC,CAAC,CAAC,CACjB,oBAAC,QAAQ,IAAC,QAAQ,EAAE,IAAI;YACtB,oBAAC,eAAe,OAAK,WAAW,GAAI,CAC3B,CACZ,CAAC,CAAC,CAAC,IAAI,CACJ,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,OAAO,CAAA"}
|
|
@@ -26,7 +26,7 @@ const AnnotationBlock = observer(function ({ track, model, offsetX, }) {
|
|
|
26
26
|
ctx.font = ctx.font.replace(/\d+px/, `${fontSize}px`);
|
|
27
27
|
const xStart = Math.max(0, Math.floor(offsetX / colWidth));
|
|
28
28
|
const xEnd = Math.max(0, Math.ceil((offsetX + blockSize) / colWidth));
|
|
29
|
-
const str = data
|
|
29
|
+
const str = data?.slice(xStart, xEnd);
|
|
30
30
|
for (let i = 0; str && i < str.length; i++) {
|
|
31
31
|
const letter = str[i];
|
|
32
32
|
const color = colorScheme[letter.toUpperCase()];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextTrack.js","sourceRoot":"","sources":["../../src/components/TextTrack.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACzD,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AACxC,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAGrC,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAEvC,MAAM,eAAe,GAAG,QAAQ,CAAC,UAAU,EACzC,KAAK,EACL,KAAK,EACL,OAAO,GAKR;IACC,MAAM,EACJ,SAAS,EACT,OAAO,EACP,OAAO,EACP,WAAW,EAAE,gBAAgB,EAC7B,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,kBAAkB,GACnB,GAAG,KAAK,CAAA;IACT,MAAM,EACJ,KAAK,EAAE,EAAE,iBAAiB,EAAE,IAAI,EAAE,GACnC,GAAG,KAAK,CAAA;IAET,MAAM,WAAW,GAAG,iBAAiB,IAAI,gBAAgB,CAAA;IACzD,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAA;IACxB,MAAM,GAAG,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAA;IAC3C,MAAM,cAAc,GAAG,OAAO,CAC5B,GAAG,EAAE,CAAC,aAAa,CAAC,WAAW,EAAE,KAAK,CAAC,EACvC,CAAC,WAAW,EAAE,KAAK,CAAC,CACrB,CAAA;IACD,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,GAAG,CAAC,OAAO,EAAE,CAAC;YACjB,OAAM;QACR,CAAC;QAED,MAAM,GAAG,GAAG,GAAG,CAAC,OAAO,CAAC,UAAU,CAAC,IAAI,CAAC,CAAA;QACxC,IAAI,CAAC,GAAG,EAAE,CAAC;YACT,OAAM;QACR,CAAC;QAED,0CAA0C;QAC1C,GAAG,CAAC,cAAc,EAAE,CAAA;QACpB,GAAG,CAAC,KAAK,CAAC,kBAAkB,EAAE,kBAAkB,CAAC,CAAA;QACjD,GAAG,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,EAAE,SAAS,EAAE,SAAS,CAAC,CAAA;QACzC,GAAG,CAAC,SAAS,CAAC,CAAC,OAAO,EAAE,CAAC,CAAC,CAAA;QAC1B,GAAG,CAAC,SAAS,GAAG,QAAQ,CAAA;QACxB,GAAG,CAAC,IAAI,GAAG,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,GAAG,QAAQ,IAAI,CAAC,CAAA;QAErD,MAAM,MAAM,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,QAAQ,CAAC,CAAC,CAAA;QAC1D,MAAM,IAAI,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC,OAAO,GAAG,SAAS,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAA;QACrE,MAAM,GAAG,GAAG,IAAI,
|
|
1
|
+
{"version":3,"file":"TextTrack.js","sourceRoot":"","sources":["../../src/components/TextTrack.tsx"],"names":[],"mappings":"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"}
|
|
@@ -14,7 +14,7 @@ const TreeCanvasBlock = observer(function ({ model, offsetY, }) {
|
|
|
14
14
|
const [branchMenu, setBranchMenu] = useState();
|
|
15
15
|
const [toggleNodeMenu, setToggleNodeMenu] = useState();
|
|
16
16
|
const [hoverElt, setHoverElt] = useState();
|
|
17
|
-
const { scrollY, treeAreaWidth,
|
|
17
|
+
const { scrollY, treeAreaWidth, blockSize, highResScaleFactor } = model;
|
|
18
18
|
const width = treeAreaWidth + padding;
|
|
19
19
|
const height = blockSize;
|
|
20
20
|
const w2 = width * highResScaleFactor;
|
|
@@ -26,8 +26,7 @@ const TreeCanvasBlock = observer(function ({ model, offsetY, }) {
|
|
|
26
26
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
27
27
|
[model, height, width]);
|
|
28
28
|
useEffect(() => {
|
|
29
|
-
|
|
30
|
-
const ctx = (_a = ref.current) === null || _a === void 0 ? void 0 : _a.getContext('2d');
|
|
29
|
+
const ctx = ref.current?.getContext('2d');
|
|
31
30
|
if (!ctx) {
|
|
32
31
|
return;
|
|
33
32
|
}
|
|
@@ -42,22 +41,21 @@ const TreeCanvasBlock = observer(function ({ model, offsetY, }) {
|
|
|
42
41
|
});
|
|
43
42
|
}, [model, offsetY, theme]);
|
|
44
43
|
useEffect(() => {
|
|
45
|
-
|
|
46
|
-
const ctx = (_a = mouseoverRef.current) === null || _a === void 0 ? void 0 : _a.getContext('2d');
|
|
44
|
+
const ctx = mouseoverRef.current?.getContext('2d');
|
|
47
45
|
if (!ctx) {
|
|
48
46
|
return;
|
|
49
47
|
}
|
|
50
48
|
ctx.resetTransform();
|
|
51
49
|
ctx.clearRect(0, 0, treeAreaWidth + padding, blockSize);
|
|
52
|
-
ctx.translate(
|
|
50
|
+
ctx.translate(0, -offsetY);
|
|
53
51
|
if (hoverElt) {
|
|
54
52
|
const { minX, maxX, minY, maxY } = hoverElt;
|
|
55
53
|
ctx.fillStyle = 'rgba(0,0,0,0.1)';
|
|
56
54
|
ctx.fillRect(minX, minY, maxX - minX, maxY - minY);
|
|
57
55
|
}
|
|
58
|
-
}, [hoverElt,
|
|
56
|
+
}, [hoverElt, offsetY, blockSize, treeAreaWidth]);
|
|
59
57
|
function hoverBranchClickMap(event) {
|
|
60
|
-
const x = event.nativeEvent.offsetX
|
|
58
|
+
const x = event.nativeEvent.offsetX;
|
|
61
59
|
const y = event.nativeEvent.offsetY;
|
|
62
60
|
const [entry] = clickMap.current.search({
|
|
63
61
|
minX: x,
|
|
@@ -70,7 +68,7 @@ const TreeCanvasBlock = observer(function ({ model, offsetY, }) {
|
|
|
70
68
|
: undefined;
|
|
71
69
|
}
|
|
72
70
|
function hoverNameClickMap(event) {
|
|
73
|
-
const x = event.nativeEvent.offsetX
|
|
71
|
+
const x = event.nativeEvent.offsetX;
|
|
74
72
|
const y = event.nativeEvent.offsetY;
|
|
75
73
|
const [entry] = clickMap.current.search({
|
|
76
74
|
minX: x,
|
|
@@ -90,8 +88,8 @@ const TreeCanvasBlock = observer(function ({ model, offsetY, }) {
|
|
|
90
88
|
position: 'absolute',
|
|
91
89
|
};
|
|
92
90
|
return (React.createElement(React.Fragment, null,
|
|
93
|
-
|
|
94
|
-
|
|
91
|
+
branchMenu?.id ? (React.createElement(TreeBranchMenu, { node: branchMenu, model: model, onClose: () => setBranchMenu(undefined) })) : null,
|
|
92
|
+
toggleNodeMenu?.id ? (React.createElement(TreeNodeMenu, { node: toggleNodeMenu, model: model, onClose: () => setToggleNodeMenu(undefined) })) : null,
|
|
95
93
|
React.createElement("canvas", { width: w2, height: h2, style: style, onMouseMove: event => {
|
|
96
94
|
if (!ref.current) {
|
|
97
95
|
return;
|
|
@@ -102,11 +100,11 @@ const TreeCanvasBlock = observer(function ({ model, offsetY, }) {
|
|
|
102
100
|
}, onClick: event => {
|
|
103
101
|
const { clientX: x, clientY: y } = event;
|
|
104
102
|
const data = hoverBranchClickMap(event);
|
|
105
|
-
if (data
|
|
103
|
+
if (data?.id) {
|
|
106
104
|
setBranchMenu({ ...data, x, y });
|
|
107
105
|
}
|
|
108
106
|
const data2 = hoverNameClickMap(event);
|
|
109
|
-
if (data2
|
|
107
|
+
if (data2?.id) {
|
|
110
108
|
setToggleNodeMenu({ ...data2, x, y });
|
|
111
109
|
}
|
|
112
110
|
}, onMouseLeave: () => setHoverElt(undefined), ref: vref }),
|