viewer.html 38 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140
  1. <!DOCTYPE html>
  2. <!--
  3. Copyright 2012 Mozilla Foundation
  4. Licensed under the Apache License, Version 2.0 (the "License");
  5. you may not use this file except in compliance with the License.
  6. You may obtain a copy of the License at
  7. http://www.apache.org/licenses/LICENSE-2.0
  8. Unless required by applicable law or agreed to in writing, software
  9. distributed under the License is distributed on an "AS IS" BASIS,
  10. WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  11. See the License for the specific language governing permissions and
  12. limitations under the License.
  13. Adobe CMap resources are covered by their own copyright but the same license:
  14. Copyright 1990-2015 Adobe Systems Incorporated.
  15. See https://github.com/adobe-type-tools/cmap-resources
  16. -->
  17. <html dir="ltr" mozdisallowselectionprint>
  18. <head>
  19. <meta charset="utf-8" />
  20. <meta
  21. name="viewport"
  22. content="width=device-width, initial-scale=1, maximum-scale=1"
  23. />
  24. <meta name="google" content="notranslate" />
  25. <meta http-equiv="Content-Type" content="text/html" charset="gb2312" />
  26. <meta http-equiv="X-UA-Compatible" content="IE=edge" charset="utf-8" />
  27. <title>PDF.js viewer</title>
  28. <link rel="stylesheet" href="viewer.css" />
  29. <!-- This snippet is used in production (included from viewer.html) -->
  30. <link
  31. rel="resource"
  32. type="application/l10n"
  33. href="locale/locale.properties"
  34. />
  35. <script src="../core-js-3.29.1-minified.min.js"></script>
  36. <script>
  37. const isNoCopy = false;
  38. // 禁止右键菜单
  39. document.oncontextmenu = function () {
  40. return isNoCopy;
  41. };
  42. // 禁止文字选择
  43. document.onselectstart = function () {
  44. return isNoCopy;
  45. };
  46. // 禁止复制
  47. document.oncopy = function () {
  48. return isNoCopy;
  49. };
  50. // 禁止剪切
  51. document.oncut = function () {
  52. return isNoCopy;
  53. };
  54. window.onkeydown =
  55. window.onkeyup =
  56. window.onkeypress =
  57. function (event) {
  58. // 禁止使用F12,判断是否按下F12,F12键码为123
  59. if (event.keyCode === 123) {
  60. // 阻止默认事件
  61. event.preventDefault();
  62. window.event.returnValue = false;
  63. }
  64. // 禁用 ctrl + s 与 command + s
  65. if ((event.ctrlKey || event.metaKey) && event.key !== "f") {
  66. // 阻止默认事件
  67. event.preventDefault();
  68. window.event.returnValue = false;
  69. }
  70. };
  71. function disableContextMenu(e) {
  72. e.preventDefault();
  73. }
  74. document.addEventListener("visibilitychange", function () {
  75. if (document.hidden) {
  76. // 取消禁用鼠标右键事件
  77. document.removeEventListener("contextmenu", disableContextMenu);
  78. } else {
  79. // 禁用鼠标右键事件
  80. document.addEventListener("contextmenu", disableContextMenu);
  81. }
  82. });
  83. function formatQueryString(query) {
  84. const params = new Map();
  85. for (const [key, value] of new URLSearchParams(query)) {
  86. params.set(key.toLowerCase(), value);
  87. }
  88. return params;
  89. }
  90. var watermarkText = formatQueryString(location.search).get(
  91. "watermark_text"
  92. );
  93. var pdfIsEncrypt = parseInt(
  94. formatQueryString(location.search).get("is_encrypt") || 1
  95. );
  96. </script>
  97. <script src="../build/pdf.js"></script>
  98. <script src="wasm_exec.js"></script>
  99. <script src="viewer.js"></script>
  100. <style>
  101. .hide_btn {
  102. display: none;
  103. }
  104. </style>
  105. </head>
  106. <body tabindex="1">
  107. <div id="outerContainer">
  108. <script>
  109. const searchBox = document.getElementById("search-box");
  110. const findInput = document.getElementById("findInput");
  111. const historicalSearchMask = document.getElementById(
  112. "historical-search-mask"
  113. );
  114. findInput.addEventListener("focus", function () {
  115. console.log(123, searchBox.classList);
  116. if (searchBox.classList.length == 2) {
  117. searchBox.classList.remove("focus");
  118. } else {
  119. searchBox.classList.add("focus");
  120. }
  121. });
  122. findInput.addEventListener("blur", function () {
  123. setTimeout(() => {
  124. searchBox.classList.remove("focus");
  125. }, 1000);
  126. });
  127. historicalSearchMask.addEventListener("click", function () {
  128. searchBox.classList.remove("focus");
  129. });
  130. </script>
  131. <div id="sidebarContainerMask"></div>
  132. <div id="sidebarContainer">
  133. <div id="toolbarSidebar">
  134. <div id="toolbarSidebarLeft">
  135. <div
  136. id="sidebarViewButtons"
  137. class="splitToolbarButton toggled"
  138. role="radiogroup"
  139. >
  140. <button
  141. id="viewThumbnail"
  142. class="toolbarButton toggled"
  143. title="Show Thumbnails"
  144. tabindex="2"
  145. data-l10n-id="thumbs"
  146. role="radio"
  147. aria-checked="true"
  148. aria-controls="thumbnailView"
  149. >
  150. <span data-l10n-id="thumbs_label">Thumbnails</span>
  151. </button>
  152. <button
  153. id="viewOutline"
  154. class="toolbarButton"
  155. title="Show Document Outline (double-click to expand/collapse all items)"
  156. tabindex="3"
  157. data-l10n-id="document_outline"
  158. role="radio"
  159. aria-checked="false"
  160. aria-controls="outlineView"
  161. >
  162. <span data-l10n-id="document_outline_label"
  163. >Document Outline</span
  164. >
  165. </button>
  166. <button
  167. id="viewAttachments"
  168. class="toolbarButton"
  169. title="Show Attachments"
  170. tabindex="4"
  171. data-l10n-id="attachments"
  172. role="radio"
  173. aria-checked="false"
  174. aria-controls="attachmentsView"
  175. >
  176. <span data-l10n-id="attachments_label">Attachments</span>
  177. </button>
  178. <button
  179. id="viewLayers"
  180. class="toolbarButton"
  181. title="Show Layers (double-click to reset all layers to the default state)"
  182. tabindex="5"
  183. data-l10n-id="layers"
  184. role="radio"
  185. aria-checked="false"
  186. aria-controls="layersView"
  187. >
  188. <span data-l10n-id="layers_label">Layers</span>
  189. </button>
  190. </div>
  191. </div>
  192. <div id="toolbarSidebarRight">
  193. <div id="outlineOptionsContainer" class="hidden">
  194. <div class="verticalToolbarSeparator"></div>
  195. <button
  196. id="currentOutlineItem"
  197. class="toolbarButton"
  198. disabled="disabled"
  199. title="Find Current Outline Item"
  200. tabindex="6"
  201. data-l10n-id="current_outline_item"
  202. >
  203. <span data-l10n-id="current_outline_item_label"
  204. >Current Outline Item</span
  205. >
  206. </button>
  207. </div>
  208. </div>
  209. </div>
  210. <div id="sidebarContent">
  211. <div id="thumbnailView"></div>
  212. <div id="outlineView" class="hidden"></div>
  213. <div id="attachmentsView" class="hidden"></div>
  214. <div id="layersView" class="hidden"></div>
  215. </div>
  216. <div id="sidebarResizer"></div>
  217. </div>
  218. <!-- sidebarContainer -->
  219. <div id="mainContainer">
  220. <div class="findbar hidden doorHanger" id="findbar">
  221. <div id="findbarInputContainer">
  222. <input
  223. id="findInput"
  224. class="toolbarField"
  225. title="Find"
  226. placeholder="Find in document…"
  227. tabindex="91"
  228. data-l10n-id="find_input"
  229. aria-invalid="false"
  230. />
  231. <div class="splitToolbarButton">
  232. <button
  233. id="findPrevious"
  234. class="toolbarButton"
  235. title="Find the previous occurrence of the phrase"
  236. tabindex="92"
  237. data-l10n-id="find_previous"
  238. >
  239. <span data-l10n-id="find_previous_label">Previous</span>
  240. </button>
  241. <div class="splitToolbarButtonSeparator"></div>
  242. <button
  243. id="findNext"
  244. class="toolbarButton"
  245. title="Find the next occurrence of the phrase"
  246. tabindex="93"
  247. data-l10n-id="find_next"
  248. >
  249. <span data-l10n-id="find_next_label">Next</span>
  250. </button>
  251. </div>
  252. </div>
  253. <div id="findbarOptionsOneContainer">
  254. <input
  255. type="checkbox"
  256. id="findHighlightAll"
  257. class="toolbarField"
  258. tabindex="94"
  259. />
  260. <label
  261. for="findHighlightAll"
  262. class="toolbarLabel"
  263. data-l10n-id="find_highlight"
  264. >Highlight All</label
  265. >
  266. <input
  267. type="checkbox"
  268. id="findMatchCase"
  269. class="toolbarField"
  270. tabindex="95"
  271. />
  272. <label
  273. for="findMatchCase"
  274. class="toolbarLabel"
  275. data-l10n-id="find_match_case_label"
  276. >Match Case</label
  277. >
  278. </div>
  279. <div id="findbarOptionsTwoContainer">
  280. <input
  281. type="checkbox"
  282. id="findMatchDiacritics"
  283. class="toolbarField"
  284. tabindex="96"
  285. />
  286. <label
  287. for="findMatchDiacritics"
  288. class="toolbarLabel"
  289. data-l10n-id="find_match_diacritics_label"
  290. >Match Diacritics</label
  291. >
  292. <input
  293. type="checkbox"
  294. id="findEntireWord"
  295. class="toolbarField"
  296. tabindex="97"
  297. />
  298. <label
  299. for="findEntireWord"
  300. class="toolbarLabel"
  301. data-l10n-id="find_entire_word_label"
  302. >Whole Words</label
  303. >
  304. </div>
  305. <div id="findbarMessageContainer" aria-live="polite">
  306. <span id="findResultsCount" class="toolbarLabel"></span>
  307. <span id="findMsg" class="toolbarLabel"></span>
  308. </div>
  309. </div>
  310. <!-- findbar -->
  311. <div
  312. class="editorParamsToolbar hidden doorHangerRight"
  313. id="editorFreeTextParamsToolbar"
  314. >
  315. <div class="editorParamsToolbarContainer">
  316. <div class="editorParamsSetter">
  317. <label
  318. for="editorFreeTextColor"
  319. class="editorParamsLabel"
  320. data-l10n-id="editor_free_text_color"
  321. >Color</label
  322. >
  323. <input
  324. type="color"
  325. id="editorFreeTextColor"
  326. class="editorParamsColor"
  327. tabindex="100"
  328. />
  329. </div>
  330. <div class="editorParamsSetter">
  331. <label
  332. for="editorFreeTextFontSize"
  333. class="editorParamsLabel"
  334. data-l10n-id="editor_free_text_size"
  335. >Size</label
  336. >
  337. <input
  338. type="range"
  339. id="editorFreeTextFontSize"
  340. class="editorParamsSlider"
  341. value="10"
  342. min="5"
  343. max="100"
  344. step="1"
  345. tabindex="101"
  346. />
  347. </div>
  348. </div>
  349. </div>
  350. <div
  351. class="editorParamsToolbar hidden doorHangerRight"
  352. id="editorInkParamsToolbar"
  353. >
  354. <div class="editorParamsToolbarContainer">
  355. <div class="editorParamsSetter">
  356. <label
  357. for="editorInkColor"
  358. class="editorParamsLabel"
  359. data-l10n-id="editor_ink_color"
  360. >Color</label
  361. >
  362. <input
  363. type="color"
  364. id="editorInkColor"
  365. class="editorParamsColor"
  366. tabindex="102"
  367. />
  368. </div>
  369. <div class="editorParamsSetter">
  370. <label
  371. for="editorInkThickness"
  372. class="editorParamsLabel"
  373. data-l10n-id="editor_ink_thickness"
  374. >Thickness</label
  375. >
  376. <input
  377. type="range"
  378. id="editorInkThickness"
  379. class="editorParamsSlider"
  380. value="1"
  381. min="1"
  382. max="20"
  383. step="1"
  384. tabindex="103"
  385. />
  386. </div>
  387. <div class="editorParamsSetter">
  388. <label
  389. for="editorInkOpacity"
  390. class="editorParamsLabel"
  391. data-l10n-id="editor_ink_opacity"
  392. >Opacity</label
  393. >
  394. <input
  395. type="range"
  396. id="editorInkOpacity"
  397. class="editorParamsSlider"
  398. value="100"
  399. min="1"
  400. max="100"
  401. step="1"
  402. tabindex="104"
  403. />
  404. </div>
  405. </div>
  406. </div>
  407. <div
  408. id="secondaryToolbar"
  409. class="secondaryToolbar hidden doorHangerRight"
  410. >
  411. <div id="secondaryToolbarButtonContainer">
  412. <button
  413. id="secondaryOpenFile"
  414. class="secondaryToolbarButton visibleLargeView"
  415. title="Open File"
  416. tabindex="51"
  417. data-l10n-id="open_file"
  418. >
  419. <span data-l10n-id="open_file_label">Open</span>
  420. </button>
  421. <button
  422. id="secondaryPrint"
  423. class="secondaryToolbarButton visibleMediumView"
  424. title="Print"
  425. tabindex="52"
  426. data-l10n-id="print"
  427. >
  428. <span data-l10n-id="print_label">Print</span>
  429. </button>
  430. <button
  431. id="secondaryDownload"
  432. class="secondaryToolbarButton visibleMediumView"
  433. title="Save"
  434. tabindex="53"
  435. data-l10n-id="save"
  436. >
  437. <span data-l10n-id="save_label">Save</span>
  438. </button>
  439. <div class="horizontalToolbarSeparator visibleLargeView"></div>
  440. <button
  441. id="presentationMode"
  442. class="secondaryToolbarButton"
  443. title="Switch to Presentation Mode"
  444. tabindex="54"
  445. data-l10n-id="presentation_mode"
  446. >
  447. <span data-l10n-id="presentation_mode_label"
  448. >Presentation Mode</span
  449. >
  450. </button>
  451. <a
  452. href="#"
  453. id="viewBookmark"
  454. class="secondaryToolbarButton"
  455. title="Current Page (View URL from Current Page)"
  456. tabindex="55"
  457. data-l10n-id="bookmark1"
  458. >
  459. <span data-l10n-id="bookmark1_label">Current Page</span>
  460. </a>
  461. <div
  462. id="viewBookmarkSeparator"
  463. class="horizontalToolbarSeparator"
  464. ></div>
  465. <button
  466. id="firstPage"
  467. class="secondaryToolbarButton"
  468. title="Go to First Page"
  469. tabindex="56"
  470. data-l10n-id="first_page"
  471. >
  472. <span data-l10n-id="first_page_label">Go to First Page</span>
  473. </button>
  474. <button
  475. id="lastPage"
  476. class="secondaryToolbarButton"
  477. title="Go to Last Page"
  478. tabindex="57"
  479. data-l10n-id="last_page"
  480. >
  481. <span data-l10n-id="last_page_label">Go to Last Page</span>
  482. </button>
  483. <div class="horizontalToolbarSeparator"></div>
  484. <button
  485. id="pageRotateCw"
  486. class="secondaryToolbarButton"
  487. title="Rotate Clockwise"
  488. tabindex="58"
  489. data-l10n-id="page_rotate_cw"
  490. >
  491. <span data-l10n-id="page_rotate_cw_label">Rotate Clockwise</span>
  492. </button>
  493. <button
  494. id="pageRotateCcw"
  495. class="secondaryToolbarButton"
  496. title="Rotate Counterclockwise"
  497. tabindex="59"
  498. data-l10n-id="page_rotate_ccw"
  499. >
  500. <span data-l10n-id="page_rotate_ccw_label"
  501. >Rotate Counterclockwise</span
  502. >
  503. </button>
  504. <div class="horizontalToolbarSeparator"></div>
  505. <div id="cursorToolButtons" role="radiogroup">
  506. <button
  507. id="cursorSelectTool"
  508. class="secondaryToolbarButton toggled"
  509. title="Enable Text Selection Tool"
  510. tabindex="60"
  511. data-l10n-id="cursor_text_select_tool"
  512. role="radio"
  513. aria-checked="true"
  514. >
  515. <span data-l10n-id="cursor_text_select_tool_label"
  516. >Text Selection Tool</span
  517. >
  518. </button>
  519. <button
  520. id="cursorHandTool"
  521. class="secondaryToolbarButton"
  522. title="Enable Hand Tool"
  523. tabindex="61"
  524. data-l10n-id="cursor_hand_tool"
  525. role="radio"
  526. aria-checked="false"
  527. >
  528. <span data-l10n-id="cursor_hand_tool_label">Hand Tool</span>
  529. </button>
  530. </div>
  531. <div class="horizontalToolbarSeparator"></div>
  532. <div id="scrollModeButtons" role="radiogroup">
  533. <button
  534. id="scrollPage"
  535. class="secondaryToolbarButton"
  536. title="Use Page Scrolling"
  537. tabindex="62"
  538. data-l10n-id="scroll_page"
  539. role="radio"
  540. aria-checked="false"
  541. >
  542. <span data-l10n-id="scroll_page_label">Page Scrolling</span>
  543. </button>
  544. <button
  545. id="scrollVertical"
  546. class="secondaryToolbarButton toggled"
  547. title="Use Vertical Scrolling"
  548. tabindex="63"
  549. data-l10n-id="scroll_vertical"
  550. role="radio"
  551. aria-checked="true"
  552. >
  553. <span data-l10n-id="scroll_vertical_label"
  554. >Vertical Scrolling</span
  555. >
  556. </button>
  557. <button
  558. id="scrollHorizontal"
  559. class="secondaryToolbarButton"
  560. title="Use Horizontal Scrolling"
  561. tabindex="64"
  562. data-l10n-id="scroll_horizontal"
  563. role="radio"
  564. aria-checked="false"
  565. >
  566. <span data-l10n-id="scroll_horizontal_label"
  567. >Horizontal Scrolling</span
  568. >
  569. </button>
  570. <button
  571. id="scrollWrapped"
  572. class="secondaryToolbarButton"
  573. title="Use Wrapped Scrolling"
  574. tabindex="65"
  575. data-l10n-id="scroll_wrapped"
  576. role="radio"
  577. aria-checked="false"
  578. >
  579. <span data-l10n-id="scroll_wrapped_label"
  580. >Wrapped Scrolling</span
  581. >
  582. </button>
  583. </div>
  584. <div class="horizontalToolbarSeparator"></div>
  585. <div id="spreadModeButtons" role="radiogroup">
  586. <button
  587. id="spreadNone"
  588. class="secondaryToolbarButton toggled"
  589. title="Do not join page spreads"
  590. tabindex="66"
  591. data-l10n-id="spread_none"
  592. role="radio"
  593. aria-checked="true"
  594. >
  595. <span data-l10n-id="spread_none_label">No Spreads</span>
  596. </button>
  597. <button
  598. id="spreadOdd"
  599. class="secondaryToolbarButton"
  600. title="Join page spreads starting with odd-numbered pages"
  601. tabindex="67"
  602. data-l10n-id="spread_odd"
  603. role="radio"
  604. aria-checked="false"
  605. >
  606. <span data-l10n-id="spread_odd_label">Odd Spreads</span>
  607. </button>
  608. <button
  609. id="spreadEven"
  610. class="secondaryToolbarButton"
  611. title="Join page spreads starting with even-numbered pages"
  612. tabindex="68"
  613. data-l10n-id="spread_even"
  614. role="radio"
  615. aria-checked="false"
  616. >
  617. <span data-l10n-id="spread_even_label">Even Spreads</span>
  618. </button>
  619. </div>
  620. <div class="horizontalToolbarSeparator"></div>
  621. <button
  622. id="documentProperties"
  623. class="secondaryToolbarButton"
  624. title="Document Properties…"
  625. tabindex="69"
  626. data-l10n-id="document_properties"
  627. aria-controls="documentPropertiesDialog"
  628. >
  629. <span data-l10n-id="document_properties_label"
  630. >Document Properties…</span
  631. >
  632. </button>
  633. </div>
  634. </div>
  635. <!-- secondaryToolbar -->
  636. <div class="toolbar">
  637. <div id="toolbarContainer">
  638. <div id="toolbarViewer">
  639. <div id="toolbarViewerLeft">
  640. <button
  641. id="sidebarToggle"
  642. class="toolbarButton"
  643. title="Toggle Sidebar"
  644. tabindex="11"
  645. data-l10n-id="toggle_sidebar"
  646. aria-expanded="false"
  647. aria-controls="sidebarContainer"
  648. >
  649. <span data-l10n-id="toggle_sidebar_label"
  650. >Toggle Sidebar</span
  651. >
  652. </button>
  653. <div class="toolbarButtonSpacer"></div>
  654. <button
  655. id="viewFind"
  656. class="toolbarButton"
  657. title="Find in Document"
  658. tabindex="12"
  659. data-l10n-id="findbar"
  660. aria-expanded="false"
  661. aria-controls="findbar"
  662. >
  663. <span data-l10n-id="findbar_label">Find</span>
  664. </button>
  665. <div class="splitToolbarButton hiddenSmallView">
  666. <button
  667. class="toolbarButton"
  668. title="Previous Page"
  669. id="previous"
  670. tabindex="13"
  671. data-l10n-id="previous"
  672. >
  673. <span data-l10n-id="previous_label">Previous</span>
  674. </button>
  675. <div class="splitToolbarButtonSeparator"></div>
  676. <button
  677. class="toolbarButton"
  678. title="Next Page"
  679. id="next"
  680. tabindex="14"
  681. data-l10n-id="next"
  682. >
  683. <span data-l10n-id="next_label">Next</span>
  684. </button>
  685. </div>
  686. <input
  687. type="number"
  688. id="pageNumber"
  689. class="toolbarField"
  690. title="Page"
  691. value="1"
  692. min="1"
  693. tabindex="15"
  694. data-l10n-id="page"
  695. autocomplete="off"
  696. />
  697. <span id="numPages" class="toolbarLabel"></span>
  698. </div>
  699. <div id="toolbarViewerRight">
  700. <!-- 打开文件 -->
  701. <button
  702. id="openFile"
  703. class="toolbarButton hiddenLargeView hide_btn"
  704. title="Open File"
  705. tabindex="31"
  706. data-l10n-id="open_file"
  707. >
  708. <span data-l10n-id="open_file_label">Open</span>
  709. </button>
  710. <!-- 打印 -->
  711. <button
  712. id="print"
  713. class="toolbarButton hiddenMediumView hide_btn"
  714. title="Print"
  715. tabindex="32"
  716. data-l10n-id="print"
  717. >
  718. <span data-l10n-id="print_label">Print</span>
  719. </button>
  720. <!-- 下载 -->
  721. <button
  722. id="download"
  723. class="toolbarButton hiddenMediumView hide_btn"
  724. title="Save"
  725. tabindex="33"
  726. data-l10n-id="save"
  727. >
  728. <span data-l10n-id="save_label">Save</span>
  729. </button>
  730. <div class="verticalToolbarSeparator hiddenMediumView"></div>
  731. <!-- 编辑 -->
  732. <div
  733. id="editorModeButtons"
  734. class="splitToolbarButton toggled hide_btn"
  735. role="radiogroup"
  736. >
  737. <button
  738. id="editorFreeText"
  739. class="toolbarButton"
  740. disabled="disabled"
  741. title="Text"
  742. role="radio"
  743. aria-checked="false"
  744. tabindex="34"
  745. data-l10n-id="editor_free_text2"
  746. >
  747. <span data-l10n-id="editor_free_text2_label">Text</span>
  748. </button>
  749. <button
  750. id="editorInk"
  751. class="toolbarButton"
  752. disabled="disabled"
  753. title="Draw"
  754. role="radio"
  755. aria-checked="false"
  756. tabindex="35"
  757. data-l10n-id="editor_ink2"
  758. >
  759. <span data-l10n-id="editor_ink2_label">Draw</span>
  760. </button>
  761. </div>
  762. <div
  763. id="editorModeSeparator"
  764. class="verticalToolbarSeparator"
  765. ></div>
  766. <!-- 功能 -->
  767. <button
  768. id="secondaryToolbarToggle"
  769. class="toolbarButton hide_btn"
  770. title="Tools"
  771. tabindex="48"
  772. data-l10n-id="tools"
  773. aria-expanded="false"
  774. aria-controls="secondaryToolbar"
  775. >
  776. <span data-l10n-id="tools_label">Tools</span>
  777. </button>
  778. </div>
  779. <div id="toolbarViewerMiddle">
  780. <div class="splitToolbarButton">
  781. <button
  782. id="zoomOut"
  783. class="toolbarButton"
  784. title="Zoom Out"
  785. tabindex="21"
  786. data-l10n-id="zoom_out"
  787. >
  788. <span data-l10n-id="zoom_out_label">Zoom Out</span>
  789. </button>
  790. <div class="splitToolbarButtonSeparator"></div>
  791. <button
  792. id="zoomIn"
  793. class="toolbarButton"
  794. title="Zoom In"
  795. tabindex="22"
  796. data-l10n-id="zoom_in"
  797. >
  798. <span data-l10n-id="zoom_in_label">Zoom In</span>
  799. </button>
  800. </div>
  801. <span id="scaleSelectContainer" class="dropdownToolbarButton">
  802. <select
  803. id="scaleSelect"
  804. title="Zoom"
  805. tabindex="23"
  806. data-l10n-id="zoom"
  807. >
  808. <option
  809. id="pageAutoOption"
  810. title=""
  811. value="auto"
  812. selected="selected"
  813. data-l10n-id="page_scale_auto"
  814. >
  815. Automatic Zoom
  816. </option>
  817. <option
  818. id="pageActualOption"
  819. title=""
  820. value="page-actual"
  821. data-l10n-id="page_scale_actual"
  822. >
  823. Actual Size
  824. </option>
  825. <option
  826. id="pageFitOption"
  827. title=""
  828. value="page-fit"
  829. data-l10n-id="page_scale_fit"
  830. >
  831. Page Fit
  832. </option>
  833. <option
  834. id="pageWidthOption"
  835. title=""
  836. value="page-width"
  837. data-l10n-id="page_scale_width"
  838. >
  839. Page Width
  840. </option>
  841. <option
  842. id="customScaleOption"
  843. title=""
  844. value="custom"
  845. disabled="disabled"
  846. hidden="true"
  847. ></option>
  848. <option
  849. title=""
  850. value="0.5"
  851. data-l10n-id="page_scale_percent"
  852. data-l10n-args='{ "scale": 50 }'
  853. >
  854. 50%
  855. </option>
  856. <option
  857. title=""
  858. value="0.75"
  859. data-l10n-id="page_scale_percent"
  860. data-l10n-args='{ "scale": 75 }'
  861. >
  862. 75%
  863. </option>
  864. <option
  865. title=""
  866. value="1"
  867. data-l10n-id="page_scale_percent"
  868. data-l10n-args='{ "scale": 100 }'
  869. >
  870. 100%
  871. </option>
  872. <option
  873. title=""
  874. value="1.25"
  875. data-l10n-id="page_scale_percent"
  876. data-l10n-args='{ "scale": 125 }'
  877. >
  878. 125%
  879. </option>
  880. <option
  881. title=""
  882. value="1.5"
  883. data-l10n-id="page_scale_percent"
  884. data-l10n-args='{ "scale": 150 }'
  885. >
  886. 150%
  887. </option>
  888. <option
  889. title=""
  890. value="2"
  891. data-l10n-id="page_scale_percent"
  892. data-l10n-args='{ "scale": 200 }'
  893. >
  894. 200%
  895. </option>
  896. <option
  897. title=""
  898. value="3"
  899. data-l10n-id="page_scale_percent"
  900. data-l10n-args='{ "scale": 300 }'
  901. >
  902. 300%
  903. </option>
  904. <option
  905. title=""
  906. value="4"
  907. data-l10n-id="page_scale_percent"
  908. data-l10n-args='{ "scale": 400 }'
  909. >
  910. 400%
  911. </option>
  912. </select>
  913. </span>
  914. </div>
  915. </div>
  916. <div id="loadingBar">
  917. <div class="progress">
  918. <div class="glimmer"></div>
  919. </div>
  920. </div>
  921. </div>
  922. </div>
  923. <div id="viewerContainer" tabindex="0">
  924. <div id="viewer" class="pdfViewer"></div>
  925. </div>
  926. </div>
  927. <!-- mainContainer -->
  928. <div id="dialogContainer">
  929. <dialog id="passwordDialog">
  930. <div class="row">
  931. <label
  932. for="password"
  933. id="passwordText"
  934. data-l10n-id="password_label"
  935. >Enter the password to open this PDF file:</label
  936. >
  937. </div>
  938. <div class="row">
  939. <input type="password" id="password" class="toolbarField" />
  940. </div>
  941. <div class="buttonRow">
  942. <button id="passwordCancel" class="dialogButton">
  943. <span data-l10n-id="password_cancel">Cancel</span>
  944. </button>
  945. <button id="passwordSubmit" class="dialogButton">
  946. <span data-l10n-id="password_ok">OK</span>
  947. </button>
  948. </div>
  949. </dialog>
  950. <dialog id="documentPropertiesDialog">
  951. <div class="row">
  952. <span
  953. id="fileNameLabel"
  954. data-l10n-id="document_properties_file_name"
  955. >File name:</span
  956. >
  957. <p id="fileNameField" aria-labelledby="fileNameLabel">-</p>
  958. </div>
  959. <div class="row">
  960. <span
  961. id="fileSizeLabel"
  962. data-l10n-id="document_properties_file_size"
  963. >File size:</span
  964. >
  965. <p id="fileSizeField" aria-labelledby="fileSizeLabel">-</p>
  966. </div>
  967. <div class="separator"></div>
  968. <div class="row">
  969. <span id="titleLabel" data-l10n-id="document_properties_title"
  970. >Title:</span
  971. >
  972. <p id="titleField" aria-labelledby="titleLabel">-</p>
  973. </div>
  974. <div class="row">
  975. <span id="authorLabel" data-l10n-id="document_properties_author"
  976. >Author:</span
  977. >
  978. <p id="authorField" aria-labelledby="authorLabel">-</p>
  979. </div>
  980. <div class="row">
  981. <span id="subjectLabel" data-l10n-id="document_properties_subject"
  982. >Subject:</span
  983. >
  984. <p id="subjectField" aria-labelledby="subjectLabel">-</p>
  985. </div>
  986. <div class="row">
  987. <span id="keywordsLabel" data-l10n-id="document_properties_keywords"
  988. >Keywords:</span
  989. >
  990. <p id="keywordsField" aria-labelledby="keywordsLabel">-</p>
  991. </div>
  992. <div class="row">
  993. <span
  994. id="creationDateLabel"
  995. data-l10n-id="document_properties_creation_date"
  996. >Creation Date:</span
  997. >
  998. <p id="creationDateField" aria-labelledby="creationDateLabel">-</p>
  999. </div>
  1000. <div class="row">
  1001. <span
  1002. id="modificationDateLabel"
  1003. data-l10n-id="document_properties_modification_date"
  1004. >Modification Date:</span
  1005. >
  1006. <p
  1007. id="modificationDateField"
  1008. aria-labelledby="modificationDateLabel"
  1009. >
  1010. -
  1011. </p>
  1012. </div>
  1013. <div class="row">
  1014. <span id="creatorLabel" data-l10n-id="document_properties_creator"
  1015. >Creator:</span
  1016. >
  1017. <p id="creatorField" aria-labelledby="creatorLabel">-</p>
  1018. </div>
  1019. <div class="separator"></div>
  1020. <div class="row">
  1021. <span id="producerLabel" data-l10n-id="document_properties_producer"
  1022. >PDF Producer:</span
  1023. >
  1024. <p id="producerField" aria-labelledby="producerLabel">-</p>
  1025. </div>
  1026. <div class="row">
  1027. <span id="versionLabel" data-l10n-id="document_properties_version"
  1028. >PDF Version:</span
  1029. >
  1030. <p id="versionField" aria-labelledby="versionLabel">-</p>
  1031. </div>
  1032. <div class="row">
  1033. <span
  1034. id="pageCountLabel"
  1035. data-l10n-id="document_properties_page_count"
  1036. >Page Count:</span
  1037. >
  1038. <p id="pageCountField" aria-labelledby="pageCountLabel">-</p>
  1039. </div>
  1040. <div class="row">
  1041. <span
  1042. id="pageSizeLabel"
  1043. data-l10n-id="document_properties_page_size"
  1044. >Page Size:</span
  1045. >
  1046. <p id="pageSizeField" aria-labelledby="pageSizeLabel">-</p>
  1047. </div>
  1048. <div class="separator"></div>
  1049. <div class="row">
  1050. <span
  1051. id="linearizedLabel"
  1052. data-l10n-id="document_properties_linearized"
  1053. >Fast Web View:</span
  1054. >
  1055. <p id="linearizedField" aria-labelledby="linearizedLabel">-</p>
  1056. </div>
  1057. <div class="buttonRow">
  1058. <button id="documentPropertiesClose" class="dialogButton">
  1059. <span data-l10n-id="document_properties_close">Close</span>
  1060. </button>
  1061. </div>
  1062. </dialog>
  1063. <dialog id="printServiceDialog" style="min-width: 200px">
  1064. <div class="row">
  1065. <span data-l10n-id="print_progress_message"
  1066. >Preparing document for printing…</span
  1067. >
  1068. </div>
  1069. <div class="row">
  1070. <progress value="0" max="100"></progress>
  1071. <span
  1072. data-l10n-id="print_progress_percent"
  1073. data-l10n-args='{ "progress": 0 }'
  1074. class="relative-progress"
  1075. >0%</span
  1076. >
  1077. </div>
  1078. <div class="buttonRow">
  1079. <button id="printCancel" class="dialogButton">
  1080. <span data-l10n-id="print_progress_close">Cancel</span>
  1081. </button>
  1082. </div>
  1083. </dialog>
  1084. </div>
  1085. <!-- dialogContainer -->
  1086. </div>
  1087. <!-- outerContainer -->
  1088. <div id="printContainer"></div>
  1089. <input type="file" id="fileInput" class="hidden" />
  1090. </body>
  1091. </html>