ui_utils.js 15 KB

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