@jbrowse/plugin-dotplot-view 3.5.1 → 3.6.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.
Files changed (29) hide show
  1. package/dist/DotplotView/components/ImportForm/ImportSyntenyOpenCustomTrack.js +2 -53
  2. package/dist/DotplotView/components/ImportForm/ImportSyntenyTrackSelector.js +2 -2
  3. package/dist/DotplotView/components/ImportForm/selectors/AnchorsFileSelector.d.ts +3 -0
  4. package/dist/DotplotView/components/ImportForm/selectors/AnchorsFileSelector.js +23 -0
  5. package/dist/DotplotView/components/ImportForm/selectors/PifGzSelector.d.ts +3 -0
  6. package/dist/DotplotView/components/ImportForm/selectors/PifGzSelector.js +13 -0
  7. package/dist/DotplotView/components/ImportForm/selectors/SelectorTypes.d.ts +23 -0
  8. package/dist/DotplotView/components/ImportForm/selectors/SelectorTypes.js +10 -0
  9. package/dist/DotplotView/components/ImportForm/selectors/SwapAssemblies.d.ts +13 -0
  10. package/dist/DotplotView/components/ImportForm/selectors/SwapAssemblies.js +32 -0
  11. package/dist/DotplotView/components/ImportForm/selectors/SyntenyFileSelector.d.ts +3 -0
  12. package/dist/DotplotView/components/ImportForm/selectors/SyntenyFileSelector.js +24 -0
  13. package/dist/DotplotView/components/ImportForm/selectors/index.d.ts +3 -0
  14. package/dist/DotplotView/components/ImportForm/selectors/index.js +12 -0
  15. package/esm/DotplotView/components/ImportForm/ImportSyntenyOpenCustomTrack.js +4 -52
  16. package/esm/DotplotView/components/ImportForm/ImportSyntenyTrackSelector.js +2 -2
  17. package/esm/DotplotView/components/ImportForm/selectors/AnchorsFileSelector.d.ts +3 -0
  18. package/esm/DotplotView/components/ImportForm/selectors/AnchorsFileSelector.js +18 -0
  19. package/esm/DotplotView/components/ImportForm/selectors/PifGzSelector.d.ts +3 -0
  20. package/esm/DotplotView/components/ImportForm/selectors/PifGzSelector.js +8 -0
  21. package/esm/DotplotView/components/ImportForm/selectors/SelectorTypes.d.ts +23 -0
  22. package/esm/DotplotView/components/ImportForm/selectors/SelectorTypes.js +7 -0
  23. package/esm/DotplotView/components/ImportForm/selectors/SwapAssemblies.d.ts +13 -0
  24. package/esm/DotplotView/components/ImportForm/selectors/SwapAssemblies.js +27 -0
  25. package/esm/DotplotView/components/ImportForm/selectors/SyntenyFileSelector.d.ts +3 -0
  26. package/esm/DotplotView/components/ImportForm/selectors/SyntenyFileSelector.js +19 -0
  27. package/esm/DotplotView/components/ImportForm/selectors/index.d.ts +3 -0
  28. package/esm/DotplotView/components/ImportForm/selectors/index.js +3 -0
  29. package/package.json +4 -4
@@ -1,15 +1,12 @@
1
1
  "use strict";
2
- var __importDefault = (this && this.__importDefault) || function (mod) {
3
- return (mod && mod.__esModule) ? mod : { "default": mod };
4
- };
5
2
  Object.defineProperty(exports, "__esModule", { value: true });
6
3
  const jsx_runtime_1 = require("react/jsx-runtime");
7
4
  const react_1 = require("react");
8
5
  const ui_1 = require("@jbrowse/core/ui");
9
- const Help_1 = __importDefault(require("@mui/icons-material/Help"));
10
6
  const material_1 = require("@mui/material");
11
7
  const mobx_react_1 = require("mobx-react");
12
8
  const getAdapter_1 = require("./getAdapter");
9
+ const selectors_1 = require("./selectors");
13
10
  const util_1 = require("./util");
