Remove floating menu
This commit is contained in:
parent
4c539cb4f5
commit
0349f94ead
|
@ -4,7 +4,6 @@ import initial from 'lodash/initial'
|
|||
import isEqual from 'lodash/isEqual'
|
||||
import naturalSort from 'javascript-natural-sort'
|
||||
|
||||
import FloatingMenu from './menu/FloatingMenu'
|
||||
import { escapeHTML, unescapeHTML } from '../utils/stringUtils'
|
||||
import { getInnerText, insideRect } from '../utils/domUtils'
|
||||
import { stringConvert, valueType, isUrl } from '../utils/typeUtils'
|
||||
|
@ -131,8 +130,6 @@ export default class JSONNode extends PureComponent {
|
|||
}
|
||||
}
|
||||
|
||||
// FIXME
|
||||
const floatingMenu = this.renderFloatingMenu('object', this.props.eson[SELECTION])
|
||||
const nodeEnd = this.props.eson[EXPANDED]
|
||||
? h('div', {key: 'node-end', className: 'jsoneditor-node-end', 'data-area': 'empty'}, [
|
||||
this.renderDelimiter('}', 'jsoneditor-delimiter-end')
|
||||
|
@ -145,7 +142,7 @@ export default class JSONNode extends PureComponent {
|
|||
className: this.getContainerClassName(this.props.eson[SELECTION], this.state.hover),
|
||||
// onMouseOver: this.handleMouseOver,
|
||||
// onMouseLeave: this.handleMouseLeave
|
||||
}, [floatingMenu, nodeStart, childs, nodeEnd])
|
||||
}, [nodeStart, childs, nodeEnd])
|
||||
}
|
||||
|
||||
renderJSONArray () {
|
||||
|
@ -192,7 +189,6 @@ export default class JSONNode extends PureComponent {
|
|||
}
|
||||
}
|
||||
|
||||
const floatingMenu = this.renderFloatingMenu('array', this.props.eson[SELECTION])
|
||||
const nodeEnd = this.props.eson[EXPANDED]
|
||||
? h('div', {key: 'node-end', className: 'jsoneditor-node-end', 'data-area': 'empty'}, [
|
||||
this.renderDelimiter(']', 'jsoneditor-delimiter-end')
|
||||
|
@ -205,7 +201,7 @@ export default class JSONNode extends PureComponent {
|
|||
className: this.getContainerClassName(this.props.eson[SELECTION], this.state.hover),
|
||||
// onMouseOver: this.handleMouseOver,
|
||||
// onMouseLeave: this.handleMouseLeave
|
||||
}, [floatingMenu, nodeStart, childs, nodeEnd])
|
||||
}, [nodeStart, childs, nodeEnd])
|
||||
}
|
||||
|
||||
renderJSONValue () {
|
||||
|
@ -221,8 +217,6 @@ export default class JSONNode extends PureComponent {
|
|||
this.renderError(this.props.eson[ERROR])
|
||||
])
|
||||
|
||||
const floatingMenu = this.renderFloatingMenu('value', this.props.eson[SELECTION])
|
||||
|
||||
// const insertArea = this.renderInsertBeforeArea()
|
||||
|
||||
return h('div', {
|
||||
|
@ -231,7 +225,7 @@ export default class JSONNode extends PureComponent {
|
|||
className: this.getContainerClassName(this.props.eson[SELECTION], this.state.hover),
|
||||
// onMouseOver: this.handleMouseOver,
|
||||
// onMouseLeave: this.handleMouseLeave
|
||||
}, [node, floatingMenu])
|
||||
}, [node])
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -539,84 +533,6 @@ export default class JSONNode extends PureComponent {
|
|||
)
|
||||
}
|
||||
|
||||
renderFloatingMenu (type, selected) {
|
||||
if (((selected & SELECTED_END) === 0) &&
|
||||
((selected & SELECTED_INSIDE) === 0) &&
|
||||
((selected & SELECTED_AFTER) === 0)) {
|
||||
return null
|
||||
}
|
||||
|
||||
const isLastOfMultiple = ((selected & SELECTED_LAST) !== 0) &&
|
||||
((selected & SELECTED_FIRST) === 0)
|
||||
const isAfter = ((selected & SELECTED_AFTER) !== 0)
|
||||
// const isInside = ((selected & SELECTED_INSIDE) !== 0) // TODO: nicely position menu when selected inside
|
||||
|
||||
return h(FloatingMenu, {
|
||||
key: 'floating-menu',
|
||||
path: this.state.path,
|
||||
emit: this.props.emit,
|
||||
items: this.getFloatingMenuItems(type, selected),
|
||||
position: isLastOfMultiple || isAfter ? 'bottom' : 'top'
|
||||
})
|
||||
}
|
||||
|
||||
getFloatingMenuItems (type, selected) {
|
||||
if ((selected & SELECTED_AFTER) !== 0) {
|
||||
return [
|
||||
{type: 'insertStructureAfter'},
|
||||
{type: 'insertValueAfter'},
|
||||
{type: 'insertObjectAfter'},
|
||||
{type: 'insertArrayAfter'},
|
||||
{type: 'paste'},
|
||||
]
|
||||
}
|
||||
|
||||
if ((selected & SELECTED_INSIDE) !== 0) {
|
||||
return [
|
||||
{type: 'insertStructureInside'},
|
||||
{type: 'insertValueInside'},
|
||||
{type: 'insertObjectInside'},
|
||||
{type: 'insertArrayInside'},
|
||||
{type: 'paste'},
|
||||
]
|
||||
}
|
||||
|
||||
if (type === 'object') {
|
||||
return [
|
||||
{type: 'sort'},
|
||||
{type: 'duplicate'},
|
||||
{type: 'cut'},
|
||||
{type: 'copy'},
|
||||
{type: 'paste'},
|
||||
{type: 'remove'}
|
||||
]
|
||||
}
|
||||
|
||||
if (type === 'array') {
|
||||
return [
|
||||
{type: 'sort'},
|
||||
{type: 'duplicate'},
|
||||
{type: 'cut'},
|
||||
{type: 'copy'},
|
||||
{type: 'paste'},
|
||||
{type: 'remove'}
|
||||
]
|
||||
}
|
||||
|
||||
if (type === 'value') {
|
||||
return [
|
||||
// {text: 'String', onClick: this.props.emit('changeType', {type: 'checkbox', checked: false}}),
|
||||
{type: 'duplicate'},
|
||||
{type: 'cut'},
|
||||
{type: 'copy'},
|
||||
{type: 'paste'},
|
||||
{type: 'remove'}
|
||||
]
|
||||
}
|
||||
|
||||
throw new Error(`Cannot create FloatingMenu items for type: ${type}, selected: ${selected})`)
|
||||
}
|
||||
|
||||
handleMouseOver = (event) => {
|
||||
if (event.buttons === 0) { // no mouse button down, no dragging
|
||||
event.stopPropagation()
|
||||
|
|
|
@ -765,7 +765,8 @@ export default class TreeMode extends PureComponent {
|
|||
|
||||
const pointer = this.findJSONPointerFromElement(event.target)
|
||||
const clickedOnEmptySpace = (event.target.nodeName === 'DIV') &&
|
||||
(event.target.contentEditable !== 'true')
|
||||
(event.target.contentEditable !== 'true') &&
|
||||
(event.target.className !== 'jsoneditor-tag') // FIXME: this is an ugly hack to prevent an object/array from being selected when expanding it by clicking the tag
|
||||
|
||||
// TODO: cleanup
|
||||
// console.log('handleTouchStart', clickedOnEmptySpace && pointer, pointer && this.selectionFromJSONPointer(pointer))
|
||||
|
|
Loading…
Reference in New Issue