tobias
d6f7993504
Der Scanner liest den QR jetzt auch aus einer gespeicherten Bilddatei - in der Testumgebung ohne Kamera der einzige Weg, auf dem Telefon der kuerzere (der Token entsteht am Rechner, das Bildschirmfoto liegt ohnehin auf dem Geraet). Gleicher Leser, gleiche Deutung, nur eine andere Quelle; ohne Kamera entfaellt das schwarze Quadrat. Dabei ein echter Fehler in der ersten Fassung, gefunden an der Musterseite: img.decode() loest bei einem GIF in Chromium nie auf - das Blatt haette ohne Meldung ewig gewartet. Jetzt createImageBitmap, als Rueckfall bewusst das load-Ereignis statt decode(). Debug-Mode ist nur noch ein stiller Textknopf am Seitenende, ohne Kachel und ohne Erlaeuterung; der Zugang zu Home Assistant steht als Akkordeon in der Kachel "Zugaenge" darin. Beides auf Vorgabe des Eigentuemers. Die Musterseite kann jetzt auch die Ersteinrichtung (?seite=einrichtung) - damit ist der ganze Weg ohne echten Token nachgewiesen: selbst erzeugter QR mit Token-Text landet zeichengleich im Feld, einer mit http-Adresse im Adressfeld, ein Bild ohne Code meldet das sauber. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
78 lines
2.9 KiB
TypeScript
78 lines
2.9 KiB
TypeScript
/**
|
|
* Musterseite: die Oberflaeche der App mit Beispieldaten, ohne Server.
|
|
*
|
|
* WOFUER
|
|
* ------
|
|
* Die App braucht sonst einen gespeicherten Zugang, um ueberhaupt etwas
|
|
* anzuzeigen - und damit war jede OPTISCHE Pruefung an ein Zugangstoken
|
|
* gebunden. Genau daran ist in diesem Projekt wiederholt die Verifikation
|
|
* haengengeblieben, obwohl fast jeder gefundene Fehler (CSS-Spezifitaet,
|
|
* Flex-Basis in Spalten, unsichtbare Rahmen) nur am gerenderten Bild
|
|
* sichtbar war und von tsc und den Tests nicht gefunden werden konnte.
|
|
*
|
|
* Diese Seite mountet dieselben Bildschirme mit demselben Stylesheet, aber
|
|
* mit `beispielApi()` aus den Tests. Kein Netz, kein Token, keine echten
|
|
* Daten - und trotzdem echtes CSS.
|
|
*
|
|
* NICHT TEIL DER APP
|
|
* ------------------
|
|
* Gebaut wird sie ueber `vite.muster.config.ts` nach `dist-muster/`. Der
|
|
* normale `npm run build` fasst sie nicht an, sie liegt also auch nicht in
|
|
* der .ipa.
|
|
*
|
|
* Aufruf: `?seite=einst` (Vorgabe), jeder Name aus navigation.ts TITEL.
|
|
* Dazu `?seite=einrichtung` fuer den Willkommensbildschirm - der ist keine
|
|
* Route (er steht VOR der Anmeldung) und braucht deshalb einen eigenen Zweig.
|
|
*/
|
|
|
|
import { StrictMode, useState } from "react"
|
|
import { createRoot } from "react-dom/client"
|
|
|
|
import "@audi-dash/ui/styles.css"
|
|
import "../src/stile/grundlage.css"
|
|
import "../src/stile/audi-schrift.css"
|
|
import "../src/stile/rahmen.css"
|
|
import "../src/stile/screens.css"
|
|
|
|
import { DatenAnbieter } from "../src/daten/DatenKontext"
|
|
import { Shell } from "../src/Shell"
|
|
import type { SeitenName } from "../src/navigation"
|
|
import { TITEL } from "../src/navigation"
|
|
import { Einrichtung } from "../src/screens/Einrichtung"
|
|
import { SeiteFuer } from "../src/screens/register"
|
|
import { beispielApi } from "../src/tests/beispieldaten"
|
|
|
|
function Muster() {
|
|
const gewaehlt = new URLSearchParams(location.search).get("seite") || "einst"
|
|
const start = gewaehlt as SeitenName
|
|
const [route, setzeRoute] = useState<{ name: SeitenName; id?: string }>({ name: start })
|
|
const geheZu = (name: SeitenName, id?: string) =>
|
|
setzeRoute(id === undefined ? { name } : { name, id })
|
|
// Der Willkommensbildschirm haengt an keinem Zugang und an keiner Route.
|
|
if (gewaehlt === "einrichtung") return <Einrichtung fertig={() => {}} />
|
|
return (
|
|
<DatenAnbieter api={beispielApi()}>
|
|
<Shell route={route} geheZu={geheZu} tabBeschriftung>
|
|
<SeiteFuer
|
|
route={route}
|
|
geheZu={geheZu}
|
|
tabBeschriftung
|
|
setzeTabBeschriftung={() => {}}
|
|
beiAbmeldung={() => {}}
|
|
/>
|
|
</Shell>
|
|
</DatenAnbieter>
|
|
)
|
|
}
|
|
|
|
// Zum schnellen Springen zwischen den Seiten, ohne die Adresse zu tippen.
|
|
;(window as unknown as { SEITEN: string[] }).SEITEN = Object.keys(TITEL)
|
|
|
|
const wurzel = document.getElementById("wurzel")
|
|
if (!wurzel) throw new Error("Wurzelelement #wurzel fehlt")
|
|
createRoot(wurzel).render(
|
|
<StrictMode>
|
|
<Muster />
|
|
</StrictMode>,
|
|
)
|