Implement most menu functionality
This commit is contained in:
parent
702dc5ed20
commit
4c539cb4f5
|
@ -24,8 +24,7 @@ import {
|
|||
insertInside,
|
||||
remove,
|
||||
removeAll,
|
||||
replace,
|
||||
sort
|
||||
replace
|
||||
} from '../actions'
|
||||
import JSONNode from './JSONNode'
|
||||
import JSONNodeView from './JSONNodeView'
|
||||
|
@ -271,6 +270,12 @@ export default class TreeMode extends PureComponent {
|
|||
}
|
||||
|
||||
renderMenu () {
|
||||
const hasCursor = true // FIXME: implement hasCursor
|
||||
const hasSelection = !!this.state.selection
|
||||
const hasClipboard = this.state.clipboard
|
||||
? this.state.clipboard.length > 0
|
||||
: false
|
||||
|
||||
return h(TreeModeMenu, {
|
||||
key: 'menu',
|
||||
|
||||
|
@ -278,13 +283,32 @@ export default class TreeMode extends PureComponent {
|
|||
modes: this.props.modes,
|
||||
onChangeMode: this.props.onChangeMode,
|
||||
|
||||
canCut: hasSelection,
|
||||
canCopy: hasSelection,
|
||||
canPaste: hasClipboard && hasCursor,
|
||||
onCut: this.handleCut,
|
||||
onCopy: this.handleCopy,
|
||||
onPaste: this.handlePaste,
|
||||
|
||||
canInsert: hasCursor,
|
||||
canDuplicate: hasSelection,
|
||||
canRemove: hasSelection,
|
||||
onInsert: this.handleInsertBefore,
|
||||
onDuplicate: this.handleDuplicate,
|
||||
onRemove: this.handleRemove,
|
||||
|
||||
canSort: hasSelection || hasCursor,
|
||||
canTransform: hasSelection || hasCursor,
|
||||
canSearch: this.props.search,
|
||||
onSort: this.handleSort,
|
||||
onTransform: this.handleTransform,
|
||||
onToggleSearch: this.toggleSearch,
|
||||
|
||||
enableHistory: this.props.history,
|
||||
canUndo: this.canUndo(),
|
||||
canRedo: this.canRedo(),
|
||||
onUndo: this.undo,
|
||||
onRedo: this.redo,
|
||||
|
||||
onToggleSearch: this.toggleSearch
|
||||
})
|
||||
}
|
||||
|
||||
|
@ -541,6 +565,14 @@ export default class TreeMode extends PureComponent {
|
|||
|
||||
// TODO: select the pasted contents
|
||||
}
|
||||
else {
|
||||
// TODO: paste before current line => selection must contain current line
|
||||
}
|
||||
}
|
||||
|
||||
handleInsertBefore = () => {
|
||||
// FIXME: implement handleInsertBefore
|
||||
console.error('Insert not yet implemented...')
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -569,13 +601,15 @@ export default class TreeMode extends PureComponent {
|
|||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* Handle sorting a path
|
||||
* @param {Path} path
|
||||
* @param {string | null} [order]
|
||||
*/
|
||||
handleSort = (path, order = null) => {
|
||||
this.handlePatch(sort(this.state.eson, path, order))
|
||||
handleSort = () => {
|
||||
// FIXME: implement handle sort from selection or caret
|
||||
console.error('sort not yet implemented...')
|
||||
// this.handlePatch(sort(this.state.eson, path, order))
|
||||
}
|
||||
|
||||
handleTransform = () => {
|
||||
// FIXME: implement handleTransform
|
||||
console.error('transform not yet implemented...')
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
|
@ -20,6 +20,10 @@
|
|||
|
||||
font-family: arial, sans-serif;
|
||||
font-size: 16px;
|
||||
|
||||
&.current-mode {
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
button:hover {
|
||||
|
|
|
@ -29,11 +29,12 @@ export default class ModeButton extends Component {
|
|||
return h('div', {className: 'jsoneditor-modes'}, [
|
||||
h('button', {
|
||||
key: 'button',
|
||||
className: 'current-mode',
|
||||
title: 'Switch mode',
|
||||
onClick: this.handleOpen
|
||||
}, [
|
||||
toCapital(props.mode) + ' ',
|
||||
h('i', { className: 'fa fa-chevron-down' })
|
||||
h('i', { key: 'icon', className: 'fa fa-chevron-down' })
|
||||
]),
|
||||
|
||||
h(ModeSelector, {
|
||||
|
|
|
@ -41,13 +41,25 @@ export default class TreeModeMenu extends PureComponent {
|
|||
onCopy: PropTypes.func.isRequired,
|
||||
onPaste: PropTypes.func.isRequired,
|
||||
|
||||
canInsert: PropTypes.bool.isRequired,
|
||||
canDuplicate: PropTypes.bool.isRequired,
|
||||
canRemove: PropTypes.bool.isRequired,
|
||||
onInsert: PropTypes.func.isRequired,
|
||||
onDuplicate: PropTypes.func.isRequired,
|
||||
onRemove: PropTypes.func.isRequired,
|
||||
|
||||
canSort: PropTypes.bool.isRequired,
|
||||
canTransform: PropTypes.bool.isRequired,
|
||||
canSearch: PropTypes.bool.isRequired,
|
||||
onSort: PropTypes.func.isRequired,
|
||||
onTransform: PropTypes.func.isRequired,
|
||||
onToggleSearch: PropTypes.func,
|
||||
|
||||
enableHistory: PropTypes.bool,
|
||||
canUndo: PropTypes.bool,
|
||||
canRedo: PropTypes.bool,
|
||||
onUndo: PropTypes.func,
|
||||
onRedo: PropTypes.func,
|
||||
|
||||
onToggleSearch: PropTypes.func
|
||||
onRedo: PropTypes.func
|
||||
}
|
||||
|
||||
render () {
|
||||
|
@ -82,14 +94,14 @@ export default class TreeModeMenu extends PureComponent {
|
|||
key: 'copy',
|
||||
className: 'jsoneditor-copy',
|
||||
title: 'Copy current selection',
|
||||
// disabled: !this.props.canPaste,
|
||||
onClick: this.props.onPaste
|
||||
disabled: !this.props.canCopy,
|
||||
onClick: this.props.onCopy
|
||||
}, h('i', {className: 'fa fa-copy'})),
|
||||
h('button', {
|
||||
key: 'paste',
|
||||
className: 'jsoneditor-paste',
|
||||
title: 'Paste copied selection',
|
||||
// disabled: !this.props.canPaste,
|
||||
disabled: !this.props.canPaste,
|
||||
onClick: this.props.onPaste
|
||||
}, h('i', {className: 'fa fa-paste'}))
|
||||
])
|
||||
|
@ -128,13 +140,14 @@ export default class TreeModeMenu extends PureComponent {
|
|||
key: 'sort',
|
||||
className: 'jsoneditor-sort',
|
||||
title: 'Sort contents',
|
||||
onClick: this.props.onSort // TODO: implement onSort
|
||||
// disabled: !this.props.canSort, // TODO: can sort
|
||||
onClick: this.props.onSort
|
||||
}, h('i', {className: 'fa fa-sort-amount-down'})),
|
||||
h('button', {
|
||||
key: 'transform',
|
||||
className: 'jsoneditor-transform',
|
||||
title: 'Transform contents',
|
||||
// disabled: !this.props.canPaste,
|
||||
// disabled: !this.props.canTransform, // TODO canTransform
|
||||
onClick: this.props.onTransform
|
||||
}, h('i', {className: 'fa fa-filter'})),
|
||||
h('button', {
|
||||
|
|
Loading…
Reference in New Issue