react-msaview 4.4.4 → 4.4.6
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 +111 -111
- package/bundle/index.js.LICENSE.txt +24 -6
- package/bundle/index.js.map +1 -1
- package/dist/components/dialogs/InterProScanDialog.js +1 -1
- package/dist/components/dialogs/InterProScanDialog.js.map +1 -1
- package/dist/components/dialogs/SettingsDialog.js +1 -1
- package/dist/components/dialogs/SettingsDialog.js.map +1 -1
- package/dist/components/msa/MSACanvasBlock.js +8 -1
- package/dist/components/msa/MSACanvasBlock.js.map +1 -1
- package/dist/components/msa/renderMSABlock.js +22 -4
- package/dist/components/msa/renderMSABlock.js.map +1 -1
- package/dist/components/msa/renderMSAMouseover.js +21 -1
- package/dist/components/msa/renderMSAMouseover.js.map +1 -1
- package/dist/components/tree/TreeCanvas.js +61 -2
- package/dist/components/tree/TreeCanvas.js.map +1 -1
- package/dist/components/tree/TreeCanvasBlock.js +56 -5
- package/dist/components/tree/TreeCanvasBlock.js.map +1 -1
- package/dist/components/tree/TreeNodeMenu.js +6 -2
- package/dist/components/tree/TreeNodeMenu.js.map +1 -1
- package/dist/components/tree/renderTreeCanvas.d.ts +14 -4
- package/dist/components/tree/renderTreeCanvas.js +3 -0
- package/dist/components/tree/renderTreeCanvas.js.map +1 -1
- package/dist/components/util.js +1 -1
- package/dist/components/util.js.map +1 -1
- package/dist/layout.d.ts +4 -1
- package/dist/layout.js +30 -8
- package/dist/layout.js.map +1 -1
- package/dist/model/treeModel.js +2 -2
- package/dist/model/treeModel.js.map +1 -1
- package/dist/model.d.ts +14 -79
- package/dist/model.js +94 -4
- package/dist/model.js.map +1 -1
- package/dist/rowCoordinateCalculations.js +1 -5
- package/dist/rowCoordinateCalculations.js.map +1 -1
- package/dist/rowCoordinateCalculations.test.js +14 -2
- package/dist/rowCoordinateCalculations.test.js.map +1 -1
- package/dist/seqCoordToRowSpecificGlobalCoord.js +9 -5
- package/dist/seqCoordToRowSpecificGlobalCoord.js.map +1 -1
- package/dist/seqCoordToRowSpecificGlobalCoord.test.js +6 -6
- package/dist/version.d.ts +1 -1
- package/dist/version.js +1 -1
- package/package.json +3 -2
- package/src/components/dialogs/InterProScanDialog.tsx +1 -1
- package/src/components/dialogs/SettingsDialog.tsx +1 -1
- package/src/components/msa/MSACanvasBlock.tsx +8 -1
- package/src/components/msa/renderMSABlock.ts +32 -2
- package/src/components/msa/renderMSAMouseover.ts +26 -0
- package/src/components/tree/TreeCanvas.tsx +76 -1
- package/src/components/tree/TreeCanvasBlock.tsx +69 -5
- package/src/components/tree/TreeNodeMenu.tsx +12 -1
- package/src/components/tree/renderTreeCanvas.ts +20 -4
- package/src/components/util.ts +1 -1
- package/src/layout.ts +48 -8
- package/src/model/treeModel.ts +2 -2
- package/src/model.ts +108 -5
- package/src/rowCoordinateCalculations.test.ts +15 -2
- package/src/rowCoordinateCalculations.ts +1 -5
- package/src/seqCoordToRowSpecificGlobalCoord.test.ts +6 -6
- package/src/seqCoordToRowSpecificGlobalCoord.ts +9 -4
- package/src/version.ts +1 -1
- package/dist/DataModel.d.ts +0 -34
- package/dist/DataModel.js +0 -46
- package/dist/DataModel.js.map +0 -1
- package/dist/DialogQueue.d.ts +0 -25
- package/dist/DialogQueue.js +0 -44
- package/dist/DialogQueue.js.map +0 -1
- package/dist/SelectedStructuresMixin.d.ts +0 -46
- package/dist/SelectedStructuresMixin.js +0 -52
- package/dist/SelectedStructuresMixin.js.map +0 -1
- package/dist/StructureModel.d.ts +0 -9
- package/dist/StructureModel.js +0 -11
- package/dist/StructureModel.js.map +0 -1
- package/dist/UniprotTrack.d.ts +0 -27
- package/dist/UniprotTrack.js +0 -53
- package/dist/UniprotTrack.js.map +0 -1
- package/dist/components/BoxTrack.d.ts +0 -7
- package/dist/components/BoxTrack.js +0 -15
- package/dist/components/BoxTrack.js.map +0 -1
- package/dist/components/BoxTrackBlock.d.ts +0 -8
- package/dist/components/BoxTrackBlock.js +0 -136
- package/dist/components/BoxTrackBlock.js.map +0 -1
- package/dist/components/ExportSVGDialog.d.ts +0 -6
- package/dist/components/ExportSVGDialog.js +0 -39
- package/dist/components/ExportSVGDialog.js.map +0 -1
- package/dist/components/Header.d.ts +0 -6
- package/dist/components/Header.js +0 -62
- package/dist/components/Header.js.map +0 -1
- package/dist/components/HeaderInfoArea.d.ts +0 -6
- package/dist/components/HeaderInfoArea.js +0 -12
- package/dist/components/HeaderInfoArea.js.map +0 -1
- package/dist/components/ImportForm/ImportFormExamples.d.ts +0 -6
- package/dist/components/ImportForm/ImportFormExamples.js +0 -50
- package/dist/components/ImportForm/ImportFormExamples.js.map +0 -1
- package/dist/components/ImportForm/data/seq2.d.ts +0 -3
- package/dist/components/ImportForm/data/seq2.js +0 -33
- package/dist/components/ImportForm/data/seq2.js.map +0 -1
- package/dist/components/ImportForm/index.d.ts +0 -6
- package/dist/components/ImportForm/index.js +0 -31
- package/dist/components/ImportForm/index.js.map +0 -1
- package/dist/components/ImportForm/util.d.ts +0 -3
- package/dist/components/ImportForm/util.js +0 -16
- package/dist/components/ImportForm/util.js.map +0 -1
- package/dist/components/MSACanvas.d.ts +0 -6
- package/dist/components/MSACanvas.js +0 -141
- package/dist/components/MSACanvas.js.map +0 -1
- package/dist/components/MSAPanel/Loading.d.ts +0 -2
- package/dist/components/MSAPanel/Loading.js +0 -12
- package/dist/components/MSAPanel/Loading.js.map +0 -1
- package/dist/components/MSAPanel/MSABlock.d.ts +0 -8
- package/dist/components/MSAPanel/MSABlock.js +0 -62
- package/dist/components/MSAPanel/MSABlock.js.map +0 -1
- package/dist/components/MSAPanel/MSACanvas.d.ts +0 -7
- package/dist/components/MSAPanel/MSACanvas.js +0 -69
- package/dist/components/MSAPanel/MSACanvas.js.map +0 -1
- package/dist/components/MSAPanel/MSAMouseoverCanvas.d.ts +0 -6
- package/dist/components/MSAPanel/MSAMouseoverCanvas.js +0 -27
- package/dist/components/MSAPanel/MSAMouseoverCanvas.js.map +0 -1
- package/dist/components/MSAPanel/index.d.ts +0 -5
- package/dist/components/MSAPanel/index.js +0 -9
- package/dist/components/MSAPanel/index.js.map +0 -1
- package/dist/components/MSAPanel/renderMSABlock.d.ts +0 -9
- package/dist/components/MSAPanel/renderMSABlock.js +0 -89
- package/dist/components/MSAPanel/renderMSABlock.js.map +0 -1
- package/dist/components/MSAPanel/renderMSABlock_BACKUP_139826.d.ts +0 -9
- package/dist/components/MSAPanel/renderMSABlock_BACKUP_139826.js +0 -89
- package/dist/components/MSAPanel/renderMSABlock_BACKUP_139826.js.map +0 -1
- package/dist/components/MSAPanel/renderMSABlock_BASE_139826.d.ts +0 -13
- package/dist/components/MSAPanel/renderMSABlock_BASE_139826.js +0 -82
- package/dist/components/MSAPanel/renderMSABlock_BASE_139826.js.map +0 -1
- package/dist/components/MSAPanel/renderMSABlock_LOCAL_139826.d.ts +0 -9
- package/dist/components/MSAPanel/renderMSABlock_LOCAL_139826.js +0 -89
- package/dist/components/MSAPanel/renderMSABlock_LOCAL_139826.js.map +0 -1
- package/dist/components/MSAPanel/renderMSABlock_REMOTE_139826.d.ts +0 -0
- package/dist/components/MSAPanel/renderMSABlock_REMOTE_139826.js +0 -2
- package/dist/components/MSAPanel/renderMSABlock_REMOTE_139826.js.map +0 -1
- package/dist/components/MSAPanel/renderMSAMouseover.d.ts +0 -5
- package/dist/components/MSAPanel/renderMSAMouseover.js +0 -30
- package/dist/components/MSAPanel/renderMSAMouseover.js.map +0 -1
- package/dist/components/Minimap.d.ts +0 -6
- package/dist/components/Minimap.js +0 -72
- package/dist/components/Minimap.js.map +0 -1
- package/dist/components/MinimapSVG.d.ts +0 -6
- package/dist/components/MinimapSVG.js +0 -25
- package/dist/components/MinimapSVG.js.map +0 -1
- package/dist/components/MultiAlignmentSelector.d.ts +0 -6
- package/dist/components/MultiAlignmentSelector.js +0 -13
- package/dist/components/MultiAlignmentSelector.js.map +0 -1
- package/dist/components/TreePanel/TreeBranchMenu.d.ts +0 -14
- package/dist/components/TreePanel/TreeBranchMenu.js +0 -26
- package/dist/components/TreePanel/TreeBranchMenu.js.map +0 -1
- package/dist/components/TreePanel/TreeCanvas.d.ts +0 -6
- package/dist/components/TreePanel/TreeCanvas.js +0 -100
- package/dist/components/TreePanel/TreeCanvas.js.map +0 -1
- package/dist/components/TreePanel/TreeCanvasBlock.d.ts +0 -7
- package/dist/components/TreePanel/TreeCanvasBlock.js +0 -118
- package/dist/components/TreePanel/TreeCanvasBlock.js.map +0 -1
- package/dist/components/TreePanel/TreeNodeMenu.d.ts +0 -13
- package/dist/components/TreePanel/TreeNodeMenu.js +0 -74
- package/dist/components/TreePanel/TreeNodeMenu.js.map +0 -1
- package/dist/components/TreePanel/TreeRuler.d.ts +0 -6
- package/dist/components/TreePanel/TreeRuler.js +0 -8
- package/dist/components/TreePanel/TreeRuler.js.map +0 -1
- package/dist/components/TreePanel/dialogs/TreeNodeInfoDialog.d.ts +0 -9
- package/dist/components/TreePanel/dialogs/TreeNodeInfoDialog.js +0 -16
- package/dist/components/TreePanel/dialogs/TreeNodeInfoDialog.js.map +0 -1
- package/dist/components/TreePanel/index.d.ts +0 -6
- package/dist/components/TreePanel/index.js +0 -10
- package/dist/components/TreePanel/index.js.map +0 -1
- package/dist/components/TreePanel/renderTreeCanvas.d.ts +0 -46
- package/dist/components/TreePanel/renderTreeCanvas.js +0 -180
- package/dist/components/TreePanel/renderTreeCanvas.js.map +0 -1
- package/dist/components/VerticalGuide.d.ts +0 -7
- package/dist/components/VerticalGuide.js +0 -30
- package/dist/components/VerticalGuide.js.map +0 -1
- package/dist/components/ZoomControls.d.ts +0 -6
- package/dist/components/ZoomControls.js +0 -59
- package/dist/components/ZoomControls.js.map +0 -1
- package/dist/components/msa/MSACanvas_BACKUP_139826.d.ts +0 -7
- package/dist/components/msa/MSACanvas_BACKUP_139826.js +0 -68
- package/dist/components/msa/MSACanvas_BACKUP_139826.js.map +0 -1
- package/dist/components/msa/MSACanvas_BASE_139826.d.ts +0 -6
- package/dist/components/msa/MSACanvas_BASE_139826.js +0 -107
- package/dist/components/msa/MSACanvas_BASE_139826.js.map +0 -1
- package/dist/components/msa/MSACanvas_LOCAL_139826.d.ts +0 -7
- package/dist/components/msa/MSACanvas_LOCAL_139826.js +0 -69
- package/dist/components/msa/MSACanvas_LOCAL_139826.js.map +0 -1
- package/dist/components/msa/MSACanvas_REMOTE_139826.d.ts +0 -6
- package/dist/components/msa/MSACanvas_REMOTE_139826.js +0 -106
- package/dist/components/msa/MSACanvas_REMOTE_139826.js.map +0 -1
- package/dist/sansserif.d.ts +0 -3
- package/dist/sansserif.js +0 -1583
- package/dist/sansserif.js.map +0 -1
|
@@ -1,59 +0,0 @@
|
|
|
1
|
-
import React, { Suspense, lazy, useState } from 'react';
|
|
2
|
-
import { IconButton } from '@mui/material';
|
|
3
|
-
import { observer } from 'mobx-react';
|
|
4
|
-
import CascadingMenuButton from '@jbrowse/core/ui/CascadingMenuButton';
|
|
5
|
-
// icons
|
|
6
|
-
import MoreVert from '@mui/icons-material/MoreVert';
|
|
7
|
-
import ZoomIn from '@mui/icons-material/ZoomIn';
|
|
8
|
-
import ZoomOut from '@mui/icons-material/ZoomOut';
|
|
9
|
-
// lazies
|
|
10
|
-
const ExportSVGDialog = lazy(() => import('./ExportSVGDialog'));
|
|
11
|
-
const ZoomControls = observer(function ZoomControls({ model, }) {
|
|
12
|
-
const { colWidth, rowHeight } = model;
|
|
13
|
-
const [exportSvgDialogOpen, setExportSvgDialogOpen] = useState(false);
|
|
14
|
-
return (React.createElement(React.Fragment, null,
|
|
15
|
-
React.createElement(IconButton, { onClick: () => {
|
|
16
|
-
model.setColWidth(Math.ceil(colWidth * 1.5));
|
|
17
|
-
model.setRowHeight(Math.ceil(rowHeight * 1.5));
|
|
18
|
-
} },
|
|
19
|
-
React.createElement(ZoomIn, null)),
|
|
20
|
-
React.createElement(IconButton, { onClick: () => {
|
|
21
|
-
model.setColWidth(Math.max(1, Math.floor(colWidth * 0.75)));
|
|
22
|
-
model.setRowHeight(Math.max(1.5, Math.floor(rowHeight * 0.75)));
|
|
23
|
-
} },
|
|
24
|
-
React.createElement(ZoomOut, null)),
|
|
25
|
-
React.createElement(CascadingMenuButton, { menuItems: [
|
|
26
|
-
{
|
|
27
|
-
label: 'Decrease row height',
|
|
28
|
-
onClick: () => model.setRowHeight(Math.max(1.5, rowHeight * 0.75)),
|
|
29
|
-
},
|
|
30
|
-
{
|
|
31
|
-
label: 'Increase row height',
|
|
32
|
-
onClick: () => model.setRowHeight(rowHeight * 1.5),
|
|
33
|
-
},
|
|
34
|
-
{
|
|
35
|
-
label: 'Decrease col width',
|
|
36
|
-
onClick: () => model.setColWidth(Math.max(1, colWidth * 0.75)),
|
|
37
|
-
},
|
|
38
|
-
{
|
|
39
|
-
label: 'Increase col width',
|
|
40
|
-
onClick: () => model.setColWidth(colWidth * 1.5),
|
|
41
|
-
},
|
|
42
|
-
{
|
|
43
|
-
label: 'Reset zoom to default',
|
|
44
|
-
onClick: () => {
|
|
45
|
-
model.setColWidth(16);
|
|
46
|
-
model.setRowHeight(20);
|
|
47
|
-
},
|
|
48
|
-
},
|
|
49
|
-
{
|
|
50
|
-
label: 'Export SVG',
|
|
51
|
-
onClick: () => setExportSvgDialogOpen(true),
|
|
52
|
-
},
|
|
53
|
-
] },
|
|
54
|
-
React.createElement(MoreVert, null)),
|
|
55
|
-
exportSvgDialogOpen ? (React.createElement(Suspense, { fallback: null },
|
|
56
|
-
React.createElement(ExportSVGDialog, { model: model, onClose: () => setExportSvgDialogOpen(false) }))) : null));
|
|
57
|
-
});
|
|
58
|
-
export default ZoomControls;
|
|
59
|
-
//# sourceMappingURL=ZoomControls.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ZoomControls.js","sourceRoot":"","sources":["../../src/components/ZoomControls.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,68 +0,0 @@
|
|
|
1
|
-
import 'pixi.js/text-bitmap';
|
|
2
|
-
import React, { useEffect, useMemo, useRef, useState } from 'react';
|
|
3
|
-
import { observer } from 'mobx-react';
|
|
4
|
-
import { ErrorMessage } from '@jbrowse/core/ui';
|
|
5
|
-
import { useTheme } from '@mui/material';
|
|
6
|
-
import { Application } from 'pixi.js';
|
|
7
|
-
import { renderMSABlock } from './renderMSABlock';
|
|
8
|
-
import { colorContrast } from '../../util';
|
|
9
|
-
const MSACanvas = observer(function MSACanvas2({ model, }) {
|
|
10
|
-
const { colorScheme, msaAreaWidth, height } = model;
|
|
11
|
-
const ref = useRef(null);
|
|
12
|
-
const [error, setError] = useState();
|
|
13
|
-
const theme = useTheme();
|
|
14
|
-
const contrastScheme = useMemo(() => colorContrast(colorScheme, theme), [colorScheme, theme]);
|
|
15
|
-
useEffect(() => {
|
|
16
|
-
// eslint-disable-next-line @typescript-eslint/no-floating-promises
|
|
17
|
-
;
|
|
18
|
-
(async () => {
|
|
19
|
-
try {
|
|
20
|
-
if (!ref.current) {
|
|
21
|
-
return;
|
|
22
|
-
}
|
|
23
|
-
const app = new Application();
|
|
24
|
-
await app.init({
|
|
25
|
-
width: msaAreaWidth,
|
|
26
|
-
height,
|
|
27
|
-
canvas: ref.current,
|
|
28
|
-
resizeTo: ref.current,
|
|
29
|
-
});
|
|
30
|
-
const letters = [];
|
|
31
|
-
// for (const letter of 'ABCDEFGHIJKLMNOPQRSTUVWXYZ') {
|
|
32
|
-
// const x = new BitmapText({
|
|
33
|
-
// text: letter,
|
|
34
|
-
// x: msaAreaWidth * Math.random(),
|
|
35
|
-
// y: height * Math.random(),
|
|
36
|
-
// style: {
|
|
37
|
-
// fontFamily: 'Arial',
|
|
38
|
-
// fontSize: 20,
|
|
39
|
-
// },
|
|
40
|
-
// })
|
|
41
|
-
// letters.push(x)
|
|
42
|
-
// app.stage.addChild(x)
|
|
43
|
-
// }
|
|
44
|
-
// Add a ticker callback to move the sprite back and forth
|
|
45
|
-
// app.ticker.add(ticker => {
|
|
46
|
-
// for (const elt of letters) {
|
|
47
|
-
// elt.updateTransform({
|
|
48
|
-
// x: elt.x + (Math.random() - 0.5) * 1,
|
|
49
|
-
// y: elt.y + (Math.random() - 0.5) * 1,
|
|
50
|
-
// })
|
|
51
|
-
// }
|
|
52
|
-
// })
|
|
53
|
-
renderMSABlock({ app, contrastScheme, theme, model });
|
|
54
|
-
}
|
|
55
|
-
catch (e) {
|
|
56
|
-
setError(e);
|
|
57
|
-
console.error(e);
|
|
58
|
-
}
|
|
59
|
-
})();
|
|
60
|
-
}, [height, model, theme, contrastScheme, msaAreaWidth]);
|
|
61
|
-
const e = error;
|
|
62
|
-
return e ? (React.createElement(ErrorMessage, { error: e })) : (React.createElement("canvas", { onWheel: event => {
|
|
63
|
-
model.setScrollX(model.scrollX - event.deltaX);
|
|
64
|
-
model.setScrollY(model.scrollY - event.deltaY);
|
|
65
|
-
}, width: msaAreaWidth, height: height, ref: ref }));
|
|
66
|
-
});
|
|
67
|
-
export default MSACanvas;
|
|
68
|
-
//# sourceMappingURL=MSACanvas_BACKUP_139826.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"MSACanvas_BACKUP_139826.js","sourceRoot":"","sources":["../../../src/components/msa/MSACanvas_BACKUP_139826.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,107 +0,0 @@
|
|
|
1
|
-
import React, { useEffect, useState, useRef } from 'react';
|
|
2
|
-
import { observer } from 'mobx-react';
|
|
3
|
-
import normalizeWheel from 'normalize-wheel';
|
|
4
|
-
import MSABlock from './MSABlock';
|
|
5
|
-
import Loading from './Loading';
|
|
6
|
-
const MSACanvas = observer(function ({ model }) {
|
|
7
|
-
const { MSA, msaFilehandle, height, msaAreaWidth, blocks2d } = model;
|
|
8
|
-
const ref = useRef(null);
|
|
9
|
-
// wheel
|
|
10
|
-
const scheduled = useRef(false);
|
|
11
|
-
const deltaX = useRef(0);
|
|
12
|
-
const deltaY = useRef(0);
|
|
13
|
-
// mouse click-and-drag scrolling
|
|
14
|
-
const prevX = useRef(0);
|
|
15
|
-
const prevY = useRef(0);
|
|
16
|
-
const [mouseDragging, setMouseDragging] = useState(false);
|
|
17
|
-
useEffect(() => {
|
|
18
|
-
const curr = ref.current;
|
|
19
|
-
if (!curr) {
|
|
20
|
-
return;
|
|
21
|
-
}
|
|
22
|
-
function onWheel(origEvent) {
|
|
23
|
-
const event = normalizeWheel(origEvent);
|
|
24
|
-
deltaX.current += event.pixelX;
|
|
25
|
-
deltaY.current += event.pixelY;
|
|
26
|
-
if (!scheduled.current) {
|
|
27
|
-
scheduled.current = true;
|
|
28
|
-
requestAnimationFrame(() => {
|
|
29
|
-
model.doScrollX(-deltaX.current);
|
|
30
|
-
model.doScrollY(-deltaY.current);
|
|
31
|
-
deltaX.current = 0;
|
|
32
|
-
deltaY.current = 0;
|
|
33
|
-
scheduled.current = false;
|
|
34
|
-
});
|
|
35
|
-
}
|
|
36
|
-
origEvent.preventDefault();
|
|
37
|
-
}
|
|
38
|
-
curr.addEventListener('wheel', onWheel);
|
|
39
|
-
return () => {
|
|
40
|
-
curr.removeEventListener('wheel', onWheel);
|
|
41
|
-
};
|
|
42
|
-
}, [model]);
|
|
43
|
-
useEffect(() => {
|
|
44
|
-
let cleanup = () => { };
|
|
45
|
-
function globalMouseMove(event) {
|
|
46
|
-
event.preventDefault();
|
|
47
|
-
const currX = event.clientX;
|
|
48
|
-
const currY = event.clientY;
|
|
49
|
-
const distanceX = currX - prevX.current;
|
|
50
|
-
const distanceY = currY - prevY.current;
|
|
51
|
-
if (distanceX || distanceY) {
|
|
52
|
-
// use rAF to make it so multiple event handlers aren't fired per-frame
|
|
53
|
-
// see https://calendar.perfplanet.com/2013/the-runtime-performance-checklist/
|
|
54
|
-
if (!scheduled.current) {
|
|
55
|
-
scheduled.current = true;
|
|
56
|
-
window.requestAnimationFrame(() => {
|
|
57
|
-
model.doScrollX(distanceX);
|
|
58
|
-
model.doScrollY(distanceY);
|
|
59
|
-
scheduled.current = false;
|
|
60
|
-
prevX.current = event.clientX;
|
|
61
|
-
prevY.current = event.clientY;
|
|
62
|
-
});
|
|
63
|
-
}
|
|
64
|
-
}
|
|
65
|
-
}
|
|
66
|
-
function globalMouseUp() {
|
|
67
|
-
prevX.current = 0;
|
|
68
|
-
if (mouseDragging) {
|
|
69
|
-
setMouseDragging(false);
|
|
70
|
-
}
|
|
71
|
-
}
|
|
72
|
-
if (mouseDragging) {
|
|
73
|
-
window.addEventListener('mousemove', globalMouseMove, true);
|
|
74
|
-
window.addEventListener('mouseup', globalMouseUp, true);
|
|
75
|
-
cleanup = () => {
|
|
76
|
-
window.removeEventListener('mousemove', globalMouseMove, true);
|
|
77
|
-
window.removeEventListener('mouseup', globalMouseUp, true);
|
|
78
|
-
};
|
|
79
|
-
}
|
|
80
|
-
return cleanup;
|
|
81
|
-
}, [model, mouseDragging]);
|
|
82
|
-
return (React.createElement("div", { ref: ref, onMouseDown: event => {
|
|
83
|
-
// check if clicking a draggable element or a resize handle
|
|
84
|
-
const target = event.target;
|
|
85
|
-
if (target.draggable || target.dataset.resizer) {
|
|
86
|
-
return;
|
|
87
|
-
}
|
|
88
|
-
// otherwise do click and drag scroll
|
|
89
|
-
if (event.button === 0) {
|
|
90
|
-
prevX.current = event.clientX;
|
|
91
|
-
prevY.current = event.clientY;
|
|
92
|
-
setMouseDragging(true);
|
|
93
|
-
}
|
|
94
|
-
}, onMouseUp: event => {
|
|
95
|
-
event.preventDefault();
|
|
96
|
-
setMouseDragging(false);
|
|
97
|
-
}, onMouseLeave: event => {
|
|
98
|
-
event.preventDefault();
|
|
99
|
-
}, style: {
|
|
100
|
-
position: 'relative',
|
|
101
|
-
height,
|
|
102
|
-
width: msaAreaWidth,
|
|
103
|
-
overflow: 'hidden',
|
|
104
|
-
} }, !MSA && !msaFilehandle ? null : !MSA ? (React.createElement(Loading, null)) : (blocks2d.map(([bx, by]) => (React.createElement(MSABlock, { key: `${bx}_${by}`, model: model, offsetX: bx, offsetY: by }))))));
|
|
105
|
-
});
|
|
106
|
-
export default MSACanvas;
|
|
107
|
-
//# sourceMappingURL=MSACanvas_BASE_139826.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"MSACanvas_BASE_139826.js","sourceRoot":"","sources":["../../../src/components/msa/MSACanvas_BASE_139826.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,69 +0,0 @@
|
|
|
1
|
-
import 'pixi.js/text-bitmap';
|
|
2
|
-
import React, { useEffect, useMemo, useRef, useState } from 'react';
|
|
3
|
-
import { observer } from 'mobx-react';
|
|
4
|
-
import { ErrorMessage } from '@jbrowse/core/ui';
|
|
5
|
-
import { useTheme } from '@mui/material';
|
|
6
|
-
import { Application } from 'pixi.js';
|
|
7
|
-
import { renderMSABlock } from './renderMSABlock';
|
|
8
|
-
import { colorContrast } from '../../util';
|
|
9
|
-
// Helper Component to ensure assets are loaded for docusaurus live examples
|
|
10
|
-
const MSACanvas = observer(function MSACanvas2({ model, }) {
|
|
11
|
-
const { colorScheme, msaAreaWidth, height } = model;
|
|
12
|
-
const ref = useRef(null);
|
|
13
|
-
const [error, setError] = useState();
|
|
14
|
-
const theme = useTheme();
|
|
15
|
-
const contrastScheme = useMemo(() => colorContrast(colorScheme, theme), [colorScheme, theme]);
|
|
16
|
-
useEffect(() => {
|
|
17
|
-
// eslint-disable-next-line @typescript-eslint/no-floating-promises
|
|
18
|
-
;
|
|
19
|
-
(async () => {
|
|
20
|
-
try {
|
|
21
|
-
if (!ref.current) {
|
|
22
|
-
return;
|
|
23
|
-
}
|
|
24
|
-
const app = new Application();
|
|
25
|
-
await app.init({
|
|
26
|
-
width: msaAreaWidth,
|
|
27
|
-
height,
|
|
28
|
-
canvas: ref.current,
|
|
29
|
-
resizeTo: ref.current,
|
|
30
|
-
});
|
|
31
|
-
const letters = [];
|
|
32
|
-
// for (const letter of 'ABCDEFGHIJKLMNOPQRSTUVWXYZ') {
|
|
33
|
-
// const x = new BitmapText({
|
|
34
|
-
// text: letter,
|
|
35
|
-
// x: msaAreaWidth * Math.random(),
|
|
36
|
-
// y: height * Math.random(),
|
|
37
|
-
// style: {
|
|
38
|
-
// fontFamily: 'Arial',
|
|
39
|
-
// fontSize: 20,
|
|
40
|
-
// },
|
|
41
|
-
// })
|
|
42
|
-
// letters.push(x)
|
|
43
|
-
// app.stage.addChild(x)
|
|
44
|
-
// }
|
|
45
|
-
// Add a ticker callback to move the sprite back and forth
|
|
46
|
-
// app.ticker.add(ticker => {
|
|
47
|
-
// for (const elt of letters) {
|
|
48
|
-
// elt.updateTransform({
|
|
49
|
-
// x: elt.x + (Math.random() - 0.5) * 1,
|
|
50
|
-
// y: elt.y + (Math.random() - 0.5) * 1,
|
|
51
|
-
// })
|
|
52
|
-
// }
|
|
53
|
-
// })
|
|
54
|
-
renderMSABlock({ app, contrastScheme, theme, model });
|
|
55
|
-
}
|
|
56
|
-
catch (e) {
|
|
57
|
-
setError(e);
|
|
58
|
-
console.error(e);
|
|
59
|
-
}
|
|
60
|
-
})();
|
|
61
|
-
}, [height, model, theme, contrastScheme, msaAreaWidth]);
|
|
62
|
-
const e = error;
|
|
63
|
-
return e ? (React.createElement(ErrorMessage, { error: e })) : (React.createElement("canvas", { onWheel: event => {
|
|
64
|
-
model.setScrollX(model.scrollX - event.deltaX);
|
|
65
|
-
model.setScrollY(model.scrollY - event.deltaY);
|
|
66
|
-
}, width: msaAreaWidth, height: height, ref: ref }));
|
|
67
|
-
});
|
|
68
|
-
export default MSACanvas;
|
|
69
|
-
//# sourceMappingURL=MSACanvas_LOCAL_139826.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"MSACanvas_LOCAL_139826.js","sourceRoot":"","sources":["../../../src/components/msa/MSACanvas_LOCAL_139826.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,106 +0,0 @@
|
|
|
1
|
-
import React, { useEffect, useRef, useState } from 'react';
|
|
2
|
-
import { observer } from 'mobx-react';
|
|
3
|
-
import Loading from './Loading';
|
|
4
|
-
import MSACanvasBlock from './MSACanvasBlock';
|
|
5
|
-
const MSACanvas = observer(function ({ model }) {
|
|
6
|
-
const { MSA, verticalScrollbarWidth, msaFilehandle, height, msaAreaWidth, blocks2d, } = model;
|
|
7
|
-
const ref = useRef(null);
|
|
8
|
-
// wheel
|
|
9
|
-
const scheduled = useRef(false);
|
|
10
|
-
const deltaX = useRef(0);
|
|
11
|
-
const deltaY = useRef(0);
|
|
12
|
-
// mouse click-and-drag scrolling
|
|
13
|
-
const prevX = useRef(0);
|
|
14
|
-
const prevY = useRef(0);
|
|
15
|
-
const [mouseDragging, setMouseDragging] = useState(false);
|
|
16
|
-
useEffect(() => {
|
|
17
|
-
const curr = ref.current;
|
|
18
|
-
if (!curr) {
|
|
19
|
-
return;
|
|
20
|
-
}
|
|
21
|
-
function onWheel(event) {
|
|
22
|
-
deltaX.current += event.deltaX;
|
|
23
|
-
deltaY.current += event.deltaY;
|
|
24
|
-
if (!scheduled.current) {
|
|
25
|
-
scheduled.current = true;
|
|
26
|
-
requestAnimationFrame(() => {
|
|
27
|
-
model.doScrollX(-deltaX.current);
|
|
28
|
-
model.doScrollY(-deltaY.current);
|
|
29
|
-
deltaX.current = 0;
|
|
30
|
-
deltaY.current = 0;
|
|
31
|
-
scheduled.current = false;
|
|
32
|
-
});
|
|
33
|
-
}
|
|
34
|
-
event.preventDefault();
|
|
35
|
-
event.stopPropagation();
|
|
36
|
-
}
|
|
37
|
-
curr.addEventListener('wheel', onWheel, { passive: false });
|
|
38
|
-
return () => {
|
|
39
|
-
curr.removeEventListener('wheel', onWheel);
|
|
40
|
-
};
|
|
41
|
-
}, [model]);
|
|
42
|
-
useEffect(() => {
|
|
43
|
-
let cleanup = () => { };
|
|
44
|
-
function globalMouseMove(event) {
|
|
45
|
-
event.preventDefault();
|
|
46
|
-
const currX = event.clientX;
|
|
47
|
-
const currY = event.clientY;
|
|
48
|
-
const distanceX = currX - prevX.current;
|
|
49
|
-
const distanceY = currY - prevY.current;
|
|
50
|
-
if (distanceX || distanceY) {
|
|
51
|
-
// use rAF to make it so multiple event handlers aren't fired per-frame
|
|
52
|
-
// see https://calendar.perfplanet.com/2013/the-runtime-performance-checklist/
|
|
53
|
-
if (!scheduled.current) {
|
|
54
|
-
scheduled.current = true;
|
|
55
|
-
window.requestAnimationFrame(() => {
|
|
56
|
-
model.doScrollX(distanceX);
|
|
57
|
-
model.doScrollY(distanceY);
|
|
58
|
-
scheduled.current = false;
|
|
59
|
-
prevX.current = event.clientX;
|
|
60
|
-
prevY.current = event.clientY;
|
|
61
|
-
});
|
|
62
|
-
}
|
|
63
|
-
}
|
|
64
|
-
}
|
|
65
|
-
function globalMouseUp() {
|
|
66
|
-
prevX.current = 0;
|
|
67
|
-
if (mouseDragging) {
|
|
68
|
-
setMouseDragging(false);
|
|
69
|
-
}
|
|
70
|
-
}
|
|
71
|
-
if (mouseDragging) {
|
|
72
|
-
window.addEventListener('mousemove', globalMouseMove, true);
|
|
73
|
-
window.addEventListener('mouseup', globalMouseUp, true);
|
|
74
|
-
cleanup = () => {
|
|
75
|
-
window.removeEventListener('mousemove', globalMouseMove, true);
|
|
76
|
-
window.removeEventListener('mouseup', globalMouseUp, true);
|
|
77
|
-
};
|
|
78
|
-
}
|
|
79
|
-
return cleanup;
|
|
80
|
-
}, [model, mouseDragging]);
|
|
81
|
-
return (React.createElement("div", { ref: ref, onMouseDown: event => {
|
|
82
|
-
// check if clicking a draggable element or a resize handle
|
|
83
|
-
const target = event.target;
|
|
84
|
-
if (target.draggable || target.dataset.resizer) {
|
|
85
|
-
return;
|
|
86
|
-
}
|
|
87
|
-
// otherwise do click and drag scroll
|
|
88
|
-
if (event.button === 0) {
|
|
89
|
-
prevX.current = event.clientX;
|
|
90
|
-
prevY.current = event.clientY;
|
|
91
|
-
setMouseDragging(true);
|
|
92
|
-
}
|
|
93
|
-
}, onMouseUp: event => {
|
|
94
|
-
event.preventDefault();
|
|
95
|
-
setMouseDragging(false);
|
|
96
|
-
}, onMouseLeave: event => {
|
|
97
|
-
event.preventDefault();
|
|
98
|
-
}, style: {
|
|
99
|
-
position: 'relative',
|
|
100
|
-
height,
|
|
101
|
-
width: msaAreaWidth - verticalScrollbarWidth,
|
|
102
|
-
overflow: 'hidden',
|
|
103
|
-
} }, !MSA && !msaFilehandle ? null : MSA ? (blocks2d.map(([bx, by]) => (React.createElement(MSACanvasBlock, { key: `${bx}_${by}`, model: model, offsetX: bx, offsetY: by })))) : (React.createElement(Loading, null))));
|
|
104
|
-
});
|
|
105
|
-
export default MSACanvas;
|
|
106
|
-
//# sourceMappingURL=MSACanvas_REMOTE_139826.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"MSACanvas_REMOTE_139826.js","sourceRoot":"","sources":["../../../src/components/msa/MSACanvas_REMOTE_139826.tsx"],"names":[],"mappings":"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"}
|
package/dist/sansserif.d.ts
DELETED