You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

repo-findfile.js 4.1KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123
  1. import $ from 'jquery';
  2. import {svg} from '../svg.js';
  3. import {toggleElem} from '../utils/dom.js';
  4. const {csrf} = window.config;
  5. const threshold = 50;
  6. let files = [];
  7. let $repoFindFileInput, $repoFindFileTableBody, $repoFindFileNoResult;
  8. // return the case-insensitive sub-match result as an array: [unmatched, matched, unmatched, matched, ...]
  9. // res[even] is unmatched, res[odd] is matched, see unit tests for examples
  10. // argument subLower must be a lower-cased string.
  11. export function strSubMatch(full, subLower) {
  12. const res = [''];
  13. let i = 0, j = 0;
  14. const fullLower = full.toLowerCase();
  15. while (i < subLower.length && j < fullLower.length) {
  16. if (subLower[i] === fullLower[j]) {
  17. if (res.length % 2 !== 0) res.push('');
  18. res[res.length - 1] += full[j];
  19. j++;
  20. i++;
  21. } else {
  22. if (res.length % 2 === 0) res.push('');
  23. res[res.length - 1] += full[j];
  24. j++;
  25. }
  26. }
  27. if (i !== subLower.length) {
  28. // if the sub string doesn't match the full, only return the full as unmatched.
  29. return [full];
  30. }
  31. if (j < full.length) {
  32. // append remaining chars from full to result as unmatched
  33. if (res.length % 2 === 0) res.push('');
  34. res[res.length - 1] += full.substring(j);
  35. }
  36. return res;
  37. }
  38. export function calcMatchedWeight(matchResult) {
  39. let weight = 0;
  40. for (let i = 0; i < matchResult.length; i++) {
  41. if (i % 2 === 1) { // matches are on odd indices, see strSubMatch
  42. // use a function f(x+x) > f(x) + f(x) to make the longer matched string has higher weight.
  43. weight += matchResult[i].length * matchResult[i].length;
  44. }
  45. }
  46. return weight;
  47. }
  48. export function filterRepoFilesWeighted(files, filter) {
  49. let filterResult = [];
  50. if (filter) {
  51. const filterLower = filter.toLowerCase();
  52. // TODO: for large repo, this loop could be slow, maybe there could be one more limit:
  53. // ... && filterResult.length < threshold * 20, wait for more feedbacks
  54. for (let i = 0; i < files.length; i++) {
  55. const res = strSubMatch(files[i], filterLower);
  56. if (res.length > 1) { // length==1 means unmatched, >1 means having matched sub strings
  57. filterResult.push({matchResult: res, matchWeight: calcMatchedWeight(res)});
  58. }
  59. }
  60. filterResult.sort((a, b) => b.matchWeight - a.matchWeight);
  61. filterResult = filterResult.slice(0, threshold);
  62. } else {
  63. for (let i = 0; i < files.length && i < threshold; i++) {
  64. filterResult.push({matchResult: [files[i]], matchWeight: 0});
  65. }
  66. }
  67. return filterResult;
  68. }
  69. export function escapePath(s) {
  70. return s.split('/').map(encodeURIComponent).join('/');
  71. }
  72. function filterRepoFiles(filter) {
  73. const treeLink = $repoFindFileInput.attr('data-url-tree-link');
  74. $repoFindFileTableBody.empty();
  75. const filterResult = filterRepoFilesWeighted(files, filter);
  76. const tmplRow = `<tr><td><a></a></td></tr>`;
  77. toggleElem($repoFindFileNoResult, filterResult.length === 0);
  78. for (const r of filterResult) {
  79. const $row = $(tmplRow);
  80. const $a = $row.find('a');
  81. $a.attr('href', `${treeLink}/${escapePath(r.matchResult.join(''))}`);
  82. const $octiconFile = $(svg('octicon-file')).addClass('gt-mr-3');
  83. $a.append($octiconFile);
  84. // if the target file path is "abc/xyz", to search "bx", then the matchResult is ['a', 'b', 'c/', 'x', 'yz']
  85. // the matchResult[odd] is matched and highlighted to red.
  86. for (let j = 0; j < r.matchResult.length; j++) {
  87. if (!r.matchResult[j]) continue;
  88. const $span = $('<span>').text(r.matchResult[j]);
  89. if (j % 2 === 1) $span.addClass('ui text red');
  90. $a.append($span);
  91. }
  92. $repoFindFileTableBody.append($row);
  93. }
  94. }
  95. async function loadRepoFiles() {
  96. files = await $.ajax({
  97. url: $repoFindFileInput.attr('data-url-data-link'),
  98. headers: {'X-Csrf-Token': csrf}
  99. });
  100. filterRepoFiles($repoFindFileInput.val());
  101. }
  102. export function initFindFileInRepo() {
  103. $repoFindFileInput = $('#repo-file-find-input');
  104. if (!$repoFindFileInput.length) return;
  105. $repoFindFileTableBody = $('#repo-find-file-table tbody');
  106. $repoFindFileNoResult = $('#repo-find-file-no-result');
  107. $repoFindFileInput.on('input', () => filterRepoFiles($repoFindFileInput.val()));
  108. loadRepoFiles();
  109. }