@jbrowse/plugin-config 1.4.2 → 1.5.2
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/ConfigurationEditorWidget/components/CodeEditor.d.ts +4 -0
- package/dist/ConfigurationEditorWidget/components/ColorEditor.d.ts +0 -11
- package/dist/ConfigurationEditorWidget/components/ColorPicker.d.ts +14 -0
- package/dist/FromConfigAdapter/FromConfigAdapter.d.ts +3 -1
- package/dist/FromConfigAdapter/FromConfigRegionsAdapter.d.ts +3 -1
- package/dist/FromConfigAdapter/FromConfigSequenceAdapter.d.ts +1 -1
- package/dist/RefNameAliasAdapter/RefNameAliasAdapter.d.ts +5 -8
- package/dist/plugin-config.cjs.development.js +232 -174
- package/dist/plugin-config.cjs.development.js.map +1 -1
- package/dist/plugin-config.cjs.production.min.js +1 -1
- package/dist/plugin-config.cjs.production.min.js.map +1 -1
- package/dist/plugin-config.esm.js +244 -186
- package/dist/plugin-config.esm.js.map +1 -1
- package/package.json +3 -3
- package/src/ConfigurationEditorWidget/components/CallbackEditor.js +8 -6
- package/src/ConfigurationEditorWidget/components/CodeEditor.js +59 -0
- package/src/ConfigurationEditorWidget/components/ColorEditor.tsx +12 -54
- package/src/ConfigurationEditorWidget/components/ColorPicker.tsx +52 -0
- package/src/ConfigurationEditorWidget/components/ConfigurationEditor.test.js +3 -4
- package/src/ConfigurationEditorWidget/components/JsonEditor.js +12 -51
- package/src/ConfigurationEditorWidget/components/SlotEditor.js +7 -3
- package/src/ConfigurationEditorWidget/components/__snapshots__/ConfigurationEditor.test.js.snap +42 -25
- package/src/FromConfigAdapter/FromConfigAdapter.ts +8 -2
- package/src/FromConfigAdapter/FromConfigRegionsAdapter.ts +7 -2
- package/src/FromConfigAdapter/FromConfigSequenceAdapter.test.ts +2 -5
- package/src/FromConfigAdapter/FromConfigSequenceAdapter.ts +1 -4
- package/src/RefNameAliasAdapter/RefNameAliasAdapter.test.ts +4 -1
- package/src/RefNameAliasAdapter/RefNameAliasAdapter.ts +8 -22
- package/src/RefNameAliasAdapter/configSchema.ts +4 -1
- package/src/index.ts +24 -0
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@jbrowse/plugin-config",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.5.2",
|
|
4
4
|
"description": "JBrowse 2 config utilities",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"jbrowse",
|
|
@@ -36,7 +36,7 @@
|
|
|
36
36
|
},
|
|
37
37
|
"dependencies": {
|
|
38
38
|
"@material-ui/icons": "^4.9.1",
|
|
39
|
-
"generic-filehandle": "^2.
|
|
39
|
+
"generic-filehandle": "^2.2.2",
|
|
40
40
|
"pluralize": "^8.0.0",
|
|
41
41
|
"react-color": "^2.19.3",
|
|
42
42
|
"react-simple-code-editor": "0.9.3",
|
|
@@ -55,5 +55,5 @@
|
|
|
55
55
|
"publishConfig": {
|
|
56
56
|
"access": "public"
|
|
57
57
|
},
|
|
58
|
-
"gitHead": "
|
|
58
|
+
"gitHead": "94fdfbc34787ab8f12a87e00038da74b247b42fa"
|
|
59
59
|
}
|
|
@@ -1,12 +1,14 @@
|
|
|
1
1
|
import React, { useEffect, useState } from 'react'
|
|
2
2
|
import { useDebounce } from '@jbrowse/core/util'
|
|
3
3
|
import { stringToJexlExpression } from '@jbrowse/core/util/jexlStrings'
|
|
4
|
-
import
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
4
|
+
import {
|
|
5
|
+
FormControl,
|
|
6
|
+
FormHelperText,
|
|
7
|
+
InputLabel,
|
|
8
|
+
Tooltip,
|
|
9
|
+
IconButton,
|
|
10
|
+
makeStyles,
|
|
11
|
+
} from '@material-ui/core'
|
|
10
12
|
import HelpIcon from '@material-ui/icons/Help'
|
|
11
13
|
import { getEnv } from 'mobx-state-tree'
|
|
12
14
|
import { observer, PropTypes } from 'mobx-react'
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
import React, { useEffect } from 'react'
|
|
2
|
+
import Editor from 'react-simple-code-editor'
|
|
3
|
+
import { Light as SyntaxHighlighter } from 'react-syntax-highlighter'
|
|
4
|
+
import json from 'react-syntax-highlighter/dist/cjs/languages/hljs/json'
|
|
5
|
+
import a11yDark from 'react-syntax-highlighter/dist/cjs/styles/hljs/a11y-dark'
|
|
6
|
+
import a11yLight from 'react-syntax-highlighter/dist/cjs/styles/hljs/a11y-light'
|
|
7
|
+
import { useTheme, makeStyles } from '@material-ui/core'
|
|
8
|
+
|
|
9
|
+
// fontSize and fontFamily have to match between Editor and SyntaxHighlighter
|
|
10
|
+
const fontSize = '12px'
|
|
11
|
+
// Optimize by using system default fonts: https://css-tricks.com/snippets/css/font-stacks/
|
|
12
|
+
const fontFamily =
|
|
13
|
+
'Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace'
|
|
14
|
+
|
|
15
|
+
const useStyles = makeStyles({
|
|
16
|
+
callbackEditor: {
|
|
17
|
+
fontFamily,
|
|
18
|
+
fontSize,
|
|
19
|
+
overflowX: 'auto',
|
|
20
|
+
marginTop: '16px',
|
|
21
|
+
borderBottom: '1px solid rgba(0,0,0,0.42)',
|
|
22
|
+
},
|
|
23
|
+
syntaxHighlighter: {
|
|
24
|
+
margin: 0,
|
|
25
|
+
fontFamily,
|
|
26
|
+
fontSize,
|
|
27
|
+
},
|
|
28
|
+
})
|
|
29
|
+
|
|
30
|
+
// eslint-disable-next-line react/prop-types
|
|
31
|
+
export default function CodeEditor({ contents, setContents }) {
|
|
32
|
+
const classes = useStyles()
|
|
33
|
+
const theme = useTheme()
|
|
34
|
+
useEffect(() => {
|
|
35
|
+
SyntaxHighlighter.registerLanguage('json', json)
|
|
36
|
+
}, [])
|
|
37
|
+
|
|
38
|
+
return (
|
|
39
|
+
<Editor
|
|
40
|
+
className={classes.callbackEditor}
|
|
41
|
+
value={contents}
|
|
42
|
+
onValueChange={setContents}
|
|
43
|
+
highlight={newCode => (
|
|
44
|
+
<SyntaxHighlighter
|
|
45
|
+
language="json"
|
|
46
|
+
style={theme.palette.type === 'dark' ? a11yDark : a11yLight}
|
|
47
|
+
className={classes.syntaxHighlighter}
|
|
48
|
+
// override some inline style stuff that's higher specificity
|
|
49
|
+
// than className
|
|
50
|
+
customStyle={{ background: 'none', padding: 0 }}
|
|
51
|
+
>
|
|
52
|
+
{newCode}
|
|
53
|
+
</SyntaxHighlighter>
|
|
54
|
+
)}
|
|
55
|
+
padding={10}
|
|
56
|
+
style={{}}
|
|
57
|
+
/>
|
|
58
|
+
)
|
|
59
|
+
}
|
|
@@ -1,9 +1,10 @@
|
|
|
1
|
+
import React, { lazy, useState } from 'react'
|
|
1
2
|
import { observer } from 'mobx-react'
|
|
2
3
|
import ReactPropTypes from 'prop-types'
|
|
3
4
|
import TextField from '@material-ui/core/TextField'
|
|
4
|
-
import {
|
|
5
|
-
|
|
6
|
-
|
|
5
|
+
import { Color, RGBColor } from 'react-color'
|
|
6
|
+
|
|
7
|
+
const ColorPicker = lazy(() => import('./ColorPicker'))
|
|
7
8
|
|
|
8
9
|
// this is needed because passing a entire color object into the react-color
|
|
9
10
|
// for alpha, can't pass in an rgba string for example
|
|
@@ -14,51 +15,6 @@ function serializeColor(color: Color) {
|
|
|
14
15
|
}
|
|
15
16
|
return color
|
|
16
17
|
}
|
|
17
|
-
const useStyles = makeStyles({
|
|
18
|
-
popover: {
|
|
19
|
-
position: 'absolute',
|
|
20
|
-
zIndex: 2,
|
|
21
|
-
},
|
|
22
|
-
cover: {
|
|
23
|
-
position: 'fixed',
|
|
24
|
-
top: 0,
|
|
25
|
-
right: 0,
|
|
26
|
-
bottom: 0,
|
|
27
|
-
left: 0,
|
|
28
|
-
},
|
|
29
|
-
})
|
|
30
|
-
|
|
31
|
-
export function ColorPicker(props: {
|
|
32
|
-
color: Color
|
|
33
|
-
onChange: (color: ColorResult) => void
|
|
34
|
-
}) {
|
|
35
|
-
const { color, onChange } = props
|
|
36
|
-
const classes = useStyles()
|
|
37
|
-
const [displayColorPicker, setDisplayColorPicker] = useState(true)
|
|
38
|
-
|
|
39
|
-
const handleClose = () => {
|
|
40
|
-
setDisplayColorPicker(false)
|
|
41
|
-
}
|
|
42
|
-
return (
|
|
43
|
-
<div>
|
|
44
|
-
{displayColorPicker ? (
|
|
45
|
-
<div className={classes.popover}>
|
|
46
|
-
<div
|
|
47
|
-
role="presentation"
|
|
48
|
-
className={classes.cover}
|
|
49
|
-
onClick={handleClose}
|
|
50
|
-
/>
|
|
51
|
-
<ChromePicker color={color} onChange={onChange} />
|
|
52
|
-
</div>
|
|
53
|
-
) : null}
|
|
54
|
-
</div>
|
|
55
|
-
)
|
|
56
|
-
}
|
|
57
|
-
|
|
58
|
-
ColorPicker.propTypes = {
|
|
59
|
-
color: ReactPropTypes.string.isRequired,
|
|
60
|
-
onChange: ReactPropTypes.func.isRequired,
|
|
61
|
-
}
|
|
62
18
|
|
|
63
19
|
export const ColorSlot = (props: {
|
|
64
20
|
value: string
|
|
@@ -92,12 +48,14 @@ export const ColorSlot = (props: {
|
|
|
92
48
|
{...TextFieldProps}
|
|
93
49
|
/>
|
|
94
50
|
{displayed ? (
|
|
95
|
-
<
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
onChange
|
|
99
|
-
|
|
100
|
-
|
|
51
|
+
<React.Suspense fallback={<div />}>
|
|
52
|
+
<ColorPicker
|
|
53
|
+
color={value}
|
|
54
|
+
onChange={event => {
|
|
55
|
+
onChange(serializeColor(event.rgb))
|
|
56
|
+
}}
|
|
57
|
+
/>
|
|
58
|
+
</React.Suspense>
|
|
101
59
|
) : null}
|
|
102
60
|
</>
|
|
103
61
|
)
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
import React, { useState } from 'react'
|
|
2
|
+
import { makeStyles } from '@material-ui/core/styles'
|
|
3
|
+
import ReactPropTypes from 'prop-types'
|
|
4
|
+
import { ChromePicker, Color, ColorResult } from 'react-color'
|
|
5
|
+
|
|
6
|
+
const useStyles = makeStyles({
|
|
7
|
+
popover: {
|
|
8
|
+
position: 'absolute',
|
|
9
|
+
zIndex: 2,
|
|
10
|
+
},
|
|
11
|
+
cover: {
|
|
12
|
+
position: 'fixed',
|
|
13
|
+
top: 0,
|
|
14
|
+
right: 0,
|
|
15
|
+
bottom: 0,
|
|
16
|
+
left: 0,
|
|
17
|
+
},
|
|
18
|
+
})
|
|
19
|
+
|
|
20
|
+
export function ColorPicker(props: {
|
|
21
|
+
color: Color
|
|
22
|
+
onChange: (color: ColorResult) => void
|
|
23
|
+
}) {
|
|
24
|
+
const { color, onChange } = props
|
|
25
|
+
const classes = useStyles()
|
|
26
|
+
const [displayColorPicker, setDisplayColorPicker] = useState(true)
|
|
27
|
+
|
|
28
|
+
const handleClose = () => {
|
|
29
|
+
setDisplayColorPicker(false)
|
|
30
|
+
}
|
|
31
|
+
return (
|
|
32
|
+
<div>
|
|
33
|
+
{displayColorPicker ? (
|
|
34
|
+
<div className={classes.popover}>
|
|
35
|
+
<div
|
|
36
|
+
role="presentation"
|
|
37
|
+
className={classes.cover}
|
|
38
|
+
onClick={handleClose}
|
|
39
|
+
/>
|
|
40
|
+
<ChromePicker color={color} onChange={onChange} />
|
|
41
|
+
</div>
|
|
42
|
+
) : null}
|
|
43
|
+
</div>
|
|
44
|
+
)
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
ColorPicker.propTypes = {
|
|
48
|
+
color: ReactPropTypes.string.isRequired,
|
|
49
|
+
onChange: ReactPropTypes.func.isRequired,
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
export default ColorPicker
|
|
@@ -35,7 +35,7 @@ describe('ConfigurationEditor widget', () => {
|
|
|
35
35
|
name: 'fileLocationTest',
|
|
36
36
|
description: 'fileLocationTest',
|
|
37
37
|
type: 'fileLocation',
|
|
38
|
-
defaultValue: { uri: '/path/to/my.file' },
|
|
38
|
+
defaultValue: { uri: '/path/to/my.file', locationType: 'UriLocation' },
|
|
39
39
|
},
|
|
40
40
|
stringArrayTest: {
|
|
41
41
|
name: 'stringArrayTest',
|
|
@@ -86,9 +86,8 @@ describe('ConfigurationEditor widget', () => {
|
|
|
86
86
|
const pluginManager = new PluginManager([new Alignments(), new SVG()])
|
|
87
87
|
pluginManager.createPluggableElements()
|
|
88
88
|
pluginManager.configure()
|
|
89
|
-
const PileupDisplaySchema =
|
|
90
|
-
pluginManager
|
|
91
|
-
)
|
|
89
|
+
const PileupDisplaySchema =
|
|
90
|
+
linearBasicDisplayConfigSchemaFactory(pluginManager)
|
|
92
91
|
const { container } = render(
|
|
93
92
|
<ConfigurationEditor model={{ target: PileupDisplaySchema.create() }} />,
|
|
94
93
|
)
|
|
@@ -1,46 +1,23 @@
|
|
|
1
|
+
import React, { lazy, useEffect, useState } from 'react'
|
|
1
2
|
import { useDebounce } from '@jbrowse/core/util'
|
|
2
|
-
import
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
3
|
+
import {
|
|
4
|
+
FormControl,
|
|
5
|
+
FormHelperText,
|
|
6
|
+
InputLabel,
|
|
7
|
+
makeStyles,
|
|
8
|
+
} from '@material-ui/core'
|
|
6
9
|
import { observer, PropTypes } from 'mobx-react'
|
|
7
|
-
import React, { useEffect, useState } from 'react'
|
|
8
|
-
import Editor from 'react-simple-code-editor'
|
|
9
|
-
import { Light as SyntaxHighlighter } from 'react-syntax-highlighter'
|
|
10
|
-
import json from 'react-syntax-highlighter/dist/cjs/languages/hljs/json'
|
|
11
|
-
import a11yDark from 'react-syntax-highlighter/dist/cjs/styles/hljs/a11y-dark'
|
|
12
|
-
import a11yLight from 'react-syntax-highlighter/dist/cjs/styles/hljs/a11y-light'
|
|
13
|
-
|
|
14
|
-
SyntaxHighlighter.registerLanguage('json', json)
|
|
15
|
-
|
|
16
|
-
// fontSize and fontFamily have to match between Editor and SyntaxHighlighter
|
|
17
|
-
const fontSize = '12px'
|
|
18
|
-
// Optimize by using system default fonts: https://css-tricks.com/snippets/css/font-stacks/
|
|
19
|
-
const fontFamily =
|
|
20
|
-
'Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace'
|
|
21
|
-
|
|
22
10
|
const useStyles = makeStyles({
|
|
23
|
-
callbackEditor: {
|
|
24
|
-
fontFamily,
|
|
25
|
-
fontSize,
|
|
26
|
-
overflowX: 'auto',
|
|
27
|
-
marginTop: '16px',
|
|
28
|
-
borderBottom: '1px solid rgba(0,0,0,0.42)',
|
|
29
|
-
},
|
|
30
|
-
syntaxHighlighter: {
|
|
31
|
-
margin: 0,
|
|
32
|
-
fontFamily,
|
|
33
|
-
fontSize,
|
|
34
|
-
},
|
|
35
11
|
error: {
|
|
36
12
|
color: 'red',
|
|
37
13
|
fontSize: '0.8em',
|
|
38
14
|
},
|
|
39
15
|
})
|
|
40
16
|
|
|
17
|
+
const CodeEditor = lazy(() => import('./CodeEditor'))
|
|
18
|
+
|
|
41
19
|
function JsonEditor({ slot }) {
|
|
42
20
|
const classes = useStyles()
|
|
43
|
-
const theme = useTheme()
|
|
44
21
|
const [contents, setContents] = useState(
|
|
45
22
|
JSON.stringify(slot.value, null, ' '),
|
|
46
23
|
)
|
|
@@ -64,25 +41,9 @@ function JsonEditor({ slot }) {
|
|
|
64
41
|
<InputLabel shrink htmlFor="callback-editor">
|
|
65
42
|
{slot.name}
|
|
66
43
|
</InputLabel>
|
|
67
|
-
<
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
onValueChange={setContents}
|
|
71
|
-
highlight={newCode => (
|
|
72
|
-
<SyntaxHighlighter
|
|
73
|
-
language="json"
|
|
74
|
-
style={theme.palette.type === 'dark' ? a11yDark : a11yLight}
|
|
75
|
-
className={classes.syntaxHighlighter}
|
|
76
|
-
// override some inline style stuff that's higher specificity
|
|
77
|
-
// than className
|
|
78
|
-
customStyle={{ background: 'none', padding: 0 }}
|
|
79
|
-
>
|
|
80
|
-
{newCode}
|
|
81
|
-
</SyntaxHighlighter>
|
|
82
|
-
)}
|
|
83
|
-
padding={10}
|
|
84
|
-
style={{}}
|
|
85
|
-
/>
|
|
44
|
+
<React.Suspense fallback={<div />}>
|
|
45
|
+
<CodeEditor contents={contents} setContents={setContents} />
|
|
46
|
+
</React.Suspense>
|
|
86
47
|
<FormHelperText>{slot.description}</FormHelperText>
|
|
87
48
|
</FormControl>
|
|
88
49
|
</>
|
|
@@ -1,3 +1,6 @@
|
|
|
1
|
+
import React, { useEffect, useState } from 'react'
|
|
2
|
+
import { observer } from 'mobx-react'
|
|
3
|
+
import { getPropertyMembers, getEnv } from 'mobx-state-tree'
|
|
1
4
|
import { FileSelector } from '@jbrowse/core/ui'
|
|
2
5
|
import {
|
|
3
6
|
getPropertyType,
|
|
@@ -24,12 +27,12 @@ import {
|
|
|
24
27
|
makeStyles,
|
|
25
28
|
} from '@material-ui/core'
|
|
26
29
|
|
|
30
|
+
// icons
|
|
27
31
|
import DeleteIcon from '@material-ui/icons/Delete'
|
|
28
32
|
import AddIcon from '@material-ui/icons/Add'
|
|
29
33
|
import RadioButtonUncheckedIcon from '@material-ui/icons/RadioButtonUnchecked'
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
import React, { useEffect, useState } from 'react'
|
|
34
|
+
|
|
35
|
+
// locals
|
|
33
36
|
import CallbackEditor from './CallbackEditor'
|
|
34
37
|
import ColorEditor from './ColorEditor'
|
|
35
38
|
import JsonEditor from './JsonEditor'
|
|
@@ -341,6 +344,7 @@ const FileSelectorWrapper = observer(({ slot }) => {
|
|
|
341
344
|
setLocation={location => slot.set(location)}
|
|
342
345
|
name={slot.name}
|
|
343
346
|
description={slot.description}
|
|
347
|
+
rootModel={getEnv(slot).pluginManager?.rootModel}
|
|
344
348
|
/>
|
|
345
349
|
)
|
|
346
350
|
})
|
package/src/ConfigurationEditorWidget/components/__snapshots__/ConfigurationEditor.test.js.snap
CHANGED
|
@@ -47,21 +47,24 @@ exports[`ConfigurationEditor widget renders all the different types of built-in
|
|
|
47
47
|
<div
|
|
48
48
|
class="makeStyles-paperContent"
|
|
49
49
|
>
|
|
50
|
-
<
|
|
51
|
-
class="
|
|
52
|
-
data-shrink="true"
|
|
53
|
-
for="callback-editor"
|
|
50
|
+
<div
|
|
51
|
+
class="MuiBox-root MuiBox-root"
|
|
54
52
|
>
|
|
55
|
-
|
|
56
|
-
|
|
53
|
+
<label
|
|
54
|
+
class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-animated MuiInputLabel-shrink"
|
|
55
|
+
data-shrink="true"
|
|
56
|
+
>
|
|
57
|
+
fileLocationTest
|
|
58
|
+
</label>
|
|
59
|
+
</div>
|
|
57
60
|
<div
|
|
58
|
-
class="
|
|
61
|
+
class="MuiBox-root MuiBox-root"
|
|
59
62
|
>
|
|
60
63
|
<div
|
|
61
|
-
class="
|
|
64
|
+
class="MuiBox-root MuiBox-root"
|
|
62
65
|
>
|
|
63
66
|
<div
|
|
64
|
-
aria-label="file or
|
|
67
|
+
aria-label="file, url, or account picker"
|
|
65
68
|
class="MuiToggleButtonGroup-root"
|
|
66
69
|
role="group"
|
|
67
70
|
>
|
|
@@ -101,24 +104,38 @@ exports[`ConfigurationEditor widget renders all the different types of built-in
|
|
|
101
104
|
</button>
|
|
102
105
|
</div>
|
|
103
106
|
</div>
|
|
107
|
+
</div>
|
|
108
|
+
<div
|
|
109
|
+
class="MuiFormControl-root MuiTextField-root MuiFormControl-fullWidth"
|
|
110
|
+
>
|
|
111
|
+
<label
|
|
112
|
+
class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-filled"
|
|
113
|
+
data-shrink="true"
|
|
114
|
+
>
|
|
115
|
+
Enter URL
|
|
116
|
+
</label>
|
|
104
117
|
<div
|
|
105
|
-
class="
|
|
118
|
+
class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-fullWidth MuiInputBase-formControl"
|
|
106
119
|
>
|
|
107
|
-
<
|
|
108
|
-
|
|
120
|
+
<input
|
|
121
|
+
aria-invalid="false"
|
|
122
|
+
class="MuiInputBase-input MuiOutlinedInput-input"
|
|
123
|
+
data-testid="urlInput"
|
|
124
|
+
type="text"
|
|
125
|
+
value="/path/to/my.file"
|
|
126
|
+
/>
|
|
127
|
+
<fieldset
|
|
128
|
+
aria-hidden="true"
|
|
129
|
+
class="PrivateNotchedOutline-root MuiOutlinedInput-notchedOutline"
|
|
109
130
|
>
|
|
110
|
-
<
|
|
111
|
-
class="
|
|
131
|
+
<legend
|
|
132
|
+
class="PrivateNotchedOutline-legendLabelled PrivateNotchedOutline-legendNotched"
|
|
112
133
|
>
|
|
113
|
-
<
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
value="/path/to/my.file"
|
|
119
|
-
/>
|
|
120
|
-
</div>
|
|
121
|
-
</div>
|
|
134
|
+
<span>
|
|
135
|
+
Enter URL
|
|
136
|
+
</span>
|
|
137
|
+
</legend>
|
|
138
|
+
</fieldset>
|
|
122
139
|
</div>
|
|
123
140
|
</div>
|
|
124
141
|
<p
|
|
@@ -975,13 +992,13 @@ exports[`ConfigurationEditor widget renders with defaults of the PileupTrack sch
|
|
|
975
992
|
</label>
|
|
976
993
|
<div
|
|
977
994
|
class="MuiInputBase-root MuiInput-root MuiInput-underline MuiInputBase-fullWidth MuiInput-fullWidth MuiInputBase-formControl MuiInput-formControl"
|
|
978
|
-
style="color: rgb(
|
|
995
|
+
style="color: rgb(255, 0, 255); border-right-width: 25px; border-right-style: solid; border-right-color: #f0f;"
|
|
979
996
|
>
|
|
980
997
|
<input
|
|
981
998
|
aria-invalid="false"
|
|
982
999
|
class="MuiInputBase-input MuiInput-input"
|
|
983
1000
|
type="text"
|
|
984
|
-
value="#
|
|
1001
|
+
value="#f0f"
|
|
985
1002
|
/>
|
|
986
1003
|
</div>
|
|
987
1004
|
<p
|
|
@@ -7,6 +7,8 @@ import { ObservableCreate } from '@jbrowse/core/util/rxjs'
|
|
|
7
7
|
import { NoAssemblyRegion } from '@jbrowse/core/util/types'
|
|
8
8
|
import { AnyConfigurationModel } from '@jbrowse/core/configuration/configurationSchema'
|
|
9
9
|
import { readConfObject } from '@jbrowse/core/configuration'
|
|
10
|
+
import PluginManager from '@jbrowse/core/PluginManager'
|
|
11
|
+
import { getSubAdapterType } from '@jbrowse/core/data_adapters/dataAdapterCache'
|
|
10
12
|
|
|
11
13
|
/**
|
|
12
14
|
* Adapter that just returns the features defined in its `features` configuration
|
|
@@ -17,8 +19,12 @@ import { readConfObject } from '@jbrowse/core/configuration'
|
|
|
17
19
|
export default class FromConfigAdapter extends BaseFeatureDataAdapter {
|
|
18
20
|
protected features: Map<string, Feature[]>
|
|
19
21
|
|
|
20
|
-
constructor(
|
|
21
|
-
|
|
22
|
+
constructor(
|
|
23
|
+
conf: AnyConfigurationModel,
|
|
24
|
+
getSubAdapter?: getSubAdapterType,
|
|
25
|
+
pluginManager?: PluginManager,
|
|
26
|
+
) {
|
|
27
|
+
super(conf, getSubAdapter, pluginManager)
|
|
22
28
|
const feats = readConfObject(conf, 'features') as SimpleFeatureSerialized[]
|
|
23
29
|
this.features = FromConfigAdapter.makeFeatures(feats || [])
|
|
24
30
|
}
|
|
@@ -10,6 +10,8 @@ import { readConfObject } from '@jbrowse/core/configuration'
|
|
|
10
10
|
import { ConfigurationModel } from '@jbrowse/core/configuration/configurationSchema'
|
|
11
11
|
import { configSchema as FromConfigAdapterConfigSchema } from './configSchema'
|
|
12
12
|
import FromConfigAdapter from './FromConfigAdapter'
|
|
13
|
+
import PluginManager from '@jbrowse/core/PluginManager'
|
|
14
|
+
import { getSubAdapterType } from '@jbrowse/core/data_adapters/dataAdapterCache'
|
|
13
15
|
|
|
14
16
|
/**
|
|
15
17
|
* Adapter that just returns the features defined in its `features` configuration
|
|
@@ -18,13 +20,16 @@ import FromConfigAdapter from './FromConfigAdapter'
|
|
|
18
20
|
*/
|
|
19
21
|
export default class FromConfigRegionsAdapter
|
|
20
22
|
extends BaseAdapter
|
|
21
|
-
implements RegionsAdapter
|
|
23
|
+
implements RegionsAdapter
|
|
24
|
+
{
|
|
22
25
|
private features: Map<string, Feature[]>
|
|
23
26
|
|
|
24
27
|
constructor(
|
|
25
28
|
config: ConfigurationModel<typeof FromConfigAdapterConfigSchema>,
|
|
29
|
+
getSubAdapter?: getSubAdapterType,
|
|
30
|
+
pluginManager?: PluginManager,
|
|
26
31
|
) {
|
|
27
|
-
super(config)
|
|
32
|
+
super(config, getSubAdapter, pluginManager)
|
|
28
33
|
const features = readConfObject(
|
|
29
34
|
config,
|
|
30
35
|
'features',
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { toArray } from 'rxjs/operators'
|
|
2
2
|
import Adapter from './FromConfigSequenceAdapter'
|
|
3
3
|
import { sequenceConfigSchema } from './configSchema'
|
|
4
|
-
|
|
5
4
|
test('adapter can fetch sequences when there is just one feature representing whole refseq', async () => {
|
|
6
5
|
const features = [
|
|
7
6
|
{
|
|
@@ -9,8 +8,7 @@ test('adapter can fetch sequences when there is just one feature representing wh
|
|
|
9
8
|
refName: 'ctgA',
|
|
10
9
|
start: 0,
|
|
11
10
|
end: 150,
|
|
12
|
-
seq:
|
|
13
|
-
'ccaaaccgtcaattaaccggtatcttctcggaaacggcggttctctcctagatagcgatctgtggtctcaccatgcaatttaaacaggtgagtaaagattgctacaaatacgagactagctgtcaccagatgctgttcatctgttggctc',
|
|
11
|
+
seq: 'ccaaaccgtcaattaaccggtatcttctcggaaacggcggttctctcctagatagcgatctgtggtctcaccatgcaatttaaacaggtgagtaaagattgctacaaatacgagactagctgtcaccagatgctgttcatctgttggctc',
|
|
14
12
|
},
|
|
15
13
|
]
|
|
16
14
|
const adapter = new Adapter(sequenceConfigSchema.create({ features }))
|
|
@@ -40,8 +38,7 @@ test("adapter can fetch sequences when the config's sequence doesn't start at 0"
|
|
|
40
38
|
refName: 'ctgA',
|
|
41
39
|
start: 5000,
|
|
42
40
|
end: 5150,
|
|
43
|
-
seq:
|
|
44
|
-
'ccaaaccgtcaattaaccggtatcttctcggaaacggcggttctctcctagatagcgatctgtggtctcaccatgcaatttaaacaggtgagtaaagattgctacaaatacgagactagctgtcaccagatgctgttcatctgttggctc',
|
|
41
|
+
seq: 'ccaaaccgtcaattaaccggtatcttctcggaaacggcggttctctcctagatagcgatctgtggtctcaccatgcaatttaaacaggtgagtaaagattgctacaaatacgagactagctgtcaccagatgctgttcatctgttggctc',
|
|
45
42
|
},
|
|
46
43
|
]
|
|
47
44
|
const adapter = new Adapter(sequenceConfigSchema.create({ features }))
|
|
@@ -4,7 +4,7 @@ import { NoAssemblyRegion } from '@jbrowse/core/util/types'
|
|
|
4
4
|
import { toArray } from 'rxjs/operators'
|
|
5
5
|
import FromConfigAdapter from './FromConfigAdapter'
|
|
6
6
|
|
|
7
|
-
export default class
|
|
7
|
+
export default class FromConfigSequenceAdapter extends FromConfigAdapter {
|
|
8
8
|
/**
|
|
9
9
|
* Fetch features for a certain region
|
|
10
10
|
* @param region - Region
|
|
@@ -73,9 +73,6 @@ export default class FromSequenceConfigAdapter extends FromConfigAdapter {
|
|
|
73
73
|
}
|
|
74
74
|
}
|
|
75
75
|
|
|
76
|
-
// sort the regions by refName
|
|
77
|
-
regions.sort((a, b) => a.refName.localeCompare(b.refName))
|
|
78
|
-
|
|
79
76
|
return regions
|
|
80
77
|
}
|
|
81
78
|
|
|
@@ -4,7 +4,10 @@ import configSchema from './configSchema'
|
|
|
4
4
|
test('adapter can fetch a simple alias file', async () => {
|
|
5
5
|
const adapter = new Adapter(
|
|
6
6
|
configSchema.create({
|
|
7
|
-
location: {
|
|
7
|
+
location: {
|
|
8
|
+
localPath: require.resolve('./test_data/simple_alias.txt'),
|
|
9
|
+
locationType: 'LocalPathLocation',
|
|
10
|
+
},
|
|
8
11
|
}),
|
|
9
12
|
)
|
|
10
13
|
const result = await adapter.getRefNameAliases()
|
|
@@ -1,30 +1,20 @@
|
|
|
1
1
|
import {
|
|
2
2
|
BaseRefNameAliasAdapter,
|
|
3
|
-
Alias,
|
|
4
3
|
BaseAdapter,
|
|
5
4
|
} from '@jbrowse/core/data_adapters/BaseAdapter'
|
|
6
5
|
import { openLocation } from '@jbrowse/core/util/io'
|
|
7
|
-
import { GenericFilehandle } from 'generic-filehandle'
|
|
8
6
|
import { readConfObject } from '@jbrowse/core/configuration'
|
|
9
7
|
|
|
10
|
-
import { ConfigurationModel } from '@jbrowse/core/configuration/configurationSchema'
|
|
11
|
-
import MyConfigAdapterSchema from './configSchema'
|
|
12
|
-
|
|
13
8
|
export default class RefNameAliasAdapter
|
|
14
9
|
extends BaseAdapter
|
|
15
|
-
implements BaseRefNameAliasAdapter
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
this.promise = this.downloadResults()
|
|
24
|
-
}
|
|
25
|
-
|
|
26
|
-
private async downloadResults() {
|
|
27
|
-
const results = (await this.location.readFile('utf8')) as string
|
|
10
|
+
implements BaseRefNameAliasAdapter
|
|
11
|
+
{
|
|
12
|
+
async getRefNameAliases() {
|
|
13
|
+
const loc = readConfObject(this.config, 'location')
|
|
14
|
+
if (loc.uri === '' || loc.uri === '/path/to/my/aliases.txt') {
|
|
15
|
+
return []
|
|
16
|
+
}
|
|
17
|
+
const results = (await openLocation(loc).readFile('utf8')) as string
|
|
28
18
|
return results
|
|
29
19
|
.trim()
|
|
30
20
|
.split('\n')
|
|
@@ -34,9 +24,5 @@ export default class RefNameAliasAdapter
|
|
|
34
24
|
})
|
|
35
25
|
}
|
|
36
26
|
|
|
37
|
-
getRefNameAliases() {
|
|
38
|
-
return this.promise
|
|
39
|
-
}
|
|
40
|
-
|
|
41
27
|
async freeResources() {}
|
|
42
28
|
}
|
|
@@ -5,7 +5,10 @@ export default ConfigurationSchema(
|
|
|
5
5
|
{
|
|
6
6
|
location: {
|
|
7
7
|
type: 'fileLocation',
|
|
8
|
-
defaultValue: {
|
|
8
|
+
defaultValue: {
|
|
9
|
+
uri: '/path/to/my/aliases.txt',
|
|
10
|
+
locationType: 'UriLocation',
|
|
11
|
+
},
|
|
9
12
|
},
|
|
10
13
|
},
|
|
11
14
|
{ explicitlyTyped: true },
|