14
11
  const ImportSyntenyOpenCustomTrack = (0, mobx_react_1.observer)(function ({ model, assembly1, assembly2, }) {
15
12
  const [swap, setSwap] = (0, react_1.useState)(false);
@@ -63,13 +60,6 @@ const ImportSyntenyOpenCustomTrack = (0, mobx_react_1.observer)(function ({ mode
63
60
  indexFileLocation,
64
61
  radioOption,
65
62
  ]);
66
- const helpStrings = {
67
- '.paf': 'minimap2 target.fa query.fa',
68
- '.pif.gz': 'minimap2 target.fa query.fa',
69
- '.out': 'mashmap target.fa query.fa',
70
- '.delta': 'mummer target.fa query.fa',
71
- '.chain': 'e.g. queryToTarget.chain',
72
- };
73
63
  return ((0, jsx_runtime_1.jsxs)(material_1.Paper, { style: { padding: 12 }, children: [error ? (0, jsx_runtime_1.jsx)(ui_1.ErrorMessage, { error: error }) : null, (0, jsx_runtime_1.jsx)(material_1.Typography, { style: { textAlign: 'center' }, children: "Add a .paf (minimap2), .delta (Mummer), .chain (UCSC liftover), .anchors or .anchors.simple (MCScan), or .pif.gz (jbrowse CLI make-pif) file to view. These file types can also be gzipped." }), (0, jsx_runtime_1.jsx)(material_1.RadioGroup, { value: radioOption, onChange: event => {
74
64
  setValue(event.target.value);
75
65
  }, children: (0, jsx_runtime_1.jsx)(material_1.Grid, { container: true, justifyContent: "center", children: [
@@ -83,47 +73,6 @@ const ImportSyntenyOpenCustomTrack = (0, mobx_react_1.observer)(function ({ mode
83
73
  ].map(extension => ((0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { value: extension, control: (0, jsx_runtime_1.jsx)(material_1.Radio, {}), label: extension }, extension))) }) }), (0, jsx_runtime_1.jsx)(material_1.Grid, { container: true, justifyContent: "center", children: radioOption === '.paf' ||
84
74
  radioOption === '.out' ||
85
75
  radioOption === '.delta' ||
86
- radioOption === '.chain' ||
87
- radioOption === '.pif.gz' ? ((0, jsx_runtime_1.jsxs)("div", { style: {
88
- display: 'flex',
89
- flexDirection: 'column',
90
- gap: 10,
91
- }, children: [(0, jsx_runtime_1.jsx)(ui_1.FileSelector, { name: `${radioOption} location`, inline: true, description: "", location: fileLocation, setLocation: loc => {
92
- setFileLocation(loc);
93
- } }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("div", { children: ["Verify or click swap", (0, jsx_runtime_1.jsx)(material_1.Tooltip, { title: (0, jsx_runtime_1.jsx)("code", { children: helpStrings[radioOption] }), children: (0, jsx_runtime_1.jsx)(Help_1.default, {}) })] }), (0, jsx_runtime_1.jsxs)("div", { style: {
94
- display: 'flex',
95
- gap: 20,
96
- }, children: [(0, jsx_runtime_1.jsxs)("div", { style: {
97
- display: 'grid',
98
- gridTemplateColumns: '1fr 1fr',
99
- gap: 4,
100
- alignItems: 'center',
101
- }, children: [(0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)("i", { children: swap ? assembly2 : assembly1 }) }), (0, jsx_runtime_1.jsx)("div", { children: "query assembly" }), (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)("i", { children: swap ? assembly1 : assembly2 }) }), (0, jsx_runtime_1.jsx)("div", { children: "target assembly" })] }), (0, jsx_runtime_1.jsx)(material_1.Button, { variant: "contained", onClick: () => {
102
- setSwap(!swap);
103
- }, children: "Swap?" })] })] })] })) : value === '.anchors' || value === '.anchors.simple' ? ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("div", { style: { margin: 20 }, children: ["Open the ", value, " and .bed files for both genome assemblies from the MCScan (Python version) pipeline", ' ', (0, jsx_runtime_1.jsx)("a", { href: "https://github.com/tanghaibao/jcvi/wiki/MCscan-(Python-version)", children: "(more info)" })] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)(ui_1.FileSelector, { inline: true, name: value, location: fileLocation, setLocation: loc => {
104
- setFileLocation(loc);
105
- } }), (0, jsx_runtime_1.jsx)(ui_1.FileSelector, { inline: true, name: "genome 1 .bed (left column of anchors file)", description: "", location: bed1Location, setLocation: loc => {
106
- setBed1Location(loc);
107
- } }), (0, jsx_runtime_1.jsx)(ui_1.FileSelector, { inline: true, name: "genome 2 .bed (right column of anchors file)", description: "", location: bed2Location, setLocation: loc => {
108
- setBed2Location(loc);
109
- } })] }), (0, jsx_runtime_1.jsxs)("div", { style: {
110
- margin: 'auto',
111
- display: 'flex',
112
- justifyContent: 'center',
113
- gap: 20,
114
- }, children: [(0, jsx_runtime_1.jsxs)("div", { style: {
115
- display: 'grid',
116
- gridTemplateColumns: '1fr 1fr',
117
- gap: 4,
118
- alignItems: 'center',
119
- }, children: [(0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)("i", { children: swap ? assembly2 : assembly1 }) }), (0, jsx_runtime_1.jsx)("div", { children: "bed1 assembly" }), (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)("i", { children: swap ? assembly1 : assembly2 }) }), (0, jsx_runtime_1.jsx)("div", { children: "bed2 assembly" })] }), (0, jsx_runtime_1.jsx)(material_1.Button, { variant: "contained", onClick: () => {
120
- setSwap(!swap);
121
- }, children: "Swap?" })] })] })) : value === '.pif.gz' ? ((0, jsx_runtime_1.jsxs)("div", { style: { display: 'flex' }, children: [(0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(ui_1.FileSelector, { name: `${value} location`, description: "", location: fileLocation, setLocation: loc => {
122
- setFileLocation(loc);
123
- } }) }), (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(ui_1.FileSelector, { name: `${value} index location`, description: "", location: indexFileLocation, setLocation: loc => {
124
- setIndexFileLocation(loc);
125
- } }) })] })) : ((0, jsx_runtime_1.jsx)(ui_1.FileSelector, { name: value ? `${value} location` : '', description: "", location: fileLocation, setLocation: loc => {
126
- setFileLocation(loc);
127
- } })) })] }));
76
+ radioOption === '.chain' ? ((0, jsx_runtime_1.jsx)(selectors_1.SyntenyFileSelector, { radioOption: radioOption, fileLocation: fileLocation, setFileLocation: setFileLocation, assembly1: assembly1, assembly2: assembly2, swap: swap, setSwap: setSwap })) : radioOption === '.anchors' || radioOption === '.anchors.simple' ? ((0, jsx_runtime_1.jsx)(selectors_1.AnchorsFileSelector, { radioOption: radioOption, fileLocation: fileLocation, setFileLocation: setFileLocation, assembly1: assembly1, assembly2: assembly2, swap: swap, setSwap: setSwap, bed1Location: bed1Location, setBed1Location: setBed1Location, bed2Location: bed2Location, setBed2Location: setBed2Location })) : radioOption === '.pif.gz' ? ((0, jsx_runtime_1.jsx)(selectors_1.PifGzSelector, { radioOption: radioOption, fileLocation: fileLocation, setFileLocation: setFileLocation, assembly1: assembly1, assembly2: assembly2, swap: swap, setSwap: setSwap, indexFileLocation: indexFileLocation, setIndexFileLocation: setIndexFileLocation })) : null })] }));
128
77
  });
