Some preparations for moveTo active search result (WIP)
This commit is contained in:
parent
fec1bb8f23
commit
349e6015a3
|
@ -8,9 +8,7 @@ import { escapeHTML, unescapeHTML } from '../utils/stringUtils'
|
||||||
import { getInnerText, insideRect } from '../utils/domUtils'
|
import { getInnerText, insideRect } from '../utils/domUtils'
|
||||||
import { stringConvert, valueType, isUrl } from '../utils/typeUtils'
|
import { stringConvert, valueType, isUrl } from '../utils/typeUtils'
|
||||||
|
|
||||||
import type {
|
import type { PropertyData, JSONData, SearchResultStatus } from '../types'
|
||||||
PropertyData, ObjectData, ArrayData, JSONData,
|
|
||||||
SearchResult, SearchResultStatus } from '../types'
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @type {JSONNode | null} activeContextMenu singleton holding the JSONNode having
|
* @type {JSONNode | null} activeContextMenu singleton holding the JSONNode having
|
||||||
|
@ -393,14 +391,15 @@ export default class JSONNode extends Component {
|
||||||
}
|
}
|
||||||
|
|
||||||
componentDidUpdate (prevProps, prevState) {
|
componentDidUpdate (prevProps, prevState) {
|
||||||
if (this.props.data.focusProperty && !prevProps.data.focusProperty) {
|
if (this.props.prop && this.props.prop.focus &&
|
||||||
|
!(prevProps.props.prop && prevProps.props.prop.focus)) {
|
||||||
console.log('focus property', this.getPath()) // TODO: cleanup
|
console.log('focus property', this.getPath()) // TODO: cleanup
|
||||||
if (this.refs.property) {
|
if (this.refs.property) {
|
||||||
this.refs.property.focus()
|
this.refs.property.focus()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
if (this.props.data.focusValue && !prevProps.data.focusValue) {
|
if (this.props.data.focus && !prevProps.data.focus) {
|
||||||
console.log('focus value', this.getPath()) // TODO: cleanup
|
console.log('focus value', this.getPath()) // TODO: cleanup
|
||||||
if (this.refs.value) {
|
if (this.refs.value) {
|
||||||
this.refs.value.focus()
|
this.refs.value.focus()
|
||||||
|
|
|
@ -7,7 +7,8 @@ import { parseJSON } from '../utils/jsonUtils'
|
||||||
import { enrichSchemaError } from '../utils/schemaUtils'
|
import { enrichSchemaError } from '../utils/schemaUtils'
|
||||||
import {
|
import {
|
||||||
jsonToData, dataToJson, toDataPath, patchData, pathExists,
|
jsonToData, dataToJson, toDataPath, patchData, pathExists,
|
||||||
expand, addErrors, search, addSearchResults, nextSearchResult, previousSearchResult
|
expand, addErrors, addFocus,
|
||||||
|
search, addSearchResults, nextSearchResult, previousSearchResult
|
||||||
} from '../jsonData'
|
} from '../jsonData'
|
||||||
import {
|
import {
|
||||||
duplicate, insert, append, remove,
|
duplicate, insert, append, remove,
|
||||||
|
@ -118,6 +119,10 @@ export default class TreeMode extends Component {
|
||||||
if (searchResults) {
|
if (searchResults) {
|
||||||
data = addSearchResults(data, searchResults, this.state.search.active)
|
data = addSearchResults(data, searchResults, this.state.search.active)
|
||||||
}
|
}
|
||||||
|
// TODO: moveTo active search result (not focus!)
|
||||||
|
// if (this.state.search.active) {
|
||||||
|
// data = addFocus(data, this.state.search.active)
|
||||||
|
// }
|
||||||
|
|
||||||
// console.log('data', data)
|
// console.log('data', data)
|
||||||
|
|
||||||
|
|
|
@ -9,7 +9,7 @@ import { setIn, updateIn, getIn, deleteIn, insertAt } from './utils/immutability
|
||||||
import { isObject } from './utils/typeUtils'
|
import { isObject } from './utils/typeUtils'
|
||||||
import isEqual from 'lodash/isEqual'
|
import isEqual from 'lodash/isEqual'
|
||||||
|
|
||||||
import type {JSONData, SearchResult} from './types'
|
import type {JSONData, DataPointer} from './types'
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Expand function which will expand all nodes
|
* Expand function which will expand all nodes
|
||||||
|
@ -509,8 +509,8 @@ export function addErrors (data, errors) {
|
||||||
/**
|
/**
|
||||||
* Search some text in all properties and values
|
* Search some text in all properties and values
|
||||||
*/
|
*/
|
||||||
export function search (data: JSONData, text: string): SearchResult[] {
|
export function search (data: JSONData, text: string): DataPointer[] {
|
||||||
let results: SearchResult[] = []
|
let results: DataPointer[] = []
|
||||||
|
|
||||||
traverse(data, function (value, path) {
|
traverse(data, function (value, path) {
|
||||||
// check property name
|
// check property name
|
||||||
|
@ -546,7 +546,7 @@ export function search (data: JSONData, text: string): SearchResult[] {
|
||||||
* returned as next
|
* returned as next
|
||||||
* - When `searchResults` is empty, null will be returned
|
* - When `searchResults` is empty, null will be returned
|
||||||
*/
|
*/
|
||||||
export function nextSearchResult (searchResults: SearchResult[], current: SearchResult): SearchResult | null {
|
export function nextSearchResult (searchResults: DataPointer[], current: DataPointer): DataPointer | null {
|
||||||
if (searchResults.length === 0) {
|
if (searchResults.length === 0) {
|
||||||
return null
|
return null
|
||||||
}
|
}
|
||||||
|
@ -570,7 +570,7 @@ export function nextSearchResult (searchResults: SearchResult[], current: Search
|
||||||
* returned as next
|
* returned as next
|
||||||
* - When `searchResults` is empty, null will be returned
|
* - When `searchResults` is empty, null will be returned
|
||||||
*/
|
*/
|
||||||
export function previousSearchResult (searchResults: SearchResult[], current: SearchResult): SearchResult | null {
|
export function previousSearchResult (searchResults: DataPointer[], current: DataPointer): DataPointer | null {
|
||||||
if (searchResults.length === 0) {
|
if (searchResults.length === 0) {
|
||||||
return null
|
return null
|
||||||
}
|
}
|
||||||
|
@ -589,7 +589,7 @@ export function previousSearchResult (searchResults: SearchResult[], current: Se
|
||||||
/**
|
/**
|
||||||
* Merge searchResults into the data
|
* Merge searchResults into the data
|
||||||
*/
|
*/
|
||||||
export function addSearchResults (data: JSONData, searchResults: SearchResult[], activeSearchResult: SearchResult) {
|
export function addSearchResults (data: JSONData, searchResults: DataPointer[], activeSearchResult: DataPointer) {
|
||||||
let updatedData = data
|
let updatedData = data
|
||||||
|
|
||||||
searchResults.forEach(function (searchResult) {
|
searchResults.forEach(function (searchResult) {
|
||||||
|
@ -612,21 +612,20 @@ export function addSearchResults (data: JSONData, searchResults: SearchResult[],
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Merge a object describing where the focus is to the data
|
* Merge a object describing where the focus is to the data
|
||||||
*
|
|
||||||
* @param {JSONData} data
|
|
||||||
* @param {SearchResult} focusOn
|
|
||||||
* @return {JSONData} Returns an updated copy of data
|
|
||||||
*/
|
*/
|
||||||
export function addFocus (data: JSONData, focusOn: SearchResult) {
|
export function addFocus (data: JSONData, focusOn: DataPointer) {
|
||||||
if (focusOn.value) {
|
if (focusOn.type == 'value') {
|
||||||
const dataPath = toDataPath(data, focusOn.dataPath).concat('focusValue')
|
const dataPath = toDataPath(data, focusOn.dataPath).concat('focus')
|
||||||
return setIn(data, dataPath, true)
|
return setIn(data, dataPath, true)
|
||||||
}
|
}
|
||||||
|
|
||||||
if (focusOn.property) {
|
if (focusOn.type === 'property') {
|
||||||
const dataPath = toDataPath(data, focusOn.dataPath).concat('focusProperty')
|
const valueDataPath = toDataPath(data, focusOn.dataPath)
|
||||||
return setIn(data, dataPath, true)
|
const propertyDataPath = allButLast(valueDataPath).concat('focus')
|
||||||
|
return setIn(data, propertyDataPath, true)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
return data
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|
|
@ -50,7 +50,7 @@ export type JSONArrayType = Array<JSONType>;
|
||||||
/********************** TYPES FOR THE JSON DATA MODEL *************************/
|
/********************** TYPES FOR THE JSON DATA MODEL *************************/
|
||||||
|
|
||||||
export type SearchResultStatus = 'normal' | 'active'
|
export type SearchResultStatus = 'normal' | 'active'
|
||||||
export type SearchResultType = 'value' | 'property'
|
export type DataPointerType = 'value' | 'property'
|
||||||
|
|
||||||
export type PropertyData = {
|
export type PropertyData = {
|
||||||
name: string,
|
name: string,
|
||||||
|
@ -82,11 +82,11 @@ export type JSONData = ObjectData | ArrayData | ValueData
|
||||||
|
|
||||||
export type Path = string[]
|
export type Path = string[]
|
||||||
|
|
||||||
export type SearchResult = {
|
export type DataPointer = {
|
||||||
dataPath: Path,
|
dataPath: Path,
|
||||||
type: SearchResultType
|
type: DataPointerType
|
||||||
}
|
}
|
||||||
// TODO: SearchResult.dataPath is an array, JSONSchemaError.dataPath is a string -> make this consistent
|
// TODO: DataPointer.dataPath is an array, JSONSchemaError.dataPath is a string -> make this consistent
|
||||||
|
|
||||||
|
|
||||||
// TODO: remove SetOptions, merge into Options (everywhere in the public API)
|
// TODO: remove SetOptions, merge into Options (everywhere in the public API)
|
||||||
|
|
Loading…
Reference in New Issue