text_layer_builder.js 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456
  1. /**
  2. * @licstart The following is the entire license notice for the
  3. * Javascript code in this page
  4. *
  5. * Copyright 2018 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.DefaultTextLayerFactory = exports.TextLayerBuilder = void 0;
  27. var _ui_utils = require("./ui_utils");
  28. var _pdf = require("../pdf");
  29. function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
  30. function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
  31. function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
  32. var EXPAND_DIVS_TIMEOUT = 300;
  33. var TextLayerBuilder =
  34. /*#__PURE__*/
  35. function () {
  36. function TextLayerBuilder(_ref) {
  37. var textLayerDiv = _ref.textLayerDiv,
  38. eventBus = _ref.eventBus,
  39. pageIndex = _ref.pageIndex,
  40. viewport = _ref.viewport,
  41. _ref$findController = _ref.findController,
  42. findController = _ref$findController === void 0 ? null : _ref$findController,
  43. _ref$enhanceTextSelec = _ref.enhanceTextSelection,
  44. enhanceTextSelection = _ref$enhanceTextSelec === void 0 ? false : _ref$enhanceTextSelec;
  45. _classCallCheck(this, TextLayerBuilder);
  46. this.textLayerDiv = textLayerDiv;
  47. this.eventBus = eventBus || (0, _ui_utils.getGlobalEventBus)();
  48. this.textContent = null;
  49. this.textContentItemsStr = [];
  50. this.textContentStream = null;
  51. this.renderingDone = false;
  52. this.pageIdx = pageIndex;
  53. this.pageNumber = this.pageIdx + 1;
  54. this.matches = [];
  55. this.viewport = viewport;
  56. this.textDivs = [];
  57. this.findController = findController;
  58. this.textLayerRenderTask = null;
  59. this.enhanceTextSelection = enhanceTextSelection;
  60. this._boundEvents = Object.create(null);
  61. this._bindEvents();
  62. this._bindMouse();
  63. }
  64. _createClass(TextLayerBuilder, [{
  65. key: "_finishRendering",
  66. value: function _finishRendering() {
  67. this.renderingDone = true;
  68. if (!this.enhanceTextSelection) {
  69. var endOfContent = document.createElement('div');
  70. endOfContent.className = 'endOfContent';
  71. this.textLayerDiv.appendChild(endOfContent);
  72. }
  73. this.eventBus.dispatch('textlayerrendered', {
  74. source: this,
  75. pageNumber: this.pageNumber,
  76. numTextDivs: this.textDivs.length
  77. });
  78. }
  79. }, {
  80. key: "render",
  81. value: function render() {
  82. var _this = this;
  83. var timeout = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
  84. if (!(this.textContent || this.textContentStream) || this.renderingDone) {
  85. return;
  86. }
  87. this.cancel();
  88. this.textDivs = [];
  89. var textLayerFrag = document.createDocumentFragment();
  90. this.textLayerRenderTask = (0, _pdf.renderTextLayer)({
  91. textContent: this.textContent,
  92. textContentStream: this.textContentStream,
  93. container: textLayerFrag,
  94. viewport: this.viewport,
  95. textDivs: this.textDivs,
  96. textContentItemsStr: this.textContentItemsStr,
  97. timeout: timeout,
  98. enhanceTextSelection: this.enhanceTextSelection
  99. });
  100. this.textLayerRenderTask.promise.then(function () {
  101. _this.textLayerDiv.appendChild(textLayerFrag);
  102. _this._finishRendering();
  103. _this._updateMatches();
  104. }, function (reason) {});
  105. }
  106. }, {
  107. key: "cancel",
  108. value: function cancel() {
  109. if (this.textLayerRenderTask) {
  110. this.textLayerRenderTask.cancel();
  111. this.textLayerRenderTask = null;
  112. }
  113. }
  114. }, {
  115. key: "setTextContentStream",
  116. value: function setTextContentStream(readableStream) {
  117. this.cancel();
  118. this.textContentStream = readableStream;
  119. }
  120. }, {
  121. key: "setTextContent",
  122. value: function setTextContent(textContent) {
  123. this.cancel();
  124. this.textContent = textContent;
  125. }
  126. }, {
  127. key: "_convertMatches",
  128. value: function _convertMatches(matches, matchesLength) {
  129. if (!matches) {
  130. return [];
  131. }
  132. var findController = this.findController,
  133. textContentItemsStr = this.textContentItemsStr;
  134. var i = 0,
  135. iIndex = 0;
  136. var end = textContentItemsStr.length - 1;
  137. var queryLen = findController.state.query.length;
  138. var result = [];
  139. for (var m = 0, mm = matches.length; m < mm; m++) {
  140. var matchIdx = matches[m];
  141. while (i !== end && matchIdx >= iIndex + textContentItemsStr[i].length) {
  142. iIndex += textContentItemsStr[i].length;
  143. i++;
  144. }
  145. if (i === textContentItemsStr.length) {
  146. console.error('Could not find a matching mapping');
  147. }
  148. var match = {
  149. begin: {
  150. divIdx: i,
  151. offset: matchIdx - iIndex
  152. }
  153. };
  154. if (matchesLength) {
  155. matchIdx += matchesLength[m];
  156. } else {
  157. matchIdx += queryLen;
  158. }
  159. while (i !== end && matchIdx > iIndex + textContentItemsStr[i].length) {
  160. iIndex += textContentItemsStr[i].length;
  161. i++;
  162. }
  163. match.end = {
  164. divIdx: i,
  165. offset: matchIdx - iIndex
  166. };
  167. result.push(match);
  168. }
  169. return result;
  170. }
  171. }, {
  172. key: "_renderMatches",
  173. value: function _renderMatches(matches) {
  174. if (matches.length === 0) {
  175. return;
  176. }
  177. var findController = this.findController,
  178. pageIdx = this.pageIdx,
  179. textContentItemsStr = this.textContentItemsStr,
  180. textDivs = this.textDivs;
  181. var isSelectedPage = pageIdx === findController.selected.pageIdx;
  182. var selectedMatchIdx = findController.selected.matchIdx;
  183. var highlightAll = findController.state.highlightAll;
  184. var prevEnd = null;
  185. var infinity = {
  186. divIdx: -1,
  187. offset: undefined
  188. };
  189. function beginText(begin, className) {
  190. var divIdx = begin.divIdx;
  191. textDivs[divIdx].textContent = '';
  192. appendTextToDiv(divIdx, 0, begin.offset, className);
  193. }
  194. function appendTextToDiv(divIdx, fromOffset, toOffset, className) {
  195. var div = textDivs[divIdx];
  196. var content = textContentItemsStr[divIdx].substring(fromOffset, toOffset);
  197. var node = document.createTextNode(content);
  198. if (className) {
  199. var span = document.createElement('span');
  200. span.className = className;
  201. span.appendChild(node);
  202. div.appendChild(span);
  203. return;
  204. }
  205. div.appendChild(node);
  206. }
  207. var i0 = selectedMatchIdx,
  208. i1 = i0 + 1;
  209. if (highlightAll) {
  210. i0 = 0;
  211. i1 = matches.length;
  212. } else if (!isSelectedPage) {
  213. return;
  214. }
  215. for (var i = i0; i < i1; i++) {
  216. var match = matches[i];
  217. var begin = match.begin;
  218. var end = match.end;
  219. var isSelected = isSelectedPage && i === selectedMatchIdx;
  220. var highlightSuffix = isSelected ? ' selected' : '';
  221. if (isSelected) {
  222. findController.scrollMatchIntoView({
  223. element: textDivs[begin.divIdx],
  224. pageIndex: pageIdx,
  225. matchIndex: selectedMatchIdx
  226. });
  227. }
  228. if (!prevEnd || begin.divIdx !== prevEnd.divIdx) {
  229. if (prevEnd !== null) {
  230. appendTextToDiv(prevEnd.divIdx, prevEnd.offset, infinity.offset);
  231. }
  232. beginText(begin);
  233. } else {
  234. appendTextToDiv(prevEnd.divIdx, prevEnd.offset, begin.offset);
  235. }
  236. if (begin.divIdx === end.divIdx) {
  237. appendTextToDiv(begin.divIdx, begin.offset, end.offset, 'highlight' + highlightSuffix);
  238. } else {
  239. appendTextToDiv(begin.divIdx, begin.offset, infinity.offset, 'highlight begin' + highlightSuffix);
  240. for (var n0 = begin.divIdx + 1, n1 = end.divIdx; n0 < n1; n0++) {
  241. textDivs[n0].className = 'highlight middle' + highlightSuffix;
  242. }
  243. beginText(end, 'highlight end' + highlightSuffix);
  244. }
  245. prevEnd = end;
  246. }
  247. if (prevEnd) {
  248. appendTextToDiv(prevEnd.divIdx, prevEnd.offset, infinity.offset);
  249. }
  250. }
  251. }, {
  252. key: "_updateMatches",
  253. value: function _updateMatches() {
  254. if (!this.renderingDone) {
  255. return;
  256. }
  257. var findController = this.findController,
  258. matches = this.matches,
  259. pageIdx = this.pageIdx,
  260. textContentItemsStr = this.textContentItemsStr,
  261. textDivs = this.textDivs;
  262. var clearedUntilDivIdx = -1;
  263. for (var i = 0, ii = matches.length; i < ii; i++) {
  264. var match = matches[i];
  265. var begin = Math.max(clearedUntilDivIdx, match.begin.divIdx);
  266. for (var n = begin, end = match.end.divIdx; n <= end; n++) {
  267. var div = textDivs[n];
  268. div.textContent = textContentItemsStr[n];
  269. div.className = '';
  270. }
  271. clearedUntilDivIdx = match.end.divIdx + 1;
  272. }
  273. if (!findController || !findController.highlightMatches) {
  274. return;
  275. }
  276. var pageMatches = findController.pageMatches[pageIdx] || null;
  277. var pageMatchesLength = findController.pageMatchesLength[pageIdx] || null;
  278. this.matches = this._convertMatches(pageMatches, pageMatchesLength);
  279. this._renderMatches(this.matches);
  280. }
  281. }, {
  282. key: "_bindEvents",
  283. value: function _bindEvents() {
  284. var _this2 = this;
  285. var eventBus = this.eventBus,
  286. _boundEvents = this._boundEvents;
  287. _boundEvents.pageCancelled = function (evt) {
  288. if (evt.pageNumber !== _this2.pageNumber) {
  289. return;
  290. }
  291. if (_this2.textLayerRenderTask) {
  292. console.error('TextLayerBuilder._bindEvents: `this.cancel()` should ' + 'have been called when the page was reset, or rendering cancelled.');
  293. return;
  294. }
  295. for (var name in _boundEvents) {
  296. eventBus.off(name.toLowerCase(), _boundEvents[name]);
  297. delete _boundEvents[name];
  298. }
  299. };
  300. _boundEvents.updateTextLayerMatches = function (evt) {
  301. if (evt.pageIndex !== _this2.pageIdx && evt.pageIndex !== -1) {
  302. return;
  303. }
  304. _this2._updateMatches();
  305. };
  306. eventBus.on('pagecancelled', _boundEvents.pageCancelled);
  307. eventBus.on('updatetextlayermatches', _boundEvents.updateTextLayerMatches);
  308. }
  309. }, {
  310. key: "_bindMouse",
  311. value: function _bindMouse() {
  312. var _this3 = this;
  313. var div = this.textLayerDiv;
  314. var expandDivsTimer = null;
  315. div.addEventListener('mousedown', function (evt) {
  316. if (_this3.enhanceTextSelection && _this3.textLayerRenderTask) {
  317. _this3.textLayerRenderTask.expandTextDivs(true);
  318. if (expandDivsTimer) {
  319. clearTimeout(expandDivsTimer);
  320. expandDivsTimer = null;
  321. }
  322. return;
  323. }
  324. var end = div.querySelector('.endOfContent');
  325. if (!end) {
  326. return;
  327. }
  328. var adjustTop = evt.target !== div;
  329. adjustTop = adjustTop && window.getComputedStyle(end).getPropertyValue('-moz-user-select') !== 'none';
  330. if (adjustTop) {
  331. var divBounds = div.getBoundingClientRect();
  332. var r = Math.max(0, (evt.pageY - divBounds.top) / divBounds.height);
  333. end.style.top = (r * 100).toFixed(2) + '%';
  334. }
  335. end.classList.add('active');
  336. });
  337. div.addEventListener('mouseup', function () {
  338. if (_this3.enhanceTextSelection && _this3.textLayerRenderTask) {
  339. expandDivsTimer = setTimeout(function () {
  340. if (_this3.textLayerRenderTask) {
  341. _this3.textLayerRenderTask.expandTextDivs(false);
  342. }
  343. expandDivsTimer = null;
  344. }, EXPAND_DIVS_TIMEOUT);
  345. return;
  346. }
  347. var end = div.querySelector('.endOfContent');
  348. if (!end) {
  349. return;
  350. }
  351. end.style.top = '';
  352. end.classList.remove('active');
  353. });
  354. }
  355. }]);
  356. return TextLayerBuilder;
  357. }();
  358. exports.TextLayerBuilder = TextLayerBuilder;
  359. var DefaultTextLayerFactory =
  360. /*#__PURE__*/
  361. function () {
  362. function DefaultTextLayerFactory() {
  363. _classCallCheck(this, DefaultTextLayerFactory);
  364. }
  365. _createClass(DefaultTextLayerFactory, [{
  366. key: "createTextLayerBuilder",
  367. value: function createTextLayerBuilder(textLayerDiv, pageIndex, viewport) {
  368. var enhanceTextSelection = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
  369. return new TextLayerBuilder({
  370. textLayerDiv: textLayerDiv,
  371. pageIndex: pageIndex,
  372. viewport: viewport,
  373. enhanceTextSelection: enhanceTextSelection
  374. });
  375. }
  376. }]);
  377. return DefaultTextLayerFactory;
  378. }();
  379. exports.DefaultTextLayerFactory = DefaultTextLayerFactory;