129
78
  exports.default = ImportSyntenyOpenCustomTrack;
@@ -9,7 +9,7 @@ const util_1 = require("@jbrowse/core/util");
9
9
  const tracks_1 = require("@jbrowse/core/util/tracks");
10
10
  const material_1 = require("@mui/material");
11
11
  const mobx_react_1 = require("mobx-react");
12
- function f(track, assembly1, assembly2) {
12
+ function isRelevantTrack(track, assembly1, assembly2) {
13
13
  const assemblyNames = (0, configuration_1.readConfObject)(track, 'assemblyNames');
14
14
  return (assemblyNames.includes(assembly1) &&
15
15
  assemblyNames.includes(assembly2) &&
@@ -23,7 +23,7 @@ const ImportSyntenyTrackSelector = (0, mobx_react_1.observer)(function ({ model,
23
23
  ...tracks,
24
24
  ...(sessionTracks || []),
25
25
  ];
26
- const filteredTracks = allTracks.filter(t => f(t, assembly2, assembly1));
26
+ const filteredTracks = allTracks.filter(t => isRelevantTrack(t, assembly2, assembly1));
27
27
  const resetTrack = ((_a = filteredTracks[0]) === null || _a === void 0 ? void 0 : _a.trackId) || '';
28
28
  const [value, setValue] = (0, react_1.useState)(resetTrack);
29
29
  (0, react_1.useEffect)(() => {
@@ -0,0 +1,3 @@
1
+ import type { SelectorProps } from './SelectorTypes';
2
+ declare const AnchorsFileSelector: ({ assembly1, assembly2, swap, setSwap, fileLocation, setFileLocation, bed1Location, setBed1Location, bed2Location, setBed2Location, radioOption, }: SelectorProps) => import("react/jsx-runtime").JSX.Element;
3
+ export default AnchorsFileSelector;
@@ -0,0 +1,23 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ const jsx_runtime_1 = require("react/jsx-runtime");
7
+ const ui_1 = require("@jbrowse/core/ui");
8
+ const mobx_react_1 = require("mobx-react");
9
+ const SwapAssemblies_1 = __importDefault(require("./SwapAssemblies"));
10
+ const AnchorsFileSelector = (0, mobx_react_1.observer)(function ({ assembly1, assembly2, swap, setSwap, fileLocation, setFileLocation, bed1Location, setBed1Location, bed2Location, setBed2Location, radioOption, }) {
11
+ return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("div", { style: { margin: 20 }, children: ["Open the ", radioOption, " and .bed files for both genome assemblies from the MCScan (Python version) pipeline", ' ', (0, jsx_runtime_1.jsx)("a", { href: "https://github.com/tanghaibao/jcvi/wiki/MCscan-(Python-version)", children: "(more info)" })] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)(ui_1.FileSelector, { inline: true, name: radioOption, location: fileLocation, setLocation: loc => {
12
+ setFileLocation(loc);
13
+ } }), (0, jsx_runtime_1.jsx)(ui_1.FileSelector, { inline: true, name: "genome 1 .bed (left column of anchors file)", description: "", location: bed1Location, setLocation: loc => {
14
+ if (setBed1Location) {
15
+ setBed1Location(loc);
16
+ }
17
+ } }), (0, jsx_runtime_1.jsx)(ui_1.FileSelector, { inline: true, name: "genome 2 .bed (right column of anchors file)", description: "", location: bed2Location, setLocation: loc => {
18
+ if (setBed2Location) {
19
+ setBed2Location(loc);
20
+ }
21
+ } })] }), (0, jsx_runtime_1.jsx)(SwapAssemblies_1.default, { swap: swap, radioOption: radioOption, assembly1: assembly1, assembly2: assembly2, setSwap: setSwap, text1: "bed 1 assembly", text2: "bed 2 assembly" })] }));
22
+ });
23
+ exports.default = AnchorsFileSelector;
@@ -0,0 +1,3 @@
1
+ import type { SelectorProps } from './SelectorTypes';
2
+ declare const PifGzSelector: ({ assembly1, assembly2, swap, setSwap, fileLocation, setFileLocation, indexFileLocation, setIndexFileLocation, radioOption, }: SelectorProps) => import("react/jsx-runtime").JSX.Element;
3
+ export default PifGzSelector;
@@ -0,0 +1,13 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ const jsx_runtime_1 = require("react/jsx-runtime");
7
+ const ui_1 = require("@jbrowse/core/ui");
8
+ const mobx_react_1 = require("mobx-react");
9
+ const SwapAssemblies_1 = __importDefault(require("./SwapAssemblies"));
10
+ const PifGzSelector = (0, mobx_react_1.observer)(function ({ assembly1, assembly2, swap, setSwap, fileLocation, setFileLocation, indexFileLocation = undefined, setIndexFileLocation = () => { }, radioOption, }) {
11
+ return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("div", { style: { margin: 20 }, children: ["Open the ", radioOption, " and .pif.gz and index file (.pif.gz.tbi or .pif.gz.csi) files for created by `jbrowse make-pif`"] }), (0, jsx_runtime_1.jsxs)("div", { style: { maxWidth: 400, margin: '0 auto' }, children: [(0, jsx_runtime_1.jsx)(ui_1.FileSelector, { name: `${radioOption} location`, inline: true, description: "", location: fileLocation, setLocation: setFileLocation }), (0, jsx_runtime_1.jsx)(ui_1.FileSelector, { name: `${radioOption} index location (.tbi or .csi)`, inline: true, description: "", location: indexFileLocation, setLocation: setIndexFileLocation }), (0, jsx_runtime_1.jsx)(SwapAssemblies_1.default, { swap: swap, radioOption: radioOption, assembly1: assembly1, assembly2: assembly2, setSwap: setSwap, text1: "query assembly", text2: "target assembly" })] })] }));
12
+ });
13
+ exports.default = PifGzSelector;
@@ -0,0 +1,23 @@
1
+ import type { FileLocation } from '@jbrowse/core/util/types';
2
+ export declare const helpStrings: {
3
+ readonly '.paf': "minimap2 target.fa query.fa";
4
+ readonly '.pif.gz': "minimap2 target.fa query.fa";
5
+ readonly '.out': "mashmap target.fa query.fa";
6
+ readonly '.delta': "mummer target.fa query.fa";
7
+ readonly '.chain': "e.g. queryToTarget.chain";
8
+ };
9
+ export interface SelectorProps {
10
+ assembly1?: string;
11
+ assembly2?: string;
12
+ swap?: boolean;
13
+ setSwap?: (arg: boolean) => void;
14
+ fileLocation?: FileLocation;
15
+ setFileLocation: (arg: FileLocation) => void;
16
+ indexFileLocation?: FileLocation;
17
+ setIndexFileLocation?: (arg: FileLocation) => void;
18
+ bed1Location?: FileLocation;
19
+ setBed1Location?: (arg: FileLocation) => void;
20
+ bed2Location?: FileLocation;
21
+ setBed2Location?: (arg: FileLocation) => void;
22
+ radioOption: string;
23
+ }
@@ -0,0 +1,10 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.helpStrings = void 0;
4
+ exports.helpStrings = {
5
+ '.paf': 'minimap2 target.fa query.fa',
6
+ '.pif.gz': 'minimap2 target.fa query.fa',
7
+ '.out': 'mashmap target.fa query.fa',
8
+ '.delta': 'mummer target.fa query.fa',
9
+ '.chain': 'e.g. queryToTarget.chain',
10
+ };
@@ -0,0 +1,13 @@
1
+ import type { ReactNode } from 'react';
2
+ export interface SwapAssembliesProps {
3
+ assembly1?: string;
4
+ assembly2?: string;
5
+ swap?: boolean;
6
+ setSwap?: (arg: boolean) => void;
7
+ radioOption: string;
8
+ helpContent?: ReactNode;
9
+ text1: string;
10
+ text2: string;
11
+ }
12
+ declare const SwapAssemblies: ({ assembly1, assembly2, swap, setSwap, radioOption, helpContent, text1, text2, }: SwapAssembliesProps) => import("react/jsx-runtime").JSX.Element;
13
+ export default SwapAssemblies;
@@ -0,0 +1,32 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ const jsx_runtime_1 = require("react/jsx-runtime");
7
+ const Help_1 = __importDefault(require("@mui/icons-material/Help"));
8
+ const material_1 = require("@mui/material");
9
+ const mobx_react_1 = require("mobx-react");
10
+ const mui_1 = require("tss-react/mui");
11
+ const SelectorTypes_1 = require("./SelectorTypes");
12
+ const useStyles = (0, mui_1.makeStyles)()({
13
+ row: {
14
+ display: 'flex',
15
+ gap: 20,
16
+ },
17
+ swap: {
18
+ display: 'grid',
19
+ gridTemplateColumns: '1fr 1fr',
20
+ gap: 4,
21
+ alignItems: 'center',
22
+ },
23
+ });
24
+ const SwapAssemblies = (0, mobx_react_1.observer)(function ({ assembly1, assembly2, swap, setSwap, radioOption, helpContent, text1, text2, }) {
25
+ const { classes } = useStyles();
26
+ return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("div", { children: ["Verify or click swap", (0, jsx_runtime_1.jsx)(material_1.Tooltip, { title: helpContent || ((0, jsx_runtime_1.jsx)("code", { children: SelectorTypes_1.helpStrings[radioOption] })), children: (0, jsx_runtime_1.jsx)(Help_1.default, {}) })] }), (0, jsx_runtime_1.jsxs)("div", { className: classes.row, children: [(0, jsx_runtime_1.jsxs)("div", { className: classes.swap, children: [(0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)("i", { children: swap ? assembly2 : assembly1 }) }), (0, jsx_runtime_1.jsx)("div", { children: text1 }), (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)("i", { children: swap ? assembly1 : assembly2 }) }), (0, jsx_runtime_1.jsx)("div", { children: text2 })] }), (0, jsx_runtime_1.jsx)(material_1.Button, { variant: "contained", onClick: () => {
27
+ if (setSwap) {
28
+ setSwap(!swap);
29
+ }
30
+ }, children: "Swap?" })] })] }));
31
+ });
32
+ exports.default = SwapAssemblies;
@@ -0,0 +1,3 @@
1
+ import type { SelectorProps } from './SelectorTypes';
2
+ declare const SyntenyFileSelector: ({ assembly1, assembly2, swap, setSwap, fileLocation, setFileLocation, radioOption, }: SelectorProps) => import("react/jsx-runtime").JSX.Element;
3
+ export default SyntenyFileSelector;
@@ -0,0 +1,24 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ const jsx_runtime_1 = require("react/jsx-runtime");
7
+ const ui_1 = require("@jbrowse/core/ui");
8
+ const mobx_react_1 = require("mobx-react");
9
+ const mui_1 = require("tss-react/mui");
10
+ const SwapAssemblies_1 = __importDefault(require("./SwapAssemblies"));
11
+ const useStyles = (0, mui_1.makeStyles)()({
12
+ container: {
13
+ display: 'flex',
14
+ flexDirection: 'column',
15
+ gap: 10,
16
+ },
17
+ });
18
+ const SyntenyFileSelector = (0, mobx_react_1.observer)(function ({ assembly1, assembly2, swap, setSwap, fileLocation, setFileLocation, radioOption, }) {
19
+ const { classes } = useStyles();
20
+ return ((0, jsx_runtime_1.jsxs)("div", { className: classes.container, children: [(0, jsx_runtime_1.jsx)(ui_1.FileSelector, { name: `${radioOption} location`, inline: true, description: "", location: fileLocation, setLocation: loc => {
21
+ setFileLocation(loc);
22
+ } }), (0, jsx_runtime_1.jsx)(SwapAssemblies_1.default, { assembly1: assembly1, assembly2: assembly2, swap: swap, setSwap: setSwap, radioOption: radioOption, text1: "query assembly", text2: "target assembly" })] }));
23
+ });
24
+ exports.default = SyntenyFileSelector;
@@ -0,0 +1,3 @@
1
+ export { default as AnchorsFileSelector } from './AnchorsFileSelector';
2
+ export { default as PifGzSelector } from './PifGzSelector';
3
+ export { default as SyntenyFileSelector } from './SyntenyFileSelector';
@@ -0,0 +1,12 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ exports.SyntenyFileSelector = exports.PifGzSelector = exports.AnchorsFileSelector = void 0;
7
+ var AnchorsFileSelector_1 = require("./AnchorsFileSelector");
8
+ Object.defineProperty(exports, "AnchorsFileSelector", { enumerable: true, get: function () { return __importDefault(AnchorsFileSelector_1).default; } });
9
+ var PifGzSelector_1 = require("./PifGzSelector");
10
+ Object.defineProperty(exports, "PifGzSelector", { enumerable: true, get: function () { return __importDefault(PifGzSelector_1).default; } });
11
+ var SyntenyFileSelector_1 = require("./SyntenyFileSelector");
12
+ Object.defineProperty(exports, "SyntenyFileSelector", { enumerable: true, get: function () { return __importDefault(SyntenyFileSelector_1).default; } });
@@ -1,10 +1,10 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { useEffect, useState } from 'react';
3
- import { ErrorMessage, FileSelector } from '@jbrowse/core/ui';
4
- import HelpIcon from '@mui/icons-material/Help';
5
- import { Button, FormControlLabel, Grid, Paper, Radio, RadioGroup, Tooltip, Typography, } from '@mui/material';
3
+ import { ErrorMessage } from '@jbrowse/core/ui';
4
+ import { FormControlLabel, Grid, Paper, Radio, RadioGroup, Typography, } from '@mui/material';
6
5
  import { observer } from 'mobx-react';
