ui_utils.js 16 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644
  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.animationStarted = exports.VERTICAL_PADDING = exports.UNKNOWN_SCALE = exports.TextLayerMode = exports.SpreadMode = exports.SidebarView = exports.ScrollMode = exports.SCROLLBAR_PADDING = exports.RenderingStates = exports.RendererType = exports.ProgressBar = exports.PresentationModeState = exports.OutputScale = exports.MIN_SCALE = exports.MAX_SCALE = exports.MAX_AUTO_SCALE = exports.DEFAULT_SCALE_VALUE = exports.DEFAULT_SCALE_DELTA = exports.DEFAULT_SCALE = exports.AutoPrintRegExp = void 0;
  27. exports.apiPageLayoutToViewerModes = apiPageLayoutToViewerModes;
  28. exports.apiPageModeToSidebarView = apiPageModeToSidebarView;
  29. exports.approximateFraction = approximateFraction;
  30. exports.backtrackBeforeAllVisibleElements = backtrackBeforeAllVisibleElements;
  31. exports.binarySearchFirstItem = binarySearchFirstItem;
  32. exports.docStyle = void 0;
  33. exports.getActiveOrFocusedElement = getActiveOrFocusedElement;
  34. exports.getPageSizeInches = getPageSizeInches;
  35. exports.getVisibleElements = getVisibleElements;
  36. exports.isPortraitOrientation = isPortraitOrientation;
  37. exports.isValidRotation = isValidRotation;
  38. exports.isValidScrollMode = isValidScrollMode;
  39. exports.isValidSpreadMode = isValidSpreadMode;
  40. exports.noContextMenuHandler = noContextMenuHandler;
  41. exports.normalizeWheelEventDelta = normalizeWheelEventDelta;
  42. exports.normalizeWheelEventDirection = normalizeWheelEventDirection;
  43. exports.parseQueryString = parseQueryString;
  44. exports.removeNullCharacters = removeNullCharacters;
  45. exports.roundToDivide = roundToDivide;
  46. exports.scrollIntoView = scrollIntoView;
  47. exports.watchScroll = watchScroll;
  48. const DEFAULT_SCALE_VALUE = "auto";
  49. exports.DEFAULT_SCALE_VALUE = DEFAULT_SCALE_VALUE;
  50. const DEFAULT_SCALE = 1.0;
  51. exports.DEFAULT_SCALE = DEFAULT_SCALE;
  52. const DEFAULT_SCALE_DELTA = 1.1;
  53. exports.DEFAULT_SCALE_DELTA = DEFAULT_SCALE_DELTA;
  54. const MIN_SCALE = 0.1;
  55. exports.MIN_SCALE = MIN_SCALE;
  56. const MAX_SCALE = 10.0;
  57. exports.MAX_SCALE = MAX_SCALE;
  58. const UNKNOWN_SCALE = 0;
  59. exports.UNKNOWN_SCALE = UNKNOWN_SCALE;
  60. const MAX_AUTO_SCALE = 1.25;
  61. exports.MAX_AUTO_SCALE = MAX_AUTO_SCALE;
  62. const SCROLLBAR_PADDING = 40;
  63. exports.SCROLLBAR_PADDING = SCROLLBAR_PADDING;
  64. const VERTICAL_PADDING = 5;
  65. exports.VERTICAL_PADDING = VERTICAL_PADDING;
  66. const RenderingStates = {
  67. INITIAL: 0,
  68. RUNNING: 1,
  69. PAUSED: 2,
  70. FINISHED: 3
  71. };
  72. exports.RenderingStates = RenderingStates;
  73. const PresentationModeState = {
  74. UNKNOWN: 0,
  75. NORMAL: 1,
  76. CHANGING: 2,
  77. FULLSCREEN: 3
  78. };
  79. exports.PresentationModeState = PresentationModeState;
  80. const SidebarView = {
  81. UNKNOWN: -1,
  82. NONE: 0,
  83. THUMBS: 1,
  84. OUTLINE: 2,
  85. ATTACHMENTS: 3,
  86. LAYERS: 4
  87. };
  88. exports.SidebarView = SidebarView;
  89. const RendererType = {
  90. CANVAS: "canvas",
  91. SVG: "svg"
  92. };
  93. exports.RendererType = RendererType;
  94. const TextLayerMode = {
  95. DISABLE: 0,
  96. ENABLE: 1,
  97. ENABLE_ENHANCE: 2
  98. };
  99. exports.TextLayerMode = TextLayerMode;
  100. const ScrollMode = {
  101. UNKNOWN: -1,
  102. VERTICAL: 0,
  103. HORIZONTAL: 1,
  104. WRAPPED: 2,
  105. PAGE: 3
  106. };
  107. exports.ScrollMode = ScrollMode;
  108. const SpreadMode = {
  109. UNKNOWN: -1,
  110. NONE: 0,
  111. ODD: 1,
  112. EVEN: 2
  113. };
  114. exports.SpreadMode = SpreadMode;
  115. const AutoPrintRegExp = /\bprint\s*\(/;
  116. exports.AutoPrintRegExp = AutoPrintRegExp;
  117. class OutputScale {
  118. constructor() {
  119. const pixelRatio = window.devicePixelRatio || 1;
  120. this.sx = pixelRatio;
  121. this.sy = pixelRatio;
  122. }
  123. get scaled() {
  124. return this.sx !== 1 || this.sy !== 1;
  125. }
  126. }
  127. exports.OutputScale = OutputScale;
  128. function scrollIntoView(element, spot, scrollMatches = false) {
  129. let parent = element.offsetParent;
  130. if (!parent) {
  131. console.error("offsetParent is not set -- cannot scroll");
  132. return;
  133. }
  134. let offsetY = element.offsetTop + element.clientTop;
  135. let offsetX = element.offsetLeft + element.clientLeft;
  136. while (parent.clientHeight === parent.scrollHeight && parent.clientWidth === parent.scrollWidth || scrollMatches && (parent.classList.contains("markedContent") || getComputedStyle(parent).overflow === "hidden")) {
  137. offsetY += parent.offsetTop;
  138. offsetX += parent.offsetLeft;
  139. parent = parent.offsetParent;
  140. if (!parent) {
  141. return;
  142. }
  143. }
  144. if (spot) {
  145. if (spot.top !== undefined) {
  146. offsetY += spot.top;
  147. }
  148. if (spot.left !== undefined) {
  149. offsetX += spot.left;
  150. parent.scrollLeft = offsetX;
  151. }
  152. }
  153. parent.scrollTop = offsetY;
  154. }
  155. function watchScroll(viewAreaElement, callback) {
  156. const debounceScroll = function (evt) {
  157. if (rAF) {
  158. return;
  159. }
  160. rAF = window.requestAnimationFrame(function viewAreaElementScrolled() {
  161. rAF = null;
  162. const currentX = viewAreaElement.scrollLeft;
  163. const lastX = state.lastX;
  164. if (currentX !== lastX) {
  165. state.right = currentX > lastX;
  166. }
  167. state.lastX = currentX;
  168. const currentY = viewAreaElement.scrollTop;
  169. const lastY = state.lastY;
  170. if (currentY !== lastY) {
  171. state.down = currentY > lastY;
  172. }
  173. state.lastY = currentY;
  174. callback(state);
  175. });
  176. };
  177. const state = {
  178. right: true,
  179. down: true,
  180. lastX: viewAreaElement.scrollLeft,
  181. lastY: viewAreaElement.scrollTop,
  182. _eventHandler: debounceScroll
  183. };
  184. let rAF = null;
  185. viewAreaElement.addEventListener("scroll", debounceScroll, true);
  186. return state;
  187. }
  188. function parseQueryString(query) {
  189. const params = new Map();
  190. for (const [key, value] of new URLSearchParams(query)) {
  191. params.set(key.toLowerCase(), value);
  192. }
  193. return params;
  194. }
  195. const NullCharactersRegExp = /\x00/g;
  196. const InvisibleCharactersRegExp = /[\x01-\x1F]/g;
  197. function removeNullCharacters(str, replaceInvisible = false) {
  198. if (typeof str !== "string") {
  199. console.error(`The argument must be a string.`);
  200. return str;
  201. }
  202. if (replaceInvisible) {
  203. str = str.replace(InvisibleCharactersRegExp, " ");
  204. }
  205. return str.replace(NullCharactersRegExp, "");
  206. }
  207. function binarySearchFirstItem(items, condition, start = 0) {
  208. let minIndex = start;
  209. let maxIndex = items.length - 1;
  210. if (maxIndex < 0 || !condition(items[maxIndex])) {
  211. return items.length;
  212. }
  213. if (condition(items[minIndex])) {
  214. return minIndex;
  215. }
  216. while (minIndex < maxIndex) {
  217. const currentIndex = minIndex + maxIndex >> 1;
  218. const currentItem = items[currentIndex];
  219. if (condition(currentItem)) {
  220. maxIndex = currentIndex;
  221. } else {
  222. minIndex = currentIndex + 1;
  223. }
  224. }
  225. return minIndex;
  226. }
  227. function approximateFraction(x) {
  228. if (Math.floor(x) === x) {
  229. return [x, 1];
  230. }
  231. const xinv = 1 / x;
  232. const limit = 8;
  233. if (xinv > limit) {
  234. return [1, limit];
  235. } else if (Math.floor(xinv) === xinv) {
  236. return [1, xinv];
  237. }
  238. const x_ = x > 1 ? xinv : x;
  239. let a = 0,
  240. b = 1,
  241. c = 1,
  242. d = 1;
  243. while (true) {
  244. const p = a + c,
  245. q = b + d;
  246. if (q > limit) {
  247. break;
  248. }
  249. if (x_ <= p / q) {
  250. c = p;
  251. d = q;
  252. } else {
  253. a = p;
  254. b = q;
  255. }
  256. }
  257. let result;
  258. if (x_ - a / b < c / d - x_) {
  259. result = x_ === x ? [a, b] : [b, a];
  260. } else {
  261. result = x_ === x ? [c, d] : [d, c];
  262. }
  263. return result;
  264. }
  265. function roundToDivide(x, div) {
  266. const r = x % div;
  267. return r === 0 ? x : Math.round(x - r + div);
  268. }
  269. function getPageSizeInches({
  270. view,
  271. userUnit,
  272. rotate
  273. }) {
  274. const [x1, y1, x2, y2] = view;
  275. const changeOrientation = rotate % 180 !== 0;
  276. const width = (x2 - x1) / 72 * userUnit;
  277. const height = (y2 - y1) / 72 * userUnit;
  278. return {
  279. width: changeOrientation ? height : width,
  280. height: changeOrientation ? width : height
  281. };
  282. }
  283. function backtrackBeforeAllVisibleElements(index, views, top) {
  284. if (index < 2) {
  285. return index;
  286. }
  287. let elt = views[index].div;
  288. let pageTop = elt.offsetTop + elt.clientTop;
  289. if (pageTop >= top) {
  290. elt = views[index - 1].div;
  291. pageTop = elt.offsetTop + elt.clientTop;
  292. }
  293. for (let i = index - 2; i >= 0; --i) {
  294. elt = views[i].div;
  295. if (elt.offsetTop + elt.clientTop + elt.clientHeight <= pageTop) {
  296. break;
  297. }
  298. index = i;
  299. }
  300. return index;
  301. }
  302. function getVisibleElements({
  303. scrollEl,
  304. views,
  305. sortByVisibility = false,
  306. horizontal = false,
  307. rtl = false
  308. }) {
  309. const top = scrollEl.scrollTop,
  310. bottom = top + scrollEl.clientHeight;
  311. const left = scrollEl.scrollLeft,
  312. right = left + scrollEl.clientWidth;
  313. function isElementBottomAfterViewTop(view) {
  314. const element = view.div;
  315. const elementBottom = element.offsetTop + element.clientTop + element.clientHeight;
  316. return elementBottom > top;
  317. }
  318. function isElementNextAfterViewHorizontally(view) {
  319. const element = view.div;
  320. const elementLeft = element.offsetLeft + element.clientLeft;
  321. const elementRight = elementLeft + element.clientWidth;
  322. return rtl ? elementLeft < right : elementRight > left;
  323. }
  324. const visible = [],
  325. ids = new Set(),
  326. numViews = views.length;
  327. let firstVisibleElementInd = binarySearchFirstItem(views, horizontal ? isElementNextAfterViewHorizontally : isElementBottomAfterViewTop);
  328. if (firstVisibleElementInd > 0 && firstVisibleElementInd < numViews && !horizontal) {
  329. firstVisibleElementInd = backtrackBeforeAllVisibleElements(firstVisibleElementInd, views, top);
  330. }
  331. let lastEdge = horizontal ? right : -1;
  332. for (let i = firstVisibleElementInd; i < numViews; i++) {
  333. const view = views[i],
  334. element = view.div;
  335. const currentWidth = element.offsetLeft + element.clientLeft;
  336. const currentHeight = element.offsetTop + element.clientTop;
  337. const viewWidth = element.clientWidth,
  338. viewHeight = element.clientHeight;
  339. const viewRight = currentWidth + viewWidth;
  340. const viewBottom = currentHeight + viewHeight;
  341. if (lastEdge === -1) {
  342. if (viewBottom >= bottom) {
  343. lastEdge = viewBottom;
  344. }
  345. } else if ((horizontal ? currentWidth : currentHeight) > lastEdge) {
  346. break;
  347. }
  348. if (viewBottom <= top || currentHeight >= bottom || viewRight <= left || currentWidth >= right) {
  349. continue;
  350. }
  351. const hiddenHeight = Math.max(0, top - currentHeight) + Math.max(0, viewBottom - bottom);
  352. const hiddenWidth = Math.max(0, left - currentWidth) + Math.max(0, viewRight - right);
  353. const fractionHeight = (viewHeight - hiddenHeight) / viewHeight,
  354. fractionWidth = (viewWidth - hiddenWidth) / viewWidth;
  355. const percent = fractionHeight * fractionWidth * 100 | 0;
  356. visible.push({
  357. id: view.id,
  358. x: currentWidth,
  359. y: currentHeight,
  360. view,
  361. percent,
  362. widthPercent: fractionWidth * 100 | 0
  363. });
  364. ids.add(view.id);
  365. }
  366. const first = visible[0],
  367. last = visible.at(-1);
  368. if (sortByVisibility) {
  369. visible.sort(function (a, b) {
  370. const pc = a.percent - b.percent;
  371. if (Math.abs(pc) > 0.001) {
  372. return -pc;
  373. }
  374. return a.id - b.id;
  375. });
  376. }
  377. return {
  378. first,
  379. last,
  380. views: visible,
  381. ids
  382. };
  383. }
  384. function noContextMenuHandler(evt) {
  385. evt.preventDefault();
  386. }
  387. function normalizeWheelEventDirection(evt) {
  388. let delta = Math.hypot(evt.deltaX, evt.deltaY);
  389. const angle = Math.atan2(evt.deltaY, evt.deltaX);
  390. if (-0.25 * Math.PI < angle && angle < 0.75 * Math.PI) {
  391. delta = -delta;
  392. }
  393. return delta;
  394. }
  395. function normalizeWheelEventDelta(evt) {
  396. let delta = normalizeWheelEventDirection(evt);
  397. const MOUSE_DOM_DELTA_PIXEL_MODE = 0;
  398. const MOUSE_DOM_DELTA_LINE_MODE = 1;
  399. const MOUSE_PIXELS_PER_LINE = 30;
  400. const MOUSE_LINES_PER_PAGE = 30;
  401. if (evt.deltaMode === MOUSE_DOM_DELTA_PIXEL_MODE) {
  402. delta /= MOUSE_PIXELS_PER_LINE * MOUSE_LINES_PER_PAGE;
  403. } else if (evt.deltaMode === MOUSE_DOM_DELTA_LINE_MODE) {
  404. delta /= MOUSE_LINES_PER_PAGE;
  405. }
  406. return delta;
  407. }
  408. function isValidRotation(angle) {
  409. return Number.isInteger(angle) && angle % 90 === 0;
  410. }
  411. function isValidScrollMode(mode) {
  412. return Number.isInteger(mode) && Object.values(ScrollMode).includes(mode) && mode !== ScrollMode.UNKNOWN;
  413. }
  414. function isValidSpreadMode(mode) {
  415. return Number.isInteger(mode) && Object.values(SpreadMode).includes(mode) && mode !== SpreadMode.UNKNOWN;
  416. }
  417. function isPortraitOrientation(size) {
  418. return size.width <= size.height;
  419. }
  420. const animationStarted = new Promise(function (resolve) {
  421. if (typeof window === "undefined") {
  422. setTimeout(resolve, 20);
  423. return;
  424. }
  425. window.requestAnimationFrame(resolve);
  426. });
  427. exports.animationStarted = animationStarted;
  428. const docStyle = typeof document === "undefined" ? null : document.documentElement.style;
  429. exports.docStyle = docStyle;
  430. function clamp(v, min, max) {
  431. return Math.min(Math.max(v, min), max);
  432. }
  433. class ProgressBar {
  434. #classList = null;
  435. #percent = 0;
  436. #visible = true;
  437. constructor(id) {
  438. if (arguments.length > 1) {
  439. throw new Error("ProgressBar no longer accepts any additional options, " + "please use CSS rules to modify its appearance instead.");
  440. }
  441. const bar = document.getElementById(id);
  442. this.#classList = bar.classList;
  443. }
  444. get percent() {
  445. return this.#percent;
  446. }
  447. set percent(val) {
  448. this.#percent = clamp(val, 0, 100);
  449. if (isNaN(val)) {
  450. this.#classList.add("indeterminate");
  451. return;
  452. }
  453. this.#classList.remove("indeterminate");
  454. docStyle.setProperty("--progressBar-percent", `${this.#percent}%`);
  455. }
  456. setWidth(viewer) {
  457. if (!viewer) {
  458. return;
  459. }
  460. const container = viewer.parentNode;
  461. const scrollbarWidth = container.offsetWidth - viewer.offsetWidth;
  462. if (scrollbarWidth > 0) {
  463. docStyle.setProperty("--progressBar-end-offset", `${scrollbarWidth}px`);
  464. }
  465. }
  466. hide() {
  467. if (!this.#visible) {
  468. return;
  469. }
  470. this.#visible = false;
  471. this.#classList.add("hidden");
  472. }
  473. show() {
  474. if (this.#visible) {
  475. return;
  476. }
  477. this.#visible = true;
  478. this.#classList.remove("hidden");
  479. }
  480. }
  481. exports.ProgressBar = ProgressBar;
  482. function getActiveOrFocusedElement() {
  483. let curRoot = document;
  484. let curActiveOrFocused = curRoot.activeElement || curRoot.querySelector(":focus");
  485. while (curActiveOrFocused?.shadowRoot) {
  486. curRoot = curActiveOrFocused.shadowRoot;
  487. curActiveOrFocused = curRoot.activeElement || curRoot.querySelector(":focus");
  488. }
  489. return curActiveOrFocused;
  490. }
  491. function apiPageLayoutToViewerModes(layout) {
  492. let scrollMode = ScrollMode.VERTICAL,
  493. spreadMode = SpreadMode.NONE;
  494. switch (layout) {
  495. case "SinglePage":
  496. scrollMode = ScrollMode.PAGE;
  497. break;
  498. case "OneColumn":
  499. break;
  500. case "TwoPageLeft":
  501. scrollMode = ScrollMode.PAGE;
  502. case "TwoColumnLeft":
  503. spreadMode = SpreadMode.ODD;
  504. break;
  505. case "TwoPageRight":
  506. scrollMode = ScrollMode.PAGE;
  507. case "TwoColumnRight":
  508. spreadMode = SpreadMode.EVEN;
  509. break;
  510. }
  511. return {
  512. scrollMode,
  513. spreadMode
  514. };
  515. }
  516. function apiPageModeToSidebarView(mode) {
  517. switch (mode) {
  518. case "UseNone":
  519. return SidebarView.NONE;
  520. case "UseThumbs":
  521. return SidebarView.THUMBS;
  522. case "UseOutlines":
  523. return SidebarView.OUTLINE;
  524. case "UseAttachments":
  525. return SidebarView.ATTACHMENTS;
  526. case "UseOC":
  527. return SidebarView.LAYERS;
  528. }
  529. return SidebarView.NONE;
  530. }