marcandClaude Opus 5
4e38ccdec1
Zwei Schalter, unabhaengig voneinander: Schreibtisch, Leiste, beides oder keins. Die Stadt wird einmal gesucht und mit ihren Koordinaten gespeichert, sonst suchte jede Abfrage den Ort erneut. Geholt wird serverseitig und zehn Minuten zwischengespeichert. Der Grund ist nicht Sparsamkeit: Die Leiste steht auf jeder Seite jeder App, und fragte sie selbst an, ginge bei jedem Seitenaufruf eine Anfrage samt IP an einen Fremden — und die CSP jeder App muesste ihn erlauben. Kein Ort eingestellt oder Dienst nicht erreichbar: 204, und das Symbol bleibt weg. Eine Zahl von gestern waere schlechter als keine. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
107 lines
5.3 KiB
HTML
107 lines
5.3 KiB
HTML
<!doctype html>
|
|
<html lang="de">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
|
|
<meta name="theme-color" content="#0a0705" />
|
|
<title>HoneyOS</title>
|
|
<link rel="icon" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect width='16' height='16' fill='%230a0705'/%3E%3Cpath d='M4 4h2v3h4V4h2v8h-2V9H6v3H4z' fill='%23ffb641'/%3E%3C/svg%3E" />
|
|
<link rel="stylesheet" href="./style.css" />
|
|
</head>
|
|
<body>
|
|
<!-- Bildschirm: alles liegt darin, damit Scanlines/Vignette darüber passen -->
|
|
<div class="crt" id="screen">
|
|
<!-- ── Boot ───────────────────────────────────────────────────────── -->
|
|
<div class="boot" id="boot" hidden>
|
|
<pre class="boot-log" id="bootLog" aria-live="polite"></pre>
|
|
<p class="boot-hint">[ beliebige Taste = überspringen ]</p>
|
|
</div>
|
|
|
|
<!-- ── Anmeldung ──────────────────────────────────────────────────── -->
|
|
<div class="login" id="login" hidden>
|
|
<pre class="boot-log" id="loginLog"></pre>
|
|
<div class="login-box">
|
|
<button class="login-btn" id="btnLogin">▸ <span id="loginLabel">Anmelden</span></button>
|
|
<p class="login-note" id="loginNote"></p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- ── Desktop ────────────────────────────────────────────────────── -->
|
|
<div class="desktop" id="desktop" hidden>
|
|
<!-- Menüleiste: dieselbe Anatomie wie honeybar.js in den Apps -->
|
|
<header class="menubar">
|
|
<button class="mb-logo" id="btnAbout" title="Über HoneyOS">
|
|
<span class="hex">■</span> HONEY<b>OS</b>
|
|
</button>
|
|
<nav class="mb-apps" id="mbApps" aria-label="Anwendungen"></nav>
|
|
<div class="mb-right">
|
|
<img class="mb-avatar" id="mbAvatar" alt="" hidden />
|
|
<span class="mb-user" id="mbUser"> </span>
|
|
<span class="mb-clock" id="clock">--:--</span>
|
|
<button class="mb-btn" id="btnSettings" title="Einstellungen (S)">⚙</button>
|
|
<button class="mb-btn" id="btnLogout" title="Abmelden" hidden>⏻</button>
|
|
</div>
|
|
</header>
|
|
|
|
<main class="stage" id="stage">
|
|
<!-- Statusfenster -->
|
|
<section class="win win-status">
|
|
<div class="win-bar"><span class="win-title">system</span><span class="win-dots">●●●</span></div>
|
|
<div class="win-body">
|
|
<p class="greet" id="greet">Willkommen zurück.</p>
|
|
<dl class="statlist" id="statList"></dl>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Wetter. Steht in beiden Betriebsarten zur Verfügung, wird aber
|
|
nur gezeigt, wenn ein Ort eingestellt und das Widget an ist. -->
|
|
<section class="win win-weather" id="wxTile" hidden>
|
|
<div class="win-bar"><span class="win-title">wetter</span><span class="win-dots">●●●</span></div>
|
|
<div class="win-body wx-body"></div>
|
|
</section>
|
|
|
|
<!-- App-Kacheln -->
|
|
<section class="tiles" id="tiles" aria-label="Apps starten"></section>
|
|
</main>
|
|
|
|
<!-- Desktop-Modus: Symbolfläche, Fenster, Taskleiste -->
|
|
<div class="deskspace" id="deskspace" hidden>
|
|
<div class="desk-icons" id="deskIcons"></div>
|
|
<div class="windows" id="windows"></div>
|
|
<!-- Dasselbe Wetter, im Schreibtisch-Modus als kleines Feld oben rechts -->
|
|
<div class="deskwidget" id="wxDesk" hidden></div>
|
|
</div>
|
|
|
|
<footer class="taskbar" id="taskbar" hidden>
|
|
<button class="task-start" id="btnStart">■ START</button>
|
|
<div class="task-list" id="taskList"></div>
|
|
<span class="task-date" id="taskDate"></span>
|
|
</footer>
|
|
|
|
<footer class="statusbar" id="statusbar">
|
|
<span id="hint">[1] [2] app starten · [M] modus · [S] einstellungen · [?] hilfe</span>
|
|
<span class="sb-right" id="sbRight"></span>
|
|
</footer>
|
|
</div>
|
|
|
|
<!-- ── Dialoge ────────────────────────────────────────────────────── -->
|
|
<div class="modal" id="modal" hidden>
|
|
<div class="win win-modal" role="dialog" aria-modal="true" aria-labelledby="modalTitle">
|
|
<div class="win-bar">
|
|
<span class="win-title" id="modalTitle">einstellungen</span>
|
|
<button class="win-close" id="btnClose" aria-label="Schließen">×</button>
|
|
</div>
|
|
<div class="win-body" id="modalBody"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- CRT-Effekte: rein dekorativ, liegen über allem -->
|
|
<div class="scanlines" aria-hidden="true"></div>
|
|
<div class="vignette" aria-hidden="true"></div>
|
|
<div class="flicker" aria-hidden="true"></div>
|
|
</div>
|
|
|
|
<script src="./os.js"></script>
|
|
</body>
|
|
</html>
|