7
6
  import { getAdapter } from './getAdapter';
7
+ import { AnchorsFileSelector, PifGzSelector, SyntenyFileSelector, } from './selectors';
8
8
  import { basename, extName, getName, stripGz } from './util';
9
9
  const ImportSyntenyOpenCustomTrack = observer(function ({ model, assembly1, assembly2, }) {
10
10
  const [swap, setSwap] = useState(false);
@@ -58,13 +58,6 @@ const ImportSyntenyOpenCustomTrack = observer(function ({ model, assembly1, asse
58
58
  indexFileLocation,
59
59
  radioOption,
60
60
  ]);
61
- const helpStrings = {
62
- '.paf': 'minimap2 target.fa query.fa',
63
- '.pif.gz': 'minimap2 target.fa query.fa',
64
- '.out': 'mashmap target.fa query.fa',
65
- '.delta': 'mummer target.fa query.fa',
66
- '.chain': 'e.g. queryToTarget.chain',
67
- };
68
61
  return (_jsxs(Paper, { style: { padding: 12 }, children: [error ? _jsx(ErrorMessage, { error: error }) : null, _jsx(Typography, { style: { textAlign: 'center' }, children: "Add a .paf (minimap2), .delta (Mummer), .chain (UCSC liftover), .anchors or .anchors.simple (MCScan), or .pif.gz (jbrowse CLI make-pif) file to view. These file types can also be gzipped." }), _jsx(RadioGroup, { value: radioOption, onChange: event => {
69
62
  setValue(event.target.value);
70
63
  }, children: _jsx(Grid, { container: true, justifyContent: "center", children: [
@@ -78,47 +71,6 @@ const ImportSyntenyOpenCustomTrack = observer(function ({ model, assembly1, asse
78
71
  ].map(extension => (_jsx(FormControlLabel, { value: extension, control: _jsx(Radio, {}), label: extension }, extension))) }) }), _jsx(Grid, { container: true, justifyContent: "center", children: radioOption === '.paf' ||
79
72
  radioOption === '.out' ||
80
73
  radioOption === '.delta' ||
81
- radioOption === '.chain' ||
82
- radioOption === '.pif.gz' ? (_jsxs("div", { style: {
83
- display: 'flex',
84
- flexDirection: 'column',
85
- gap: 10,
86
- }, children: [_jsx(FileSelector, { name: `${radioOption} location`, inline: true, description: "", location: fileLocation, setLocation: loc => {
87
- setFileLocation(loc);
88
- } }), _jsxs("div", { children: [_jsxs("div", { children: ["Verify or click swap", _jsx(Tooltip, { title: _jsx("code", { children: helpStrings[radioOption] }), children: _jsx(HelpIcon, {}) })] }), _jsxs("div", { style: {
89
- display: 'flex',
90
- gap: 20,
91
- }, children: [_jsxs("div", { style: {
92
- display: 'grid',
93
- gridTemplateColumns: '1fr 1fr',
94
- gap: 4,
95
- alignItems: 'center',
96
- }, children: [_jsx("div", { children: _jsx("i", { children: swap ? assembly2 : assembly1 }) }), _jsx("div", { children: "query assembly" }), _jsx("div", { children: _jsx("i", { children: swap ? assembly1 : assembly2 }) }), _jsx("div", { children: "target assembly" })] }), _jsx(Button, { variant: "contained", onClick: () => {
97
- setSwap(!swap);
98
- }, children: "Swap?" })] })] })] })) : value === '.anchors' || value === '.anchors.simple' ? (_jsxs("div", { children: [_jsxs("div", { style: { margin: 20 }, children: ["Open the ", value, " and .bed files for both genome assemblies from the MCScan (Python version) pipeline", ' ', _jsx("a", { href: "https://github.com/tanghaibao/jcvi/wiki/MCscan-(Python-version)", children: "(more info)" })] }), _jsxs("div", { children: [_jsx(FileSelector, { inline: true, name: value, location: fileLocation, setLocation: loc => {
99
- setFileLocation(loc);
100
- } }), _jsx(FileSelector, { inline: true, name: "genome 1 .bed (left column of anchors file)", description: "", location: bed1Location, setLocation: loc => {
101
- setBed1Location(loc);
102
- } }), _jsx(FileSelector, { inline: true, name: "genome 2 .bed (right column of anchors file)", description: "", location: bed2Location, setLocation: loc => {
103
- setBed2Location(loc);
104
- } })] }), _jsxs("div", { style: {
105
- margin: 'auto',
106
- display: 'flex',
107
- justifyContent: 'center',
108
- gap: 20,
109
- }, children: [_jsxs("div", { style: {
110
- display: 'grid',
111
- gridTemplateColumns: '1fr 1fr',
112
- gap: 4,
113
- alignItems: 'center',
114
- }, children: [_jsx("div", { children: _jsx("i", { children: swap ? assembly2 : assembly1 }) }), _jsx("div", { children: "bed1 assembly" }), _jsx("div", { children: _jsx("i", { children: swap ? assembly1 : assembly2 }) }), _jsx("div", { children: "bed2 assembly" })] }), _jsx(Button, { variant: "contained", onClick: () => {
115
- setSwap(!swap);
116
- }, children: "Swap?" })] })] })) : value === '.pif.gz' ? (_jsxs("div", { style: { display: 'flex' }, children: [_jsx("div", { children: _jsx(FileSelector, { name: `${value} location`, description: "", location: fileLocation, setLocation: loc => {
117
- setFileLocation(loc);
118
- } }) }), _jsx("div", { children: _jsx(FileSelector, { name: `${value} index location`, description: "", location: indexFileLocation, setLocation: loc => {
119
- setIndexFileLocation(loc);
120
- } }) })] })) : (_jsx(FileSelector, { name: value ? `${value} location` : '', description: "", location: fileLocation, setLocation: loc => {
121
- setFileLocation(loc);
122
- } })) })] }));
74
+ radioOption === '.chain' ? (_jsx(SyntenyFileSelector, { radioOption: radioOption, fileLocation: fileLocation, setFileLocation: setFileLocation, assembly1: assembly1, assembly2: assembly2, swap: swap, setSwap: setSwap })) : radioOption === '.anchors' || radioOption === '.anchors.simple' ? (_jsx(AnchorsFileSelector, { radioOption: radioOption, fileLocation: fileLocation, setFileLocation: setFileLocation, assembly1: assembly1, assembly2: assembly2, swap: swap, setSwap: setSwap, bed1Location: bed1Location, setBed1Location: setBed1Location, bed2Location: bed2Location, setBed2Location: setBed2Location })) : radioOption === '.pif.gz' ? (_jsx(PifGzSelector, { radioOption: radioOption, fileLocation: fileLocation, setFileLocation: setFileLocation, assembly1: assembly1, assembly2: assembly2, swap: swap, setSwap: setSwap, indexFileLocation: indexFileLocation, setIndexFileLocation: setIndexFileLocation })) : null })] }));
123
75
  });
