chrome-extension/popup.html

Rama main · réplica de lectura del repositorio original.

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>NASDrop</title>
  <link rel="stylesheet" href="popup.css">
</head>
<body>
  <header>
    <img src="icons/nasdrop-48.png" alt="">
    <div><strong>NASDrop</strong><span id="connection-label">Chrome</span></div>
    <button id="logout-button" class="text-button hidden" type="button" data-i18n="logout">Sign out</button>
  </header>

  <main>
    <label class="language-control"><span id="language-label">Language</span><select id="language-select" aria-labelledby="language-label"><option value="auto" id="language-auto">Automatic (browser)</option><option value="en">English</option><option value="ko">한국어</option><option value="zh">中文（简体）</option><option value="ja">日本語</option></select></label>
    <section id="login-view">
      <h1 data-i18n="connectTitle">Connect to your NAS</h1>
      <p class="muted" data-i18n="connectHint">Use the same address and account as the NASDrop web portal.</p>
      <form id="login-form">
        <label><span data-i18n="serverAddress">NASDrop address</span><input id="base-url" type="url" placeholder="http://192.168.1.10:8791" required></label>
        <label><span data-i18n="username">ID</span><input id="username" autocomplete="username" required></label>
        <label><span data-i18n="password">Password</span><input id="password" type="password" autocomplete="current-password" required></label>
        <button class="primary" id="login-button" type="submit" data-i18n="connect">Connect</button>
      </form>
    </section>

    <section id="app-view" class="hidden">
      <h1 id="automatic-title">Send from supported sites</h1>
      <p class="muted automatic-hint" id="automatic-hint">Click a site's download button to send it to NASDrop.</p>
      <a id="sponsor-banner" class="sponsor-banner" href="https://buymeacoffee.com/littleweirdlab0514" target="_blank" rel="noopener noreferrer" aria-label="Support NASDrop on Buy Me a Coffee"><img src="buy-me-a-coffee.png" width="217" height="61" alt=""></a>
      <details>
      <summary id="manual-title">Send a link manually</summary>
      <form id="send-form">
        <label><span data-i18n="downloadLink">Download link</span><textarea id="download-url" rows="3" required></textarea></label>
        <button class="secondary" id="use-tab-button" type="button" data-i18n="useCurrentTab">Use current tab</button>
        <label><span data-i18n="archivePassword">Archive password (optional)</span><input id="archive-password" type="password" autocomplete="off"></label>
        <label><span data-i18n="gigafileDownloadKey">GigaFile download key (optional)</span><input id="gigafile-download-key" type="password" maxlength="4" autocomplete="off" aria-describedby="gigafile-download-key-hint"></label>
        <p id="gigafile-download-key-hint" class="muted" data-i18n="gigafileDownloadKeyHint">Used only for a protected GigaFile download. It is not an archive password.</p>
        <button class="primary" id="send-button" type="submit" data-i18n="send">Send to NASDrop</button>
      </form>
      </details>
      <p class="destination" id="destination-label"></p>
      <div class="jobs-head jobs-toolbar"><h2 data-i18n="recentJobs">Recent jobs</h2><div class="job-controls"><div class="refresh-options"><button id="refresh-button" class="text-button" type="button" data-i18n="refresh">Refresh</button><label class="check"><input id="auto-extract" type="checkbox"><span data-i18n="autoExtract">Automatically extract archives</span></label></div><button id="clear-completed" class="text-button danger" type="button" disabled data-i18n="clearCompleted">Clear completed</button></div></div>
      <p id="poll-status" class="muted" role="status"></p>
      <p id="password-alert" class="hidden" role="alert"></p>
      <div id="jobs" class="jobs"></div>
      <section id="job-detail" class="hidden">
        <button id="close-detail" class="text-button" type="button" data-i18n="close">Close</button>
        <p id="job-delete-hint" class="muted"></p>
        <form id="job-options-form">
          <label><span data-i18n="archivePassword">Archive password (optional)</span><input id="job-password" type="password" autocomplete="off"></label>
          <p id="job-options-hint" class="muted"></p>
          <button id="save-job-options" class="primary" type="submit" data-i18n="saveOptions">Save options</button>
        </form>
        <form id="job-download-key-form" class="hidden">
          <label><span data-i18n="gigafileDownloadKeyRequired">GigaFile download key</span><input id="job-download-key" type="password" maxlength="4" autocomplete="off" aria-describedby="job-download-key-hint" required></label>
          <p id="job-download-key-hint" class="muted" data-i18n="gigafileDownloadKeyRequiredHint">Enter the 1–4 character key supplied by the sender.</p>
          <button id="save-job-download-key" class="primary" type="submit" data-i18n="submitDownloadKey">Submit download key</button>
        </form>
      </section>
    </section>
    <p id="notice" role="status"></p>
  </main>
  <script src="i18n.js"></script>
  <script src="popup-poller.js"></script>
  <script src="popup.js"></script>
</body>
</html>