Highlights nach vorn, kraeftige Chatfarben, alle Farben in einer Kachel
screen1 -- HIGHLIGHTS AUF ANSCHLAGBRETTS PLATZ
Kein Tausch, sondern ein Aufruecken: Highlights nimmt die Stelle,
alle anderen wandern eine weiter. Inhaltlich stimmt das auch --
was die Leute selbst gemacht haben, steht vor dem, was ihnen
angesagt wird.
screen2 -- DIE CHATFARBEN SIND GERECHNET, NICHT GEGRIFFEN
Gemessen, was drinstand: Buntheit 0,002 bis 0,048, im Mittel 0,028
-- auf dem Bildschirm zwoelf Grautoene. Das lag nicht an fehlendem
Mut, sondern an der Fusszeile der Blase: Sie stand auf der leisen
Hausschrift, und gegen die darf die Flaeche kaum Farbe haben.
Deshalb ZUERST die Schrift (--blase-text/--blase-leise, eigene
Farben der Blase), DANN die Flaeche. Andersherum waere es der
Fehler vom selben Vormittag gewesen, als 27 von 31 Startkacheln
unlesbar wurden.
tools/chat-kacheln-rechnen.mjs liest beide Schriftfarben aus dem
CSS und rechnet daraus die hellste Flaeche, die sie noch tragen.
Ergebnis: Buntheit 0,072 bis 0,268, alle zwoelf auf DERSELBEN
Leuchtdichte -- also exakt demselben Kontrast (7,02 bis 7,13:1).
Zwei Anlaeufe waren falsch und stehen im Werkzeug begruendet:
- hoechste Buntheit nehmen, dann Kontrast pruefen. Musste
scheitern: gesaettigtes Gelb ist bei gleicher empfundener
Helligkeit viel heller als Blau.
- gleiche OKLab-Helligkeit statt gleicher Leuchtdichte. Das
Versprechen der zwoelf lautet "ueberall gleich gut lesbar",
und Lesbarkeit haengt an der Leuchtdichte, nicht am Eindruck.
WER NICHTS EINSTELLT, BEKOMMT TROTZDEM EINE FARBE. Gemessen an der
Live-Datenbank hatten vier von fuenfzehn eine gewaehlt -- der Chat
war fuer alle anderen einfarbig. Jetzt vergibt der Server einen der
elf bunten Toene aus der Personennummer, stabil. Schrittweite 4:
elf ist prim, also laufen alle Toene durch, und vier Schritte sind
131 Grad im Farbkreis -- aufeinanderfolgende Nummern landen so weit
auseinander wie moeglich. Mit id % 11 sassen zwei Nachbarn im
selben Gespraech magenta und rot nebeneinander.
Niemand verliert seine Wahl: veilchen, ziegel und moos sind die
drei gewaehlten und behalten ihren Farbbereich.
Dazu: Blasen mit 22px runden Kanten (nur die Ecke zur Person bleibt
spitz -- sie sagt, wer spricht), Lichtsaum oben innen, weicher
Schatten. Der Name hell und fett mit Rollenpunkt davor; er stand
auf leisem Grau mit 85 Prozent Deckung und war der schwaechste Text
der Seite, ausgerechnet der, der sagt, wer spricht.
ZWEI REGELBLOECKE FUER DIESELBE BLASE ZUSAMMENGELEGT. Der untere
gewann und hat an einem Tag zweimal Schaden angerichtet: Er stellte
die runden Kanten auf 16px zurueck (die Aenderung waere wirkungslos
ausgeliefert worden), und er mischte 26 Prozent Akzentfarbe in die
eigene Blase -- die hatte damit eine Farbe, die in CHAT_KACHELN
nicht vorkommt und die die Kontrastpruefung nie angesehen hat.
screen3 -- ALLE FARBEN DES HAUSES IN EINER KACHEL
tools/kachel-regenbogen.mjs leitet die 31 benutzten Toene ab
(bereicheFuer/zusatzBereicheFuer ueber alle Rollen und beide
Haeuser) und schreibt daraus einen Streifenverlauf mit harten
Kanten -- "nicht gemischt" war die eigentliche Ansage. Ein Verlauf
ergaebe Zwischentoene, die es im Haus nicht gibt.
Gegen einen deckenden Grund gemischt, nicht gegen --flaeche: Die
ist halbdurchsichtig, und durch 31 schmale Baender schien das
Buehnenbild -- sie verloren genau das, wofuer sie da sind.
Der Lesesaum ist staerker als auf den anderen Kacheln, und zwar
gemessen: Mit deren Werten kam der Text auf 4,45:1, fuenf
Hundertstel unter der Grenze. Gefunden hat das pruef-kachelfarben,
nicht der Blick -- 4,45 gegen 4,50 sieht man nicht.
pruef-buehne -- DIE ZAHL GEHOERT IN DIE BEDINGUNG
Die Abtastung wurde nachsichtiger (fremde Flaechen zaehlen nicht
mehr als Untergrund eines Textes). Das war richtig und hat einen
Fehlalarm beseitigt, der seit Tagen kam. Eine Lockerung kann aber
zu weit gehen, deshalb muss jetzt jeder gefundene Text in genau
einem von drei Toepfen landen: gemessen, ohne freien Untergrund,
oder aussortiert. Geht die Rechnung nicht auf, ist unterwegs etwas
still verschwunden.
Erster Anlauf war "mindestens 5 Stellen" -- und wurde auf
uebersicht.html sofort rot, weil die Seite nur vier Texte hat.
Eine feste Schwelle ist eine Rechnung von gestern; diese war keine
fuenf Minuten alt.
Gemessen: pruef-kachelfarben 22/0 (war 18, neu: die Willkommenskachel
traegt wirklich alle benutzten Farben, in beide Richtungen geprueft),
pruef-buehne 192/0, pruef-chatkachel 32/0, pruef-chat-optik 45/0,
pruef-chat 48/0, pruef-erwaehnung 69/0, pruef-start-ansicht 153/0,
pruef-treff 80/0, pruef-willkommen 67/0, pruef-treffchat 110/0,
pruef-css-klassen 30/0.
Co-Authored-By: Claude Opus 5 <[email protected]>
This commit is contained in:
+114
-17
@@ -188,8 +188,8 @@ function bildWegFuer(personId) {
|
||||
Kachel gehoert einem selbst, GESEHEN wird sie von allen anderen --
|
||||
deshalb ist sie kein Platz fuer etwas, das man nicht abschalten kann.
|
||||
|
||||
Die zwoelf Toene hier sind alle gleich dunkel und gleich gesaettigt.
|
||||
Sie unterscheiden sich im Farbton und in sonst nichts. Damit ist der
|
||||
Die zwoelf Toene hier liegen alle auf DERSELBEN LEUCHTDICHTE. Sie
|
||||
unterscheiden sich im Farbton und in sonst nichts. Damit ist der
|
||||
Kontrast zur Schrift bei jedem gleich -- er muss nicht bei jedem
|
||||
einzeln geprueft werden, und niemand kann sich unlesbar machen.
|
||||
Augenschonend ist hier keine Geschmacksfrage: Ein Chat ist die
|
||||
@@ -197,21 +197,55 @@ function bildWegFuer(personId) {
|
||||
|
||||
KEINE der zwoelf ist hell. Das ist Absicht und nicht Sparsamkeit --
|
||||
die Schrift ist hell, und eine helle Kachel waere fuer die Person,
|
||||
die sie waehlt, hübsch und fuer alle anderen unlesbar.
|
||||
die sie waehlt, huebsch und fuer alle anderen unlesbar.
|
||||
|
||||
---------------------------------------------------------------------
|
||||
DIESE LISTE IST GERECHNET, NICHT GEWAEHLT (22.09.2026)
|
||||
|
||||
Filipe: „ich will dass die farben viel klarer und stärker sind ...
|
||||
die kachel von den texten von den leuten im chat soll auch klarer
|
||||
und stärker sein bitte."
|
||||
|
||||
Bis heute lagen alle zwoelf bei einer Buntheit zwischen 0,002 und
|
||||
0,048 -- auf dem Bildschirm zwoelf Grautoene mit einem Hauch Farbe.
|
||||
Das lag nicht an fehlendem Mut, sondern an der Fusszeile der Blase:
|
||||
Sie stand auf der leisen Hausschrift, und gegen die darf die Flaeche
|
||||
kaum Farbe haben.
|
||||
|
||||
Geaendert wurde deshalb ZUERST die Schrift der Blase (--blase-text /
|
||||
--blase-leise in chat.css, beide heller als die der Seite) und DANN
|
||||
die Flaeche. Andersherum waere es der Fehler vom selben Vormittag
|
||||
gewesen, als 27 von 31 Startkacheln unlesbar wurden.
|
||||
|
||||
NICHT VON HAND AENDERN. Die Werte kommen aus
|
||||
`tools/chat-kacheln-rechnen.mjs`; es liest die beiden Schriftfarben
|
||||
aus dem CSS und rechnet daraus die hellste Flaeche aus, die beide
|
||||
noch tragen (7:1 fuer den Nachrichtentext, 4,8:1 fuer die
|
||||
Fusszeile). Wer hier eine Farbe eintippt, umgeht genau die Rechnung,
|
||||
die die Lesbarkeit garantiert. Richtig ist:
|
||||
|
||||
node tools/chat-kacheln-rechnen.mjs --schreiben
|
||||
node server/pruef-chatkachel.mjs
|
||||
|
||||
DIE SCHLUESSEL LINKS STEHEN IN DER DATENBANK. Wer einen umbenennt,
|
||||
setzt die Wahl der betroffenen Person still auf „Standard" zurueck.
|
||||
Vor diesem Umbau nachgesehen: gewaehlt waren `veilchen`, `ziegel`
|
||||
und `moos` -- alle drei stehen weiter unten und haben ihren
|
||||
Farbbereich behalten.
|
||||
===================================================================== */
|
||||
export const CHAT_KACHELN = [
|
||||
{ wert: "grund", name: "Standard", farbe: "#131a25" },
|
||||
{ wert: "tinte", name: "Tinte", farbe: "#141c2e" },
|
||||
{ wert: "veilchen", name: "Veilchen", farbe: "#1d1730" },
|
||||
{ wert: "pflaume", name: "Pflaume", farbe: "#251729" },
|
||||
{ wert: "wein", name: "Wein", farbe: "#2a1620" },
|
||||
{ wert: "ziegel", name: "Ziegel", farbe: "#2a1a17" },
|
||||
{ wert: "bernstein", name: "Bernstein", farbe: "#271f14" },
|
||||
{ wert: "moos", name: "Moos", farbe: "#16251b" },
|
||||
{ wert: "tanne", name: "Tanne", farbe: "#132622" },
|
||||
{ wert: "lagune", name: "Lagune", farbe: "#122429" },
|
||||
{ wert: "stahl", name: "Stahl", farbe: "#1b2128" },
|
||||
{ wert: "schiefer", name: "Schiefer", farbe: "#20201f" },
|
||||
{ wert: "grund", name: "Neutral", farbe: "#4f545c" },
|
||||
{ wert: "tinte", name: "Tinte", farbe: "#0150af" },
|
||||
{ wert: "veilchen", name: "Veilchen", farbe: "#6a01e5" },
|
||||
{ wert: "pflaume", name: "Pflaume", farbe: "#9301a2" },
|
||||
{ wert: "kirsche", name: "Kirsche", farbe: "#a5015e" },
|
||||
{ wert: "ziegel", name: "Ziegel", farbe: "#ad0103" },
|
||||
{ wert: "bernstein", name: "Bernstein", farbe: "#7e4601" },
|
||||
{ wert: "oliv", name: "Oliv", farbe: "#635201" },
|
||||
{ wert: "moos", name: "Moos", farbe: "#405c01" },
|
||||
{ wert: "tanne", name: "Tanne", farbe: "#00603d" },
|
||||
{ wert: "lagune", name: "Lagune", farbe: "#035e5c" },
|
||||
{ wert: "ozean", name: "Ozean", farbe: "#045b74" },
|
||||
];
|
||||
|
||||
/** Nur ein Ton aus der Liste kommt durch -- sonst nichts.
|
||||
@@ -226,7 +260,63 @@ export function kachelPruefen(wert) {
|
||||
return CHAT_KACHELN.some((k) => k.wert === String(wert)) ? String(wert) : null;
|
||||
}
|
||||
|
||||
/* WER NICHTS EINSTELLT, BEKOMMT TROTZDEM EINE FARBE (22.09.2026)
|
||||
---------------------------------------------------------------------
|
||||
Filipe: „die kachel von den texten von den leuten im chat soll auch
|
||||
klarer und stärker sein ... so dass die leute richtig bekommen es zu
|
||||
benutzen."
|
||||
|
||||
Vorher hiess „nichts eingestellt" GRAU -- und eingestellt hatten es
|
||||
vier von fuenfzehn. Auf dem Bildschirm war der Chat damit einfarbig,
|
||||
egal wie gut die zwoelf Toene gerechnet sind. Eine Einstellung, die
|
||||
man erst finden muss, damit ueberhaupt etwas passiert, benutzt kaum
|
||||
jemand; das Ergebnis sehen aber alle.
|
||||
|
||||
Jetzt bekommt jede Person von sich aus einen der elf bunten Toene.
|
||||
Dieselbe Person hat immer denselben -- man erkennt sie an der Farbe,
|
||||
noch bevor man den Namen liest. Wer einen anderen will, waehlt ihn
|
||||
weiterhin; die eigene Wahl gewinnt immer.
|
||||
|
||||
WARUM AUS DER ID UND NICHT AUS DEM NAMEN: Ein Name aendert sich
|
||||
(Heirat, Schreibweise, Kuerzel), eine ID nie. Eine Farbe, die beim
|
||||
Umbenennen springt, waere schlimmer als gar keine.
|
||||
|
||||
Der neutrale Ton bleibt in der Liste -- er ist jetzt eine WAHL
|
||||
(„ich will keine Farbe"), keine Voreinstellung. */
|
||||
/* WARUM NICHT EINFACH `id % 11`.
|
||||
---------------------------------------------------------------------
|
||||
Die elf Toene stehen in der Reihenfolge ihres Farbwinkels -- Nachbarn
|
||||
in der Liste sind auch Nachbarn im Farbkreis. Mit `id % 11` bekommen
|
||||
zwei Leute, deren Nummern aufeinanderfolgen, deshalb zwei aehnliche
|
||||
Farben. Gemessen am Bildschirm: Person 13 und 14 sassen im selben
|
||||
Gespraech, eine magenta, eine rot -- auf dem Bildschirmfoto kaum zu
|
||||
trennen, und genau das, was die Farbe verhindern soll.
|
||||
|
||||
Elf ist eine Primzahl. Damit ist JEDE Schrittweite von 1 bis 10
|
||||
teilerfremd, laeuft also durch alle elf Toene, bevor sich einer
|
||||
wiederholt -- keiner geht verloren. Die 4 ist gewaehlt, weil sie den
|
||||
groessten Sprung ergibt: vier Schritte sind rund 131 Grad im
|
||||
Farbkreis, fast das Maximum von 180. Aufeinanderfolgende Nummern
|
||||
landen damit so weit auseinander wie moeglich. */
|
||||
const SPRUNG = 4;
|
||||
|
||||
export function autoKachelFuer(personId) {
|
||||
const bunte = CHAT_KACHELN.filter((k) => k.wert !== "grund");
|
||||
if (!bunte.length) return null;
|
||||
const n = Number(personId);
|
||||
if (!Number.isFinite(n) || n < 0) return null;
|
||||
return bunte[(n * SPRUNG) % bunte.length].wert;
|
||||
}
|
||||
|
||||
/** Der Ton, den diese Person TRAEGT -- eigene Wahl, sonst die
|
||||
* automatische. Fuer die Frage „was hat sie eingestellt?" gibt es
|
||||
* `gewaehlteKachelFuer`; die beiden zu verwechseln hiesse, dass im
|
||||
* Waehler ploetzlich ein Ton angehakt waere, den niemand gewaehlt hat. */
|
||||
function kachelFuer(personId) {
|
||||
return gewaehlteKachelFuer(personId) || autoKachelFuer(personId);
|
||||
}
|
||||
|
||||
function gewaehlteKachelFuer(personId) {
|
||||
try {
|
||||
return kachelPruefen(db().prepare(
|
||||
"SELECT chat_kachel FROM personen WHERE id = ?").get(personId)?.chat_kachel);
|
||||
@@ -543,7 +633,12 @@ chatRouter.get("/workspace/api/chat/kacheln", (req, res) => {
|
||||
try {
|
||||
res.json({
|
||||
kacheln: CHAT_KACHELN,
|
||||
meine: kachelFuer(req.person.id),
|
||||
/* Die eigene WAHL, nicht der getragene Ton -- sonst stuende im
|
||||
Waehler ein Haken bei einer Farbe, die niemand gewaehlt hat. */
|
||||
meine: gewaehlteKachelFuer(req.person.id),
|
||||
/* Damit der Waehler beim neutralen Eintrag zeigen kann, was
|
||||
stattdessen getragen wird, wenn man nichts waehlt. */
|
||||
automatisch: autoKachelFuer(req.person.id),
|
||||
});
|
||||
} catch (f) {
|
||||
console.error("[chat] Kacheln:", f?.message);
|
||||
@@ -1091,7 +1186,9 @@ chatRouter.get("/workspace/api/chat/raeume/:id/nachrichten", (req, res) => {
|
||||
auch die von gestern. Die Farbe an jede Zeile zu schreiben
|
||||
waere eine zweite Wahrheit -- und nach der ersten Aenderung
|
||||
haette dieselbe Person zwei Farben im selben Gespraech. */
|
||||
von_kachel: kachelPruefen(n.von_kachel),
|
||||
/* Eigene Wahl, sonst die automatische -- dieselbe Regel wie
|
||||
ueberall, damit eine Person in jeder Liste gleich aussieht. */
|
||||
von_kachel: kachelPruefen(n.von_kachel) || autoKachelFuer(n.person_id),
|
||||
text: n.weg_am ? null : n.text,
|
||||
zurueckgenommen: !!n.weg_am,
|
||||
erstellt: n.erstellt,
|
||||
|
||||
Reference in New Issue
Block a user