84 lines
2.9 KiB
HTML
84 lines
2.9 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="cs">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>Encryptor (HTMX)</title>
|
|
<script src="https://unpkg.com/htmx.org"></script>
|
|
<link rel="stylesheet" href="/static/style.css">
|
|
</head>
|
|
<body>
|
|
<header>
|
|
<h1>🔐 Encryptor</h1>
|
|
<p class="subtitle">Jednoduché HTMX rozhraní pro šifrování zpráv cizím klíčem</p>
|
|
</header>
|
|
|
|
<section class="card">
|
|
<h2>Můj veřejný klíč</h2>
|
|
<div class="link-row">
|
|
<a href="/public.pem" target="_blank">public.pem</a>
|
|
<button onclick="copyFromUrl('/public.pem')">Copy</button>
|
|
</div>
|
|
<div class="link-row">
|
|
<a href="/public.crt" target="_blank">identity.crt</a>
|
|
<button onclick="copyFromUrl('/public.crt')">Copy</button>
|
|
</div>
|
|
<small>Pošli tohle kontaktům; můžou šifrovat pro tebe.</small>
|
|
</section>
|
|
|
|
<section class="card">
|
|
<h2>Šifrovat pro cizí klíč</h2>
|
|
<form hx-post="/encrypt" hx-target="#encryptResult" hx-swap="innerHTML">
|
|
<label>Zpráva</label>
|
|
<div class="row">
|
|
<textarea id="msg" name="message" placeholder="Sem napiš zprávu..."></textarea>
|
|
<button type="button" class="secondary" onclick="copyEl('msg')">Copy</button>
|
|
</div>
|
|
|
|
<label>Veřejný klíč příjemce (PEM nebo CERT)</label>
|
|
<div class="row">
|
|
<textarea id="peerKey" name="pubkey" placeholder="-----BEGIN PUBLIC KEY----- ..."></textarea>
|
|
<button type="button" class="secondary" onclick="copyEl('peerKey')">Copy</button>
|
|
</div>
|
|
|
|
<button type="submit" class="primary">Encrypt</button>
|
|
</form>
|
|
<div id="encryptResult" class="result"></div>
|
|
</section>
|
|
|
|
<section class="card">
|
|
<h2>Dešifrovat</h2>
|
|
<form hx-post="/decrypt" hx-target="#decryptResult" hx-swap="innerHTML">
|
|
<label>Payload (JSON envelope)</label>
|
|
<div class="row">
|
|
<textarea id="payload" name="payload" placeholder='{"ek":"...","n":"...","ct":"..."}'></textarea>
|
|
<button type="button" class="secondary" onclick="copyEl('payload')">Copy</button>
|
|
</div>
|
|
<button type="submit" class="primary">Decrypt</button>
|
|
</form>
|
|
<div id="decryptResult" class="result"></div>
|
|
</section>
|
|
|
|
<div id="toast">Zkopírováno</div>
|
|
<script>
|
|
function showToast(msg='Zkopírováno') {
|
|
const t = document.getElementById('toast');
|
|
t.textContent = msg;
|
|
t.classList.add('show');
|
|
setTimeout(() => t.classList.remove('show'), 1200);
|
|
}
|
|
async function copyEl(id) {
|
|
const el = document.getElementById(id);
|
|
const val = (el.tagName === 'TEXTAREA' || el.tagName === 'INPUT') ? el.value : el.textContent;
|
|
await navigator.clipboard.writeText(val || '');
|
|
showToast();
|
|
}
|
|
async function copyFromUrl(url) {
|
|
const res = await fetch(url);
|
|
const text = await res.text();
|
|
await navigator.clipboard.writeText(text);
|
|
showToast();
|
|
}
|
|
</script>
|
|
</body>
|
|
</html>
|