text_layer_builder.js 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304
  1. /* Copyright 2017 Mozilla Foundation
  2. *
  3. * Licensed under the Apache License, Version 2.0 (the "License");
  4. * you may not use this file except in compliance with the License.
  5. * You may obtain a copy of the License at
  6. *
  7. * http://www.apache.org/licenses/LICENSE-2.0
  8. *
  9. * Unless required by applicable law or agreed to in writing, software
  10. * distributed under the License is distributed on an "AS IS" BASIS,
  11. * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  12. * See the License for the specific language governing permissions and
  13. * limitations under the License.
  14. */
  15. 'use strict';
  16. Object.defineProperty(exports, "__esModule", {
  17. value: true
  18. });
  19. exports.DefaultTextLayerFactory = exports.TextLayerBuilder = undefined;
  20. var _dom_events = require('./dom_events');
  21. var _pdf = require('../pdf');
  22. var EXPAND_DIVS_TIMEOUT = 300;
  23. var TextLayerBuilder = function TextLayerBuilderClosure() {
  24. function TextLayerBuilder(options) {
  25. this.textLayerDiv = options.textLayerDiv;
  26. this.eventBus = options.eventBus || (0, _dom_events.getGlobalEventBus)();
  27. this.textContent = null;
  28. this.textContentItemsStr = [];
  29. this.textContentStream = null;
  30. this.renderingDone = false;
  31. this.pageIdx = options.pageIndex;
  32. this.pageNumber = this.pageIdx + 1;
  33. this.matches = [];
  34. this.viewport = options.viewport;
  35. this.textDivs = [];
  36. this.findController = options.findController || null;
  37. this.textLayerRenderTask = null;
  38. this.enhanceTextSelection = options.enhanceTextSelection;
  39. this._bindMouse();
  40. }
  41. TextLayerBuilder.prototype = {
  42. _finishRendering: function TextLayerBuilder_finishRendering() {
  43. this.renderingDone = true;
  44. if (!this.enhanceTextSelection) {
  45. var endOfContent = document.createElement('div');
  46. endOfContent.className = 'endOfContent';
  47. this.textLayerDiv.appendChild(endOfContent);
  48. }
  49. this.eventBus.dispatch('textlayerrendered', {
  50. source: this,
  51. pageNumber: this.pageNumber,
  52. numTextDivs: this.textDivs.length
  53. });
  54. },
  55. render: function TextLayerBuilder_render(timeout) {
  56. var _this = this;
  57. if (!(this.textContent || this.textContentStream) || this.renderingDone) {
  58. return;
  59. }
  60. this.cancel();
  61. this.textDivs = [];
  62. var textLayerFrag = document.createDocumentFragment();
  63. this.textLayerRenderTask = (0, _pdf.renderTextLayer)({
  64. textContent: this.textContent,
  65. textContentStream: this.textContentStream,
  66. container: textLayerFrag,
  67. viewport: this.viewport,
  68. textDivs: this.textDivs,
  69. textContentItemsStr: this.textContentItemsStr,
  70. timeout: timeout,
  71. enhanceTextSelection: this.enhanceTextSelection
  72. });
  73. this.textLayerRenderTask.promise.then(function () {
  74. _this.textLayerDiv.appendChild(textLayerFrag);
  75. _this._finishRendering();
  76. _this.updateMatches();
  77. }, function (reason) {});
  78. },
  79. cancel: function TextLayerBuilder_cancel() {
  80. if (this.textLayerRenderTask) {
  81. this.textLayerRenderTask.cancel();
  82. this.textLayerRenderTask = null;
  83. }
  84. },
  85. setTextContentStream: function setTextContentStream(readableStream) {
  86. this.cancel();
  87. this.textContentStream = readableStream;
  88. },
  89. setTextContent: function TextLayerBuilder_setTextContent(textContent) {
  90. this.cancel();
  91. this.textContent = textContent;
  92. },
  93. convertMatches: function TextLayerBuilder_convertMatches(matches, matchesLength) {
  94. var i = 0;
  95. var iIndex = 0;
  96. var textContentItemsStr = this.textContentItemsStr;
  97. var end = textContentItemsStr.length - 1;
  98. var queryLen = this.findController === null ? 0 : this.findController.state.query.length;
  99. var ret = [];
  100. if (!matches) {
  101. return ret;
  102. }
  103. for (var m = 0, len = matches.length; m < len; m++) {
  104. var matchIdx = matches[m];
  105. while (i !== end && matchIdx >= iIndex + textContentItemsStr[i].length) {
  106. iIndex += textContentItemsStr[i].length;
  107. i++;
  108. }
  109. if (i === textContentItemsStr.length) {
  110. console.error('Could not find a matching mapping');
  111. }
  112. var match = {
  113. begin: {
  114. divIdx: i,
  115. offset: matchIdx - iIndex
  116. }
  117. };
  118. if (matchesLength) {
  119. matchIdx += matchesLength[m];
  120. } else {
  121. matchIdx += queryLen;
  122. }
  123. while (i !== end && matchIdx > iIndex + textContentItemsStr[i].length) {
  124. iIndex += textContentItemsStr[i].length;
  125. i++;
  126. }
  127. match.end = {
  128. divIdx: i,
  129. offset: matchIdx - iIndex
  130. };
  131. ret.push(match);
  132. }
  133. return ret;
  134. },
  135. renderMatches: function TextLayerBuilder_renderMatches(matches) {
  136. if (matches.length === 0) {
  137. return;
  138. }
  139. var textContentItemsStr = this.textContentItemsStr;
  140. var textDivs = this.textDivs;
  141. var prevEnd = null;
  142. var pageIdx = this.pageIdx;
  143. var isSelectedPage = this.findController === null ? false : pageIdx === this.findController.selected.pageIdx;
  144. var selectedMatchIdx = this.findController === null ? -1 : this.findController.selected.matchIdx;
  145. var highlightAll = this.findController === null ? false : this.findController.state.highlightAll;
  146. var infinity = {
  147. divIdx: -1,
  148. offset: undefined
  149. };
  150. function beginText(begin, className) {
  151. var divIdx = begin.divIdx;
  152. textDivs[divIdx].textContent = '';
  153. appendTextToDiv(divIdx, 0, begin.offset, className);
  154. }
  155. function appendTextToDiv(divIdx, fromOffset, toOffset, className) {
  156. var div = textDivs[divIdx];
  157. var content = textContentItemsStr[divIdx].substring(fromOffset, toOffset);
  158. var node = document.createTextNode(content);
  159. if (className) {
  160. var span = document.createElement('span');
  161. span.className = className;
  162. span.appendChild(node);
  163. div.appendChild(span);
  164. return;
  165. }
  166. div.appendChild(node);
  167. }
  168. var i0 = selectedMatchIdx,
  169. i1 = i0 + 1;
  170. if (highlightAll) {
  171. i0 = 0;
  172. i1 = matches.length;
  173. } else if (!isSelectedPage) {
  174. return;
  175. }
  176. for (var i = i0; i < i1; i++) {
  177. var match = matches[i];
  178. var begin = match.begin;
  179. var end = match.end;
  180. var isSelected = isSelectedPage && i === selectedMatchIdx;
  181. var highlightSuffix = isSelected ? ' selected' : '';
  182. if (this.findController) {
  183. this.findController.updateMatchPosition(pageIdx, i, textDivs, begin.divIdx);
  184. }
  185. if (!prevEnd || begin.divIdx !== prevEnd.divIdx) {
  186. if (prevEnd !== null) {
  187. appendTextToDiv(prevEnd.divIdx, prevEnd.offset, infinity.offset);
  188. }
  189. beginText(begin);
  190. } else {
  191. appendTextToDiv(prevEnd.divIdx, prevEnd.offset, begin.offset);
  192. }
  193. if (begin.divIdx === end.divIdx) {
  194. appendTextToDiv(begin.divIdx, begin.offset, end.offset, 'highlight' + highlightSuffix);
  195. } else {
  196. appendTextToDiv(begin.divIdx, begin.offset, infinity.offset, 'highlight begin' + highlightSuffix);
  197. for (var n0 = begin.divIdx + 1, n1 = end.divIdx; n0 < n1; n0++) {
  198. textDivs[n0].className = 'highlight middle' + highlightSuffix;
  199. }
  200. beginText(end, 'highlight end' + highlightSuffix);
  201. }
  202. prevEnd = end;
  203. }
  204. if (prevEnd) {
  205. appendTextToDiv(prevEnd.divIdx, prevEnd.offset, infinity.offset);
  206. }
  207. },
  208. updateMatches: function TextLayerBuilder_updateMatches() {
  209. if (!this.renderingDone) {
  210. return;
  211. }
  212. var matches = this.matches;
  213. var textDivs = this.textDivs;
  214. var textContentItemsStr = this.textContentItemsStr;
  215. var clearedUntilDivIdx = -1;
  216. for (var i = 0, len = matches.length; i < len; i++) {
  217. var match = matches[i];
  218. var begin = Math.max(clearedUntilDivIdx, match.begin.divIdx);
  219. for (var n = begin, end = match.end.divIdx; n <= end; n++) {
  220. var div = textDivs[n];
  221. div.textContent = textContentItemsStr[n];
  222. div.className = '';
  223. }
  224. clearedUntilDivIdx = match.end.divIdx + 1;
  225. }
  226. if (this.findController === null || !this.findController.active) {
  227. return;
  228. }
  229. var pageMatches, pageMatchesLength;
  230. if (this.findController !== null) {
  231. pageMatches = this.findController.pageMatches[this.pageIdx] || null;
  232. pageMatchesLength = this.findController.pageMatchesLength ? this.findController.pageMatchesLength[this.pageIdx] || null : null;
  233. }
  234. this.matches = this.convertMatches(pageMatches, pageMatchesLength);
  235. this.renderMatches(this.matches);
  236. },
  237. _bindMouse: function TextLayerBuilder_bindMouse() {
  238. var div = this.textLayerDiv;
  239. var self = this;
  240. var expandDivsTimer = null;
  241. div.addEventListener('mousedown', function (e) {
  242. if (self.enhanceTextSelection && self.textLayerRenderTask) {
  243. self.textLayerRenderTask.expandTextDivs(true);
  244. if (expandDivsTimer) {
  245. clearTimeout(expandDivsTimer);
  246. expandDivsTimer = null;
  247. }
  248. return;
  249. }
  250. var end = div.querySelector('.endOfContent');
  251. if (!end) {
  252. return;
  253. }
  254. var adjustTop = e.target !== div;
  255. adjustTop = adjustTop && window.getComputedStyle(end).getPropertyValue('-moz-user-select') !== 'none';
  256. if (adjustTop) {
  257. var divBounds = div.getBoundingClientRect();
  258. var r = Math.max(0, (e.pageY - divBounds.top) / divBounds.height);
  259. end.style.top = (r * 100).toFixed(2) + '%';
  260. }
  261. end.classList.add('active');
  262. });
  263. div.addEventListener('mouseup', function (e) {
  264. if (self.enhanceTextSelection && self.textLayerRenderTask) {
  265. expandDivsTimer = setTimeout(function () {
  266. if (self.textLayerRenderTask) {
  267. self.textLayerRenderTask.expandTextDivs(false);
  268. }
  269. expandDivsTimer = null;
  270. }, EXPAND_DIVS_TIMEOUT);
  271. return;
  272. }
  273. var end = div.querySelector('.endOfContent');
  274. if (!end) {
  275. return;
  276. }
  277. end.style.top = '';
  278. end.classList.remove('active');
  279. });
  280. }
  281. };
  282. return TextLayerBuilder;
  283. }();
  284. function DefaultTextLayerFactory() {}
  285. DefaultTextLayerFactory.prototype = {
  286. createTextLayerBuilder: function createTextLayerBuilder(textLayerDiv, pageIndex, viewport) {
  287. var enhanceTextSelection = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
  288. return new TextLayerBuilder({
  289. textLayerDiv: textLayerDiv,
  290. pageIndex: pageIndex,
  291. viewport: viewport,
  292. enhanceTextSelection: enhanceTextSelection
  293. });
  294. }
  295. };
  296. exports.TextLayerBuilder = TextLayerBuilder;
  297. exports.DefaultTextLayerFactory = DefaultTextLayerFactory;