124
76
  export default ImportSyntenyOpenCustomTrack;
@@ -7,7 +7,7 @@ import { getSession } from '@jbrowse/core/util';
7
7
  import { getTrackName } from '@jbrowse/core/util/tracks';
8
8
  import { MenuItem, Paper, Select, Typography } from '@mui/material';
9
9
  import { observer } from 'mobx-react';
10
- function f(track, assembly1, assembly2) {
10
+ function isRelevantTrack(track, assembly1, assembly2) {
11
11
  const assemblyNames = readConfObject(track, 'assemblyNames');
12
12
  return (assemblyNames.includes(assembly1) &&
13
13
  assemblyNames.includes(assembly2) &&
@@ -21,7 +21,7 @@ const ImportSyntenyTrackSelector = observer(function ({ model, assembly1, assemb
21
21
  ...tracks,
22
22
  ...(sessionTracks || []),
23
23
  ];
24
- const filteredTracks = allTracks.filter(t => f(t, assembly2, assembly1));
24
+ const filteredTracks = allTracks.filter(t => isRelevantTrack(t, assembly2, assembly1));
25
25
  const resetTrack = ((_a = filteredTracks[0]) === null || _a === void 0 ? void 0 : _a.trackId) || '';
26
26
  const [value, setValue] = useState(resetTrack);
27
27
  useEffect(() => {
@@ -0,0 +1,3 @@
1
+ import type { SelectorProps } from './SelectorTypes';
2
+ declare const AnchorsFileSelector: ({ assembly1, assembly2, swap, setSwap, fileLocation, setFileLocation, bed1Location, setBed1Location, bed2Location, setBed2Location, radioOption, }: SelectorProps) => import("react/jsx-runtime").JSX.Element;
3
+ export default AnchorsFileSelector;
@@ -0,0 +1,18 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { FileSelector } from '@jbrowse/core/ui';
3
+ import { observer } from 'mobx-react';
4
+ import SwapAssemblies from './SwapAssemblies';
5
+ const AnchorsFileSelector = observer(function ({ assembly1, assembly2, swap, setSwap, fileLocation, setFileLocation, bed1Location, setBed1Location, bed2Location, setBed2Location, radioOption, }) {
6
+ return (_jsxs("div", { children: [_jsxs("div", { style: { margin: 20 }, children: ["Open the ", radioOption, " and .bed files for both genome assemblies from the MCScan (Python version) pipeline", ' ', _jsx("a", { href: "https://github.com/tanghaibao/jcvi/wiki/MCscan-(Python-version)", children: "(more info)" })] }), _jsxs("div", { children: [_jsx(FileSelector, { inline: true, name: radioOption, location: fileLocation, setLocation: loc => {
7
+ setFileLocation(loc);
8
+ } }), _jsx(FileSelector, { inline: true, name: "genome 1 .bed (left column of anchors file)", description: "", location: bed1Location, setLocation: loc => {
9
+ if (setBed1Location) {
10
+ setBed1Location(loc);
11
+ }
12
+ } }), _jsx(FileSelector, { inline: true, name: "genome 2 .bed (right column of anchors file)", description: "", location: bed2Location, setLocation: loc => {
13
+ if (setBed2Location) {
14
+ setBed2Location(loc);
15
+ }
16
+ } })] }), _jsx(SwapAssemblies, { swap: swap, radioOption: radioOption, assembly1: assembly1, assembly2: assembly2, setSwap: setSwap, text1: "bed 1 assembly", text2: "bed 2 assembly" })] }));
17
+ });
18
+ export default AnchorsFileSelector;
@@ -0,0 +1,3 @@
1
+ import type { SelectorProps } from './SelectorTypes';
2
+ declare const PifGzSelector: ({ assembly1, assembly2, swap, setSwap, fileLocation, setFileLocation, indexFileLocation, setIndexFileLocation, radioOption, }: SelectorProps) => import("react/jsx-runtime").JSX.Element;
3
+ export default PifGzSelector;
@@ -0,0 +1,8 @@
1
+ import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
2
+ import { FileSelector } from '@jbrowse/core/ui';
3
+ import { observer } from 'mobx-react';
4
+ import SwapAssemblies from './SwapAssemblies';
5
+ const PifGzSelector = observer(function ({ assembly1, assembly2, swap, setSwap, fileLocation, setFileLocation, indexFileLocation = undefined, setIndexFileLocation = () => { }, radioOption, }) {
6
+ return (_jsxs("div", { children: [_jsxs("div", { style: { margin: 20 }, children: ["Open the ", radioOption, " and .pif.gz and index file (.pif.gz.tbi or .pif.gz.csi) files for created by `jbrowse make-pif`"] }), _jsxs("div", { style: { maxWidth: 400, margin: '0 auto' }, children: [_jsx(FileSelector, { name: `${radioOption} location`, inline: true, description: "", location: fileLocation, setLocation: setFileLocation }), _jsx(FileSelector, { name: `${radioOption} index location (.tbi or .csi)`, inline: true, description: "", location: indexFileLocation, setLocation: setIndexFileLocation }), _jsx(SwapAssemblies, { swap: swap, radioOption: radioOption, assembly1: assembly1, assembly2: assembly2, setSwap: setSwap, text1: "query assembly", text2: "target assembly" })] })] }));
7
+ });
8
+ export default PifGzSelector;
@@ -0,0 +1,23 @@
1
+ import type { FileLocation } from '@jbrowse/core/util/types';
2
+ export declare const helpStrings: {
3
+ readonly '.paf': "minimap2 target.fa query.fa";
4
+ readonly '.pif.gz': "minimap2 target.fa query.fa";
5
+ readonly '.out': "mashmap target.fa query.fa";
6
+ readonly '.delta': "mummer target.fa query.fa";
7
+ readonly '.chain': "e.g. queryToTarget.chain";
8
+ };
9
+ export interface SelectorProps {
10
+ assembly1?: string;
11
+ assembly2?: string;
12
+ swap?: boolean;
13
+ setSwap?: (arg: boolean) => void;
14
+ fileLocation?: FileLocation;
15
+ setFileLocation: (arg: FileLocation) => void;
16
+ indexFileLocation?: FileLocation;
17
+ setIndexFileLocation?: (arg: FileLocation) => void;
18
+ bed1Location?: FileLocation;
19
+ setBed1Location?: (arg: FileLocation) => void;
20
+ bed2Location?: FileLocation;
21
+ setBed2Location?: (arg: FileLocation) => void;
22
+ radioOption: string;
23
+ }
@@ -0,0 +1,7 @@
1
+ export const helpStrings = {
2
+ '.paf': 'minimap2 target.fa query.fa',
3
+ '.pif.gz': 'minimap2 target.fa query.fa',
4
+ '.out': 'mashmap target.fa query.fa',
5
+ '.delta': 'mummer target.fa query.fa',
6
+ '.chain': 'e.g. queryToTarget.chain',
7
+ };
@@ -0,0 +1,13 @@
1
+ import type { ReactNode } from 'react';
2
+ export interface SwapAssembliesProps {
3
+ assembly1?: string;
4
+ assembly2?: string;
5
+ swap?: boolean;
6
+ setSwap?: (arg: boolean) => void;
7
+ radioOption: string;
8
+ helpContent?: ReactNode;
9
+ text1: string;
10
+ text2: string;
11
+ }
12
+ declare const SwapAssemblies: ({ assembly1, assembly2, swap, setSwap, radioOption, helpContent, text1, text2, }: SwapAssembliesProps) => import("react/jsx-runtime").JSX.Element;
13
+ export default SwapAssemblies;
@@ -0,0 +1,27 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import HelpIcon from '@mui/icons-material/Help';
3
+ import { Button, Tooltip } from '@mui/material';
4
+ import { observer } from 'mobx-react';
5
+ import { makeStyles } from 'tss-react/mui';
6
+ import { helpStrings } from './SelectorTypes';
7
+ const useStyles = makeStyles()({
8
+ row: {
9
+ display: 'flex',
10
+ gap: 20,
11
+ },
12
+ swap: {
13
+ display: 'grid',
14
+ gridTemplateColumns: '1fr 1fr',
15
+ gap: 4,
16
+ alignItems: 'center',
17
+ },
18
+ });
19
+ const SwapAssemblies = observer(function ({ assembly1, assembly2, swap, setSwap, radioOption, helpContent, text1, text2, }) {
20
+ const { classes } = useStyles();
21
+ return (_jsxs("div", { children: [_jsxs("div", { children: ["Verify or click swap", _jsx(Tooltip, { title: helpContent || (_jsx("code", { children: helpStrings[radioOption] })), children: _jsx(HelpIcon, {}) })] }), _jsxs("div", { className: classes.row, children: [_jsxs("div", { className: classes.swap, children: [_jsx("div", { children: _jsx("i", { children: swap ? assembly2 : assembly1 }) }), _jsx("div", { children: text1 }), _jsx("div", { children: _jsx("i", { children: swap ? assembly1 : assembly2 }) }), _jsx("div", { children: text2 })] }), _jsx(Button, { variant: "contained", onClick: () => {
22
+ if (setSwap) {
23
+ setSwap(!swap);
24
+ }
25
+ }, children: "Swap?" })] })] }));
26
+ });
27
+ export default SwapAssemblies;
@@ -0,0 +1,3 @@
1
+ import type { SelectorProps } from './SelectorTypes';
2
+ declare const SyntenyFileSelector: ({ assembly1, assembly2, swap, setSwap, fileLocation, setFileLocation, radioOption, }: SelectorProps) => import("react/jsx-runtime").JSX.Element;
3
+ export default SyntenyFileSelector;
@@ -0,0 +1,19 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { FileSelector } from '@jbrowse/core/ui';
3
+ import { observer } from 'mobx-react';
4
+ import { makeStyles } from 'tss-react/mui';
5
+ import SwapAssemblies from './SwapAssemblies';
6
+ const useStyles = makeStyles()({
7
+ container: {
8
+ display: 'flex',
9
+ flexDirection: 'column',
10
+ gap: 10,
11
+ },
12
+ });
13
+ const SyntenyFileSelector = observer(function ({ assembly1, assembly2, swap, setSwap, fileLocation, setFileLocation, radioOption, }) {
14
+ const { classes } = useStyles();
15
+ return (_jsxs("div", { className: classes.container, children: [_jsx(FileSelector, { name: `${radioOption} location`, inline: true, description: "", location: fileLocation, setLocation: loc => {
16
+ setFileLocation(loc);
17
+ } }), _jsx(SwapAssemblies, { assembly1: assembly1, assembly2: assembly2, swap: swap, setSwap: setSwap, radioOption: radioOption, text1: "query assembly", text2: "target assembly" })] }));
18
+ });
19
+ export default SyntenyFileSelector;
@@ -0,0 +1,3 @@
1
+ export { default as AnchorsFileSelector } from './AnchorsFileSelector';
2
+ export { default as PifGzSelector } from './PifGzSelector';
3
+ export { default as SyntenyFileSelector } from './SyntenyFileSelector';
@@ -0,0 +1,3 @@
1
+ export { default as AnchorsFileSelector } from './AnchorsFileSelector';
2
+ export { default as PifGzSelector } from './PifGzSelector';
3
+ export { default as SyntenyFileSelector } from './SyntenyFileSelector';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@jbrowse/plugin-dotplot-view",
3
- "version": "3.5.1",
3
+ "version": "3.6.0",
4
4
  "description": "JBrowse 2 dotplot view",
5
5
  "keywords": [
6
6
  "jbrowse",
@@ -36,8 +36,8 @@
36
36
  "clean": "rimraf dist esm *.tsbuildinfo"
37
37
  },
38
38
  "dependencies": {
39
- "@jbrowse/core": "^3.5.1",
40
- "@jbrowse/plugin-alignments": "^3.5.1",
39
+ "@jbrowse/core": "^3.6.0",
40
+ "@jbrowse/plugin-alignments": "^3.6.0",
41
41
  "@mui/icons-material": "^7.0.0",
42
42
  "@mui/material": "^7.0.0",
43
43
  "@mui/x-data-grid": "^8.0.0",
@@ -59,5 +59,5 @@
59
59
  "publishConfig": {
60
60
  "access": "public"
61
61
  },
62
- "gitHead": "cb8859da9d838ad2594964777c5c54f385d98f5e"
62
+ "gitHead": "133a68815ab348d156c18d83cffc997356c3cfbb"
63
63
  }