80 lines
3.8 KiB
HTML
80 lines
3.8 KiB
HTML
|
<!doctype html>
|
|||
|
|
<html lang="en">
|
|||
|
|
<head>
|
|||
|
|
<meta charset="utf-8">
|
|||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|||
|
|
<meta name="referrer" content="no-referrer">
|
|||
|
|
<meta name="color-scheme" content="dark light">
|
|||
|
|
<title>Pithos</title>
|
|||
|
|
<link rel="icon" href="/_app/icon.svg" type="image/svg+xml">
|
|||
|
|
<link rel="stylesheet" href="/_app/app.css">
|
|||
|
|
<script type="module" src="/_app/app.js"></script>
|
|||
|
|
</head>
|
|||
|
|
<body>
|
|||
|
|
<header class="top">
|
|||
|
|
<a class="brand" href="#/"><img src="/_app/icon.svg" alt=""><span>Pithos</span></a>
|
|||
|
|
<span class="who" id="who" hidden></span>
|
|||
|
|
<button class="btn small" id="signout" hidden>Sign out</button>
|
|||
|
|
</header>
|
|||
|
|
|
|||
|
|
<main id="signin" class="signin" hidden>
|
|||
|
|
<section class="card narrow">
|
|||
|
|
<h1>Your drives on Silent Mode</h1>
|
|||
|
|
<p class="muted">Open the drives you keep on Silent Mode from any browser. Files are decrypted here, in this page; the server only ever sees them encrypted.</p>
|
|||
|
|
|
|||
|
|
<div id="unlock" hidden>
|
|||
|
|
<p>A key is remembered on this device.</p>
|
|||
|
|
<form id="unlock-form" class="stack">
|
|||
|
|
<label class="field"><span>Passphrase</span><input type="password" id="unlock-pass" autocomplete="current-password" required></label>
|
|||
|
|
<div class="row"><button class="btn primary" type="submit">Unlock</button><button class="btn" type="button" id="forget">Use another key</button></div>
|
|||
|
|
</form>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div id="keyform">
|
|||
|
|
<label class="drop" id="drop" tabindex="0">
|
|||
|
|
<input type="file" id="keyfile" accept=".json,application/json" hidden>
|
|||
|
|
<strong>Drop your key file here</strong>
|
|||
|
|
<span class="muted">or click to choose it</span>
|
|||
|
|
</label>
|
|||
|
|
<details class="paste">
|
|||
|
|
<summary>Paste it instead</summary>
|
|||
|
|
<textarea id="keytext" rows="5" spellcheck="false" autocomplete="off" placeholder='{"v":1,"secret":"…"} or {"endpoint":"…","accessKey":"…","secretKey":"…","bucket":"…"}'></textarea>
|
|||
|
|
</details>
|
|||
|
|
<label class="check"><input type="checkbox" id="remember"> Remember on this device</label>
|
|||
|
|
<label class="field" id="pass-row" hidden><span>Passphrase to protect it (at least 10 characters)</span><input type="password" id="pass" autocomplete="new-password" minlength="10"></label>
|
|||
|
|
<button class="btn primary" id="go">Sign in</button>
|
|||
|
|
<div class="help">
|
|||
|
|
<p><b>Which key?</b></p>
|
|||
|
|
<ul>
|
|||
|
|
<li><b>Your Pithos key</b> opens all your drives, encrypted files included: in Pithos, Accounts › On Silent Mode › Export key (in Theseus: Key for the browser app).</li>
|
|||
|
|
<li><b>An S3 key file</b> (Users & keys › Export JSON…, or a folder key someone shared with you) opens readable files and shared folders.</li>
|
|||
|
|
</ul>
|
|||
|
|
<p class="muted">The key stays in this tab, or sealed with your passphrase if you choose Remember. Close the tab to sign out.</p>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<p class="error" id="signin-error" hidden></p>
|
|||
|
|
</section>
|
|||
|
|
</main>
|
|||
|
|
|
|||
|
|
<main id="app" class="app" hidden>
|
|||
|
|
<nav class="crumbs" id="crumbs"></nav>
|
|||
|
|
<div class="toolbar" id="toolbar">
|
|||
|
|
<button class="btn primary" id="upload">Upload</button>
|
|||
|
|
<input type="file" id="files" multiple hidden>
|
|||
|
|
<button class="btn" id="newfolder">New folder</button>
|
|||
|
|
<span class="spacer"></span>
|
|||
|
|
<span class="muted small" id="count"></span>
|
|||
|
|
</div>
|
|||
|
|
<section class="card list" id="list"></section>
|
|||
|
|
<p class="muted small foot">Pithos in the browser · <a href="https://silentmode.st/pithos/" rel="noopener">pithos.sia</a></p>
|
|||
|
|
</main>
|
|||
|
|
|
|||
|
|
<div class="viewer" id="viewer" hidden>
|
|||
|
|
<div class="viewer-bar"><span id="viewer-name"></span><span class="spacer"></span><button class="btn small" id="viewer-dl">Download</button><button class="btn small" id="viewer-close">Close</button></div>
|
|||
|
|
<div class="viewer-body" id="viewer-body"></div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="toasts" id="toasts" aria-live="polite"></div>
|
|||
|
|
</body>
|
|||
|
|
</html>
|