text_layer_builder.js 13 KB

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