[ADD] interface: colour tokens, two themes, checked palette, marks
The plan's colours carry meaning — a conflict, a reservation, a mode — so
they must stay readable for every reader and in both themes. jetons.css
defines the tokens for the light and dark themes, set by data-theme on the
root; palette.js reads them from the stylesheet text and checks, by
computation, contrast to WCAG and separation under the three
dichromacies, keeping the conflict hue reserved. The theme follows the
system at each start and the operator's choice lasts the session.
Checked: 1709 node and 43 browser tests.
--- FR ---
[ADD] interface : jetons de couleur, deux thèmes, palette, marques
Les couleurs du plan portent un sens — un conflit, une réservation, un mode
— et doivent rester lisibles pour tout lecteur et dans les deux thèmes.
jetons.css définit les jetons des thèmes clair et sombre, posés par
data-theme sur la racine ; palette.js les lit dans le texte de la feuille
et contrôle, par calcul, le contraste au sens des WCAG et la séparation
sous les trois dichromaties, la teinte du conflit restant réservée. Le
thème suit le système à chaque démarrage ; le choix de l'opérateur vaut
pour la séance.
Vérifié : 1709 node et 43 navigateur.
Assisted-by: Claude Opus 5.5
2026-10-07 02:33:12 -04:00
|
|
|
|
// © 2026 TechnoLibre (http://www.technolibre.ca)
|
|
|
|
|
|
// License AGPL-3.0 or later (https://www.gnu.org/licenses/agpl)
|
|
|
|
|
|
|
|
|
|
|
|
// Registre des marques porteuses d'information et des textes (§ 14.5,
|
|
|
|
|
|
// § 7.5, § 7.6, § 7.7). Chaque entrée nomme le jeton qui la peint et chaque
|
|
|
|
|
|
// jeton sur lequel elle se peint ; verifierPalette (palette.js) mesure le
|
|
|
|
|
|
// seuil de chaque couple dans les deux thèmes, sous les trois dichromaties,
|
|
|
|
|
|
// et les épreuves de rendu atteignent la marque par data-marque, qui porte
|
|
|
|
|
|
// son nom.
|
|
|
|
|
|
//
|
|
|
|
|
|
// Les remplissages d'une chaise sont son fond, son remplissage plein et les
|
|
|
|
|
|
// deux couleurs de la hachure — des traits --couleur-hachure sur le fond de
|
|
|
|
|
|
// la chaise : une marque posée sur une chaise se mesure sur chacun.
|
|
|
|
|
|
|
|
|
|
|
|
const c = (nom) => `--couleur-${nom}`;
|
|
|
|
|
|
|
|
|
|
|
|
const REMPLISSAGES_CHAISE = ['chaise-fond', 'chaise-pleine', 'hachure'];
|
|
|
|
|
|
|
|
|
|
|
|
function entree(nom, jeton, fonds, seuil) {
|
|
|
|
|
|
return Object.freeze({ nom, jeton: c(jeton), fonds: Object.freeze(fonds.map(c)), seuil });
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
const marque = (nom, jeton, fonds) => entree(nom, jeton, fonds, 3);
|
|
|
|
|
|
const texte = (nom, jeton, fonds) => entree(nom, jeton, fonds, 4.5);
|
|
|
|
|
|
|
[ADD] plan: one hue and pattern per conflict rule, legend, appartenance
The plan drew every conflict in one hue, so a table that seats colleagues
together looked like one where people meet again. Each active rule now has
its own reserved hue and pattern: same appartenance hatched one way, met
again hatched the other, back at a table dotted; rules on one table
overlap, the badge keeps the total. A legend from the view bar shows each
active rule's sample. A table's tooltip names the appartenance that brings
a pair together. The hues are validated by computation in both themes and
the spec (7.5, 12.7) follows. Checked: 2848 node, 580 browser tests.
--- FR ---
[ADD] plan : une teinte et une trame par règle, légende, appartenance
Le plan dessinait tout conflit d'une seule teinte : une table qui réunit
des collègues ressemblait à une table où des gens se revoient. Chaque
règle active a sa teinte réservée et sa trame : même appartenance hachurée
dans un sens, voisins revus dans l'autre, table revue en pointillé ; les
règles d'une table se superposent, la pastille garde le total. Une légende
dans la barre de vue montre l'échantillon de chaque règle active.
L'infobulle nomme l'appartenance qui réunit une paire. Teintes validées
par calcul dans les deux thèmes ; spec § 7.5, § 12.7. Vérifié : 2848, 580.
Assisted-by: Claude Opus 5.5
2026-10-08 04:33:43 -04:00
|
|
|
|
// Les sortes de conflit : règle, marque de la trame, jeton court, forme.
|
|
|
|
|
|
const SORTES_CONFLIT = [
|
|
|
|
|
|
['separerAppartenances', 'trameAppartenance', 'conflit-appartenance', 'hachuresDescendantes'],
|
|
|
|
|
|
['nouveauxVoisins', 'trameVoisins', 'conflit-voisins', 'hachuresMontantes'],
|
|
|
|
|
|
['nouvelleTable', 'trameTable', 'conflit-table', 'points'],
|
|
|
|
|
|
];
|
|
|
|
|
|
|
|
|
|
|
|
/** Les trois sortes de conflit qu'une table porte (§ 7.5, § 12.7), une par
|
|
|
|
|
|
* règle que le moteur localise (conflitsParTable), dans son ordre — l'ordre
|
|
|
|
|
|
* du dessin, de la légende et de l'infobulle : { regle, marque, jeton,
|
|
|
|
|
|
* forme } — la règle du moteur, la marque data-marque de sa trame, le jeton
|
|
|
|
|
|
* de sa teinte, réservée à cette trame, et la forme de son motif
|
|
|
|
|
|
* (Motifs.svelte), qui la distingue sans la couleur. Deux règles violées à
|
|
|
|
|
|
* une même table superposent leurs trames : les hachures descendantes et
|
|
|
|
|
|
* montantes se croisent en quadrillage, les points se posent par-dessus. */
|
|
|
|
|
|
export const CONFLITS = Object.freeze(
|
|
|
|
|
|
SORTES_CONFLIT.map(([regle, trame, jeton, forme]) => Object.freeze({ regle, marque: trame, jeton: c(jeton), forme })),
|
|
|
|
|
|
);
|
|
|
|
|
|
|
|
|
|
|
|
/** Les jetons des teintes de conflit, dans l'ordre de CONFLITS. */
|
|
|
|
|
|
export const JETONS_CONFLIT = Object.freeze(CONFLITS.map(({ jeton }) => jeton));
|
|
|
|
|
|
|
|
|
|
|
|
/** Écarts perçus minimaux d'une teinte de conflit, en distance OKLab × 100
|
|
|
|
|
|
* mesurée en couleurs d'origine et sous chaque dichromatie (ecartPercu,
|
|
|
|
|
|
* palette.js) : entreConflits, d'une teinte de conflit à une autre — la
|
|
|
|
|
|
* couleur redit la forme de la règle ; autresMarques, d'une teinte de
|
|
|
|
|
|
* conflit à chaque autre marque du plan. Le second seuil est plus bas : les
|
|
|
|
|
|
* gris du mobilier occupent la clarté où une teinte de conflit tient 3:1
|
|
|
|
|
|
* sur le plateau sombre, et la forme distingue toujours la trame de ce
|
[FIX] interface: ghost labels, keyboard, valid HTML, closed data-* list
The drag ghost names what releasing at the point changes, floor included.
Escape on a seat returns to its table, a refused Tab stays put, the legend
toggle exposes aria-expanded, and the header markup is valid HTML. Every
data-* attribute the interface sets belongs to one closed list that a guard
reads. The tree guards follow helpers a test imports, and the reporter says
the whole series stays watched under coverage on a small machine.
Checked: every new test red first; 3001 node, 635 browser and 63 long tests
green from the index alone.
--- FR ---
[FIX] interface : fantôme nommé, clavier, HTML valide, data-* fermés
Le fantôme du glisser nomme ce que relâcher au point modifie, sol compris.
Échap sur un siège remonte à sa table, un Tab refusé reste en place, la
bascule de la légende expose aria-expanded, et la tête est du HTML valide.
Chaque attribut data-* que l'interface pose appartient à une liste fermée
qu'une garde lit. Les gardes de l'arbre suivent les aides qu'une épreuve
importe, et le rapporteur dit la série entière surveillée sous couverture.
Vérifié : chaque épreuve rouge d'abord ; 3001 node, 635 navigateur et 63
longues vertes depuis l'index seul.
Assisted-by: Claude Opus 5.5
2026-10-09 04:01:57 -04:00
|
|
|
|
* qu'elle côtoie. Sa valeur, 5, ne vient d'aucune référence de perception :
|
|
|
|
|
|
* elle se pose juste sous la plus petite séparation que la palette tient
|
|
|
|
|
|
* entre une teinte de conflit et une autre marque, et garde la palette de
|
|
|
|
|
|
* reculer sans établir qu'un écart de 5 se perçoit. */
|
[ADD] plan: one hue and pattern per conflict rule, legend, appartenance
The plan drew every conflict in one hue, so a table that seats colleagues
together looked like one where people meet again. Each active rule now has
its own reserved hue and pattern: same appartenance hatched one way, met
again hatched the other, back at a table dotted; rules on one table
overlap, the badge keeps the total. A legend from the view bar shows each
active rule's sample. A table's tooltip names the appartenance that brings
a pair together. The hues are validated by computation in both themes and
the spec (7.5, 12.7) follows. Checked: 2848 node, 580 browser tests.
--- FR ---
[ADD] plan : une teinte et une trame par règle, légende, appartenance
Le plan dessinait tout conflit d'une seule teinte : une table qui réunit
des collègues ressemblait à une table où des gens se revoient. Chaque
règle active a sa teinte réservée et sa trame : même appartenance hachurée
dans un sens, voisins revus dans l'autre, table revue en pointillé ; les
règles d'une table se superposent, la pastille garde le total. Une légende
dans la barre de vue montre l'échantillon de chaque règle active.
L'infobulle nomme l'appartenance qui réunit une paire. Teintes validées
par calcul dans les deux thèmes ; spec § 7.5, § 12.7. Vérifié : 2848, 580.
Assisted-by: Claude Opus 5.5
2026-10-08 04:33:43 -04:00
|
|
|
|
export const SEPARATIONS = Object.freeze({ entreConflits: 12, autresMarques: 5 });
|
|
|
|
|
|
|
[ADD] interface: colour tokens, two themes, checked palette, marks
The plan's colours carry meaning — a conflict, a reservation, a mode — so
they must stay readable for every reader and in both themes. jetons.css
defines the tokens for the light and dark themes, set by data-theme on the
root; palette.js reads them from the stylesheet text and checks, by
computation, contrast to WCAG and separation under the three
dichromacies, keeping the conflict hue reserved. The theme follows the
system at each start and the operator's choice lasts the session.
Checked: 1709 node and 43 browser tests.
--- FR ---
[ADD] interface : jetons de couleur, deux thèmes, palette, marques
Les couleurs du plan portent un sens — un conflit, une réservation, un mode
— et doivent rester lisibles pour tout lecteur et dans les deux thèmes.
jetons.css définit les jetons des thèmes clair et sombre, posés par
data-theme sur la racine ; palette.js les lit dans le texte de la feuille
et contrôle, par calcul, le contraste au sens des WCAG et la séparation
sous les trois dichromaties, la teinte du conflit restant réservée. Le
thème suit le système à chaque démarrage ; le choix de l'opérateur vaut
pour la séance.
Vérifié : 1709 node et 43 navigateur.
Assisted-by: Claude Opus 5.5
2026-10-07 02:33:12 -04:00
|
|
|
|
/** Les marques porteuses d'information (§ 14.5) : { nom, jeton, fonds, seuil: 3 } — nom, la
|
|
|
|
|
|
* désignation data-marque ; jeton, celui qui la peint ; fonds, chaque jeton sur lequel elle
|
|
|
|
|
|
* se peint, chaque remplissage d'une chaise pour une marque qui passe sur une chaise. */
|
|
|
|
|
|
export const MARQUES = Object.freeze([
|
|
|
|
|
|
// Sur la chaise (§ 7.6) : cadenas posés sur ses remplissages ; l'anneau
|
|
|
|
|
|
// l'entoure, sur le sol et le bord du plateau qu'elle touche.
|
|
|
|
|
|
marque('cadenasFerme', 'marque', REMPLISSAGES_CHAISE),
|
|
|
|
|
|
marque('cadenasOuvert', 'marque', REMPLISSAGES_CHAISE),
|
|
|
|
|
|
marque('anneau', 'marque', ['sol', 'table-fond', ...REMPLISSAGES_CHAISE]),
|
|
|
|
|
|
marque('hachure', 'hachure', ['chaise-fond']),
|
|
|
|
|
|
marque('remplissagePlein', 'chaise-pleine', ['sol', 'table-fond']),
|
[ADD] plan: one hue and pattern per conflict rule, legend, appartenance
The plan drew every conflict in one hue, so a table that seats colleagues
together looked like one where people meet again. Each active rule now has
its own reserved hue and pattern: same appartenance hatched one way, met
again hatched the other, back at a table dotted; rules on one table
overlap, the badge keeps the total. A legend from the view bar shows each
active rule's sample. A table's tooltip names the appartenance that brings
a pair together. The hues are validated by computation in both themes and
the spec (7.5, 12.7) follows. Checked: 2848 node, 580 browser tests.
--- FR ---
[ADD] plan : une teinte et une trame par règle, légende, appartenance
Le plan dessinait tout conflit d'une seule teinte : une table qui réunit
des collègues ressemblait à une table où des gens se revoient. Chaque
règle active a sa teinte réservée et sa trame : même appartenance hachurée
dans un sens, voisins revus dans l'autre, table revue en pointillé ; les
règles d'une table se superposent, la pastille garde le total. Une légende
dans la barre de vue montre l'échantillon de chaque règle active.
L'infobulle nomme l'appartenance qui réunit une paire. Teintes validées
par calcul dans les deux thèmes ; spec § 7.5, § 12.7. Vérifié : 2848, 580.
Assisted-by: Claude Opus 5.5
2026-10-08 04:33:43 -04:00
|
|
|
|
// Le conflit (§ 7.5) : contour épaissi sur le sol, commun aux trois
|
|
|
|
|
|
// règles et peint de l'encre forte du plan ; une trame par règle violée
|
|
|
|
|
|
// sur le plateau, chacune de sa teinte, ses traits détachés par un halo
|
|
|
|
|
|
// du fond du plateau ; pastille chiffrée près de la table.
|
|
|
|
|
|
marque('contourConflit', 'contour-fort', ['sol', 'table-fond']),
|
|
|
|
|
|
...SORTES_CONFLIT.map(([, trame, jeton]) => marque(trame, jeton, ['table-fond'])),
|
[ADD] interface: colour tokens, two themes, checked palette, marks
The plan's colours carry meaning — a conflict, a reservation, a mode — so
they must stay readable for every reader and in both themes. jetons.css
defines the tokens for the light and dark themes, set by data-theme on the
root; palette.js reads them from the stylesheet text and checks, by
computation, contrast to WCAG and separation under the three
dichromacies, keeping the conflict hue reserved. The theme follows the
system at each start and the operator's choice lasts the session.
Checked: 1709 node and 43 browser tests.
--- FR ---
[ADD] interface : jetons de couleur, deux thèmes, palette, marques
Les couleurs du plan portent un sens — un conflit, une réservation, un mode
— et doivent rester lisibles pour tout lecteur et dans les deux thèmes.
jetons.css définit les jetons des thèmes clair et sombre, posés par
data-theme sur la racine ; palette.js les lit dans le texte de la feuille
et contrôle, par calcul, le contraste au sens des WCAG et la séparation
sous les trois dichromaties, la teinte du conflit restant réservée. Le
thème suit le système à chaque démarrage ; le choix de l'opérateur vaut
pour la séance.
Vérifié : 1709 node et 43 navigateur.
Assisted-by: Claude Opus 5.5
2026-10-07 02:33:12 -04:00
|
|
|
|
marque('pastille', 'pastille-fond', ['sol', 'table-fond']),
|
|
|
|
|
|
marque('poignee', 'poignee', ['sol']),
|
|
|
|
|
|
marque('gel', 'gel', ['sol', 'table-fond']),
|
|
|
|
|
|
// La désignation se pose sur la page, le sol, le plateau et une chaise
|
|
|
|
|
|
// vide, pourvue ou à pourvoir : chacun de ses remplissages est un fond.
|
|
|
|
|
|
marque('miseEnEvidence', 'mise-en-evidence', ['page-fond', 'sol', 'table-fond', ...REMPLISSAGES_CHAISE]),
|
|
|
|
|
|
marque('selection', 'selection', ['page-fond', 'sol', 'table-fond', ...REMPLISSAGES_CHAISE]),
|
|
|
|
|
|
// Le cadre de mode (§ 8.4) entoure le contenu de l'événement, sur la page.
|
|
|
|
|
|
marque('cadreLecture', 'cadre-lecture', ['page-fond']),
|
|
|
|
|
|
marque('cadreEcriture', 'cadre-ecriture', ['page-fond']),
|
|
|
|
|
|
marque('cadreBloque', 'cadre-bloque', ['page-fond']),
|
|
|
|
|
|
marque('focus', 'focus', ['page-fond', 'bandeau-fond', 'sol', 'table-fond', ...REMPLISSAGES_CHAISE]),
|
|
|
|
|
|
// Le mobilier sur le sol : le trait de la table, celui de la chaise, qui
|
|
|
|
|
|
// touche aussi le plateau.
|
|
|
|
|
|
marque('contourTable', 'table-trait', ['sol']),
|
|
|
|
|
|
marque('contourChaise', 'chaise-trait', ['sol', 'table-fond']),
|
|
|
|
|
|
// L'échelle graphique (§ 7.7) vit dans la surface du plan, sur le sol ou la
|
|
|
|
|
|
// page ; le fantôme d'un glissement passe sur le sol, les tables et les
|
|
|
|
|
|
// chaises.
|
|
|
|
|
|
marque('echelle', 'echelle', ['sol', 'page-fond']),
|
|
|
|
|
|
marque('fantome', 'fantome', ['sol', 'table-fond', ...REMPLISSAGES_CHAISE]),
|
[IMP] home: list shown at once, computed columns loaded per event
The event list waited until every event's ranking was evaluated, about
10 ms per event with propositions, before showing anything. It now shows
as soon as the folder is read; each line's retained-plan columns and best
proposition load one event at a time, yielding to the browser between
events, behind a rotating SVG spinner, and show as each result arrives.
Work for a list no longer shown is dropped. The spinner is the one named
exception to the no-animation rule: still under reduced motion, cancelled
for captures, announced once. Checked: 2935 node, 616 browser, 62 long.
--- FR ---
[IMP] accueil : liste aussitôt montrée, colonnes calculées par événement
La liste des événements attendait l'évaluation du classement de chaque
événement, environ 10 ms par événement qui a des propositions, avant de
rien montrer. Elle paraît dès la lecture du dossier ; les colonnes du
retenu et la meilleure proposition de chaque ligne se chargent un
événement à la fois, le navigateur reprenant la main entre deux, derrière
une icône SVG qui tourne. Le travail d'une liste qui n'est plus montrée
est abandonné. L'icône est la seule exception nommée à l'interdit
d'animation. Vérifié : 2935 node, 616 navigateur, 62 longues.
Assisted-by: Claude Opus 5.5
2026-10-08 17:07:31 -04:00
|
|
|
|
// Le signe du chargement d'une valeur de la liste des événements (§ 8.1) :
|
|
|
|
|
|
// un arc tracé de l'encre secondaire, sur la page.
|
|
|
|
|
|
marque('chargement', 'page-texte-secondaire', ['page-fond']),
|
[ADD] interface: colour tokens, two themes, checked palette, marks
The plan's colours carry meaning — a conflict, a reservation, a mode — so
they must stay readable for every reader and in both themes. jetons.css
defines the tokens for the light and dark themes, set by data-theme on the
root; palette.js reads them from the stylesheet text and checks, by
computation, contrast to WCAG and separation under the three
dichromacies, keeping the conflict hue reserved. The theme follows the
system at each start and the operator's choice lasts the session.
Checked: 1709 node and 43 browser tests.
--- FR ---
[ADD] interface : jetons de couleur, deux thèmes, palette, marques
Les couleurs du plan portent un sens — un conflit, une réservation, un mode
— et doivent rester lisibles pour tout lecteur et dans les deux thèmes.
jetons.css définit les jetons des thèmes clair et sombre, posés par
data-theme sur la racine ; palette.js les lit dans le texte de la feuille
et contrôle, par calcul, le contraste au sens des WCAG et la séparation
sous les trois dichromaties, la teinte du conflit restant réservée. Le
thème suit le système à chaque démarrage ; le choix de l'opérateur vaut
pour la séance.
Vérifié : 1709 node et 43 navigateur.
Assisted-by: Claude Opus 5.5
2026-10-07 02:33:12 -04:00
|
|
|
|
]);
|
|
|
|
|
|
|
|
|
|
|
|
/** Les textes et leurs fonds, même forme, seuil 4,5 : page, secondaire, bandeau, refus,
|
|
|
|
|
|
* avis, listes du plan sur le sol, pastille. */
|
|
|
|
|
|
export const TEXTES = Object.freeze([
|
|
|
|
|
|
texte('page', 'page-texte', ['page-fond']),
|
|
|
|
|
|
texte('secondaire', 'page-texte-secondaire', ['page-fond']),
|
|
|
|
|
|
texte('bandeau', 'bandeau-texte', ['bandeau-fond']),
|
|
|
|
|
|
texte('refus', 'refus', ['page-fond']),
|
|
|
|
|
|
texte('avis', 'avis', ['page-fond']),
|
|
|
|
|
|
texte('listes', 'liste-texte', ['sol']),
|
|
|
|
|
|
texte('pastille', 'pastille-texte', ['pastille-fond']),
|
|
|
|
|
|
]);
|