Grab-browser-extension/options.html at main · Linuxuser67/Grab-browser-extension · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>Grab Options</title>
    <style>
      :root {
        color-scheme: light dark;
      }
      body {
        font-family: system-ui, sans-serif;
        font-size: 14px;
        max-width: 480px;
        margin: 24px;
        color: #1e1e1e;
        background: #ffffff;
      }
      @media (prefers-color-scheme: dark) {
        body {
          color: #e0e0e0;
          background: #1e1e1e;
        }
      }
      label {
        display: block;
        margin: 16px 0 4px;
      }
      .hint {
        color: #666;
        font-size: 12px;
        margin: 2px 0 0;
      }
      @media (prefers-color-scheme: dark) {
        .hint {
          color: #aaa;
        }
      }
      input[type="text"] {
        width: 100%;
        box-sizing: border-box;
        padding: 6px 8px;
        margin-top: 4px;
      }
      #saved {
        color: #1a7f37;
        opacity: 0;
        transition: opacity 0.3s;
        margin-top: 16px;
      }
    </style>
  </head>
  <body>
    <h2>Grab</h2>
    <label>
      <input type="checkbox" id="interceptDownloads" />
      Automatically send browser downloads to Grab
    </label>
    <p class="hint">
      When on, downloads are cancelled in the browser and opened in Grab
      instead. Blob and data URLs can't be handed off and always stay in the
      browser.
    </p>
    <label for="minSizeMB">Only intercept downloads of at least</label>
    <div style="display: flex; align-items: center; gap: 8px; margin-top: 4px">
      <input
        type="number"
        id="minSizeMB"
        min="0"
        step="1"
        style="width: 80px; padding: 6px 8px"
      />
      <span>MB</span>
    </div>
    <p class="hint">
      Smaller downloads stay in the browser. 0 intercepts everything.
    </p>
    <label for="skipTypes">Don't intercept these file types</label>
    <input type="text" id="skipTypes" placeholder="pdf, jpg, png" />
    <p class="hint">Comma-separated extensions, e.g. <code>pdf, jpg</code>.</p>
    <label>
      <input type="checkbox" id="showContextMenu" />
      Show “Download with Grab” in the right-click menu
    </label>
    <label>
      <input type="checkbox" id="detectVideos" />
      Detect videos playing in tabs
    </label>
    <p class="hint">
      Offered qualities appear in the right-click menu under “Videos detected
      by Grab”.
    </p>
    <h3>Pairing</h3>
    <label for="pairingCode">Pairing code from Grab</label>
    <input
      type="text"
      id="pairingCode"
      autocomplete="off"
      spellcheck="false"
      placeholder="Grab → Preferences → Browser extension"
    />
    <p class="hint">
      With a code, the extension checks that it is talking to Grab, signs what
      it sends, and shares the site's cookies so Grab can download pages that
      need them. Without one, only links are sent. Leave empty to unpair.
    </p>
    <button type="button" id="savePairing">Pair</button>
    <span id="pairingStatus" class="hint" role="status"></span>
    <p id="saved">Saved</p>
    <script src="shared.js"></script>
    <script src="settings.js"></script>
    <script src="options.js"></script>
  </body>
</html>