Ajoute La Corne d'Abondance, jeu de fusion façon Watermelon Game
Build and deploy / deploy (push) Successful in 35s

Nouveau mini-jeu à /corne : des avatars de Citoyens tombent dans un bac
(physique matter-js), deux avatars de même taille qui se touchent
fusionnent en un plus gros, jusqu'au débordement soutenu (5s de grâce,
pièces clignotantes pour prévenir) qui met fin à la partie. Même
mécanique de gloires que Le Vol d'Icare (record personnel, classement,
gel + attribution automatique au Tribunal via pg_cron).

Un palier de taille par Citoyen (pas les Archontes) plutôt qu'un nombre
arbitraire : citizens[tier] donne l'association palier → Citoyen, fixe
pour tout le monde (les Citoyens sont triés par pseudo côté serveur, un
ordre déterministe). Rendu en DOM pour réutiliser le composant Avatar
existant (étendu pour accepter une taille en pixels arbitraire) plutôt
que de redessiner des images sur canvas — position et rotation de chaque
pièce appliquées en impératif depuis la boucle physique, jamais via
setState.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
Valentin ROBIN
2026-08-24 00:52:07 +02:00
parent c3a3577769
commit 3b64e1cdb5
13 changed files with 955 additions and 4 deletions
+35
View File
@@ -165,6 +165,41 @@ body {
animation: reveal-pop 700ms cubic-bezier(0.2, 0.7, 0.3, 1) both;
}
/* Simple fondu, sans mise à l'échelle — contrairement à reveal-pop,
utilisé sur des pièces de La Corne d'Abondance dont la taille exacte
doit être lisible dès la première frame (reveal-pop passe par 82% puis
104% avant de se stabiliser à 100%, ce qui faisait paraître une pièce
tout juste lâchée d'une taille différente de celle annoncée). */
@keyframes fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
.animate-fade-in {
animation: fade-in 200ms ease-out both;
}
/* Avertissement de débordement (La Corne d'Abondance) : clignote sur les
pièces qui dépassent la ligne de danger pendant le délai de grâce
avant game over, pour signaler que le compte à rebours est en cours. */
@keyframes danger-blink {
0%,
100% {
opacity: 1;
}
50% {
opacity: 0.25;
}
}
.animate-danger-blink {
animation: danger-blink 500ms ease-in-out infinite;
}
/* Confettis de fin de partie (Le Vol d'Icare) : chute + rotation + fondu,
dérive latérale et vitesse propres à chaque confetti via variables CSS. */
@keyframes confetti-fall {