viewer.html 38 KB

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