text_highlighter.js 7.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239
  1. /**
  2. * @licstart The following is the entire license notice for the
  3. * JavaScript code in this page
  4. *
  5. * Copyright 2022 Mozilla Foundation
  6. *
  7. * Licensed under the Apache License, Version 2.0 (the "License");
  8. * you may not use this file except in compliance with the License.
  9. * You may obtain a copy of the License at
  10. *
  11. * http://www.apache.org/licenses/LICENSE-2.0
  12. *
  13. * Unless required by applicable law or agreed to in writing, software
  14. * distributed under the License is distributed on an "AS IS" BASIS,
  15. * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  16. * See the License for the specific language governing permissions and
  17. * limitations under the License.
  18. *
  19. * @licend The above is the entire license notice for the
  20. * JavaScript code in this page
  21. */
  22. "use strict";
  23. Object.defineProperty(exports, "__esModule", {
  24. value: true
  25. });
  26. exports.TextHighlighter = void 0;
  27. class TextHighlighter {
  28. constructor({
  29. findController,
  30. eventBus,
  31. pageIndex
  32. }) {
  33. this.findController = findController;
  34. this.matches = [];
  35. this.eventBus = eventBus;
  36. this.pageIdx = pageIndex;
  37. this._onUpdateTextLayerMatches = null;
  38. this.textDivs = null;
  39. this.textContentItemsStr = null;
  40. this.enabled = false;
  41. }
  42. setTextMapping(divs, texts) {
  43. this.textDivs = divs;
  44. this.textContentItemsStr = texts;
  45. }
  46. enable() {
  47. if (!this.textDivs || !this.textContentItemsStr) {
  48. throw new Error("Text divs and strings have not been set.");
  49. }
  50. if (this.enabled) {
  51. throw new Error("TextHighlighter is already enabled.");
  52. }
  53. this.enabled = true;
  54. if (!this._onUpdateTextLayerMatches) {
  55. this._onUpdateTextLayerMatches = evt => {
  56. if (evt.pageIndex === this.pageIdx || evt.pageIndex === -1) {
  57. this._updateMatches();
  58. }
  59. };
  60. this.eventBus._on("updatetextlayermatches", this._onUpdateTextLayerMatches);
  61. }
  62. this._updateMatches();
  63. }
  64. disable() {
  65. if (!this.enabled) {
  66. return;
  67. }
  68. this.enabled = false;
  69. if (this._onUpdateTextLayerMatches) {
  70. this.eventBus._off("updatetextlayermatches", this._onUpdateTextLayerMatches);
  71. this._onUpdateTextLayerMatches = null;
  72. }
  73. this._updateMatches(true);
  74. }
  75. _convertMatches(matches, matchesLength) {
  76. if (!matches) {
  77. return [];
  78. }
  79. const {
  80. textContentItemsStr
  81. } = this;
  82. let i = 0,
  83. iIndex = 0;
  84. const end = textContentItemsStr.length - 1;
  85. const result = [];
  86. for (let m = 0, mm = matches.length; m < mm; m++) {
  87. let matchIdx = matches[m];
  88. while (i !== end && matchIdx >= iIndex + textContentItemsStr[i].length) {
  89. iIndex += textContentItemsStr[i].length;
  90. i++;
  91. }
  92. if (i === textContentItemsStr.length) {
  93. console.error("Could not find a matching mapping");
  94. }
  95. const match = {
  96. begin: {
  97. divIdx: i,
  98. offset: matchIdx - iIndex
  99. }
  100. };
  101. matchIdx += matchesLength[m];
  102. while (i !== end && matchIdx > iIndex + textContentItemsStr[i].length) {
  103. iIndex += textContentItemsStr[i].length;
  104. i++;
  105. }
  106. match.end = {
  107. divIdx: i,
  108. offset: matchIdx - iIndex
  109. };
  110. result.push(match);
  111. }
  112. return result;
  113. }
  114. _renderMatches(matches) {
  115. if (matches.length === 0) {
  116. return;
  117. }
  118. const {
  119. findController,
  120. pageIdx
  121. } = this;
  122. const {
  123. textContentItemsStr,
  124. textDivs
  125. } = this;
  126. const isSelectedPage = pageIdx === findController.selected.pageIdx;
  127. const selectedMatchIdx = findController.selected.matchIdx;
  128. const highlightAll = findController.state.highlightAll;
  129. let prevEnd = null;
  130. const infinity = {
  131. divIdx: -1,
  132. offset: undefined
  133. };
  134. function beginText(begin, className) {
  135. const divIdx = begin.divIdx;
  136. textDivs[divIdx].textContent = "";
  137. return appendTextToDiv(divIdx, 0, begin.offset, className);
  138. }
  139. function appendTextToDiv(divIdx, fromOffset, toOffset, className) {
  140. let div = textDivs[divIdx];
  141. if (div.nodeType === Node.TEXT_NODE) {
  142. const span = document.createElement("span");
  143. div.before(span);
  144. span.append(div);
  145. textDivs[divIdx] = span;
  146. div = span;
  147. }
  148. const content = textContentItemsStr[divIdx].substring(fromOffset, toOffset);
  149. const node = document.createTextNode(content);
  150. if (className) {
  151. const span = document.createElement("span");
  152. span.className = `${className} appended`;
  153. span.append(node);
  154. div.append(span);
  155. return className.includes("selected") ? span.offsetLeft : 0;
  156. }
  157. div.append(node);
  158. return 0;
  159. }
  160. let i0 = selectedMatchIdx,
  161. i1 = i0 + 1;
  162. if (highlightAll) {
  163. i0 = 0;
  164. i1 = matches.length;
  165. } else if (!isSelectedPage) {
  166. return;
  167. }
  168. for (let i = i0; i < i1; i++) {
  169. const match = matches[i];
  170. const begin = match.begin;
  171. const end = match.end;
  172. const isSelected = isSelectedPage && i === selectedMatchIdx;
  173. const highlightSuffix = isSelected ? " selected" : "";
  174. let selectedLeft = 0;
  175. if (!prevEnd || begin.divIdx !== prevEnd.divIdx) {
  176. if (prevEnd !== null) {
  177. appendTextToDiv(prevEnd.divIdx, prevEnd.offset, infinity.offset);
  178. }
  179. beginText(begin);
  180. } else {
  181. appendTextToDiv(prevEnd.divIdx, prevEnd.offset, begin.offset);
  182. }
  183. if (begin.divIdx === end.divIdx) {
  184. selectedLeft = appendTextToDiv(begin.divIdx, begin.offset, end.offset, "highlight" + highlightSuffix);
  185. } else {
  186. selectedLeft = appendTextToDiv(begin.divIdx, begin.offset, infinity.offset, "highlight begin" + highlightSuffix);
  187. for (let n0 = begin.divIdx + 1, n1 = end.divIdx; n0 < n1; n0++) {
  188. textDivs[n0].className = "highlight middle" + highlightSuffix;
  189. }
  190. beginText(end, "highlight end" + highlightSuffix);
  191. }
  192. prevEnd = end;
  193. if (isSelected) {
  194. findController.scrollMatchIntoView({
  195. element: textDivs[begin.divIdx],
  196. selectedLeft,
  197. pageIndex: pageIdx,
  198. matchIndex: selectedMatchIdx
  199. });
  200. }
  201. }
  202. if (prevEnd) {
  203. appendTextToDiv(prevEnd.divIdx, prevEnd.offset, infinity.offset);
  204. }
  205. }
  206. _updateMatches(reset = false) {
  207. if (!this.enabled && !reset) {
  208. return;
  209. }
  210. const {
  211. findController,
  212. matches,
  213. pageIdx
  214. } = this;
  215. const {
  216. textContentItemsStr,
  217. textDivs
  218. } = this;
  219. let clearedUntilDivIdx = -1;
  220. for (const match of matches) {
  221. const begin = Math.max(clearedUntilDivIdx, match.begin.divIdx);
  222. for (let n = begin, end = match.end.divIdx; n <= end; n++) {
  223. const div = textDivs[n];
  224. div.textContent = textContentItemsStr[n];
  225. div.className = "";
  226. }
  227. clearedUntilDivIdx = match.end.divIdx + 1;
  228. }
  229. if (!findController?.highlightMatches || reset) {
  230. return;
  231. }
  232. const pageMatches = findController.pageMatches[pageIdx] || null;
  233. const pageMatchesLength = findController.pageMatchesLength[pageIdx] || null;
  234. this.matches = this._convertMatches(pageMatches, pageMatchesLength);
  235. this._renderMatches(this.matches);
  236. }
  237. }
  238. exports.TextHighlighter = TextHighlighter;