react-msaview 5.10.0 → 6.0.0
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 +99 -99
- package/bundle/index.js.map +4 -4
- package/dist/clustalX.js +22 -22
- package/dist/clustalX.js.map +1 -1
- package/dist/components/CopyButton.d.ts +9 -0
- package/dist/components/CopyButton.js +23 -0
- package/dist/components/CopyButton.js.map +1 -0
- package/dist/components/Loading.js +2 -2
- package/dist/components/Loading.js.map +1 -1
- package/dist/components/MSAView.js +2 -2
- package/dist/components/MSAView.js.map +1 -1
- package/dist/components/ResizeHandles.js +24 -40
- package/dist/components/ResizeHandles.js.map +1 -1
- package/dist/components/ScrollbarThumb.d.ts +14 -0
- package/dist/components/ScrollbarThumb.js +28 -0
- package/dist/components/ScrollbarThumb.js.map +1 -0
- package/dist/components/SequenceTextArea.js +3 -10
- package/dist/components/SequenceTextArea.js.map +1 -1
- package/dist/components/VerticalScrollbar.js +11 -25
- package/dist/components/VerticalScrollbar.js.map +1 -1
- package/dist/components/dialogs/FeatureDialog.js +3 -3
- package/dist/components/dialogs/FeatureDialog.js.map +1 -1
- package/dist/components/dialogs/{UserProvidedDomainsDialog.d.ts → InterProScanFileDialog.d.ts} +2 -2
- package/dist/components/dialogs/{UserProvidedDomainsDialog.js → InterProScanFileDialog.js} +6 -10
- package/dist/components/dialogs/InterProScanFileDialog.js.map +1 -0
- package/dist/components/dialogs/TrackInfoDialog.d.ts +2 -4
- package/dist/components/dialogs/TrackInfoDialog.js +8 -14
- package/dist/components/dialogs/TrackInfoDialog.js.map +1 -1
- package/dist/components/header/FileMenu.js +3 -3
- package/dist/components/header/FileMenu.js.map +1 -1
- package/dist/components/header/GappynessSlider.js +1 -1
- package/dist/components/header/GappynessSlider.js.map +1 -1
- package/dist/components/header/{getDomainsMenu.d.ts → getAnnotationsMenu.d.ts} +1 -1
- package/dist/components/header/{getDomainsMenu.js → getAnnotationsMenu.js} +10 -9
- package/dist/components/header/getAnnotationsMenu.js.map +1 -0
- package/dist/components/import/ImportForm.js +1 -1
- package/dist/components/import/ImportForm.js.map +1 -1
- package/dist/components/import/ImportFormExamples.js +66 -57
- package/dist/components/import/ImportFormExamples.js.map +1 -1
- package/dist/components/minimap/Minimap.js +11 -22
- package/dist/components/minimap/Minimap.js.map +1 -1
- package/dist/components/minimap/MinimapSVG.d.ts +2 -1
- package/dist/components/minimap/MinimapSVG.js +3 -4
- package/dist/components/minimap/MinimapSVG.js.map +1 -1
- package/dist/components/minimap/minimapLayout.d.ts +10 -1
- package/dist/components/minimap/minimapLayout.js +15 -10
- package/dist/components/minimap/minimapLayout.js.map +1 -1
- package/dist/components/msa/{DomainLegend.d.ts → AnnotationLegend.d.ts} +2 -2
- package/dist/components/msa/{DomainLegend.js → AnnotationLegend.js} +4 -4
- package/dist/components/msa/AnnotationLegend.js.map +1 -0
- package/dist/components/msa/MSACanvas.js +2 -2
- package/dist/components/msa/MSACanvas.js.map +1 -1
- package/dist/components/msa/MSAMouseoverCanvas.js +1 -2
- package/dist/components/msa/MSAMouseoverCanvas.js.map +1 -1
- package/dist/components/msa/MSAPanel.js +2 -2
- package/dist/components/msa/MSAPanel.js.map +1 -1
- package/dist/components/msa/domainBandCursor.d.ts +17 -0
- package/dist/components/msa/domainBandCursor.js +39 -0
- package/dist/components/msa/domainBandCursor.js.map +1 -0
- package/dist/components/msa/renderMSABlock.js +14 -20
- package/dist/components/msa/renderMSABlock.js.map +1 -1
- package/dist/components/msa/renderMSAMouseover.js +1 -2
- package/dist/components/msa/renderMSAMouseover.js.map +1 -1
- package/dist/components/tree/TreeRuler.js +5 -2
- package/dist/components/tree/TreeRuler.js.map +1 -1
- package/dist/ggplotPalettes.d.ts +0 -1
- package/dist/ggplotPalettes.js +0 -3
- package/dist/ggplotPalettes.js.map +1 -1
- package/dist/hierarchy.d.ts +2 -6
- package/dist/hierarchy.js +4 -6
- package/dist/hierarchy.js.map +1 -1
- package/dist/index.d.ts +2 -2
- package/dist/launchInterProScan.d.ts +0 -23
- package/dist/launchInterProScan.js +2 -5
- package/dist/launchInterProScan.js.map +1 -1
- package/dist/measureTextCanvas.js +21 -6
- package/dist/measureTextCanvas.js.map +1 -1
- package/dist/model.d.ts +50 -100
- package/dist/model.js +128 -107
- package/dist/model.js.map +1 -1
- package/dist/renderToSvg.js +2 -2
- package/dist/renderToSvg.js.map +1 -1
- package/dist/rowCoordinateCalculations.d.ts +13 -17
- package/dist/rowCoordinateCalculations.js +45 -39
- package/dist/rowCoordinateCalculations.js.map +1 -1
- package/dist/types.d.ts +4 -11
- package/dist/version.d.ts +1 -1
- package/dist/version.js +1 -1
- package/dist/version.js.map +1 -1
- package/package.json +5 -5
- package/src/clustalX.ts +22 -22
- package/src/colSpace.test.ts +27 -0
- package/src/components/CopyButton.tsx +44 -0
- package/src/components/Loading.tsx +10 -1
- package/src/components/MSAView.tsx +2 -3
- package/src/components/ResizeHandles.tsx +60 -69
- package/src/components/ScrollbarThumb.tsx +48 -0
- package/src/components/SequenceTextArea.tsx +3 -16
- package/src/components/VerticalScrollbar.tsx +19 -33
- package/src/components/dialogs/FeatureDialog.tsx +3 -4
- package/src/components/dialogs/{UserProvidedDomainsDialog.tsx → InterProScanFileDialog.tsx} +6 -14
- package/src/components/dialogs/TrackInfoDialog.tsx +18 -20
- package/src/components/header/FileMenu.tsx +3 -3
- package/src/components/header/GappynessSlider.tsx +4 -1
- package/src/components/header/{getDomainsMenu.ts → getAnnotationsMenu.ts} +10 -9
- package/src/components/import/ImportForm.tsx +1 -1
- package/src/components/import/ImportFormExamples.tsx +82 -133
- package/src/components/minimap/Minimap.tsx +23 -31
- package/src/components/minimap/MinimapSVG.tsx +32 -31
- package/src/components/minimap/minimapLayout.test.ts +60 -0
- package/src/components/minimap/minimapLayout.ts +15 -10
- package/src/components/msa/{DomainLegend.tsx → AnnotationLegend.tsx} +7 -3
- package/src/components/msa/MSACanvas.tsx +3 -10
- package/src/components/msa/MSAMouseoverCanvas.tsx +1 -3
- package/src/components/msa/MSAPanel.tsx +2 -2
- package/src/components/msa/domainBandCursor.ts +41 -0
- package/src/components/msa/renderMSABlock.ts +19 -23
- package/src/components/msa/renderMSAMouseover.ts +1 -3
- package/src/components/tree/TreeRuler.tsx +7 -2
- package/src/components/tree/renderTreeCanvas.test.ts +15 -7
- package/src/domainBands.test.ts +24 -0
- package/src/domainLetterColor.test.ts +80 -0
- package/src/ggplotPalettes.ts +0 -4
- package/src/hierarchy.test.ts +7 -7
- package/src/hierarchy.ts +6 -9
- package/src/index.ts +4 -1
- package/src/largeTree.test.ts +23 -2
- package/src/launchInterProScan.ts +3 -30
- package/src/loadErrorDisplay.test.tsx +102 -0
- package/src/measureTextCanvas.ts +22 -6
- package/src/model.ts +137 -115
- package/src/renderMinimapSvg.test.tsx +109 -0
- package/src/renderToSvg.tsx +2 -2
- package/src/rowCoordinateCalculations.ts +48 -44
- package/src/types.ts +10 -15
- package/src/version.ts +1 -1
- package/src/viewChrome.test.tsx +134 -0
- package/dist/components/dialogs/DomainDialog.d.ts +0 -6
- package/dist/components/dialogs/DomainDialog.js +0 -19
- package/dist/components/dialogs/DomainDialog.js.map +0 -1
- package/dist/components/dialogs/UserProvidedDomainsDialog.js.map +0 -1
- package/dist/components/header/SettingsMenu.d.ts +0 -6
- package/dist/components/header/SettingsMenu.js +0 -40
- package/dist/components/header/SettingsMenu.js.map +0 -1
- package/dist/components/header/getDomainsMenu.js.map +0 -1
- package/dist/components/msa/DomainLegend.js.map +0 -1
- package/src/components/dialogs/DomainDialog.tsx +0 -45
- package/src/components/header/SettingsMenu.tsx +0 -57
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TrackInfoDialog.js","sourceRoot":"","sources":["../../../src/components/dialogs/TrackInfoDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,
|
|
1
|
+
{"version":3,"file":"TrackInfoDialog.js","sourceRoot":"","sources":["../../../src/components/dialogs/TrackInfoDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAA;AACzC,OAAO,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAA;AACzD,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAChF,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,UAAU,MAAM,kBAAmB,CAAA;AAI1C,MAAM,SAAS,GAAG,UAAU,EAAE,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;IACvC,QAAQ,EAAE;QACR,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;QACzB,QAAQ,EAAE,MAAM;QAChB,UAAU,EAAE,MAAM;QAClB,SAAS,EAAE,YAAY;KACxB;CACF,CAAC,CAAC,CAAA;AAEH,MAAM,eAAe,GAAG,QAAQ,CAAC,UAAU,EACzC,KAAK,EACL,OAAO,GAIR;IACC,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,KAAK,CAAA;IAC5B,MAAM,EAAE,OAAO,EAAE,GAAG,SAAS,EAAE,CAAA;IAC/B,OAAO,CACL,oBAAC,MAAM,IACL,IAAI,QACJ,OAAO,EAAE,OAAO,EAChB,SAAS,QACT,QAAQ,EAAC,IAAI,EACb,KAAK,EAAE,gBAAgB,IAAI,EAAE;QAE7B,oBAAC,aAAa,QAGX,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,CACpB,oBAAC,UAAU,uCAA0C,CACtD,CAAC,CAAC,CAAC,CACF;YACE,oBAAC,UAAU,IAAC,IAAI,EAAE,IAAI,GAAI;YAC1B,6BAAK,SAAS,EAAE,OAAO,CAAC,QAAQ,IAAG,IAAI,CAAO,CAC7C,CACJ,CACa;QAChB,oBAAC,aAAa;YACZ,oBAAC,MAAM,IAAC,OAAO,EAAC,WAAW,EAAC,OAAO,EAAE,OAAO,EAAE,KAAK,EAAC,WAAW,YAEtD,CACK,CACT,CACV,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,eAAe,CAAA"}
|
|
@@ -5,7 +5,7 @@ import FolderOpen from '@mui/icons-material/FolderOpen';
|
|
|
5
5
|
import Menu from '@mui/icons-material/Menu';
|
|
6
6
|
import PhotoCamera from '@mui/icons-material/PhotoCamera';
|
|
7
7
|
import { observer } from 'mobx-react';
|
|
8
|
-
import {
|
|
8
|
+
import { getAnnotationsMenu } from './getAnnotationsMenu.js';
|
|
9
9
|
const MetadataDialog = lazy(() => import('../dialogs/MetadataDialog.js'));
|
|
10
10
|
const ExportSVGDialog = lazy(() => import('../dialogs/ExportSVGDialog.js'));
|
|
11
11
|
const FileMenu = observer(({ model }) => {
|
|
@@ -31,9 +31,9 @@ const FileMenu = observer(({ model }) => {
|
|
|
31
31
|
},
|
|
32
32
|
},
|
|
33
33
|
{
|
|
34
|
-
label: '
|
|
34
|
+
label: 'Annotations',
|
|
35
35
|
type: 'subMenu',
|
|
36
|
-
subMenu:
|
|
36
|
+
subMenu: getAnnotationsMenu({
|
|
37
37
|
model,
|
|
38
38
|
}),
|
|
39
39
|
},
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FileMenu.js","sourceRoot":"","sources":["../../../src/components/header/FileMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,IAAI,EAAE,MAAM,OAAO,CAAA;AAEnC,OAAO,mBAAmB,MAAM,sCAAsC,CAAA;AACtE,OAAO,UAAU,MAAM,gCAAgC,CAAA;AACvD,OAAO,UAAU,MAAM,gCAAgC,CAAA;AACvD,OAAO,IAAI,MAAM,0BAA0B,CAAA;AAC3C,OAAO,WAAW,MAAM,iCAAiC,CAAA;AACzD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"FileMenu.js","sourceRoot":"","sources":["../../../src/components/header/FileMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,IAAI,EAAE,MAAM,OAAO,CAAA;AAEnC,OAAO,mBAAmB,MAAM,sCAAsC,CAAA;AACtE,OAAO,UAAU,MAAM,gCAAgC,CAAA;AACvD,OAAO,UAAU,MAAM,gCAAgC,CAAA;AACvD,OAAO,IAAI,MAAM,0BAA0B,CAAA;AAC3C,OAAO,WAAW,MAAM,iCAAiC,CAAA;AACzD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAA;AAI5D,MAAM,cAAc,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC,MAAM,CAAC,8BAA+B,CAAC,CAAC,CAAA;AAC1E,MAAM,eAAe,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC,MAAM,CAAC,+BAAgC,CAAC,CAAC,CAAA;AAE5E,MAAM,QAAQ,GAAG,QAAQ,CAAC,CAAC,EAAE,KAAK,EAA2B,EAAE,EAAE;IAC/D,OAAO,CACL,oBAAC,mBAAmB,mBACN,WAAW,EACvB,OAAO,EAAC,MAAM,EACd,SAAS,EAAE;YACT;gBACE,KAAK,EAAE,uBAAuB;gBAC9B,IAAI,EAAE,UAAU;gBAChB,OAAO,EAAE,GAAG,EAAE;oBACZ,KAAK,CAAC,KAAK,EAAE,CAAA;gBACf,CAAC;aACF;YACD;gBACE,KAAK,EAAE,UAAU;gBACjB,IAAI,EAAE,UAAU;gBAChB,OAAO,EAAE,GAAG,EAAE;oBACZ,KAAK,CAAC,WAAW,CAAC,OAAO,CAAC,EAAE,CAAC;wBAC3B,cAAc;wBACd;4BACE,KAAK;4BACL,OAAO;yBACR;qBACF,CAAC,CAAA;gBACJ,CAAC;aACF;YACD;gBACE,KAAK,EAAE,aAAa;gBACpB,IAAI,EAAE,SAAS;gBACf,OAAO,EAAE,kBAAkB,CAAC;oBAC1B,KAAK;iBACN,CAAC;aACH;YACD;gBACE,KAAK,EAAE,YAAY;gBACnB,IAAI,EAAE,WAAW;gBACjB,OAAO,EAAE,GAAG,EAAE;oBACZ,KAAK,CAAC,WAAW,CAAC,OAAO,CAAC,EAAE,CAAC;wBAC3B,eAAe;wBACf;4BACE,OAAO;4BACP,KAAK;yBACN;qBACF,CAAC,CAAA;gBACJ,CAAC;aACF;SACF,EACD,YAAY,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,EAAE,EACxD,eAAe,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,EAAE;QAExD,oBAAC,IAAI,OAAG,CACY,CACvB,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,QAAQ,CAAA"}
|
|
@@ -8,7 +8,7 @@ const GappynessSlider = observer(function GappynessSlider({ model, }) {
|
|
|
8
8
|
}
|
|
9
9
|
return (React.createElement("div", { style: { display: 'flex', alignItems: 'center', gap: 8 } },
|
|
10
10
|
React.createElement(Typography, { style: { whiteSpace: 'nowrap' } },
|
|
11
|
-
"Hide columns w/
|
|
11
|
+
"Hide columns w/ \u2265",
|
|
12
12
|
allowedGappyness,
|
|
13
13
|
"% gaps"),
|
|
14
14
|
React.createElement(Slider
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GappynessSlider.js","sourceRoot":"","sources":["../../../src/components/header/GappynessSlider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAClD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAIrC,MAAM,eAAe,GAAG,QAAQ,CAAC,SAAS,eAAe,CAAC,EACxD,KAAK,GAGN;IACC,MAAM,EAAE,QAAQ,EAAE,gBAAgB,EAAE,GAAG,KAAK,CAAA;IAC5C,IAAI,CAAC,QAAQ,EAAE,CAAC;QACd,OAAO,IAAI,CAAA;IACb,CAAC;IACD,OAAO,CACL,6BAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE;
|
|
1
|
+
{"version":3,"file":"GappynessSlider.js","sourceRoot":"","sources":["../../../src/components/header/GappynessSlider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAClD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAIrC,MAAM,eAAe,GAAG,QAAQ,CAAC,SAAS,eAAe,CAAC,EACxD,KAAK,GAGN;IACC,MAAM,EAAE,QAAQ,EAAE,gBAAgB,EAAE,GAAG,KAAK,CAAA;IAC5C,IAAI,CAAC,QAAQ,EAAE,CAAC;QACd,OAAO,IAAI,CAAA;IACb,CAAC;IACD,OAAO,CACL,6BAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE;QAI3D,oBAAC,UAAU,IAAC,KAAK,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE;;YACpB,gBAAgB;qBAC1B;QACb,oBAAC,MAAM;QACL,wEAAwE;QACxE,wEAAwE;QACxE,yEAAyE;QACzE,wEAAwE;QACxE,oEAAoE;QACpE,yEAAyE;QACzE,sEAAsE;QACtE,kDAAkD;QAClD,EAAE;QACF,wEAAwE;QACxE,8DAA8D;QAC9D,oEAAoE;2BACxD,kBAAkB,EAC9B,KAAK,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE,EACrB,GAAG,EAAE,CAAC,EACN,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,gBAAgB,EACvB,QAAQ,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,EAAE;gBACnB,KAAK,CAAC,mBAAmB,CAAC,GAAG,CAAC,CAAA;YAChC,CAAC,GACD,CACE,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,eAAe,CAAA"}
|
|
@@ -5,17 +5,18 @@ import Search from '@mui/icons-material/Search';
|
|
|
5
5
|
import Sort from '@mui/icons-material/Sort';
|
|
6
6
|
import Visibility from '@mui/icons-material/Visibility';
|
|
7
7
|
const FeatureFilterDialog = lazy(() => import('../dialogs/FeatureDialog.js'));
|
|
8
|
-
const
|
|
8
|
+
const InterProScanFileDialog = lazy(() => import('../dialogs/InterProScanFileDialog.js'));
|
|
9
9
|
const InterProScanDialog = lazy(() => import('../dialogs/InterProScanDialog.js'));
|
|
10
|
-
export function
|
|
10
|
+
export function getAnnotationsMenu({ model }) {
|
|
11
11
|
const { showDomains, actuallyShowDomains, subFeatureRows, noDomains } = model;
|
|
12
|
+
const noneLoaded = noDomains ? ' (none loaded)' : '';
|
|
12
13
|
return [
|
|
13
14
|
{
|
|
14
|
-
label: 'Open
|
|
15
|
+
label: 'Open InterProScan results...',
|
|
15
16
|
icon: FolderOpen,
|
|
16
17
|
onClick: () => {
|
|
17
18
|
model.queueDialog(handleClose => [
|
|
18
|
-
|
|
19
|
+
InterProScanFileDialog,
|
|
19
20
|
{
|
|
20
21
|
handleClose,
|
|
21
22
|
model,
|
|
@@ -24,7 +25,7 @@ export function getDomainMenu({ model }) {
|
|
|
24
25
|
},
|
|
25
26
|
},
|
|
26
27
|
{
|
|
27
|
-
label: 'Query InterProScan
|
|
28
|
+
label: 'Query InterProScan...',
|
|
28
29
|
icon: Search,
|
|
29
30
|
onClick: () => {
|
|
30
31
|
model.queueDialog(handleClose => [
|
|
@@ -37,7 +38,7 @@ export function getDomainMenu({ model }) {
|
|
|
37
38
|
},
|
|
38
39
|
},
|
|
39
40
|
{
|
|
40
|
-
label: `Show
|
|
41
|
+
label: `Show annotations${noneLoaded}`,
|
|
41
42
|
disabled: noDomains,
|
|
42
43
|
icon: Visibility,
|
|
43
44
|
checked: actuallyShowDomains,
|
|
@@ -47,7 +48,7 @@ export function getDomainMenu({ model }) {
|
|
|
47
48
|
},
|
|
48
49
|
},
|
|
49
50
|
{
|
|
50
|
-
label: `Use sub-row layout${
|
|
51
|
+
label: `Use sub-row layout${noneLoaded}`,
|
|
51
52
|
disabled: noDomains,
|
|
52
53
|
checked: actuallyShowDomains ? subFeatureRows : false,
|
|
53
54
|
icon: Sort,
|
|
@@ -57,7 +58,7 @@ export function getDomainMenu({ model }) {
|
|
|
57
58
|
},
|
|
58
59
|
},
|
|
59
60
|
{
|
|
60
|
-
label: `Filter
|
|
61
|
+
label: `Filter annotations${noneLoaded}`,
|
|
61
62
|
icon: FilterAlt,
|
|
62
63
|
disabled: noDomains,
|
|
63
64
|
onClick: () => {
|
|
@@ -72,4 +73,4 @@ export function getDomainMenu({ model }) {
|
|
|
72
73
|
},
|
|
73
74
|
];
|
|
74
75
|
}
|
|
75
|
-
//# sourceMappingURL=
|
|
76
|
+
//# sourceMappingURL=getAnnotationsMenu.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"getAnnotationsMenu.js","sourceRoot":"","sources":["../../../src/components/header/getAnnotationsMenu.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,OAAO,CAAA;AAE5B,OAAO,SAAS,MAAM,+BAA+B,CAAA;AACrD,OAAO,UAAU,MAAM,gCAAgC,CAAA;AACvD,OAAO,MAAM,MAAM,4BAA4B,CAAA;AAC/C,OAAO,IAAI,MAAM,0BAA0B,CAAA;AAC3C,OAAO,UAAU,MAAM,gCAAgC,CAAA;AAIvD,MAAM,mBAAmB,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC,MAAM,CAAC,6BAA8B,CAAC,CAAC,CAAA;AAC9E,MAAM,sBAAsB,GAAG,IAAI,CACjC,GAAG,EAAE,CAAC,MAAM,CAAC,sCAAuC,CAAC,CACtD,CAAA;AACD,MAAM,kBAAkB,GAAG,IAAI,CAC7B,GAAG,EAAE,CAAC,MAAM,CAAC,kCAAmC,CAAC,CAClD,CAAA;AAED,MAAM,UAAU,kBAAkB,CAAC,EAAE,KAAK,EAA2B;IACnE,MAAM,EAAE,WAAW,EAAE,mBAAmB,EAAE,cAAc,EAAE,SAAS,EAAE,GAAG,KAAK,CAAA;IAC7E,MAAM,UAAU,GAAG,SAAS,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,EAAE,CAAA;IACpD,OAAO;QACL;YACE,KAAK,EAAE,8BAA8B;YACrC,IAAI,EAAE,UAAU;YAChB,OAAO,EAAE,GAAG,EAAE;gBACZ,KAAK,CAAC,WAAW,CAAC,WAAW,CAAC,EAAE,CAAC;oBAC/B,sBAAsB;oBACtB;wBACE,WAAW;wBACX,KAAK;qBACN;iBACF,CAAC,CAAA;YACJ,CAAC;SACF;QACD;YACE,KAAK,EAAE,uBAAuB;YAC9B,IAAI,EAAE,MAAM;YACZ,OAAO,EAAE,GAAG,EAAE;gBACZ,KAAK,CAAC,WAAW,CAAC,WAAW,CAAC,EAAE,CAAC;oBAC/B,kBAAkB;oBAClB;wBACE,WAAW;wBACX,KAAK;qBACN;iBACF,CAAC,CAAA;YACJ,CAAC;SACF;QACD;YACE,KAAK,EAAE,mBAAmB,UAAU,EAAE;YACtC,QAAQ,EAAE,SAAS;YACnB,IAAI,EAAE,UAAU;YAChB,OAAO,EAAE,mBAAmB;YAC5B,IAAI,EAAE,UAAmB;YACzB,OAAO,EAAE,GAAG,EAAE;gBACZ,KAAK,CAAC,cAAc,CAAC,CAAC,WAAW,CAAC,CAAA;YACpC,CAAC;SACF;QACD;YACE,KAAK,EAAE,qBAAqB,UAAU,EAAE;YACxC,QAAQ,EAAE,SAAS;YACnB,OAAO,EAAE,mBAAmB,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,KAAK;YACrD,IAAI,EAAE,IAAI;YACV,IAAI,EAAE,UAAmB;YACzB,OAAO,EAAE,GAAG,EAAE;gBACZ,KAAK,CAAC,iBAAiB,CAAC,CAAC,cAAc,CAAC,CAAA;YAC1C,CAAC;SACF;QACD;YACE,KAAK,EAAE,qBAAqB,UAAU,EAAE;YACxC,IAAI,EAAE,SAAS;YACf,QAAQ,EAAE,SAAS;YACnB,OAAO,EAAE,GAAG,EAAE;gBACZ,KAAK,CAAC,WAAW,CAAC,OAAO,CAAC,EAAE,CAAC;oBAC3B,mBAAmB;oBACnB;wBACE,OAAO;wBACP,KAAK;qBACN;iBACF,CAAC,CAAA;YACJ,CAAC;SACF;KACF,CAAA;AACH,CAAC"}
|
|
@@ -28,7 +28,7 @@ const ImportForm = observer(function ({ model }) {
|
|
|
28
28
|
React.createElement(Typography, null, "Tree file or URL"),
|
|
29
29
|
React.createElement(FileSelector, { location: treeFile, setLocation: setTreeFile })),
|
|
30
30
|
React.createElement("div", null,
|
|
31
|
-
React.createElement(Typography, null, "
|
|
31
|
+
React.createElement(Typography, null, "Annotation GFF file or URL (optional)"),
|
|
32
32
|
React.createElement(FileSelector, { location: gffFile, setLocation: setGffFile }))),
|
|
33
33
|
React.createElement("div", null,
|
|
34
34
|
React.createElement(Button, { onClick: () => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ImportForm.js","sourceRoot":"","sources":["../../../src/components/import/ImportForm.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAEvC,OAAO,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAA;AAC7D,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAC7D,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,kBAAkB,MAAM,yBAA0B,CAAA;AACzD,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAA;AAKhC,MAAM,UAAU,GAAG,QAAQ,CAAC,UAAU,EAAE,KAAK,EAA2B;IACtE,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,EAAgB,CAAA;IACtD,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,EAAgB,CAAA;IACxD,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,EAAgB,CAAA;IACtD,MAAM,EAAE,KAAK,EAAE,GAAG,KAAK,CAAA;IAEvB,OAAO,CACL,oBAAC,SAAS;QACR,6BAAK,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE;YACzB,KAAK,CAAC,CAAC,CAAC,oBAAC,YAAY,IAAC,KAAK,EAAE,KAAK,GAAI,CAAC,CAAC,CAAC,IAAI;YAC9C,oBAAC,UAAU,6FAGE;YACb,oBAAC,UAAU,IAAC,KAAK,EAAC,OAAO,mNAKZ,CACT;QAEN,6BACE,KAAK,EAAE;gBACL,OAAO,EAAE,MAAM;gBACf,cAAc,EAAE,QAAQ;gBACxB,UAAU,EAAE,QAAQ;gBACpB,GAAG,EAAE,EAAE;aACR;YAED;gBACE;oBACE,oBAAC,UAAU,0BAA6B;oBACxC,oBAAC,YAAY,IAAC,QAAQ,EAAE,OAAO,EAAE,WAAW,EAAE,UAAU,GAAI,CACxD;gBACN;oBACE,oBAAC,UAAU,2BAA8B;oBACzC,oBAAC,YAAY,IAAC,QAAQ,EAAE,QAAQ,EAAE,WAAW,EAAE,WAAW,GAAI,CAC1D;gBACN;oBACE,oBAAC,UAAU,
|
|
1
|
+
{"version":3,"file":"ImportForm.js","sourceRoot":"","sources":["../../../src/components/import/ImportForm.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAEvC,OAAO,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAA;AAC7D,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAC7D,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,kBAAkB,MAAM,yBAA0B,CAAA;AACzD,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAA;AAKhC,MAAM,UAAU,GAAG,QAAQ,CAAC,UAAU,EAAE,KAAK,EAA2B;IACtE,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,EAAgB,CAAA;IACtD,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,EAAgB,CAAA;IACxD,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,EAAgB,CAAA;IACtD,MAAM,EAAE,KAAK,EAAE,GAAG,KAAK,CAAA;IAEvB,OAAO,CACL,oBAAC,SAAS;QACR,6BAAK,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE;YACzB,KAAK,CAAC,CAAC,CAAC,oBAAC,YAAY,IAAC,KAAK,EAAE,KAAK,GAAI,CAAC,CAAC,CAAC,IAAI;YAC9C,oBAAC,UAAU,6FAGE;YACb,oBAAC,UAAU,IAAC,KAAK,EAAC,OAAO,mNAKZ,CACT;QAEN,6BACE,KAAK,EAAE;gBACL,OAAO,EAAE,MAAM;gBACf,cAAc,EAAE,QAAQ;gBACxB,UAAU,EAAE,QAAQ;gBACpB,GAAG,EAAE,EAAE;aACR;YAED;gBACE;oBACE,oBAAC,UAAU,0BAA6B;oBACxC,oBAAC,YAAY,IAAC,QAAQ,EAAE,OAAO,EAAE,WAAW,EAAE,UAAU,GAAI,CACxD;gBACN;oBACE,oBAAC,UAAU,2BAA8B;oBACzC,oBAAC,YAAY,IAAC,QAAQ,EAAE,QAAQ,EAAE,WAAW,EAAE,WAAW,GAAI,CAC1D;gBACN;oBACE,oBAAC,UAAU,gDAAmD;oBAC9D,oBAAC,YAAY,IAAC,QAAQ,EAAE,OAAO,EAAE,WAAW,EAAE,UAAU,GAAI,CACxD,CACF;YACN;gBACE,oBAAC,MAAM,IACL,OAAO,EAAE,GAAG,EAAE;wBACZ,IAAI,CAAC;4BACH,IAAI,CAAC,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,OAAO,CAAC,CAAA;wBACzC,CAAC;wBAAC,OAAO,CAAC,EAAE,CAAC;4BACX,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAA;4BAChB,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAA;wBACnB,CAAC;oBACH,CAAC,EACD,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,SAAS,EACf,QAAQ,EAAE,CAAC,OAAO,IAAI,CAAC,QAAQ,WAGxB,CACL;YAEN;gBACE,oBAAC,UAAU,mBAAsB;gBACjC,oBAAC,kBAAkB,IAAC,KAAK,EAAE,KAAK,GAAI,CAChC,CACF,CACI,CACb,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,UAAU,CAAA"}
|
|
@@ -3,65 +3,74 @@ import { Link, Typography } from '@mui/material';
|
|
|
3
3
|
import { observer } from 'mobx-react';
|
|
4
4
|
import { smallMSA, smallMSAOnly, smallTree } from './data/seq2.js';
|
|
5
5
|
import { load } from './util.js';
|
|
6
|
-
function ListItem({ onClick, model, children, }) {
|
|
7
|
-
return (React.createElement("li", null,
|
|
8
|
-
React.createElement(Link, { onClick: event => {
|
|
9
|
-
model.setError(undefined);
|
|
10
|
-
event.preventDefault();
|
|
11
|
-
onClick();
|
|
12
|
-
}, href: "#" },
|
|
13
|
-
React.createElement(Typography, { component: "span" }, children))));
|
|
14
|
-
}
|
|
15
6
|
const BASE = 'https://jbrowse.org/genomes/multiple_sequence_alignments';
|
|
7
|
+
const TREES = 'https://jbrowse.org/genomes/newicktrees';
|
|
8
|
+
const examples = [
|
|
9
|
+
{
|
|
10
|
+
label: '230k COVID-19 samples (tree only)',
|
|
11
|
+
tree: `${TREES}/sarscov2phylo.pub.ft.nh`,
|
|
12
|
+
},
|
|
13
|
+
{
|
|
14
|
+
label: 'Small protein MSA+tree',
|
|
15
|
+
inline: { msa: smallMSA, tree: smallTree },
|
|
16
|
+
},
|
|
17
|
+
{
|
|
18
|
+
label: 'Small MSA only',
|
|
19
|
+
inline: { msa: smallMSAOnly },
|
|
20
|
+
},
|
|
21
|
+
{
|
|
22
|
+
label: 'PFAM SARS-CoV2 multi-stockholm',
|
|
23
|
+
msa: `${BASE}/pfam-cov2.stock`,
|
|
24
|
+
},
|
|
25
|
+
{
|
|
26
|
+
label: 'PFAM SARS-CoV2 multi-stockholm w/ domains loaded',
|
|
27
|
+
msa: `${BASE}/pfam-cov2.stock`,
|
|
28
|
+
gff: `${BASE}/pfam-cov2-domains.gff`,
|
|
29
|
+
},
|
|
30
|
+
{
|
|
31
|
+
label: 'Lysine stockholm file',
|
|
32
|
+
msa: `${BASE}/Lysine.stock`,
|
|
33
|
+
},
|
|
34
|
+
{
|
|
35
|
+
label: 'PF01601 stockholm file (SARS-CoV2 spike protein)',
|
|
36
|
+
msa: `${BASE}/PF01601_full.txt`,
|
|
37
|
+
},
|
|
38
|
+
{
|
|
39
|
+
label: 'Europe COVID full genomes (LR883044.1 and 199 other sequences)',
|
|
40
|
+
msa: `${BASE}/europe_covid.fa`,
|
|
41
|
+
},
|
|
42
|
+
{
|
|
43
|
+
label: 'MAFFT+VeryFastTree(17.9k samples)',
|
|
44
|
+
msa: `${BASE}/rhv_test-only.aligned_with_mafft_auto.fa`,
|
|
45
|
+
tree: `${BASE}/rhv_test-only.aligned_with_mafft_auto.nh`,
|
|
46
|
+
},
|
|
47
|
+
{
|
|
48
|
+
label: 'Human BLAST results mfa',
|
|
49
|
+
msa: 'https://jbrowse.org/demos/ttc39a.mfa',
|
|
50
|
+
},
|
|
51
|
+
];
|
|
52
|
+
function uri(url) {
|
|
53
|
+
return url ? { uri: url, locationType: 'UriLocation' } : undefined;
|
|
54
|
+
}
|
|
16
55
|
const ImportFormExamples = observer(function ({ model, }) {
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
React.createElement(ListItem, { model: model, onClick: () => {
|
|
36
|
-
model.setData({ msa: smallMSAOnly });
|
|
37
|
-
} }, "Small MSA only"),
|
|
38
|
-
React.createElement(ListItem, { model: model, onClick: () => {
|
|
39
|
-
loadUris({ msa: `${BASE}/pfam-cov2.stock` });
|
|
40
|
-
} }, "PFAM SARS-CoV2 multi-stockholm"),
|
|
41
|
-
React.createElement(ListItem, { model: model, onClick: () => {
|
|
42
|
-
loadUris({
|
|
43
|
-
msa: `${BASE}/pfam-cov2.stock`,
|
|
44
|
-
gff: `${BASE}/pfam-cov2-domains.gff`,
|
|
45
|
-
});
|
|
46
|
-
} }, "PFAM SARS-CoV2 multi-stockholm w/ domains loaded"),
|
|
47
|
-
React.createElement(ListItem, { model: model, onClick: () => {
|
|
48
|
-
loadUris({ msa: `${BASE}/Lysine.stock` });
|
|
49
|
-
} }, "Lysine stockholm file"),
|
|
50
|
-
React.createElement(ListItem, { model: model, onClick: () => {
|
|
51
|
-
loadUris({ msa: `${BASE}/PF01601_full.txt` });
|
|
52
|
-
} }, "PF01601 stockholm file (SARS-CoV2 spike protein)"),
|
|
53
|
-
React.createElement(ListItem, { model: model, onClick: () => {
|
|
54
|
-
loadUris({ msa: `${BASE}/europe_covid.fa` });
|
|
55
|
-
} }, "Europe COVID full genomes (LR883044.1 and 199 other sequences)"),
|
|
56
|
-
React.createElement(ListItem, { model: model, onClick: () => {
|
|
57
|
-
loadUris({
|
|
58
|
-
msa: `${BASE}/rhv_test-only.aligned_with_mafft_auto.fa`,
|
|
59
|
-
tree: `${BASE}/rhv_test-only.aligned_with_mafft_auto.nh`,
|
|
60
|
-
});
|
|
61
|
-
} }, "MAFFT+VeryFastTree(17.9k samples)"),
|
|
62
|
-
React.createElement(ListItem, { model: model, onClick: () => {
|
|
63
|
-
loadUris({ msa: 'https://jbrowse.org/demos/ttc39a.mfa' });
|
|
64
|
-
} }, "Human BLAST results mfa")));
|
|
56
|
+
return (React.createElement("ul", null, examples.map(({ label, msa, tree, gff, inline }) => (React.createElement("li", { key: label },
|
|
57
|
+
React.createElement(Link, { href: "#", onClick: event => {
|
|
58
|
+
event.preventDefault();
|
|
59
|
+
model.setError(undefined);
|
|
60
|
+
try {
|
|
61
|
+
if (inline) {
|
|
62
|
+
model.setData(inline);
|
|
63
|
+
}
|
|
64
|
+
else {
|
|
65
|
+
load(model, uri(msa), uri(tree), uri(gff));
|
|
66
|
+
}
|
|
67
|
+
}
|
|
68
|
+
catch (e) {
|
|
69
|
+
console.error(e);
|
|
70
|
+
model.setError(e);
|
|
71
|
+
}
|
|
72
|
+
} },
|
|
73
|
+
React.createElement(Typography, { component: "span" }, label)))))));
|
|
65
74
|
});
|
|
66
75
|
export default ImportFormExamples;
|
|
67
76
|
//# sourceMappingURL=ImportFormExamples.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ImportFormExamples.js","sourceRoot":"","sources":["../../../src/components/import/ImportFormExamples.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAChD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,EAAE,QAAQ,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAA;AAClE,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAA;AAIhC,
|
|
1
|
+
{"version":3,"file":"ImportFormExamples.js","sourceRoot":"","sources":["../../../src/components/import/ImportFormExamples.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAChD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,EAAE,QAAQ,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAA;AAClE,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAA;AAIhC,MAAM,IAAI,GAAG,0DAA0D,CAAA;AACvE,MAAM,KAAK,GAAG,yCAAyC,CAAA;AAYvD,MAAM,QAAQ,GAAc;IAC1B;QACE,KAAK,EAAE,mCAAmC;QAC1C,IAAI,EAAE,GAAG,KAAK,0BAA0B;KACzC;IACD;QACE,KAAK,EAAE,wBAAwB;QAC/B,MAAM,EAAE,EAAE,GAAG,EAAE,QAAQ,EAAE,IAAI,EAAE,SAAS,EAAE;KAC3C;IACD;QACE,KAAK,EAAE,gBAAgB;QACvB,MAAM,EAAE,EAAE,GAAG,EAAE,YAAY,EAAE;KAC9B;IACD;QACE,KAAK,EAAE,gCAAgC;QACvC,GAAG,EAAE,GAAG,IAAI,kBAAkB;KAC/B;IACD;QACE,KAAK,EAAE,kDAAkD;QACzD,GAAG,EAAE,GAAG,IAAI,kBAAkB;QAC9B,GAAG,EAAE,GAAG,IAAI,wBAAwB;KACrC;IACD;QACE,KAAK,EAAE,uBAAuB;QAC9B,GAAG,EAAE,GAAG,IAAI,eAAe;KAC5B;IACD;QACE,KAAK,EAAE,kDAAkD;QACzD,GAAG,EAAE,GAAG,IAAI,mBAAmB;KAChC;IACD;QACE,KAAK,EAAE,gEAAgE;QACvE,GAAG,EAAE,GAAG,IAAI,kBAAkB;KAC/B;IACD;QACE,KAAK,EAAE,mCAAmC;QAC1C,GAAG,EAAE,GAAG,IAAI,2CAA2C;QACvD,IAAI,EAAE,GAAG,IAAI,2CAA2C;KACzD;IACD;QACE,KAAK,EAAE,yBAAyB;QAChC,GAAG,EAAE,sCAAsC;KAC5C;CACF,CAAA;AAED,SAAS,GAAG,CAAC,GAAY;IACvB,OAAO,GAAG,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,GAAG,EAAE,YAAY,EAAE,aAAsB,EAAE,CAAC,CAAC,CAAC,SAAS,CAAA;AAC7E,CAAC;AAED,MAAM,kBAAkB,GAAG,QAAQ,CAAC,UAAU,EAC5C,KAAK,GAGN;IACC,OAAO,CACL,gCACG,QAAQ,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,GAAG,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,CACnD,4BAAI,GAAG,EAAE,KAAK;QACZ,oBAAC,IAAI,IACH,IAAI,EAAC,GAAG,EACR,OAAO,EAAE,KAAK,CAAC,EAAE;gBACf,KAAK,CAAC,cAAc,EAAE,CAAA;gBACtB,KAAK,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAA;gBACzB,IAAI,CAAC;oBACH,IAAI,MAAM,EAAE,CAAC;wBACX,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,CAAA;oBACvB,CAAC;yBAAM,CAAC;wBACN,IAAI,CAAC,KAAK,EAAE,GAAG,CAAC,GAAG,CAAC,EAAE,GAAG,CAAC,IAAI,CAAC,EAAE,GAAG,CAAC,GAAG,CAAC,CAAC,CAAA;oBAC5C,CAAC;gBACH,CAAC;gBAAC,OAAO,CAAC,EAAE,CAAC;oBACX,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAA;oBAChB,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAA;gBACnB,CAAC;YACH,CAAC;YAED,oBAAC,UAAU,IAAC,SAAS,EAAC,MAAM,IAAE,KAAK,CAAc,CAC5C,CACJ,CACN,CAAC,CACC,CACN,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,kBAAkB,CAAA"}
|
|
@@ -1,43 +1,32 @@
|
|
|
1
|
-
import React, { useCallback
|
|
1
|
+
import React, { useCallback } from 'react';
|
|
2
2
|
import { observer } from 'mobx-react';
|
|
3
|
-
import {
|
|
3
|
+
import ScrollbarThumb, { scrollbarThumbFill } from '../ScrollbarThumb.js';
|
|
4
4
|
import { MINIMAP_BAR_HEIGHT, getMinimapLayout } from './minimapLayout.js';
|
|
5
5
|
const Minimap = observer(function ({ model }) {
|
|
6
|
-
const
|
|
7
|
-
const {
|
|
8
|
-
const
|
|
9
|
-
const fill = 'rgba(66, 119, 127, 0.3)';
|
|
10
|
-
const { startDrag } = useDragScroll('x', useCallback((delta, startScroll) => {
|
|
6
|
+
const { minimapHeight, msaCanvasWidth } = model;
|
|
7
|
+
const { unit, s, w, polygonHeight, polygonPoints } = getMinimapLayout(model, msaCanvasWidth);
|
|
8
|
+
const onDrag = useCallback((delta, startScroll) => {
|
|
11
9
|
model.setScrollX(startScroll - delta / unit);
|
|
12
|
-
}, [model, unit])
|
|
10
|
+
}, [model, unit]);
|
|
13
11
|
return (React.createElement("div", { style: {
|
|
14
12
|
position: 'relative',
|
|
15
13
|
height: minimapHeight,
|
|
16
|
-
width:
|
|
14
|
+
width: msaCanvasWidth,
|
|
15
|
+
flexShrink: 0,
|
|
17
16
|
} },
|
|
18
17
|
React.createElement("div", { style: {
|
|
19
18
|
height: MINIMAP_BAR_HEIGHT,
|
|
20
19
|
boxSizing: 'border-box',
|
|
21
20
|
border: '1px solid #555',
|
|
22
21
|
} }),
|
|
23
|
-
React.createElement("
|
|
24
|
-
position: 'absolute',
|
|
22
|
+
React.createElement(ScrollbarThumb, { axis: "x", getStart: () => model.scrollX, onDrag: onDrag, style: {
|
|
25
23
|
top: 0,
|
|
26
24
|
left: Math.max(0, s),
|
|
27
|
-
background: hovered ? 'rgba(66,119,127,0.6)' : fill,
|
|
28
|
-
cursor: 'pointer',
|
|
29
25
|
height: MINIMAP_BAR_HEIGHT,
|
|
30
26
|
width: w,
|
|
31
|
-
zIndex: 100,
|
|
32
|
-
}, onMouseOver: () => {
|
|
33
|
-
setHovered(true);
|
|
34
|
-
}, onMouseOut: () => {
|
|
35
|
-
setHovered(false);
|
|
36
|
-
}, onMouseDown: event => {
|
|
37
|
-
startDrag(event, model.scrollX);
|
|
38
27
|
} }),
|
|
39
|
-
React.createElement("svg", { height: polygonHeight,
|
|
40
|
-
React.createElement("polygon", { fill:
|
|
28
|
+
React.createElement("svg", { height: polygonHeight, width: msaCanvasWidth },
|
|
29
|
+
React.createElement("polygon", { fill: scrollbarThumbFill, points: polygonPoints }))));
|
|
41
30
|
});
|
|
42
31
|
export default Minimap;
|
|
43
32
|
//# sourceMappingURL=Minimap.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Minimap.js","sourceRoot":"","sources":["../../../src/components/minimap/Minimap.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,
|
|
1
|
+
{"version":3,"file":"Minimap.js","sourceRoot":"","sources":["../../../src/components/minimap/Minimap.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,MAAM,OAAO,CAAA;AAE1C,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,cAAc,EAAE,EAAE,kBAAkB,EAAE,MAAM,sBAAuB,CAAA;AAC1E,OAAO,EAAE,kBAAkB,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAA;AAIzE,MAAM,OAAO,GAAG,QAAQ,CAAC,UAAU,EAAE,KAAK,EAA2B;IACnE,MAAM,EAAE,aAAa,EAAE,cAAc,EAAE,GAAG,KAAK,CAAA;IAC/C,MAAM,EAAE,IAAI,EAAE,CAAC,EAAE,CAAC,EAAE,aAAa,EAAE,aAAa,EAAE,GAAG,gBAAgB,CACnE,KAAK,EACL,cAAc,CACf,CAAA;IAED,MAAM,MAAM,GAAG,WAAW,CACxB,CAAC,KAAa,EAAE,WAAmB,EAAE,EAAE;QACrC,KAAK,CAAC,UAAU,CAAC,WAAW,GAAG,KAAK,GAAG,IAAI,CAAC,CAAA;IAC9C,CAAC,EACD,CAAC,KAAK,EAAE,IAAI,CAAC,CACd,CAAA;IAED,OAAO,CAIL,6BACE,KAAK,EAAE;YACL,QAAQ,EAAE,UAAU;YACpB,MAAM,EAAE,aAAa;YACrB,KAAK,EAAE,cAAc;YACrB,UAAU,EAAE,CAAC;SACd;QAED,6BACE,KAAK,EAAE;gBACL,MAAM,EAAE,kBAAkB;gBAC1B,SAAS,EAAE,YAAY;gBACvB,MAAM,EAAE,gBAAgB;aACzB,GACD;QACF,oBAAC,cAAc,IACb,IAAI,EAAC,GAAG,EACR,QAAQ,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,OAAO,EAC7B,MAAM,EAAE,MAAM,EACd,KAAK,EAAE;gBACL,GAAG,EAAE,CAAC;gBACN,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC;gBACpB,MAAM,EAAE,kBAAkB;gBAC1B,KAAK,EAAE,CAAC;aACT,GACD;QAEF,6BAAK,MAAM,EAAE,aAAa,EAAE,KAAK,EAAE,cAAc;YAC/C,iCAAS,IAAI,EAAE,kBAAkB,EAAE,MAAM,EAAE,aAAa,GAAI,CACxD,CACF,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,OAAO,CAAA"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import type { MsaViewModel } from '../../model.ts';
|
|
3
|
-
declare const MinimapSVG: ({ model }: {
|
|
3
|
+
declare const MinimapSVG: ({ model, width }: {
|
|
4
4
|
model: MsaViewModel;
|
|
5
|
+
width: number;
|
|
5
6
|
}) => React.JSX.Element;
|
|
6
7
|
export default MinimapSVG;
|
|
@@ -1,13 +1,12 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { observer } from 'mobx-react';
|
|
3
3
|
import { MINIMAP_BAR_HEIGHT, getMinimapLayout } from './minimapLayout.js';
|
|
4
|
-
const MinimapSVG = observer(({ model }) => {
|
|
5
|
-
const {
|
|
6
|
-
const { s, w, polygonPoints } = getMinimapLayout(model);
|
|
4
|
+
const MinimapSVG = observer(({ model, width }) => {
|
|
5
|
+
const { s, w, polygonPoints } = getMinimapLayout(model, width);
|
|
7
6
|
const fillColor = 'rgb(66, 119, 127)';
|
|
8
7
|
const fillOpacity = 0.3;
|
|
9
8
|
return (React.createElement(React.Fragment, null,
|
|
10
|
-
React.createElement("rect", { x: 0, y: 0, width:
|
|
9
|
+
React.createElement("rect", { x: 0, y: 0, width: width, height: MINIMAP_BAR_HEIGHT, stroke: "#555", fill: "none" }),
|
|
11
10
|
React.createElement("rect", { x: Math.max(0, s), y: 0, width: w, height: MINIMAP_BAR_HEIGHT, fill: fillColor, fillOpacity: fillOpacity, stroke: "#555" }),
|
|
12
11
|
React.createElement("g", { transform: `translate(0 ${MINIMAP_BAR_HEIGHT})` },
|
|
13
12
|
React.createElement("polygon", { fill: fillColor, fillOpacity: fillOpacity, points: polygonPoints }))));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MinimapSVG.js","sourceRoot":"","sources":["../../../src/components/minimap/MinimapSVG.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,EAAE,kBAAkB,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAA;AAIzE,MAAM,UAAU,GAAG,QAAQ,
|
|
1
|
+
{"version":3,"file":"MinimapSVG.js","sourceRoot":"","sources":["../../../src/components/minimap/MinimapSVG.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,EAAE,kBAAkB,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAA;AAIzE,MAAM,UAAU,GAAG,QAAQ,CACzB,CAAC,EAAE,KAAK,EAAE,KAAK,EAA0C,EAAE,EAAE;IAC3D,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,aAAa,EAAE,GAAG,gBAAgB,CAAC,KAAK,EAAE,KAAK,CAAC,CAAA;IAC9D,MAAM,SAAS,GAAG,mBAAmB,CAAA;IACrC,MAAM,WAAW,GAAG,GAAG,CAAA;IAEvB,OAAO,CACL;QACE,8BACE,CAAC,EAAE,CAAC,EACJ,CAAC,EAAE,CAAC,EACJ,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,kBAAkB,EAC1B,MAAM,EAAC,MAAM,EACb,IAAI,EAAC,MAAM,GACX;QACF,8BACE,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC,EACjB,CAAC,EAAE,CAAC,EACJ,KAAK,EAAE,CAAC,EACR,MAAM,EAAE,kBAAkB,EAC1B,IAAI,EAAE,SAAS,EACf,WAAW,EAAE,WAAW,EACxB,MAAM,EAAC,MAAM,GACb;QACF,2BAAG,SAAS,EAAE,eAAe,kBAAkB,GAAG;YAChD,iCACE,IAAI,EAAE,SAAS,EACf,WAAW,EAAE,WAAW,EACxB,MAAM,EAAE,aAAa,GACrB,CACA,CACH,CACJ,CAAA;AACH,CAAC,CACF,CAAA;AAED,eAAe,UAAU,CAAA"}
|
|
@@ -1,6 +1,15 @@
|
|
|
1
1
|
import type { MsaViewModel } from '../../model.ts';
|
|
2
2
|
export declare const MINIMAP_BAR_HEIGHT = 12;
|
|
3
|
-
|
|
3
|
+
/**
|
|
4
|
+
* Viewport-rectangle and trapezoid geometry for a minimap drawn `minimapWidth`
|
|
5
|
+
* pixels wide, shared by the interactive Minimap and the static MinimapSVG.
|
|
6
|
+
*
|
|
7
|
+
* The width is a parameter rather than read off the model because the two
|
|
8
|
+
* differ: on screen the minimap sits over the alignment canvas, while the SVG
|
|
9
|
+
* export lays the whole figure out on its own grid. What the rectangle *marks*
|
|
10
|
+
* is always the on-screen viewport, so that part comes from the model.
|
|
11
|
+
*/
|
|
12
|
+
export declare function getMinimapLayout(model: MsaViewModel, minimapWidth: number): {
|
|
4
13
|
unit: number;
|
|
5
14
|
s: number;
|
|
6
15
|
w: number;
|
|
@@ -1,15 +1,20 @@
|
|
|
1
1
|
export const MINIMAP_BAR_HEIGHT = 12;
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
2
|
+
/**
|
|
3
|
+
* Viewport-rectangle and trapezoid geometry for a minimap drawn `minimapWidth`
|
|
4
|
+
* pixels wide, shared by the interactive Minimap and the static MinimapSVG.
|
|
5
|
+
*
|
|
6
|
+
* The width is a parameter rather than read off the model because the two
|
|
7
|
+
* differ: on screen the minimap sits over the alignment canvas, while the SVG
|
|
8
|
+
* export lays the whole figure out on its own grid. What the rectangle *marks*
|
|
9
|
+
* is always the on-screen viewport, so that part comes from the model.
|
|
10
|
+
*/
|
|
11
|
+
export function getMinimapLayout(model, minimapWidth) {
|
|
12
|
+
const { scrollX, minimapHeight, totalWidth, msaCanvasWidth } = model;
|
|
13
|
+
const unit = totalWidth > 0 ? minimapWidth / totalWidth : 0;
|
|
14
|
+
const s = -scrollX * unit;
|
|
15
|
+
const w = Math.max(msaCanvasWidth * unit, 20);
|
|
11
16
|
const polygonHeight = minimapHeight - MINIMAP_BAR_HEIGHT;
|
|
12
|
-
const polygonPoints = `${s + w},0 ${s},0 0,${polygonHeight} ${
|
|
17
|
+
const polygonPoints = `${s + w},0 ${s},0 0,${polygonHeight} ${minimapWidth},${polygonHeight}`;
|
|
13
18
|
return { unit, s, w, polygonHeight, polygonPoints };
|
|
14
19
|
}
|
|
15
20
|
//# sourceMappingURL=minimapLayout.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"minimapLayout.js","sourceRoot":"","sources":["../../../src/components/minimap/minimapLayout.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,kBAAkB,GAAG,EAAE,CAAA;AAEpC
|
|
1
|
+
{"version":3,"file":"minimapLayout.js","sourceRoot":"","sources":["../../../src/components/minimap/minimapLayout.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,kBAAkB,GAAG,EAAE,CAAA;AAEpC;;;;;;;;GAQG;AACH,MAAM,UAAU,gBAAgB,CAAC,KAAmB,EAAE,YAAoB;IACxE,MAAM,EAAE,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,cAAc,EAAE,GAAG,KAAK,CAAA;IACpE,MAAM,IAAI,GAAG,UAAU,GAAG,CAAC,CAAC,CAAC,CAAC,YAAY,GAAG,UAAU,CAAC,CAAC,CAAC,CAAC,CAAA;IAC3D,MAAM,CAAC,GAAG,CAAC,OAAO,GAAG,IAAI,CAAA;IACzB,MAAM,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,cAAc,GAAG,IAAI,EAAE,EAAE,CAAC,CAAA;IAC7C,MAAM,aAAa,GAAG,aAAa,GAAG,kBAAkB,CAAA;IACxD,MAAM,aAAa,GAAG,GAAG,CAAC,GAAG,CAAC,MAAM,CAAC,QAAQ,aAAa,IAAI,YAAY,IAAI,aAAa,EAAE,CAAA;IAC7F,OAAO,EAAE,IAAI,EAAE,CAAC,EAAE,CAAC,EAAE,aAAa,EAAE,aAAa,EAAE,CAAA;AACrD,CAAC"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import type { MsaViewModel } from '../../model.ts';
|
|
3
|
-
declare const
|
|
3
|
+
declare const AnnotationLegend: ({ model, }: {
|
|
4
4
|
model: MsaViewModel;
|
|
5
5
|
}) => React.JSX.Element | null;
|
|
6
|
-
export default
|
|
6
|
+
export default AnnotationLegend;
|
|
@@ -3,7 +3,7 @@ import ExpandLess from '@mui/icons-material/ExpandLess';
|
|
|
3
3
|
import ExpandMore from '@mui/icons-material/ExpandMore';
|
|
4
4
|
import { IconButton, Paper, Typography } from '@mui/material';
|
|
5
5
|
import { observer } from 'mobx-react';
|
|
6
|
-
const
|
|
6
|
+
const AnnotationLegend = observer(function ({ model, }) {
|
|
7
7
|
const { actuallyShowDomains, visibleDomainTypes: visible, fillPalette, showDomainLegend: expanded, } = model;
|
|
8
8
|
const ExpandIcon = expanded ? ExpandLess : ExpandMore;
|
|
9
9
|
return actuallyShowDomains && visible.length > 0 ? (React.createElement(Paper, { elevation: 3, style: {
|
|
@@ -23,7 +23,7 @@ const DomainLegend = observer(function ({ model }) {
|
|
|
23
23
|
justifyContent: 'flex-end',
|
|
24
24
|
padding: '2px 4px 2px 8px',
|
|
25
25
|
} },
|
|
26
|
-
React.createElement(IconButton, { size: "small", title: expanded ? 'Collapse
|
|
26
|
+
React.createElement(IconButton, { size: "small", title: expanded ? 'Collapse key' : 'Expand key', onClick: () => {
|
|
27
27
|
model.setShowDomainLegend(!expanded);
|
|
28
28
|
} },
|
|
29
29
|
React.createElement(ExpandIcon, { fontSize: "small" }))),
|
|
@@ -36,5 +36,5 @@ const DomainLegend = observer(function ({ model }) {
|
|
|
36
36
|
} }),
|
|
37
37
|
React.createElement(Typography, { variant: "caption", noWrap: true }, name)))))) : null)) : null;
|
|
38
38
|
});
|
|
39
|
-
export default
|
|
40
|
-
//# sourceMappingURL=
|
|
39
|
+
export default AnnotationLegend;
|
|
40
|
+
//# sourceMappingURL=AnnotationLegend.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AnnotationLegend.js","sourceRoot":"","sources":["../../../src/components/msa/AnnotationLegend.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,UAAU,MAAM,gCAAgC,CAAA;AACvD,OAAO,UAAU,MAAM,gCAAgC,CAAA;AACvD,OAAO,EAAE,UAAU,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAC7D,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAIrC,MAAM,gBAAgB,GAAG,QAAQ,CAAC,UAAU,EAC1C,KAAK,GAGN;IACC,MAAM,EACJ,mBAAmB,EACnB,kBAAkB,EAAE,OAAO,EAC3B,WAAW,EACX,gBAAgB,EAAE,QAAQ,GAC3B,GAAG,KAAK,CAAA;IACT,MAAM,UAAU,GAAG,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,UAAU,CAAA;IAErD,OAAO,mBAAmB,IAAI,OAAO,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CACjD,oBAAC,KAAK,IACJ,SAAS,EAAE,CAAC,EACZ,KAAK,EAAE;YACL,QAAQ,EAAE,UAAU;YACpB,GAAG,EAAE,CAAC;YACN,KAAK,EAAE,CAAC;YACR,MAAM,EAAE,GAAG;YACX,QAAQ,EAAE,GAAG;YACb,SAAS,EAAE,KAAK;YAChB,OAAO,EAAE,MAAM;YACf,aAAa,EAAE,QAAQ;YACvB,OAAO,EAAE,IAAI;SACd;QAED,6BACE,KAAK,EAAE;gBACL,OAAO,EAAE,MAAM;gBACf,UAAU,EAAE,QAAQ;gBACpB,cAAc,EAAE,UAAU;gBAC1B,OAAO,EAAE,iBAAiB;aAC3B;YAED,oBAAC,UAAU,IACT,IAAI,EAAC,OAAO,EACZ,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,YAAY,EAC/C,OAAO,EAAE,GAAG,EAAE;oBACZ,KAAK,CAAC,mBAAmB,CAAC,CAAC,QAAQ,CAAC,CAAA;gBACtC,CAAC;gBAED,oBAAC,UAAU,IAAC,QAAQ,EAAC,OAAO,GAAG,CACpB,CACT;QACL,QAAQ,CAAC,CAAC,CAAC,CACV,6BAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAE,WAAW,EAAE,IACnD,OAAO,CAAC,GAAG,CAAC,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,CACpC,6BACE,GAAG,EAAE,SAAS,EACd,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,EACxD,KAAK,EAAE,SAAS;YAEhB,6BACE,KAAK,EAAE;oBACL,KAAK,EAAE,EAAE;oBACT,MAAM,EAAE,EAAE;oBACV,UAAU,EAAE,CAAC;oBACb,UAAU,EAAE,WAAW,CAAC,SAAS,CAAC;iBACnC,GACD;YACF,oBAAC,UAAU,IAAC,OAAO,EAAC,SAAS,EAAC,MAAM,UACjC,IAAI,CACM,CACT,CACP,CAAC,CACE,CACP,CAAC,CAAC,CAAC,IAAI,CACF,CACT,CAAC,CAAC,CAAC,IAAI,CAAA;AACV,CAAC,CAAC,CAAA;AAEF,eAAe,gBAAgB,CAAA"}
|
|
@@ -4,7 +4,7 @@ import { useWheelScroll } from '../../useWheelScroll.js';
|
|
|
4
4
|
import Loading from './Loading.js';
|
|
5
5
|
import MSACanvasBlock from './MSACanvasBlock.js';
|
|
6
6
|
const MSACanvas = observer(function ({ model }) {
|
|
7
|
-
const { MSA,
|
|
7
|
+
const { MSA, msaFilehandle, height, msaCanvasWidth, blocks2d, scrollZoom } = model;
|
|
8
8
|
const ref = useRef(null);
|
|
9
9
|
const onScrollX = useCallback((d) => {
|
|
10
10
|
model.doScrollX(d);
|
|
@@ -27,7 +27,7 @@ const MSACanvas = observer(function ({ model }) {
|
|
|
27
27
|
}, style: {
|
|
28
28
|
position: 'relative',
|
|
29
29
|
height,
|
|
30
|
-
width:
|
|
30
|
+
width: msaCanvasWidth,
|
|
31
31
|
overflow: 'hidden',
|
|
32
32
|
} }, !MSA && !msaFilehandle ? null : MSA ? (blocks2d.map(([bx, by]) => (React.createElement(MSACanvasBlock, { key: `${bx}_${by}`, model: model, offsetX: bx, offsetY: by })))) : (React.createElement(Loading, null))));
|
|
33
33
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MSACanvas.js","sourceRoot":"","sources":["../../../src/components/msa/MSACanvas.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAElD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAA;AACxD,OAAO,OAAO,MAAM,cAAe,CAAA;AACnC,OAAO,cAAc,MAAM,qBAAsB,CAAA;AAIjD,MAAM,SAAS,GAAG,QAAQ,CAAC,UAAU,EAAE,KAAK,EAA2B;IACrE,MAAM,
|
|
1
|
+
{"version":3,"file":"MSACanvas.js","sourceRoot":"","sources":["../../../src/components/msa/MSACanvas.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAElD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAA;AACxD,OAAO,OAAO,MAAM,cAAe,CAAA;AACnC,OAAO,cAAc,MAAM,qBAAsB,CAAA;AAIjD,MAAM,SAAS,GAAG,QAAQ,CAAC,UAAU,EAAE,KAAK,EAA2B;IACrE,MAAM,EAAE,GAAG,EAAE,aAAa,EAAE,MAAM,EAAE,cAAc,EAAE,QAAQ,EAAE,UAAU,EAAE,GACxE,KAAK,CAAA;IACP,MAAM,GAAG,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAA;IACxC,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,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,MAAM,GAAG,WAAW,CACxB,CAAC,WAAmB,EAAE,OAAe,EAAE,OAAe,EAAE,EAAE;QACxD,KAAK,CAAC,SAAS,CAAC,WAAW,EAAE,OAAO,EAAE,OAAO,CAAC,CAAA;IAChD,CAAC,EACD,CAAC,KAAK,CAAC,CACR,CAAA;IACD,MAAM,EAAE,WAAW,EAAE,SAAS,EAAE,GAAG,cAAc,CAAC;QAChD,GAAG;QACH,SAAS;QACT,SAAS;QACT,MAAM;QACN,UAAU;KACX,CAAC,CAAA;IAEF,OAAO,CACL,6BACE,GAAG,EAAE,GAAG,iBAKI,YAAY,EACxB,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,QAAQ,EAAE,UAAU;YACpB,MAAM;YACN,KAAK,EAAE,cAAc;YACrB,QAAQ,EAAE,QAAQ;SACnB,IAEA,CAAC,GAAG,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CACrC,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC,CACzB,oBAAC,cAAc,IACb,GAAG,EAAE,GAAG,EAAE,IAAI,EAAE,EAAE,EAClB,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,EAAE,EACX,OAAO,EAAE,EAAE,GACX,CACH,CAAC,CACH,CAAC,CAAC,CAAC,CACF,oBAAC,OAAO,OAAG,CACZ,CACG,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,SAAS,CAAA"}
|
|
@@ -4,8 +4,7 @@ import { observer } from 'mobx-react';
|
|
|
4
4
|
import { useCanvasAutorun } from '../../useCanvasAutorun.js';
|
|
5
5
|
import { renderMouseover } from './renderMSAMouseover.js';
|
|
6
6
|
const MSAMouseoverCanvas = observer(function ({ model, }) {
|
|
7
|
-
const { height,
|
|
8
|
-
const width = msaAreaWidth - verticalScrollbarWidth;
|
|
7
|
+
const { height, msaCanvasWidth: width, highResScaleFactor } = model;
|
|
9
8
|
const canvasWidth = width * highResScaleFactor;
|
|
10
9
|
const canvasHeight = height * highResScaleFactor;
|
|
11
10
|
const ref = useCanvasAutorun({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MSAMouseoverCanvas.js","sourceRoot":"","sources":["../../../src/components/msa/MSAMouseoverCanvas.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,OAAO,EAAE,MAAM,0BAA0B,CAAA;AAClD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAA;AAC5D,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAA;AAIzD,MAAM,kBAAkB,GAAG,QAAQ,CAAC,UAAU,EAC5C,KAAK,GAGN;IACC,MAAM,EAAE,MAAM,EAAE,
|
|
1
|
+
{"version":3,"file":"MSAMouseoverCanvas.js","sourceRoot":"","sources":["../../../src/components/msa/MSAMouseoverCanvas.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,OAAO,EAAE,MAAM,0BAA0B,CAAA;AAClD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAA;AAC5D,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAA;AAIzD,MAAM,kBAAkB,GAAG,QAAQ,CAAC,UAAU,EAC5C,KAAK,GAGN;IACC,MAAM,EAAE,MAAM,EAAE,cAAc,EAAE,KAAK,EAAE,kBAAkB,EAAE,GAAG,KAAK,CAAA;IACnE,MAAM,WAAW,GAAG,KAAK,GAAG,kBAAkB,CAAA;IAC9C,MAAM,YAAY,GAAG,MAAM,GAAG,kBAAkB,CAAA;IAChD,MAAM,GAAG,GAAG,gBAAgB,CAAC;QAC3B,IAAI,EAAE,GAAG,CAAC,EAAE;YACV,IAAI,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC;gBACnB,eAAe,CAAC,EAAE,GAAG,EAAE,KAAK,EAAE,CAAC,CAAA;YACjC,CAAC;QACH,CAAC;QACD,KAAK,EAAE,WAAW;QAClB,MAAM,EAAE,YAAY;QACpB,IAAI,EAAE,CAAC,KAAK,CAAC;KACd,CAAC,CAAA;IAEF,OAAO,CACL,gCACE,GAAG,EAAE,GAAG,EACR,EAAE,EAAC,WAAW,EACd,KAAK,EAAE,WAAW,EAClB,MAAM,EAAE,YAAY,EACpB,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"}
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { observer } from 'mobx-react';
|
|
3
|
-
import
|
|
3
|
+
import AnnotationLegend from './AnnotationLegend.js';
|
|
4
4
|
import MSACanvas from './MSACanvas.js';
|
|
5
5
|
import MSAMouseoverCanvas from './MSAMouseoverCanvas.js';
|
|
6
6
|
const MSAPanel = observer(function ({ model }) {
|
|
7
7
|
return (React.createElement("div", { style: { position: 'relative' } },
|
|
8
8
|
React.createElement(MSACanvas, { model: model }),
|
|
9
9
|
React.createElement(MSAMouseoverCanvas, { model: model }),
|
|
10
|
-
React.createElement(
|
|
10
|
+
React.createElement(AnnotationLegend, { model: model })));
|
|
11
11
|
});
|
|
12
12
|
export default MSAPanel;
|
|
13
13
|
//# sourceMappingURL=MSAPanel.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MSAPanel.js","sourceRoot":"","sources":["../../../src/components/msa/MSAPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,
|
|
1
|
+
{"version":3,"file":"MSAPanel.js","sourceRoot":"","sources":["../../../src/components/msa/MSAPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,gBAAgB,MAAM,uBAAwB,CAAA;AACrD,OAAO,SAAS,MAAM,gBAAiB,CAAA;AACvC,OAAO,kBAAkB,MAAM,yBAA0B,CAAA;AAKzD,MAAM,QAAQ,GAAG,QAAQ,CAAC,UAAU,EAAE,KAAK,EAA2B;IACpE,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;QACpC,oBAAC,gBAAgB,IAAC,KAAK,EAAE,KAAK,GAAI,CAC9B,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,QAAQ,CAAA"}
|