jstree.search.js 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421
  1. /**
  2. * ### Search plugin
  3. *
  4. * Adds search functionality to jsTree.
  5. */
  6. /*globals jQuery, define, exports, require, document */
  7. (function (factory) {
  8. "use strict";
  9. if (typeof define === 'function' && define.amd) {
  10. define('jstree.search', ['jquery','jstree'], factory);
  11. }
  12. else if(typeof exports === 'object') {
  13. factory(require('jquery'), require('jstree'));
  14. }
  15. else {
  16. factory(jQuery, jQuery.jstree);
  17. }
  18. }(function ($, jstree, undefined) {
  19. "use strict";
  20. if($.jstree.plugins.search) { return; }
  21. /**
  22. * stores all defaults for the search plugin
  23. * @name $.jstree.defaults.search
  24. * @plugin search
  25. */
  26. $.jstree.defaults.search = {
  27. /**
  28. * a jQuery-like AJAX config, which jstree uses if a server should be queried for results.
  29. *
  30. * A `str` (which is the search string) parameter will be added with the request, an optional `inside` parameter will be added if the search is limited to a node id. The expected result is a JSON array with nodes that need to be opened so that matching nodes will be revealed.
  31. * Leave this setting as `false` to not query the server. You can also set this to a function, which will be invoked in the instance's scope and receive 3 parameters - the search string, the callback to call with the array of nodes to load, and the optional node ID to limit the search to
  32. * @name $.jstree.defaults.search.ajax
  33. * @plugin search
  34. */
  35. ajax : false,
  36. /**
  37. * Indicates if the search should be fuzzy or not (should `chnd3` match `child node 3`). Default is `false`.
  38. * @name $.jstree.defaults.search.fuzzy
  39. * @plugin search
  40. */
  41. fuzzy : false,
  42. /**
  43. * Indicates if the search should be case sensitive. Default is `false`.
  44. * @name $.jstree.defaults.search.case_sensitive
  45. * @plugin search
  46. */
  47. case_sensitive : false,
  48. /**
  49. * Indicates if the tree should be filtered (by default) to show only matching nodes (keep in mind this can be a heavy on large trees in old browsers).
  50. * This setting can be changed at runtime when calling the search method. Default is `false`.
  51. * @name $.jstree.defaults.search.show_only_matches
  52. * @plugin search
  53. */
  54. show_only_matches : false,
  55. /**
  56. * Indicates if the children of matched element are shown (when show_only_matches is true)
  57. * This setting can be changed at runtime when calling the search method. Default is `false`.
  58. * @name $.jstree.defaults.search.show_only_matches_children
  59. * @plugin search
  60. */
  61. show_only_matches_children : false,
  62. /**
  63. * Indicates if all nodes opened to reveal the search result, should be closed when the search is cleared or a new search is performed. Default is `true`.
  64. * @name $.jstree.defaults.search.close_opened_onclear
  65. * @plugin search
  66. */
  67. close_opened_onclear : true,
  68. /**
  69. * Indicates if only leaf nodes should be included in search results. Default is `false`.
  70. * @name $.jstree.defaults.search.search_leaves_only
  71. * @plugin search
  72. */
  73. search_leaves_only : false,
  74. /**
  75. * If set to a function it wil be called in the instance's scope with two arguments - search string and node (where node will be every node in the structure, so use with caution).
  76. * If the function returns a truthy value the node will be considered a match (it might not be displayed if search_only_leaves is set to true and the node is not a leaf). Default is `false`.
  77. * @name $.jstree.defaults.search.search_callback
  78. * @plugin search
  79. */
  80. search_callback : false
  81. };
  82. $.jstree.plugins.search = function (options, parent) {
  83. this.bind = function () {
  84. parent.bind.call(this);
  85. this._data.search.str = "";
  86. this._data.search.dom = $();
  87. this._data.search.res = [];
  88. this._data.search.opn = [];
  89. this._data.search.som = false;
  90. this._data.search.smc = false;
  91. this._data.search.hdn = [];
  92. this.element
  93. .on("search.jstree", $.proxy(function (e, data) {
  94. if(this._data.search.som && data.res.length) {
  95. var m = this._model.data, i, j, p = [], k, l;
  96. for(i = 0, j = data.res.length; i < j; i++) {
  97. if(m[data.res[i]] && !m[data.res[i]].state.hidden) {
  98. p.push(data.res[i]);
  99. p = p.concat(m[data.res[i]].parents);
  100. if(this._data.search.smc) {
  101. for (k = 0, l = m[data.res[i]].children_d.length; k < l; k++) {
  102. if (m[m[data.res[i]].children_d[k]] && !m[m[data.res[i]].children_d[k]].state.hidden) {
  103. p.push(m[data.res[i]].children_d[k]);
  104. }
  105. }
  106. }
  107. }
  108. }
  109. p = $.vakata.array_remove_item($.vakata.array_unique(p), $.jstree.root);
  110. this._data.search.hdn = this.hide_all(true);
  111. this.show_node(p, true);
  112. this.redraw(true);
  113. }
  114. }, this))
  115. .on("clear_search.jstree", $.proxy(function (e, data) {
  116. if(this._data.search.som && data.res.length) {
  117. this.show_node(this._data.search.hdn, true);
  118. this.redraw(true);
  119. }
  120. }, this));
  121. };
  122. /**
  123. * used to search the tree nodes for a given string
  124. * @name search(str [, skip_async])
  125. * @param {String} str the search string
  126. * @param {Boolean} skip_async if set to true server will not be queried even if configured
  127. * @param {Boolean} show_only_matches if set to true only matching nodes will be shown (keep in mind this can be very slow on large trees or old browsers)
  128. * @param {mixed} inside an optional node to whose children to limit the search
  129. * @param {Boolean} append if set to true the results of this search are appended to the previous search
  130. * @plugin search
  131. * @trigger search.jstree
  132. */
  133. this.search = function (str, skip_async, show_only_matches, inside, append, show_only_matches_children) {
  134. if(str === false || $.trim(str.toString()) === "") {
  135. return this.clear_search();
  136. }
  137. inside = this.get_node(inside);
  138. inside = inside && inside.id ? inside.id : null;
  139. str = str.toString();
  140. var s = this.settings.search,
  141. a = s.ajax ? s.ajax : false,
  142. m = this._model.data,
  143. f = null,
  144. r = [],
  145. p = [], i, j;
  146. if(this._data.search.res.length && !append) {
  147. this.clear_search();
  148. }
  149. if(show_only_matches === undefined) {
  150. show_only_matches = s.show_only_matches;
  151. }
  152. if(show_only_matches_children === undefined) {
  153. show_only_matches_children = s.show_only_matches_children;
  154. }
  155. if(!skip_async && a !== false) {
  156. if($.isFunction(a)) {
  157. return a.call(this, str, $.proxy(function (d) {
  158. if(d && d.d) { d = d.d; }
  159. this._load_nodes(!$.isArray(d) ? [] : $.vakata.array_unique(d), function () {
  160. this.search(str, true, show_only_matches, inside, append, show_only_matches_children);
  161. });
  162. }, this), inside);
  163. }
  164. else {
  165. a = $.extend({}, a);
  166. if(!a.data) { a.data = {}; }
  167. a.data.str = str;
  168. if(inside) {
  169. a.data.inside = inside;
  170. }
  171. if (this._data.search.lastRequest) {
  172. this._data.search.lastRequest.abort();
  173. }
  174. this._data.search.lastRequest = $.ajax(a)
  175. .fail($.proxy(function () {
  176. this._data.core.last_error = { 'error' : 'ajax', 'plugin' : 'search', 'id' : 'search_01', 'reason' : 'Could not load search parents', 'data' : JSON.stringify(a) };
  177. this.settings.core.error.call(this, this._data.core.last_error);
  178. }, this))
  179. .done($.proxy(function (d) {
  180. if(d && d.d) { d = d.d; }
  181. this._load_nodes(!$.isArray(d) ? [] : $.vakata.array_unique(d), function () {
  182. this.search(str, true, show_only_matches, inside, append, show_only_matches_children);
  183. });
  184. }, this));
  185. return this._data.search.lastRequest;
  186. }
  187. }
  188. if(!append) {
  189. this._data.search.str = str;
  190. this._data.search.dom = $();
  191. this._data.search.res = [];
  192. this._data.search.opn = [];
  193. this._data.search.som = show_only_matches;
  194. this._data.search.smc = show_only_matches_children;
  195. }
  196. f = new $.vakata.search(str, true, { caseSensitive : s.case_sensitive, fuzzy : s.fuzzy });
  197. $.each(m[inside ? inside : $.jstree.root].children_d, function (ii, i) {
  198. var v = m[i];
  199. if(v.text && !v.state.hidden && (!s.search_leaves_only || (v.state.loaded && v.children.length === 0)) && ( (s.search_callback && s.search_callback.call(this, str, v)) || (!s.search_callback && f.search(v.text).isMatch) ) ) {
  200. r.push(i);
  201. p = p.concat(v.parents);
  202. }
  203. });
  204. if(r.length) {
  205. p = $.vakata.array_unique(p);
  206. for(i = 0, j = p.length; i < j; i++) {
  207. if(p[i] !== $.jstree.root && m[p[i]] && this.open_node(p[i], null, 0) === true) {
  208. this._data.search.opn.push(p[i]);
  209. }
  210. }
  211. if(!append) {
  212. this._data.search.dom = $(this.element[0].querySelectorAll('#' + $.map(r, function (v) { return "0123456789".indexOf(v[0]) !== -1 ? '\\3' + v[0] + ' ' + v.substr(1).replace($.jstree.idregex,'\\$&') : v.replace($.jstree.idregex,'\\$&'); }).join(', #')));
  213. this._data.search.res = r;
  214. }
  215. else {
  216. this._data.search.dom = this._data.search.dom.add($(this.element[0].querySelectorAll('#' + $.map(r, function (v) { return "0123456789".indexOf(v[0]) !== -1 ? '\\3' + v[0] + ' ' + v.substr(1).replace($.jstree.idregex,'\\$&') : v.replace($.jstree.idregex,'\\$&'); }).join(', #'))));
  217. this._data.search.res = $.vakata.array_unique(this._data.search.res.concat(r));
  218. }
  219. this._data.search.dom.children(".jstree-anchor").addClass('jstree-search');
  220. }
  221. /**
  222. * triggered after search is complete
  223. * @event
  224. * @name search.jstree
  225. * @param {jQuery} nodes a jQuery collection of matching nodes
  226. * @param {String} str the search string
  227. * @param {Array} res a collection of objects represeing the matching nodes
  228. * @plugin search
  229. */
  230. this.trigger('search', { nodes : this._data.search.dom, str : str, res : this._data.search.res, show_only_matches : show_only_matches });
  231. };
  232. /**
  233. * used to clear the last search (removes classes and shows all nodes if filtering is on)
  234. * @name clear_search()
  235. * @plugin search
  236. * @trigger clear_search.jstree
  237. */
  238. this.clear_search = function () {
  239. if(this.settings.search.close_opened_onclear) {
  240. this.close_node(this._data.search.opn, 0);
  241. }
  242. /**
  243. * triggered after search is complete
  244. * @event
  245. * @name clear_search.jstree
  246. * @param {jQuery} nodes a jQuery collection of matching nodes (the result from the last search)
  247. * @param {String} str the search string (the last search string)
  248. * @param {Array} res a collection of objects represeing the matching nodes (the result from the last search)
  249. * @plugin search
  250. */
  251. this.trigger('clear_search', { 'nodes' : this._data.search.dom, str : this._data.search.str, res : this._data.search.res });
  252. if(this._data.search.res.length) {
  253. this._data.search.dom = $(this.element[0].querySelectorAll('#' + $.map(this._data.search.res, function (v) {
  254. return "0123456789".indexOf(v[0]) !== -1 ? '\\3' + v[0] + ' ' + v.substr(1).replace($.jstree.idregex,'\\$&') : v.replace($.jstree.idregex,'\\$&');
  255. }).join(', #')));
  256. this._data.search.dom.children(".jstree-anchor").removeClass("jstree-search");
  257. }
  258. this._data.search.str = "";
  259. this._data.search.res = [];
  260. this._data.search.opn = [];
  261. this._data.search.dom = $();
  262. };
  263. this.redraw_node = function(obj, deep, callback, force_render) {
  264. obj = parent.redraw_node.apply(this, arguments);
  265. if(obj) {
  266. if($.inArray(obj.id, this._data.search.res) !== -1) {
  267. var i, j, tmp = null;
  268. for(i = 0, j = obj.childNodes.length; i < j; i++) {
  269. if(obj.childNodes[i] && obj.childNodes[i].className && obj.childNodes[i].className.indexOf("jstree-anchor") !== -1) {
  270. tmp = obj.childNodes[i];
  271. break;
  272. }
  273. }
  274. if(tmp) {
  275. tmp.className += ' jstree-search';
  276. }
  277. }
  278. }
  279. return obj;
  280. };
  281. };
  282. // helpers
  283. (function ($) {
  284. // from http://kiro.me/projects/fuse.html
  285. $.vakata.search = function(pattern, txt, options) {
  286. options = options || {};
  287. options = $.extend({}, $.vakata.search.defaults, options);
  288. if(options.fuzzy !== false) {
  289. options.fuzzy = true;
  290. }
  291. pattern = options.caseSensitive ? pattern : pattern.toLowerCase();
  292. var MATCH_LOCATION = options.location,
  293. MATCH_DISTANCE = options.distance,
  294. MATCH_THRESHOLD = options.threshold,
  295. patternLen = pattern.length,
  296. matchmask, pattern_alphabet, match_bitapScore, search;
  297. if(patternLen > 32) {
  298. options.fuzzy = false;
  299. }
  300. if(options.fuzzy) {
  301. matchmask = 1 << (patternLen - 1);
  302. pattern_alphabet = (function () {
  303. var mask = {},
  304. i = 0;
  305. for (i = 0; i < patternLen; i++) {
  306. mask[pattern.charAt(i)] = 0;
  307. }
  308. for (i = 0; i < patternLen; i++) {
  309. mask[pattern.charAt(i)] |= 1 << (patternLen - i - 1);
  310. }
  311. return mask;
  312. }());
  313. match_bitapScore = function (e, x) {
  314. var accuracy = e / patternLen,
  315. proximity = Math.abs(MATCH_LOCATION - x);
  316. if(!MATCH_DISTANCE) {
  317. return proximity ? 1.0 : accuracy;
  318. }
  319. return accuracy + (proximity / MATCH_DISTANCE);
  320. };
  321. }
  322. search = function (text) {
  323. text = options.caseSensitive ? text : text.toLowerCase();
  324. if(pattern === text || text.indexOf(pattern) !== -1) {
  325. return {
  326. isMatch: true,
  327. score: 0
  328. };
  329. }
  330. if(!options.fuzzy) {
  331. return {
  332. isMatch: false,
  333. score: 1
  334. };
  335. }
  336. var i, j,
  337. textLen = text.length,
  338. scoreThreshold = MATCH_THRESHOLD,
  339. bestLoc = text.indexOf(pattern, MATCH_LOCATION),
  340. binMin, binMid,
  341. binMax = patternLen + textLen,
  342. lastRd, start, finish, rd, charMatch,
  343. score = 1,
  344. locations = [];
  345. if (bestLoc !== -1) {
  346. scoreThreshold = Math.min(match_bitapScore(0, bestLoc), scoreThreshold);
  347. bestLoc = text.lastIndexOf(pattern, MATCH_LOCATION + patternLen);
  348. if (bestLoc !== -1) {
  349. scoreThreshold = Math.min(match_bitapScore(0, bestLoc), scoreThreshold);
  350. }
  351. }
  352. bestLoc = -1;
  353. for (i = 0; i < patternLen; i++) {
  354. binMin = 0;
  355. binMid = binMax;
  356. while (binMin < binMid) {
  357. if (match_bitapScore(i, MATCH_LOCATION + binMid) <= scoreThreshold) {
  358. binMin = binMid;
  359. } else {
  360. binMax = binMid;
  361. }
  362. binMid = Math.floor((binMax - binMin) / 2 + binMin);
  363. }
  364. binMax = binMid;
  365. start = Math.max(1, MATCH_LOCATION - binMid + 1);
  366. finish = Math.min(MATCH_LOCATION + binMid, textLen) + patternLen;
  367. rd = new Array(finish + 2);
  368. rd[finish + 1] = (1 << i) - 1;
  369. for (j = finish; j >= start; j--) {
  370. charMatch = pattern_alphabet[text.charAt(j - 1)];
  371. if (i === 0) {
  372. rd[j] = ((rd[j + 1] << 1) | 1) & charMatch;
  373. } else {
  374. rd[j] = ((rd[j + 1] << 1) | 1) & charMatch | (((lastRd[j + 1] | lastRd[j]) << 1) | 1) | lastRd[j + 1];
  375. }
  376. if (rd[j] & matchmask) {
  377. score = match_bitapScore(i, j - 1);
  378. if (score <= scoreThreshold) {
  379. scoreThreshold = score;
  380. bestLoc = j - 1;
  381. locations.push(bestLoc);
  382. if (bestLoc > MATCH_LOCATION) {
  383. start = Math.max(1, 2 * MATCH_LOCATION - bestLoc);
  384. } else {
  385. break;
  386. }
  387. }
  388. }
  389. }
  390. if (match_bitapScore(i + 1, MATCH_LOCATION) > scoreThreshold) {
  391. break;
  392. }
  393. lastRd = rd;
  394. }
  395. return {
  396. isMatch: bestLoc >= 0,
  397. score: score
  398. };
  399. };
  400. return txt === true ? { 'search' : search } : search(txt);
  401. };
  402. $.vakata.search.defaults = {
  403. location : 0,
  404. distance : 100,
  405. threshold : 0.6,
  406. fuzzy : false,
  407. caseSensitive : false
  408. };
  409. }($));
  410. // include the search plugin by default
  411. // $.jstree.defaults.plugins.push("search");
  412. }));