@jbrowse/plugin-wiggle 3.2.0 → 3.4.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/dist/BigWigAdapter/BigWigAdapter.d.ts +0 -1
- package/dist/BigWigAdapter/BigWigAdapter.js +0 -1
- package/dist/LinearWiggleDisplay/model.d.ts +1 -1
- package/dist/MultiLinearWiggleDisplay/components/SourcesGrid.js +2 -2
- package/dist/MultiLinearWiggleDisplay/components/{ClusterDialog/ClusterDialog.d.ts → WiggleClusterDialog/WiggleClusterDialog.d.ts} +2 -2
- package/dist/MultiLinearWiggleDisplay/components/{ClusterDialog/ClusterDialog.js → WiggleClusterDialog/WiggleClusterDialog.js} +7 -7
- package/{esm/MultiLinearWiggleDisplay/components/ClusterDialog/ClusterDialogAuto.d.ts → dist/MultiLinearWiggleDisplay/components/WiggleClusterDialog/WiggleClusterDialogAuto.d.ts} +2 -2
- package/dist/MultiLinearWiggleDisplay/components/{ClusterDialog/ClusterDialogAuto.js → WiggleClusterDialog/WiggleClusterDialogAuto.js} +8 -5
- package/dist/MultiLinearWiggleDisplay/components/{ClusterDialog/ClusterDialogAuto.d.ts → WiggleClusterDialog/WiggleClusterDialogManual.d.ts} +3 -3
- package/dist/MultiLinearWiggleDisplay/components/{ClusterDialog/ClusterDialogManual.js → WiggleClusterDialog/WiggleClusterDialogManual.js} +32 -42
- package/dist/MultiLinearWiggleDisplay/components/YScaleBars.js +2 -2
- package/dist/MultiLinearWiggleDisplay/components/util.d.ts +3 -2
- package/dist/MultiLinearWiggleDisplay/model.d.ts +3 -1
- package/dist/MultiLinearWiggleDisplay/model.js +14 -2
- package/dist/MultiWiggleAdapter/MultiWiggleAdapter.d.ts +0 -1
- package/dist/MultiWiggleAdapter/MultiWiggleAdapter.js +0 -1
- package/dist/WiggleBaseRenderer.d.ts +4 -4
- package/dist/WiggleBaseRenderer.js +1 -1
- package/dist/WiggleRPC/MultiWiggleClusterScoreMatrix.js +2 -5
- package/dist/drawDensity.js +12 -4
- package/dist/drawLine.js +4 -2
- package/dist/drawXY.js +7 -3
- package/dist/shared/SharedWiggleMixin.d.ts +1 -1
- package/esm/BigWigAdapter/BigWigAdapter.d.ts +0 -1
- package/esm/BigWigAdapter/BigWigAdapter.js +0 -1
- package/esm/LinearWiggleDisplay/model.d.ts +1 -1
- package/esm/MultiLinearWiggleDisplay/components/SourcesGrid.js +2 -2
- package/esm/MultiLinearWiggleDisplay/components/{ClusterDialog/ClusterDialog.d.ts → WiggleClusterDialog/WiggleClusterDialog.d.ts} +2 -2
- package/esm/MultiLinearWiggleDisplay/components/{ClusterDialog/ClusterDialog.js → WiggleClusterDialog/WiggleClusterDialog.js} +7 -7
- package/{dist/MultiLinearWiggleDisplay/components/ClusterDialog/ClusterDialogManual.d.ts → esm/MultiLinearWiggleDisplay/components/WiggleClusterDialog/WiggleClusterDialogAuto.d.ts} +3 -3
- package/esm/MultiLinearWiggleDisplay/components/{ClusterDialog/ClusterDialogAuto.js → WiggleClusterDialog/WiggleClusterDialogAuto.js} +8 -5
- package/esm/MultiLinearWiggleDisplay/components/{ClusterDialog/ClusterDialogManual.d.ts → WiggleClusterDialog/WiggleClusterDialogManual.d.ts} +2 -2
- package/esm/MultiLinearWiggleDisplay/components/{ClusterDialog/ClusterDialogManual.js → WiggleClusterDialog/WiggleClusterDialogManual.js} +33 -43
- package/esm/MultiLinearWiggleDisplay/components/YScaleBars.js +2 -2
- package/esm/MultiLinearWiggleDisplay/components/util.d.ts +3 -2
- package/esm/MultiLinearWiggleDisplay/model.d.ts +3 -1
- package/esm/MultiLinearWiggleDisplay/model.js +14 -2
- package/esm/MultiWiggleAdapter/MultiWiggleAdapter.d.ts +0 -1
- package/esm/MultiWiggleAdapter/MultiWiggleAdapter.js +0 -1
- package/esm/WiggleBaseRenderer.d.ts +4 -4
- package/esm/WiggleBaseRenderer.js +1 -1
- package/esm/WiggleRPC/MultiWiggleClusterScoreMatrix.js +2 -5
- package/esm/drawDensity.js +12 -4
- package/esm/drawLine.js +4 -2
- package/esm/drawXY.js +7 -3
- package/esm/shared/SharedWiggleMixin.d.ts +1 -1
- package/package.json +10 -10
- package/dist/WiggleRPC/cluster.d.ts +0 -17
- package/dist/WiggleRPC/cluster.js +0 -84
- package/esm/WiggleRPC/cluster.d.ts +0 -17
- package/esm/WiggleRPC/cluster.js +0 -79
- /package/dist/MultiLinearWiggleDisplay/components/{ClusterDialog → WiggleClusterDialog}/types.d.ts +0 -0
- /package/dist/MultiLinearWiggleDisplay/components/{ClusterDialog → WiggleClusterDialog}/types.js +0 -0
- /package/esm/MultiLinearWiggleDisplay/components/{ClusterDialog → WiggleClusterDialog}/types.d.ts +0 -0
- /package/esm/MultiLinearWiggleDisplay/components/{ClusterDialog → WiggleClusterDialog}/types.js +0 -0
|
@@ -212,7 +212,7 @@ declare function stateModelFactory(pluginManager: PluginManager, configSchema: A
|
|
|
212
212
|
} & {
|
|
213
213
|
addBlock(key: string, block: import("@jbrowse/core/util/blockTypes").BaseBlock): void;
|
|
214
214
|
deleteBlock(key: string): void;
|
|
215
|
-
selectFeature(feature: import("@jbrowse/core/util").Feature): void
|
|
215
|
+
selectFeature(feature: import("@jbrowse/core/util").Feature): Promise<void>;
|
|
216
216
|
navToFeature(feature: import("@jbrowse/core/util").Feature): void;
|
|
217
217
|
clearFeatureSelection(): void;
|
|
218
218
|
setFeatureIdUnderMouse(feature?: string): void;
|
|
@@ -87,8 +87,8 @@ function SourcesGrid({ rows, onChange, showTips, }) {
|
|
|
87
87
|
onChange([...rows]);
|
|
88
88
|
}, onClose: () => {
|
|
89
89
|
setAnchorEl(null);
|
|
90
|
-
} }), (0, jsx_runtime_1.jsx)("div", { style: { height: 400, width: '100%' }, children: (0, jsx_runtime_1.jsx)(x_data_grid_1.DataGrid, { getRowId: row => row.name, checkboxSelection: true,
|
|
91
|
-
setSelected(arg);
|
|
90
|
+
} }), (0, jsx_runtime_1.jsx)("div", { style: { height: 400, width: '100%' }, children: (0, jsx_runtime_1.jsx)(x_data_grid_1.DataGrid, { getRowId: row => row.name, checkboxSelection: true, onRowSelectionModelChange: arg => {
|
|
91
|
+
setSelected([...arg.ids]);
|
|
92
92
|
}, rows: rows, rowHeight: 25, columnHeaderHeight: 33, columns: [
|
|
93
93
|
{
|
|
94
94
|
field: 'color',
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import type { ReducedModel } from './types';
|
|
2
|
-
declare const
|
|
2
|
+
declare const WiggleClusterDialog: ({ model, handleClose, }: {
|
|
3
3
|
model: ReducedModel;
|
|
4
4
|
handleClose: () => void;
|
|
5
5
|
}) => import("react/jsx-runtime").JSX.Element;
|
|
6
|
-
export default
|
|
6
|
+
export default WiggleClusterDialog;
|
|
@@ -8,22 +8,22 @@ const react_1 = require("react");
|
|
|
8
8
|
const ui_1 = require("@jbrowse/core/ui");
|
|
9
9
|
const material_1 = require("@mui/material");
|
|
10
10
|
const mobx_react_1 = require("mobx-react");
|
|
11
|
-
const
|
|
12
|
-
const
|
|
11
|
+
const WiggleClusterDialogAuto_1 = __importDefault(require("./WiggleClusterDialogAuto"));
|
|
12
|
+
const WiggleClusterDialogManual_1 = __importDefault(require("./WiggleClusterDialogManual"));
|
|
13
13
|
function Header({ activeMode, setActiveMode, }) {
|
|
14
14
|
return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(material_1.RadioGroup, { children: Object.entries({
|
|
15
|
-
auto: ((0, jsx_runtime_1.jsx)("div", { children: "Run in-app clustering (
|
|
16
|
-
manual: ((0, jsx_runtime_1.jsx)("div", { children: "Download R script to run clustering (faster
|
|
15
|
+
auto: ((0, jsx_runtime_1.jsx)("div", { children: "Run in-app clustering (slower, particularly for large numbers of samples, uses JS implementation of hclust)" })),
|
|
16
|
+
manual: ((0, jsx_runtime_1.jsx)("div", { children: "Download R script to run clustering (faster, uses R implementation of hclust)" })),
|
|
17
17
|
}).map(([key, val]) => ((0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { control: (0, jsx_runtime_1.jsx)(material_1.Radio, { checked: activeMode === key, onChange: () => {
|
|
18
18
|
setActiveMode(key);
|
|
19
19
|
} }), label: val }, key))) }) }));
|
|
20
20
|
}
|
|
21
|
-
const
|
|
21
|
+
const WiggleClusterDialog = (0, mobx_react_1.observer)(function ({ model, handleClose, }) {
|
|
22
22
|
const [activeMode, setActiveMode] = (0, react_1.useState)('auto');
|
|
23
23
|
return ((0, jsx_runtime_1.jsx)(ui_1.Dialog, { open: true, title: "Cluster by score", maxWidth: "xl", onClose: (_, reason) => {
|
|
24
24
|
if (reason !== 'backdropClick') {
|
|
25
25
|
handleClose();
|
|
26
26
|
}
|
|
27
|
-
}, children: activeMode === 'auto' ? ((0, jsx_runtime_1.jsx)(
|
|
27
|
+
}, children: activeMode === 'auto' ? ((0, jsx_runtime_1.jsx)(WiggleClusterDialogAuto_1.default, { model: model, handleClose: handleClose, children: (0, jsx_runtime_1.jsx)(Header, { activeMode: activeMode, setActiveMode: setActiveMode }) })) : ((0, jsx_runtime_1.jsx)(WiggleClusterDialogManual_1.default, { model: model, handleClose: handleClose, children: (0, jsx_runtime_1.jsx)(Header, { activeMode: activeMode, setActiveMode: setActiveMode }) })) }));
|
|
28
28
|
});
|
|
29
|
-
exports.default =
|
|
29
|
+
exports.default = WiggleClusterDialog;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import type { ReducedModel } from './types';
|
|
2
|
-
declare const
|
|
2
|
+
declare const WiggleClusterDialogAuto: ({ model, children, handleClose, }: {
|
|
3
3
|
model: ReducedModel;
|
|
4
4
|
children: React.ReactNode;
|
|
5
5
|
handleClose: () => void;
|
|
6
6
|
}) => import("react/jsx-runtime").JSX.Element;
|
|
7
|
-
export default
|
|
7
|
+
export default WiggleClusterDialogAuto;
|
|
@@ -9,9 +9,10 @@ const tracks_1 = require("@jbrowse/core/util/tracks");
|
|
|
9
9
|
const material_1 = require("@mui/material");
|
|
10
10
|
const mobx_react_1 = require("mobx-react");
|
|
11
11
|
const mobx_state_tree_1 = require("mobx-state-tree");
|
|
12
|
-
const
|
|
12
|
+
const WiggleClusterDialogAuto = (0, mobx_react_1.observer)(function ({ model, children, handleClose, }) {
|
|
13
13
|
const [progress, setProgress] = (0, react_1.useState)('');
|
|
14
14
|
const [error, setError] = (0, react_1.useState)();
|
|
15
|
+
const [loading, setLoading] = (0, react_1.useState)(false);
|
|
15
16
|
const [stopToken, setStopToken] = (0, react_1.useState)('');
|
|
16
17
|
const [showAdvanced, setShowAdvanced] = (0, react_1.useState)(false);
|
|
17
18
|
const [samplesPerPixel, setSamplesPerPixel] = (0, util_1.useLocalStorage)('cluster-samplesPerPixel', '1');
|
|
@@ -19,12 +20,13 @@ const ClusterDialogAuto = (0, mobx_react_1.observer)(function ({ model, children
|
|
|
19
20
|
setShowAdvanced(!showAdvanced);
|
|
20
21
|
}, children: showAdvanced ? 'Hide advanced options' : 'Show advanced options' }), showAdvanced ? ((0, jsx_runtime_1.jsxs)("div", { style: { marginTop: 20 }, children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { children: "This procedure samples the data at each 'pixel' across the visible by default" }), (0, jsx_runtime_1.jsx)(material_1.TextField, { label: "Samples per pixel (>1 for denser sampling, between 0-1 for sparser sampling)", variant: "outlined", size: "small", value: samplesPerPixel, onChange: event => {
|
|
21
22
|
setSamplesPerPixel(event.target.value);
|
|
22
|
-
} })] })) : null] }), (0, jsx_runtime_1.jsxs)("div", { children: [
|
|
23
|
+
} })] })) : null] }), (0, jsx_runtime_1.jsxs)("div", { children: [loading ? ((0, jsx_runtime_1.jsxs)("div", { style: { padding: 50 }, children: [(0, jsx_runtime_1.jsx)("span", { children: progress || 'Loading...' }), (0, jsx_runtime_1.jsx)(material_1.Button, { onClick: () => {
|
|
23
24
|
(0, stopToken_1.stopStopToken)(stopToken);
|
|
24
|
-
}, children: "Stop" })] })) : null, error ? (0, jsx_runtime_1.jsx)(ui_1.ErrorMessage, { error: error }) : null] })] }), (0, jsx_runtime_1.jsxs)(material_1.DialogActions, { children: [(0, jsx_runtime_1.jsx)(material_1.Button, { variant: "contained", onClick: async () => {
|
|
25
|
+
}, children: "Stop" })] })) : null, error ? (0, jsx_runtime_1.jsx)(ui_1.ErrorMessage, { error: error }) : null] })] }), (0, jsx_runtime_1.jsxs)(material_1.DialogActions, { children: [(0, jsx_runtime_1.jsx)(material_1.Button, { variant: "contained", disabled: loading, onClick: async () => {
|
|
25
26
|
try {
|
|
26
27
|
setError(undefined);
|
|
27
|
-
setProgress('');
|
|
28
|
+
setProgress('Initializing');
|
|
29
|
+
setLoading(true);
|
|
28
30
|
const view = (0, util_1.getContainingView)(model);
|
|
29
31
|
if (!view.initialized) {
|
|
30
32
|
return;
|
|
@@ -63,6 +65,7 @@ const ClusterDialogAuto = (0, mobx_react_1.observer)(function ({ model, children
|
|
|
63
65
|
}
|
|
64
66
|
}
|
|
65
67
|
finally {
|
|
68
|
+
setLoading(false);
|
|
66
69
|
setProgress('');
|
|
67
70
|
setStopToken('');
|
|
68
71
|
}
|
|
@@ -73,4 +76,4 @@ const ClusterDialogAuto = (0, mobx_react_1.observer)(function ({ model, children
|
|
|
73
76
|
}
|
|
74
77
|
}, children: "Cancel" })] })] }));
|
|
75
78
|
});
|
|
76
|
-
exports.default =
|
|
79
|
+
exports.default = WiggleClusterDialogAuto;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import type { ReducedModel } from './types';
|
|
2
|
-
declare const
|
|
2
|
+
declare const WiggleClusterDialogManuals: ({ model, handleClose, children, }: {
|
|
3
3
|
model: ReducedModel;
|
|
4
|
-
children: React.ReactNode;
|
|
5
4
|
handleClose: () => void;
|
|
5
|
+
children: React.ReactNode;
|
|
6
6
|
}) => import("react/jsx-runtime").JSX.Element;
|
|
7
|
-
export default
|
|
7
|
+
export default WiggleClusterDialogManuals;
|
|
@@ -8,7 +8,6 @@ const react_1 = require("react");
|
|
|
8
8
|
const ui_1 = require("@jbrowse/core/ui");
|
|
9
9
|
const util_1 = require("@jbrowse/core/util");
|
|
10
10
|
const tracks_1 = require("@jbrowse/core/util/tracks");
|
|
11
|
-
const Menu_1 = __importDefault(require("@mui/icons-material/Menu"));
|
|
12
11
|
const material_1 = require("@mui/material");
|
|
13
12
|
const copy_to_clipboard_1 = __importDefault(require("copy-to-clipboard"));
|
|
14
13
|
const file_saver_1 = require("file-saver");
|
|
@@ -25,15 +24,15 @@ const useStyles = (0, mui_1.makeStyles)()(theme => ({
|
|
|
25
24
|
gap: theme.spacing(4),
|
|
26
25
|
},
|
|
27
26
|
}));
|
|
28
|
-
const
|
|
27
|
+
const WiggleClusterDialogManuals = (0, mobx_react_1.observer)(function ({ model, handleClose, children, }) {
|
|
29
28
|
const { classes } = useStyles();
|
|
30
29
|
const [paste, setPaste] = (0, react_1.useState)('');
|
|
31
30
|
const [ret, setRet] = (0, react_1.useState)();
|
|
32
31
|
const [error, setError] = (0, react_1.useState)();
|
|
33
32
|
const [loading, setLoading] = (0, react_1.useState)(false);
|
|
34
|
-
const [showAdvanced, setShowAdvanced] = (0,
|
|
35
|
-
const [clusterMethod, setClusterMethod] = (0,
|
|
36
|
-
const [samplesPerPixel, setSamplesPerPixel] = (0,
|
|
33
|
+
const [showAdvanced, setShowAdvanced] = (0, util_1.useLocalStorage)('cluster-showAdvanced', false);
|
|
34
|
+
const [clusterMethod, setClusterMethod] = (0, react_1.useState)('single');
|
|
35
|
+
const [samplesPerPixel, setSamplesPerPixel] = (0, react_1.useState)('1');
|
|
37
36
|
(0, react_1.useEffect)(() => {
|
|
38
37
|
;
|
|
39
38
|
(async () => {
|
|
@@ -82,42 +81,33 @@ cat(resultClusters$order,sep='\\n')`
|
|
|
82
81
|
.map(([key, val]) => [key, ...val].join('\t'))
|
|
83
82
|
.join('\n')
|
|
84
83
|
: undefined;
|
|
85
|
-
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.DialogContent, { children: [children, (0, jsx_runtime_1.jsxs)("div", { style: { marginTop: 50 }, children: [(0, jsx_runtime_1.jsxs)("div", { style: {
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
},
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
},
|
|
113
|
-
], children: (0, jsx_runtime_1.jsx)(Menu_1.default, {}) }) }), (0, jsx_runtime_1.jsx)("div", { children: showAdvanced ? ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "h6", children: "Advanced options" }), (0, jsx_runtime_1.jsx)(material_1.RadioGroup, { children: Object.entries({
|
|
114
|
-
single: 'Single',
|
|
115
|
-
complete: 'Complete',
|
|
116
|
-
}).map(([key, val]) => ((0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { control: (0, jsx_runtime_1.jsx)(material_1.Radio, { checked: clusterMethod === key, onChange: () => {
|
|
117
|
-
setClusterMethod(key);
|
|
118
|
-
} }), label: val }, key))) }), (0, jsx_runtime_1.jsxs)("div", { style: { marginTop: 20 }, children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { children: "This procedure samples the data at each 'pixel' across the visible by default" }), (0, jsx_runtime_1.jsx)(material_1.TextField, { label: "Samples per pixel (>1 for denser sampling, between 0-1 for sparser sampling)", variant: "outlined", size: "small", value: samplesPerPixel, onChange: event => {
|
|
119
|
-
setSamplesPerPixel(event.target.value);
|
|
120
|
-
} })] })] })) : null }), results ? ((0, jsx_runtime_1.jsx)("div", {})) : loading ? ((0, jsx_runtime_1.jsx)(ui_1.LoadingEllipses, { variant: "h6", title: "Generating score matrix" })) : error ? ((0, jsx_runtime_1.jsx)(ui_1.ErrorMessage, { error: error })) : null] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "subtitle2", gutterBottom: true, style: { marginTop: '16px' }, children: "Clustering Results:" }), (0, jsx_runtime_1.jsx)(material_1.TextField, { multiline: true, fullWidth: true, variant: "outlined", placeholder: "Paste results from Rscript here (sequence of numbers, one per line, specifying the new ordering)", rows: 10, value: paste, onChange: event => {
|
|
84
|
+
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.DialogContent, { children: [children, (0, jsx_runtime_1.jsxs)("div", { style: { marginTop: 50 }, children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("div", { style: {
|
|
85
|
+
display: 'flex',
|
|
86
|
+
gap: '8px',
|
|
87
|
+
flexWrap: 'wrap',
|
|
88
|
+
marginBottom: '16px',
|
|
89
|
+
}, children: [(0, jsx_runtime_1.jsx)(material_1.Button, { variant: "contained", onClick: () => {
|
|
90
|
+
(0, file_saver_1.saveAs)(new Blob([results || ''], {
|
|
91
|
+
type: 'text/plain;charset=utf-8',
|
|
92
|
+
}), 'cluster.R');
|
|
93
|
+
}, children: "Download Rscript" }), ' ', "or", ' ', (0, jsx_runtime_1.jsx)(material_1.Button, { variant: "contained", onClick: () => {
|
|
94
|
+
(0, copy_to_clipboard_1.default)(results || '');
|
|
95
|
+
}, children: "Copy Rscript to clipboard" }), ' ', "or", ' ', (0, jsx_runtime_1.jsx)(material_1.Button, { variant: "contained", onClick: () => {
|
|
96
|
+
(0, file_saver_1.saveAs)(new Blob([resultsTsv || ''], {
|
|
97
|
+
type: 'text/plain;charset=utf-8',
|
|
98
|
+
}), 'scores.tsv');
|
|
99
|
+
}, children: "Download TSV" })] }), (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(material_1.Button, { variant: "contained", onClick: () => {
|
|
100
|
+
setShowAdvanced(!showAdvanced);
|
|
101
|
+
}, children: showAdvanced
|
|
102
|
+
? 'Hide advanced options'
|
|
103
|
+
: 'Show advanced options' }) }), showAdvanced ? ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "h6", children: "Advanced options" }), (0, jsx_runtime_1.jsx)(material_1.RadioGroup, { children: Object.entries({
|
|
104
|
+
single: 'Single',
|
|
105
|
+
complete: 'Complete',
|
|
106
|
+
}).map(([key, val]) => ((0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { control: (0, jsx_runtime_1.jsx)(material_1.Radio, { checked: clusterMethod === key, onChange: () => {
|
|
107
|
+
setClusterMethod(key);
|
|
108
|
+
} }), label: val }, key))) }), (0, jsx_runtime_1.jsxs)("div", { style: { marginTop: 20 }, children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { children: "This procedure samples the data at each 'pixel' across the visible by default" }), (0, jsx_runtime_1.jsx)(material_1.TextField, { label: "Samples per pixel (>1 for denser sampling, between 0-1 for sparser sampling)", variant: "outlined", size: "small", value: samplesPerPixel, onChange: event => {
|
|
109
|
+
setSamplesPerPixel(event.target.value);
|
|
110
|
+
} })] })] })) : null, results ? ((0, jsx_runtime_1.jsx)("div", {})) : loading ? ((0, jsx_runtime_1.jsx)(ui_1.LoadingEllipses, { variant: "h6", title: "Generating score matrix" })) : error ? ((0, jsx_runtime_1.jsx)(ui_1.ErrorMessage, { error: error })) : null] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "subtitle2", gutterBottom: true, style: { marginTop: '16px' }, children: "Clustering Results:" }), (0, jsx_runtime_1.jsx)(material_1.TextField, { multiline: true, fullWidth: true, variant: "outlined", placeholder: "Paste results from Rscript here (sequence of numbers, one per line, specifying the new ordering)", rows: 10, value: paste, onChange: event => {
|
|
121
111
|
setPaste(event.target.value);
|
|
122
112
|
}, slotProps: {
|
|
123
113
|
input: {
|
|
@@ -152,4 +142,4 @@ cat(resultClusters$order,sep='\\n')`
|
|
|
152
142
|
handleClose();
|
|
153
143
|
}, children: "Cancel" })] })] }));
|
|
154
144
|
});
|
|
155
|
-
exports.default =
|
|
145
|
+
exports.default = WiggleClusterDialogManuals;
|
|
@@ -22,7 +22,7 @@ const Wrapper = (0, mobx_react_1.observer)(function ({ children, model, exportSV
|
|
|
22
22
|
});
|
|
23
23
|
exports.YScaleBars = (0, mobx_react_1.observer)(function (props) {
|
|
24
24
|
const { model, orientation, exportSVG } = props;
|
|
25
|
-
const { stats, needsFullHeightScalebar, sources } = model;
|
|
26
|
-
return stats && sources ? ((0, jsx_runtime_1.jsx)(Wrapper, { ...props, children: needsFullHeightScalebar ? ((0, jsx_runtime_1.jsx)(FullHeightScaleBar_1.default, { model: model, orientation: orientation, exportSVG: exportSVG })) : ((0, jsx_runtime_1.jsx)(IndividualScaleBars_1.default, { model: model, orientation: orientation, exportSVG: exportSVG })) })) : null;
|
|
25
|
+
const { showSidebar, stats, needsFullHeightScalebar, sources } = model;
|
|
26
|
+
return stats && sources ? ((0, jsx_runtime_1.jsx)(Wrapper, { ...props, children: showSidebar ? (needsFullHeightScalebar ? ((0, jsx_runtime_1.jsx)(FullHeightScaleBar_1.default, { model: model, orientation: orientation, exportSVG: exportSVG })) : ((0, jsx_runtime_1.jsx)(IndividualScaleBars_1.default, { model: model, orientation: orientation, exportSVG: exportSVG }))) : null })) : null;
|
|
27
27
|
});
|
|
28
28
|
exports.default = exports.YScaleBars;
|
|
@@ -1,12 +1,13 @@
|
|
|
1
1
|
import type { WiggleDisplayModel } from '../model';
|
|
2
|
+
import type { GridRowId } from '@mui/x-data-grid';
|
|
2
3
|
export declare function moveUp(arr: {
|
|
3
4
|
name: string;
|
|
4
|
-
}[], sel:
|
|
5
|
+
}[], sel: GridRowId[], by?: number): {
|
|
5
6
|
name: string;
|
|
6
7
|
}[];
|
|
7
8
|
export declare function moveDown(arr: {
|
|
8
9
|
name: string;
|
|
9
|
-
}[], sel:
|
|
10
|
+
}[], sel: GridRowId[], by?: number): {
|
|
10
11
|
name: string;
|
|
11
12
|
}[];
|
|
12
13
|
export declare function getOffset(model: WiggleDisplayModel): number;
|
|
@@ -101,6 +101,7 @@ export declare function stateModelFactory(_pluginManager: PluginManager, configS
|
|
|
101
101
|
} & {
|
|
102
102
|
type: import("mobx-state-tree").ISimpleType<"MultiLinearWiggleDisplay">;
|
|
103
103
|
layout: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").IType<Source[], Source[], Source[]>, [undefined]>;
|
|
104
|
+
showSidebar: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
|
|
104
105
|
}, {
|
|
105
106
|
rendererTypeName: string;
|
|
106
107
|
error: unknown;
|
|
@@ -213,7 +214,7 @@ export declare function stateModelFactory(_pluginManager: PluginManager, configS
|
|
|
213
214
|
} & {
|
|
214
215
|
addBlock(key: string, block: import("@jbrowse/core/util/blockTypes").BaseBlock): void;
|
|
215
216
|
deleteBlock(key: string): void;
|
|
216
|
-
selectFeature(feature: Feature): void
|
|
217
|
+
selectFeature(feature: Feature): Promise<void>;
|
|
217
218
|
navToFeature(feature: Feature): void;
|
|
218
219
|
clearFeatureSelection(): void;
|
|
219
220
|
setFeatureIdUnderMouse(feature?: string): void;
|
|
@@ -327,6 +328,7 @@ export declare function stateModelFactory(_pluginManager: PluginManager, configS
|
|
|
327
328
|
featureUnderMouseVolatile: Feature | undefined;
|
|
328
329
|
sourcesVolatile: Source[] | undefined;
|
|
329
330
|
} & {
|
|
331
|
+
setShowSidebar(arg: boolean): void;
|
|
330
332
|
setSourcesLoading(str: string): void;
|
|
331
333
|
setLayout(layout: Source[]): void;
|
|
332
334
|
clearLayout(): void;
|
|
@@ -50,7 +50,7 @@ const util_2 = require("../util");
|
|
|
50
50
|
const randomColor = () => '#000000'.replaceAll('0', () => (~~(Math.random() * 16)).toString(16));
|
|
51
51
|
const Tooltip = (0, react_1.lazy)(() => Promise.resolve().then(() => __importStar(require('./components/Tooltip'))));
|
|
52
52
|
const SetColorDialog = (0, react_1.lazy)(() => Promise.resolve().then(() => __importStar(require('./components/SetColorDialog'))));
|
|
53
|
-
const
|
|
53
|
+
const WiggleClusterDialog = (0, react_1.lazy)(() => Promise.resolve().then(() => __importStar(require('./components/WiggleClusterDialog/WiggleClusterDialog'))));
|
|
54
54
|
const rendererTypes = new Map([
|
|
55
55
|
['xyplot', 'MultiXYPlotRenderer'],
|
|
56
56
|
['multirowxy', 'MultiRowXYPlotRenderer'],
|
|
@@ -63,6 +63,7 @@ function stateModelFactory(_pluginManager, configSchema) {
|
|
|
63
63
|
.compose('MultiLinearWiggleDisplay', (0, SharedWiggleMixin_1.default)(configSchema), mobx_state_tree_1.types.model({
|
|
64
64
|
type: mobx_state_tree_1.types.literal('MultiLinearWiggleDisplay'),
|
|
65
65
|
layout: mobx_state_tree_1.types.optional(mobx_state_tree_1.types.frozen(), []),
|
|
66
|
+
showSidebar: true,
|
|
66
67
|
}))
|
|
67
68
|
.volatile(() => ({
|
|
68
69
|
sourcesLoadingStopToken: undefined,
|
|
@@ -70,6 +71,9 @@ function stateModelFactory(_pluginManager, configSchema) {
|
|
|
70
71
|
sourcesVolatile: undefined,
|
|
71
72
|
}))
|
|
72
73
|
.actions(self => ({
|
|
74
|
+
setShowSidebar(arg) {
|
|
75
|
+
self.showSidebar = arg;
|
|
76
|
+
},
|
|
73
77
|
setSourcesLoading(str) {
|
|
74
78
|
if (self.sourcesLoadingStopToken) {
|
|
75
79
|
(0, stopToken_1.stopStopToken)(self.sourcesLoadingStopToken);
|
|
@@ -345,7 +349,7 @@ function stateModelFactory(_pluginManager, configSchema) {
|
|
|
345
349
|
label: 'Cluster by score',
|
|
346
350
|
onClick: () => {
|
|
347
351
|
(0, util_1.getSession)(self).queueDialog(handleClose => [
|
|
348
|
-
|
|
352
|
+
WiggleClusterDialog,
|
|
349
353
|
{
|
|
350
354
|
model: self,
|
|
351
355
|
handleClose,
|
|
@@ -353,6 +357,14 @@ function stateModelFactory(_pluginManager, configSchema) {
|
|
|
353
357
|
]);
|
|
354
358
|
},
|
|
355
359
|
},
|
|
360
|
+
{
|
|
361
|
+
label: 'Show sidebar',
|
|
362
|
+
type: 'checkbox',
|
|
363
|
+
checked: self.showSidebar,
|
|
364
|
+
onClick: () => {
|
|
365
|
+
self.setShowSidebar(!self.showSidebar);
|
|
366
|
+
},
|
|
367
|
+
},
|
|
356
368
|
{
|
|
357
369
|
label: 'Edit colors/arrangement...',
|
|
358
370
|
onClick: () => {
|
|
@@ -33,7 +33,7 @@ export default abstract class WiggleBaseRenderer extends FeatureRendererType {
|
|
|
33
33
|
height: number;
|
|
34
34
|
width: number;
|
|
35
35
|
containsNoTransferables: boolean;
|
|
36
|
-
canvasRecordedData:
|
|
36
|
+
canvasRecordedData: Record<string, unknown>;
|
|
37
37
|
reactElement?: React.ReactElement;
|
|
38
38
|
html?: string;
|
|
39
39
|
} | {
|
|
@@ -41,15 +41,15 @@ export default abstract class WiggleBaseRenderer extends FeatureRendererType {
|
|
|
41
41
|
height: number;
|
|
42
42
|
width: number;
|
|
43
43
|
containsNoTransferables: boolean;
|
|
44
|
-
|
|
44
|
+
imageData: any;
|
|
45
|
+
reactElement?: React.ReactElement;
|
|
45
46
|
html?: string;
|
|
46
47
|
} | {
|
|
47
48
|
features: Map<string, Feature>;
|
|
48
49
|
height: number;
|
|
49
50
|
width: number;
|
|
50
51
|
containsNoTransferables: boolean;
|
|
51
|
-
|
|
52
|
-
reactElement?: React.ReactElement;
|
|
52
|
+
reactElement: React.ReactElement;
|
|
53
53
|
html?: string;
|
|
54
54
|
}>;
|
|
55
55
|
abstract draw<T extends RenderArgsDeserializedWithFeatures>(ctx: CanvasRenderingContext2D, props: T): Promise<Record<string, unknown> | undefined>;
|
|
@@ -31,7 +31,7 @@ class WiggleBaseRenderer extends FeatureRendererType_1.default {
|
|
|
31
31
|
...results,
|
|
32
32
|
...rest,
|
|
33
33
|
features: reducedFeatures
|
|
34
|
-
? new Map(reducedFeatures.map(
|
|
34
|
+
? new Map(reducedFeatures.map(r => [r.id(), r]))
|
|
35
35
|
: results.features,
|
|
36
36
|
height,
|
|
37
37
|
width,
|
|
@@ -5,7 +5,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
6
|
exports.MultiWiggleClusterScoreMatrix = void 0;
|
|
7
7
|
const RpcMethodTypeWithFiltersAndRenameRegions_1 = __importDefault(require("@jbrowse/core/pluggableElementTypes/RpcMethodTypeWithFiltersAndRenameRegions"));
|
|
8
|
-
const cluster_1 = require("
|
|
8
|
+
const cluster_1 = require("@jbrowse/core/util/cluster");
|
|
9
9
|
const getScoreMatrix_1 = require("./getScoreMatrix");
|
|
10
10
|
class MultiWiggleClusterScoreMatrix extends RpcMethodTypeWithFiltersAndRenameRegions_1.default {
|
|
11
11
|
constructor() {
|
|
@@ -23,12 +23,9 @@ class MultiWiggleClusterScoreMatrix extends RpcMethodTypeWithFiltersAndRenameReg
|
|
|
23
23
|
stopToken: deserializedArgs.stopToken,
|
|
24
24
|
onProgress: a => {
|
|
25
25
|
var _a;
|
|
26
|
-
(_a = deserializedArgs.statusCallback) === null || _a === void 0 ? void 0 : _a.call(deserializedArgs,
|
|
26
|
+
(_a = deserializedArgs.statusCallback) === null || _a === void 0 ? void 0 : _a.call(deserializedArgs, a);
|
|
27
27
|
},
|
|
28
28
|
});
|
|
29
29
|
}
|
|
30
30
|
}
|
|
31
31
|
exports.MultiWiggleClusterScoreMatrix = MultiWiggleClusterScoreMatrix;
|
|
32
|
-
function toP(n) {
|
|
33
|
-
return Number.parseFloat(n.toPrecision(3));
|
|
34
|
-
}
|
package/dist/drawDensity.js
CHANGED
|
@@ -39,15 +39,21 @@ function drawDensity(ctx, props) {
|
|
|
39
39
|
start = performance.now();
|
|
40
40
|
}
|
|
41
41
|
const [leftPx, rightPx] = (0, util_1.featureSpanPx)(feature, region, bpPerPx);
|
|
42
|
-
if (Math.floor(leftPx) !== Math.floor(prevLeftPx)) {
|
|
42
|
+
if (Math.floor(leftPx) !== Math.floor(prevLeftPx) || rightPx - leftPx > 1) {
|
|
43
43
|
reducedFeatures.push(feature);
|
|
44
44
|
prevLeftPx = leftPx;
|
|
45
45
|
}
|
|
46
46
|
const score = feature.get('score');
|
|
47
47
|
hasClipping = hasClipping || score > niceMax || score < niceMin;
|
|
48
48
|
const w = rightPx - leftPx + fudgeFactor;
|
|
49
|
-
|
|
50
|
-
|
|
49
|
+
if (score >= scaleOpts.domain[0]) {
|
|
50
|
+
ctx.fillStyle = cb(feature, score);
|
|
51
|
+
ctx.fillRect(leftPx, 0, w, height);
|
|
52
|
+
}
|
|
53
|
+
else {
|
|
54
|
+
ctx.fillStyle = '#eee';
|
|
55
|
+
ctx.fillRect(leftPx, 0, w, height);
|
|
56
|
+
}
|
|
51
57
|
}
|
|
52
58
|
ctx.save();
|
|
53
59
|
if (hasClipping) {
|
|
@@ -69,5 +75,7 @@ function drawDensity(ctx, props) {
|
|
|
69
75
|
}
|
|
70
76
|
}
|
|
71
77
|
ctx.restore();
|
|
72
|
-
return {
|
|
78
|
+
return {
|
|
79
|
+
reducedFeatures,
|
|
80
|
+
};
|
|
73
81
|
}
|
package/dist/drawLine.js
CHANGED
|
@@ -28,7 +28,7 @@ function drawLine(ctx, props) {
|
|
|
28
28
|
start = performance.now();
|
|
29
29
|
}
|
|
30
30
|
const [leftPx, rightPx] = (0, util_1.featureSpanPx)(feature, region, bpPerPx);
|
|
31
|
-
if (Math.floor(leftPx) !== Math.floor(prevLeftPx)) {
|
|
31
|
+
if (Math.floor(leftPx) !== Math.floor(prevLeftPx) || rightPx - leftPx > 1) {
|
|
32
32
|
reducedFeatures.push(feature);
|
|
33
33
|
prevLeftPx = leftPx;
|
|
34
34
|
}
|
|
@@ -71,5 +71,7 @@ function drawLine(ctx, props) {
|
|
|
71
71
|
ctx.stroke();
|
|
72
72
|
}
|
|
73
73
|
}
|
|
74
|
-
return {
|
|
74
|
+
return {
|
|
75
|
+
reducedFeatures,
|
|
76
|
+
};
|
|
75
77
|
}
|
package/dist/drawXY.js
CHANGED
|
@@ -92,7 +92,8 @@ function drawXY(ctx, props) {
|
|
|
92
92
|
.toString())
|
|
93
93
|
: c;
|
|
94
94
|
const w = Math.max(rightPx - leftPx + fudgeFactor, minSize);
|
|
95
|
-
if (Math.floor(leftPx) !== Math.floor(prevLeftPx)
|
|
95
|
+
if (Math.floor(leftPx) !== Math.floor(prevLeftPx) ||
|
|
96
|
+
rightPx - leftPx > 1) {
|
|
96
97
|
reducedFeatures.push(feature);
|
|
97
98
|
prevLeftPx = leftPx;
|
|
98
99
|
}
|
|
@@ -131,7 +132,8 @@ function drawXY(ctx, props) {
|
|
|
131
132
|
start = performance.now();
|
|
132
133
|
}
|
|
133
134
|
const [leftPx, rightPx] = (0, util_1.featureSpanPx)(feature, region, bpPerPx);
|
|
134
|
-
if (Math.floor(leftPx) !== Math.floor(prevLeftPx)
|
|
135
|
+
if (Math.floor(leftPx) !== Math.floor(prevLeftPx) ||
|
|
136
|
+
rightPx - leftPx > 1) {
|
|
135
137
|
reducedFeatures.push(feature);
|
|
136
138
|
prevLeftPx = leftPx;
|
|
137
139
|
}
|
|
@@ -183,5 +185,7 @@ function drawXY(ctx, props) {
|
|
|
183
185
|
ctx.stroke();
|
|
184
186
|
}
|
|
185
187
|
}
|
|
186
|
-
return {
|
|
188
|
+
return {
|
|
189
|
+
reducedFeatures,
|
|
190
|
+
};
|
|
187
191
|
}
|
|
@@ -206,7 +206,7 @@ export default function SharedWiggleMixin(configSchema: AnyConfigurationSchemaTy
|
|
|
206
206
|
} & {
|
|
207
207
|
addBlock(key: string, block: import("@jbrowse/core/util/blockTypes").BaseBlock): void;
|
|
208
208
|
deleteBlock(key: string): void;
|
|
209
|
-
selectFeature(feature: Feature): void
|
|
209
|
+
selectFeature(feature: Feature): Promise<void>;
|
|
210
210
|
navToFeature(feature: Feature): void;
|
|
211
211
|
clearFeatureSelection(): void;
|
|
212
212
|
setFeatureIdUnderMouse(feature?: string): void;
|
|
@@ -212,7 +212,7 @@ declare function stateModelFactory(pluginManager: PluginManager, configSchema: A
|
|
|
212
212
|
} & {
|
|
213
213
|
addBlock(key: string, block: import("@jbrowse/core/util/blockTypes").BaseBlock): void;
|
|
214
214
|
deleteBlock(key: string): void;
|
|
215
|
-
selectFeature(feature: import("@jbrowse/core/util").Feature): void
|
|
215
|
+
selectFeature(feature: import("@jbrowse/core/util").Feature): Promise<void>;
|
|
216
216
|
navToFeature(feature: import("@jbrowse/core/util").Feature): void;
|
|
217
217
|
clearFeatureSelection(): void;
|
|
218
218
|
setFeatureIdUnderMouse(feature?: string): void;
|
|
@@ -49,8 +49,8 @@ function SourcesGrid({ rows, onChange, showTips, }) {
|
|
|
49
49
|
onChange([...rows]);
|
|
50
50
|
}, onClose: () => {
|
|
51
51
|
setAnchorEl(null);
|
|
52
|
-
} }), _jsx("div", { style: { height: 400, width: '100%' }, children: _jsx(DataGrid, { getRowId: row => row.name, checkboxSelection: true,
|
|
53
|
-
setSelected(arg);
|
|
52
|
+
} }), _jsx("div", { style: { height: 400, width: '100%' }, children: _jsx(DataGrid, { getRowId: row => row.name, checkboxSelection: true, onRowSelectionModelChange: arg => {
|
|
53
|
+
setSelected([...arg.ids]);
|
|
54
54
|
}, rows: rows, rowHeight: 25, columnHeaderHeight: 33, columns: [
|
|
55
55
|
{
|
|
56
56
|
field: 'color',
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import type { ReducedModel } from './types';
|
|
2
|
-
declare const
|
|
2
|
+
declare const WiggleClusterDialog: ({ model, handleClose, }: {
|
|
3
3
|
model: ReducedModel;
|
|
4
4
|
handleClose: () => void;
|
|
5
5
|
}) => import("react/jsx-runtime").JSX.Element;
|
|
6
|
-
export default
|
|
6
|
+
export default WiggleClusterDialog;
|