Filipe: "ich will dass man auf die nachrichten auch reagieren kann mit einem emoji, die nachricht selbst ohne zu antworten." Neben "antworten" steht jetzt "reagieren". Ein Klick klappt sechs Zeichen auf, ein zweiter Klick setzt es -- und unter der Nachricht steht, wer mit was reagiert hat. EINE FESTE AUSWAHL, KEIN FREIES FELD (👍 ❤️ 😂 😮 🔥 🙏). Drei Gruende, der erste ist der wichtigste: Eine feste Liste laesst sich pruefen -- was dort nicht drinsteht, kommt nicht in die Datenbank, kein beliebiger Text, keine 4-KB-Zeichenketten. Zweitens sehen alle dasselbe. Drittens kann man sechs Zeichen ueberfliegen; eine volle Tafel ist eine Suchaufgabe, und dann tippt man doch wieder "ok". DIE LISTE STEHT AUF DEM SERVER und wird an die Oberflaeche geliefert. Stuende sie im Browser, gaebe es sie zweimal -- und die zweite Fassung waere die, in der ein Zeichen fehlt, das der Server noch annimmt. Faellt der Abruf aus, erscheint KEINE Auswahl statt einer mit erfundenen Zeichen. DER PRIMAERSCHLUESSEL BEANTWORTET "WIE OFT?": (nachricht, person, zeichen). Eine Person darf verschiedene Zeichen geben, jedes aber nur einmal -- und zwar durchgesetzt von der Datenbank, nicht von einer Abfrage davor, die man vergessen kann. Derselbe Klick noch einmal nimmt es zurueck; das erspart einen zweiten Weg, den man auch absichern muesste. KEIN ZAEHLER IN chat_nachrichten. Eine mitgefuehrte Zahl muesste bei jedem Hin und Her stimmen und ist genau die Art Angabe, die irgendwann nicht mehr stimmt und die niemand nachrechnet. Gezaehlt wird beim Lesen -- in EINER Abfrage fuer alle 200 Nachrichten, nicht je Zeile eine. WER ES WAR, STEHT IM TITEL. "Drei Daumen" sagt weniger als "Ayla, Ben und Cem", und es sind Leute aus demselben Raum. KEINE BENACHRICHTIGUNG AUFS HANDY. Wer im Raum ist, sieht es sofort; wer nicht, bekommt nichts. Ein Daumen ist keine Nachricht -- wer dafuer geweckt wird, schaltet Meldungen ab. Was NICHT geht: wer nicht im Raum ist (404), ein erfundenes Zeichen (400), eine zurueckgenommene Nachricht (409). Und mit der Nachricht verschwinden die Reaktionen (CASCADE). pruef-chat-aufloesen 59 -> 85. Gemessen wird der BESTAND, nicht die Antwort -- und im Browser der KNOPF, nicht nur das Recht: dass die Auswahl aufklappt, sich nach dem Klick von selbst schliesst, die Reaktion darunter erscheint, als die eigene erkennbar ist und ein Klick darauf sie wieder wegnimmt. EINE EIGENE PRUEFUNG WAR ZU SCHWACH: "bei Cem ist ueberall selbst=true" war trivial wahr, weil es nur EINE Sorte gab. Jetzt bekommt eine andere Person ein drittes Zeichen, und in derselben Antwort muss eines auf true und eines auf false stehen. Eine Angabe, die nie `false` sein kann, sagt nichts. Im CSS keine vierte Abschrift: "reagieren" haengt an derselben Regel wie "antworten" -- neben anheften und kopieren waere es die vierte fast gleiche gewesen. Co-Authored-By: Claude Opus 5 <[email protected]>
103 lines
4.0 KiB
HTML
103 lines
4.0 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" />
|
||
<title>Entwicklung · Spicy & Dogi</title>
|
||
<meta name="robots" content="noindex, nofollow" />
|
||
<link rel="manifest" href="/workspace/app.webmanifest" />
|
||
<meta name="theme-color" content="#06090f" />
|
||
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609141346" />
|
||
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609141346" />
|
||
<link rel="stylesheet" href="assets/css/gate.css?v=202609141346" />
|
||
<link rel="stylesheet" href="assets/css/start.css?v=202609141346" />
|
||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609141346" />
|
||
<link rel="stylesheet" href="assets/css/entwicklung.css?v=202609141346" />
|
||
<link rel="stylesheet" href="assets/css/module.css?v=202609141346" />
|
||
<link rel="stylesheet" href="assets/css/haus.css?v=202609141346" />
|
||
</head>
|
||
|
||
<body class="start">
|
||
|
||
<div class="schleier" aria-hidden="true"></div>
|
||
|
||
<header class="kopfleiste">
|
||
<button type="button" class="zurueck-knopf" id="zurueck" hidden>
|
||
<svg class="zurueck-knopf__pfeil" viewBox="0 0 24 24" aria-hidden="true">
|
||
<path d="M14.5 5.5 8 12l6.5 6.5" />
|
||
</svg>
|
||
<span class="zurueck-knopf__text">Zurück</span>
|
||
</button>
|
||
<p class="marke"><span class="marke__text"><a class="zurueck" href="start.html">Team Dogi</a> · Entwicklung</span></p>
|
||
<div class="kopfleiste__rechts">
|
||
<span class="wer" id="wer">…</span>
|
||
<button type="button" class="abmelden" id="abmelden">Abmelden</button>
|
||
</div>
|
||
</header>
|
||
|
||
<main class="inhalt inhalt--breit">
|
||
|
||
<section class="kopf-zeile">
|
||
<div>
|
||
<p class="marke" id="ober">Entwicklung & Nachwuchs</p>
|
||
<h1 class="titel" id="titel">Entwicklung</h1>
|
||
<p class="unterzeile" id="unterzeile">
|
||
Anklicken statt tippen. Keine Noten, keine Punktzahl – ein Gesprächsanlass.
|
||
</p>
|
||
</div>
|
||
</section>
|
||
|
||
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
|
||
|
||
<!-- ==================================================================
|
||
DIE REIHENFOLGE AUF DIESER SEITE IST DAS EIGENTLICHE DESIGN
|
||
|
||
1. Die Ampel — sie betrifft Menschen, nicht Prozesse.
|
||
2. Die Personen — wen gehe ich heute durch.
|
||
3. Die Karte — und darin die ABWEICHUNGEN zuerst.
|
||
4. Ganz unten: die eigenen sechs Fragen.
|
||
|
||
Wer die Seite öffnet, soll die wichtigste Sache zuerst sehen, und
|
||
das ist nicht die Liste. Eine Ampel unter 34 Beobachtungen hätte
|
||
niemand je gelesen.
|
||
============================================================== -->
|
||
|
||
<section id="ampel" class="e-ampel" hidden></section>
|
||
|
||
<section id="personen-block" hidden>
|
||
<h2 class="e-abschnitt">Wen gehst du durch?</h2>
|
||
<div id="personen" class="e-personen" aria-busy="true"></div>
|
||
</section>
|
||
|
||
<section id="karte" class="e-karte" hidden></section>
|
||
|
||
<!-- DEINE EIGENE KARTE.
|
||
|
||
Sie steht ÜBER den sechs Fragen und UNTER der Liste der anderen:
|
||
Wer diese Seite als DogFather öffnet, kommt zuerst zu seiner
|
||
Arbeit; wer sie als Modi öffnet, sieht die Liste gar nicht und
|
||
landet direkt hier.
|
||
|
||
Sie erscheint erst, wenn alle gesetzt haben — eine halbe Karte
|
||
ist schlimmer als keine. -->
|
||
<section id="karte-block" class="e-meine" hidden>
|
||
<h2 class="e-abschnitt">Deine Karte</h2>
|
||
<p class="e-meine__satz" id="karte-satz">…</p>
|
||
<div id="meine-karte" aria-busy="true"></div>
|
||
</section>
|
||
|
||
<section id="meins-block" class="e-meins" hidden>
|
||
<h2 class="e-abschnitt" id="meins-titel">Wie geht es dir damit?</h2>
|
||
<p class="e-meins__satz" id="meins-satz">…</p>
|
||
<div id="meins" aria-busy="true"></div>
|
||
</section>
|
||
|
||
</main>
|
||
|
||
<script src="assets/js/wahl.js?v=202609141346" defer></script>
|
||
<script src="assets/js/bereiche.js?v=202609141346" defer></script>
|
||
<script src="assets/js/kopf.js?v=202609141346" defer></script>
|
||
<script src="assets/js/entwicklung.js?v=202609141346" defer></script>
|
||
</body>
|
||
</html>
|