| <!doctype html> |
| <html lang="en"> |
| <head> |
| <meta charset="utf-8" /> |
| <title>TextPhantom Local Viewer</title> |
| <meta name="viewport" content="width=device-width,initial-scale=1" /> |
| <link rel="stylesheet" href="viewer.css" /> |
| </head> |
| <body> |
| <div class="app-shell"> |
| <aside class="sidebar"> |
| <div class="sidebar-head"> |
| <div> |
| <div class="eyebrow">TextPhantom</div> |
| <h1>Local Viewer</h1> |
| </div> |
| <div id="page-count" class="sidebar-meta">0 pages</div> |
| </div> |
| |
| <div class="toolbar stack"> |
| <div class="toolbar-row dual"> |
| <button type="button" id="viewer-open-images" class="btn primary">Open image(s)</button> |
| <button type="button" id="viewer-open-folder" class="btn">Open folder</button> |
| </div> |
| <div class="toolbar-row triple"> |
| <button type="button" id="toggle-select-pages" class="btn">Select all</button> |
| <button type="button" id="reverse-page-order" class="btn">Reverse</button> |
| <button type="button" id="clear-viewer" class="btn danger">Clear viewer</button> |
| </div> |
| <div class="toolbar-row zoom-row"> |
| <button type="button" id="zoom-out" class="btn">−</button> |
| <input id="zoom-range" type="range" min="420" max="2200" step="20" value="980" /> |
| <button type="button" id="zoom-in" class="btn">+</button> |
| <button type="button" id="fit-width" class="btn">Fit</button> |
| </div> |
| <div class="toolbar-row dual"> |
| <button type="button" id="download-selected-images" class="btn primary">Download image(s)</button> |
| <button type="button" id="download-selected-html" class="btn">Download HTML</button> |
| </div> |
| </div> |
| |
| <div class="sidebar-note">Drag names below to reorder the reader. Use Ctrl/Cmd + mouse wheel to zoom.</div> |
| <div id="viewer-status" class="status">Open local images or a folder, then right-click an image to translate.</div> |
| <div id="page-list" class="page-list"></div> |
| </aside> |
| |
| <main class="reader-shell"> |
| <header class="reader-head"> |
| <div class="reader-head-main"> |
| <h2>Reader</h2> |
| <div id="selection-summary" class="selection-summary">0 selected</div> |
| </div> |
| <div id="zoom-indicator" class="zoom-indicator">980px</div> |
| </header> |
| <section id="reader" class="reader"></section> |
| </main> |
| </div> |
| |
| <input id="viewer-images-input" type="file" accept="image/*" multiple hidden /> |
| <input id="viewer-folder-input" type="file" accept="image/*" multiple webkitdirectory hidden /> |
| <script src="../content-service.js"></script> |
| <script type="module" src="viewer.js"></script> |
| </body> |
| </html> |
|
|
