Dani
d87e9322b5
Fixed the issue with PlainText (Complete Anon) posting Need to fix device sign on issues. Need to make it so that the non-signed in devices can only see their equalivant level of posts. (i.e. plaintext, public-encrypted, private-encrypted)
172 lines
5.8 KiB
HTML
172 lines
5.8 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8"/>
|
|
<title>GreenCoast — Client</title>
|
|
<meta name="viewport" content="width=device-width,initial-scale=1"/>
|
|
<!-- Hard-pin API host so mobiles pick the right shard -->
|
|
<meta name="gc-api-base" content="https://api-gc.fullmooncyberworks.com">
|
|
<link rel="stylesheet" href="./styles.css"/>
|
|
</head>
|
|
<body>
|
|
<header class="topbar">
|
|
<div class="brand">GreenCoast</div>
|
|
<nav class="tabs">
|
|
<a data-route href="#/">Feed</a>
|
|
<a data-route href="#/privacy">Privacy</a>
|
|
<a data-route href="#/gdpr">GDPR</a>
|
|
<a data-route href="#/terms">Terms</a>
|
|
</nav>
|
|
<div class="actions">
|
|
<button id="signIn" type="button">Sign in (device key)</button>
|
|
<button id="discordStart" type="button">Discord</button>
|
|
<button id="panic" type="button">Panic wipe</button>
|
|
</div>
|
|
</header>
|
|
|
|
<div id="capWarn" class="warn is-hidden"></div>
|
|
|
|
<div id="banner" class="banner is-hidden">
|
|
You are in <strong>anonymous (limited) mode</strong>. Only plaintext posts are available until you authorize this device.
|
|
</div>
|
|
|
|
<div class="shell">
|
|
<aside id="left" class="col">
|
|
<section class="card">
|
|
<h3>Profile</h3>
|
|
<div class="profile">
|
|
<img id="avatar" alt="avatar" width="56" height="56"/>
|
|
<div class="profile-meta">
|
|
<div><code id="fp">(pseudonymous)</code></div>
|
|
<div class="muted small">Avatar is derived locally.</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="card">
|
|
<h3>Quick links</h3>
|
|
<ul class="links">
|
|
<li><a data-route href="#/">Feed</a></li>
|
|
<li><a data-route href="#/privacy">Privacy Policy</a></li>
|
|
<li><a data-route href="#/gdpr">GDPR</a></li>
|
|
<li><a data-route href="#/terms">Terms</a></li>
|
|
</ul>
|
|
</section>
|
|
</aside>
|
|
|
|
<main id="feed" class="col">
|
|
<section class="card">
|
|
<h2>Connection</h2>
|
|
<div class="row">
|
|
<label>Shard URL</label>
|
|
<input id="shardUrl" placeholder="https://api-gc.fullmooncyberworks.com"/>
|
|
</div>
|
|
|
|
<details id="adv" class="advanced">
|
|
<summary>Advanced (security)</summary>
|
|
<div class="row">
|
|
<label>Bearer (hidden)</label>
|
|
<input id="bearer" type="password" placeholder="gc2 token" autocomplete="off"/>
|
|
</div>
|
|
<div class="row">
|
|
<label>Passphrase (for Private-Encrypted)</label>
|
|
<input id="passphrase" type="password" placeholder="••••••••" autocomplete="off"/>
|
|
</div>
|
|
<p class="muted small">
|
|
Security fields are local to your browser. We do not store PII or logs.
|
|
Third-party SSO is optional and not endorsed for security.
|
|
</p>
|
|
</details>
|
|
|
|
<button id="saveConn" type="button">Save</button>
|
|
<div id="health" class="muted"></div>
|
|
</section>
|
|
|
|
<!-- Cross-post -->
|
|
<section class="card">
|
|
<h2>Share (x-post, privacy-safe)</h2>
|
|
<div class="row">
|
|
<label>Link</label>
|
|
<input id="shareUrl" placeholder="https://www.tiktok.com/@user/video/..." />
|
|
</div>
|
|
<div class="row">
|
|
<label>Note</label>
|
|
<input id="shareNote" placeholder="Optional caption…"/>
|
|
</div>
|
|
<div class="row">
|
|
<label>Visibility</label>
|
|
<select id="shareVis">
|
|
<option value="plaintext">Plaintext</option>
|
|
<option value="members">Public-Encrypted (members)</option>
|
|
<option value="private">Private-Encrypted (passphrase)</option>
|
|
</select>
|
|
</div>
|
|
<div class="row">
|
|
<button id="sharePreview" type="button">Preview</button>
|
|
<button id="sharePublish" type="button">Publish link</button>
|
|
</div>
|
|
<div id="shareCard" class="xcard muted small"></div>
|
|
</section>
|
|
|
|
<section class="card">
|
|
<h2>Compose</h2>
|
|
<div class="row">
|
|
<label>Visibility</label>
|
|
<select id="visibility">
|
|
<option value="plaintext">Plaintext (last resort)</option>
|
|
<option value="members">Public-Encrypted (members)</option>
|
|
<option value="private">Private-Encrypted (passphrase)</option>
|
|
</select>
|
|
</div>
|
|
<div class="row">
|
|
<label>Title</label>
|
|
<input id="title" placeholder="Optional title"/>
|
|
</div>
|
|
<div class="row">
|
|
<label>Body</label>
|
|
<textarea id="body" rows="6" placeholder="Write your post..."></textarea>
|
|
</div>
|
|
<button id="publish" type="button">Publish</button>
|
|
<div id="publishStatus" class="muted status"></div>
|
|
</section>
|
|
|
|
<section class="card">
|
|
<h2>Posts (live index)</h2>
|
|
<div id="posts"></div>
|
|
</section>
|
|
</main>
|
|
|
|
<main id="page" class="col is-hidden">
|
|
<section class="card">
|
|
<div id="pageContent">Loading…</div>
|
|
</section>
|
|
</main>
|
|
|
|
<aside id="right" class="col">
|
|
<section class="card">
|
|
<h3>About</h3>
|
|
<p class="muted small">Welcome to GreenCoast, a privacy-focused social media site. Zero-trust, E2EE optional, no analytics, no PII.</p>
|
|
</section>
|
|
<section class="card">
|
|
<h3>Legal</h3>
|
|
<ul class="links">
|
|
<li><a data-route href="#/privacy">Privacy</a></li>
|
|
<li><a data-route href="#/gdpr">GDPR</a></li>
|
|
<li><a data-route href="#/terms">Terms</a></li>
|
|
</ul>
|
|
</section>
|
|
</aside>
|
|
</div>
|
|
|
|
<footer class="footer">
|
|
<a data-route href="#/privacy">Privacy</a> ·
|
|
<a data-route href="#/gdpr">GDPR</a> ·
|
|
<a data-route href="#/terms">Terms</a>
|
|
</footer>
|
|
|
|
<div id="flash" class="flash"></div>
|
|
|
|
<script type="module" src="./app.js"></script>
|
|
</body>
|
|
</html>
|