From 3d467e65e17bab4c34cddd9fcb1607258b8ab61f Mon Sep 17 00:00:00 2001 From: jos Date: Fri, 16 Sep 2016 15:09:31 +0200 Subject: [PATCH] History starts to work with JSONPatch --- src/JSONNode.js | 1 - src/TreeMode.js | 82 ++++++++++++++++++++++++++++++------------------- 2 files changed, 50 insertions(+), 33 deletions(-) diff --git a/src/JSONNode.js b/src/JSONNode.js index 777c898..f5b56f3 100644 --- a/src/JSONNode.js +++ b/src/JSONNode.js @@ -529,7 +529,6 @@ export default class JSONNode extends Component { const value = this._getValueFromEvent(event) if (value !== this.props.data.value) { - console.log('oldValue', this.props.data.value, value) this.props.events.onChangeValue(this.getPath(), value) } } diff --git a/src/TreeMode.js b/src/TreeMode.js index a56547f..1228548 100644 --- a/src/TreeMode.js +++ b/src/TreeMode.js @@ -67,13 +67,13 @@ export default class TreeMode extends Component { class: 'jsoneditor-undo', title: 'Undo last action', disabled: !this.canUndo(), - onClick: this.handleUndo + onClick: this.undo }), h('button', { class: 'jsoneditor-redo', title: 'Redo', disabled: !this.canRedo(), - onClick: this.handleRedo + onClick: this.redo }) ]), @@ -161,36 +161,11 @@ export default class TreeMode extends Component { }) } - canUndo = () => { - return this.state.historyIndex < this.state.history.length - 1 - } - - canRedo = () => { - return this.state.historyIndex > 0 - } - - handleUndo = () => { - if (this.canUndo()) { - const historyIndex = this.state.historyIndex + 1 - const data = this.state.history[historyIndex] - - this.setState({ data, historyIndex }) - } - } - - handleRedo = () => { - if (this.canRedo()) { - const historyIndex = this.state.historyIndex - 1 - const data = this.state.history[historyIndex] - - this.setState({ data, historyIndex }) - } - } - /** * Apply a JSONPatch to the current JSON document and emit a change event * @param {Array} actions */ + // TODO: rename all handle* methods to _handle* handlePatch = (actions) => { // apply changes const revert = this.patch(actions) @@ -201,6 +176,46 @@ export default class TreeMode extends Component { } } + canUndo = () => { + return this.state.historyIndex < this.state.history.length + } + + canRedo = () => { + return this.state.historyIndex > 0 + } + + undo = () => { + if (this.canUndo()) { + const history = this.state.history + const historyIndex = this.state.historyIndex + const undo = history[historyIndex].undo + + // FIXME: should call a patch method with does not adjust history but does emit a change event + this.handlePatch(undo) + + this.setState({ + history, + historyIndex: historyIndex + 1 + }) + } + } + + redo = () => { + if (this.canRedo()) { + const history = this.state.history + const historyIndex = this.state.historyIndex - 1 + const redo = history[historyIndex].redo + + // FIXME: should call a patch method with does not adjust history but does emit a change event + this.handlePatch(redo) + + this.setState({ + history, + historyIndex + }) + } + } + /** * Apply a JSONPatch to the current JSON document * @param {Array} actions JSONPatch actions @@ -210,8 +225,11 @@ export default class TreeMode extends Component { const result = patchData(this.state.data, actions) const data = result.data - // TODO: store patch and revert in history - const history = [data] + const newEntry = { + redo: actions, + undo: result.revert + } + const history = [newEntry] .concat(this.state.history.slice(this.state.historyIndex)) .slice(0, 1000) @@ -236,7 +254,8 @@ export default class TreeMode extends Component { options: setIn(this.state.options, ['name'], options && options.name || null), data, - history: [data], + // TODO: do we want to keep history when .set(json) is called? + history: [], historyIndex: 0 }) } @@ -269,7 +288,6 @@ export default class TreeMode extends Component { }) } - // TODO: implement expand // TODO: implement getText and setText /**