From 497c20019d62028f51e48a19837de7d2f408af85 Mon Sep 17 00:00:00 2001 From: jos Date: Sun, 6 May 2018 21:03:53 +0200 Subject: [PATCH] No more expanding of all search results. Search working with large arrays --- HISTORY.md | 7 +++++- src/js/Node.js | 43 ++++++++++++++++------------------- src/js/SearchBox.js | 6 ++--- src/js/showMoreNodeFactory.js | 2 +- 4 files changed, 29 insertions(+), 29 deletions(-) diff --git a/HISTORY.md b/HISTORY.md index bc1d776..16d77e5 100644 --- a/HISTORY.md +++ b/HISTORY.md @@ -3,8 +3,13 @@ https://github.com/josdejong/jsoneditor -## not yet released, version 5.15.1 +## not yet released, version 5.16.0 +- Better handling of large JSON documents: + - Only displays the first 100 items of large arrays, with buttons + "show more" and "show all" to render more items. + - Search does no longer expand the paths to all matches, instead + it only expands the path of the current search result. - Fixed index numbers of Array items not being updated after sorting. diff --git a/src/js/Node.js b/src/js/Node.js index 606c8cf..88c1d4a 100644 --- a/src/js/Node.js +++ b/src/js/Node.js @@ -793,8 +793,7 @@ Node.prototype.insertAfter = function(node, afterNode) { /** * Search in this node - * The node will be expanded when the text is found one of its childs, else - * it will be collapsed. Searches are case insensitive. + * Searches are case insensitive. * @param {String} text * @return {Node[]} results Array with nodes containing the search text */ @@ -808,10 +807,10 @@ Node.prototype.search = function(text) { delete this.searchValue; // search in field - if (this.field != undefined) { + if (this.field !== undefined) { var field = String(this.field).toLowerCase(); index = field.indexOf(search); - if (index != -1) { + if (index !== -1) { this.searchField = true; results.push({ 'node': this, @@ -835,24 +834,13 @@ Node.prototype.search = function(text) { }); results = results.concat(childResults); } - - // update dom - if (search != undefined) { - var recurse = false; - if (childResults.length == 0) { - this.collapse(recurse); - } - else { - this.expand(recurse); - } - } } else { // string, auto - if (this.value != undefined ) { + if (this.value !== undefined ) { var value = String(this.value).toLowerCase(); index = value.indexOf(search); - if (index != -1) { + if (index !== -1) { this.searchValue = true; results.push({ 'node': this, @@ -874,14 +862,21 @@ Node.prototype.search = function(text) { * @param {function(boolean)} [callback] */ Node.prototype.scrollTo = function(callback) { - if (!this.dom.tr || !this.dom.tr.parentNode) { - // if the node is not visible, expand its parents - var parent = this.parent; - var recurse = false; - while (parent) { - parent.expand(recurse); - parent = parent.parent; + // if the node is not visible, expand its parents + var node = this; + var recurse = false; + while (node && node.parent) { + // expand max visible childs of the parent if needed + var index = node.parent.type === 'array' + ? node.index + : node.parent.childs.indexOf(node); + while (node.parent.maxVisibleChilds < index + 1) { + node.parent.maxVisibleChilds += Node.prototype.MAX_VISIBLE_CHILDS; } + + // expand the parent itself + node.parent.expand(recurse); + node = node.parent; } if (this.dom.tr && this.dom.tr.parentNode) { diff --git a/src/js/SearchBox.js b/src/js/SearchBox.js index 61ba943..192c3a7 100644 --- a/src/js/SearchBox.js +++ b/src/js/SearchBox.js @@ -226,14 +226,14 @@ SearchBox.prototype._onSearch = function (forceSearch) { var value = this.dom.search.value; var text = (value.length > 0) ? value : undefined; - if (text != this.lastText || forceSearch) { + if (text !== this.lastText || forceSearch) { // only search again when changed this.lastText = text; this.results = this.editor.search(text); - this._setActiveResult(undefined); + this._setActiveResult(0, false); // display search results - if (text != undefined) { + if (text !== undefined) { var resultCount = this.results.length; switch (resultCount) { case 0: this.dom.results.innerHTML = 'no results'; break; diff --git a/src/js/showMoreNodeFactory.js b/src/js/showMoreNodeFactory.js index b95f192..6b8c521 100644 --- a/src/js/showMoreNodeFactory.js +++ b/src/js/showMoreNodeFactory.js @@ -106,7 +106,7 @@ function showMoreNodeFactory(Node) { this.dom.moreText.nodeValue = this._getShowMoreText(); // update left margin - this.dom.moreContents.style.marginLeft = (this.getLevel() + 2) * 24 + 'px'; + this.dom.moreContents.style.marginLeft = (this.getLevel() + 1) * 24 + 'px'; } else { if (this.dom.tr && this.dom.tr.parentNode) {