Source
1size 960 600
2background #0b1030
3timeline 30 300
4
5// Quatre interrupteurs, une maison. L'interrupteur est UN symbole à états (`states` : éteint → allumé,
6// avec sa transition) et son étiquette est un réglage `text`. Chaque pièce s'éclaire en douceur (`smooth`).
7// Au clavier : Tab pour passer d'un interrupteur à l'autre, Entrée ou Espace pour basculer.
8var on = [0, 0, 0, 0]
9var nb = 0
10var fini = 0
11var tfin = -99
12
13symbol "Interrupteur" {
14 timeline 24 12
15 params {
16 text piece = "Pièce" "nom de la pièce"
17 }
18 states etat { eteint at 0 allume at 12 initial eteint transition 9 ease easeOut }
19 layer "plaque" {
20 rect -44 -60 88 120 16 fill linear(90, 0:#fbf8f1, 1:#e4dccb) stroke #c9bfa9 2
21 rect -19 -40 38 80 11 fill #d6cdb9
22 rect -19 -40 38 80 11 nofill stroke #bdb39c 1.5
23 text piece at -80,70 font "Geist, system-ui, sans-serif" size 17 bold align center line 1.2 color #f3e9d2 box 160 24
24 }
25 layer "mobile" {
26 group "Levier" at 0,36 pivot 0,0 {
27 layer "c" { rect -15 -36 30 36 9 fill linear(90, 0:#ffffff, 1:#ece5d6) stroke #b9ae96 1.5 rect -9 -30 18 4 2 fill #00000014 }
28 }
29 group "Voyant" at 0,50 pivot 0,0 {
30 layer "c" { circle 0 0 10 fill #ff6a4a00 circle 0 0 4.5 fill #ff6a4a }
31 }
32 cel 0 tween { pose "Levier" at 0,36 pose "Voyant" tint #ff6a4a 0 }
33 cel 12 { pose "Levier" at 0,0 pose "Voyant" tint #54e08a 1 }
34 }
35}
36
37scene {
38 layer "Ciel" {
39 rect 0 0 960 600 fill linear(90, 0:#070a22, 1:#1f2650)
40 repeat i from 0 to 50 { circle $(mod(i * 311, 600)) $(mod(i * 137, 300)) $(0.5 + mod(i, 3) * 0.5) fill #ffffff opacity $(0.2 + mod(i, 4) * 0.15) }
41 circle 470 70 22 fill #fff4d6
42 circle 480 64 20 fill #0b1030
43 }
44 layer "Jardin" {
45 path "M0 520 C200 500 420 512 640 506 C780 500 880 512 960 506 L960 600 L0 600 Z" fill #10192f
46 circle 578 486 30 fill #0c1428
47 circle 560 500 22 fill #0c1428
48 rect 575 486 6 40 fill #0c1428
49 circle 40 506 26 fill #0c1428
50 }
51 layer "Maison" {
52 path "M60 270 L310 100 L560 270 Z" fill #6b3b2e
53 path "M80 270 L310 122 L540 270 Z" fill #e9d6b5
54 rect 80 270 460 260 fill #f1e3c8
55 rect 80 398 460 6 fill #8a6a4c
56 rect 80 268 460 6 fill #8a6a4c
57 rect 307 404 6 126 fill #8a6a4c
58 path "M60 270 L310 100 L560 270" nofill stroke #4a271e 10 join round
59 rect 70 526 480 8 fill #4a271e
60 }
61 layer "Meubles" {
62 // grenier : malle et carton
63 rect 250 214 70 46 4 fill #a8743e
64 rect 250 214 70 10 fill #8c5c2c
65 rect 336 226 52 34 3 fill #c9a06a
66 circle 310 170 16 fill #fff7e0 opacity 0.6
67 // chambre : lit et tableau
68 rect 120 352 150 40 6 fill #6e8cc7
69 rect 120 344 40 20 6 fill #f3f6ff
70 rect 112 330 10 62 3 fill #8a6a4c
71 rect 400 300 80 54 3 fill #8a6a4c
72 rect 406 306 68 42 fill #a7d3c8
73 path "M406 348 L430 322 L448 336 L474 314 L474 348 Z" fill #4f8a62
74 // salon : canapé et lampe
75 rect 110 470 150 50 10 fill #c75a4a
76 rect 110 452 150 30 10 fill #d86b58
77 rect 272 440 4 80 fill #6b5544
78 path "M258 440 L290 440 L282 420 L266 420 Z" fill #f2c464
79 // cuisine : table et fenêtre
80 rect 360 486 130 10 3 fill #8a6a4c
81 rect 372 496 8 30 fill #8a6a4c
82 rect 470 496 8 30 fill #8a6a4c
83 rect 410 420 80 50 4 fill #9fc3e6 stroke #8a6a4c 4
84 circle 448 474 9 fill #e8d26a
85 }
86 layer "Nuit" {
87 group "N3" at 0,0 nohit { layer "c" { path "M80 270 L310 122 L540 270 Z" fill #0a0d24 } }
88 group "N2" at 0,0 nohit { layer "c" { rect 80 274 460 124 fill #0a0d24 } }
89 group "N0" at 0,0 nohit { layer "c" { rect 80 404 227 122 fill #0a0d24 } }
90 group "N1" at 0,0 nohit { layer "c" { rect 313 404 227 122 fill #0a0d24 } }
91 }
92 layer "Panneau" {
93 rect 616 70 312 450 24 fill #ffffff0c stroke #ffffff22 1.5
94 text "LA MAISON" at 640,96 font "Geist, system-ui, sans-serif" size 24 bold align left line 1.2 color #f3e9d2 box 260 32
95 text "allume chaque pièce : au doigt, ou Tab puis Entrée" at 640,128 font "Geist, system-ui, sans-serif" size 13 align left line 1.25 color #8f96c4 box 270 36 wrap
96 instance "Interrupteur" as "I3" at 700,236 hitbox 100 140 { piece = "Grenier" }
97 instance "Interrupteur" as "I2" at 846,236 hitbox 100 140 { piece = "Chambre" }
98 instance "Interrupteur" as "I0" at 700,406 hitbox 100 140 { piece = "Salon" }
99 instance "Interrupteur" as "I1" at 846,406 hitbox 100 140 { piece = "Cuisine" }
100 }
101 layer "Bravo" {
102 group "Bravo" at 310,566 pivot 0,0 nohit {
103 layer "c" { text "Toute la maison est éclairée !" at -260,-16 font "Geist, system-ui, sans-serif" size 26 bold align center line 1.2 color #ffe7a8 box 520 34 }
104 }
105 }
106}
107
108fn bascule(i) {
109 on[i] = 1 - on[i]
110 nb = on[0] + on[1] + on[2] + on[3]
111}
112
113object "I0" {
114 focusable order 3
115 when clicked {
116 bascule(0)
117 I0.etat = on[0]
118 }
119}
120object "I1" {
121 focusable order 4
122 when clicked {
123 bascule(1)
124 I1.etat = on[1]
125 }
126}
127object "I2" {
128 focusable order 2
129 when clicked {
130 bascule(2)
131 I2.etat = on[2]
132 }
133}
134object "I3" {
135 focusable order 1
136 when clicked {
137 bascule(3)
138 I3.etat = on[3]
139 }
140}
141object "N0" { smooth opacity = 0.86 * (1 - on[0]) { k 0.08 } }
142object "N1" { smooth opacity = 0.86 * (1 - on[1]) { k 0.08 } }
143object "N2" { smooth opacity = 0.86 * (1 - on[2]) { k 0.08 } }
144object "N3" { smooth opacity = 0.86 * (1 - on[3]) { k 0.08 } }
145object "Bravo" {
146 opacity = fini * clamp((clock - tfin) * 2, 0, 1)
147 dy = 4 * sin(clock * 2)
148}
149
150every frame {
151 if nb >= 4 {
152 if fini == 0 {
153 fini = 1
154 tfin = clock
155 send "maison"
156 }
157 }
158 if nb < 4 {
159 fini = 0
160 }
161}
Galerie
FR
FrançaisEnglish

La maison qui s'allume

Scène animée · 960×600 · 30 img/s
FlatInk
InteractifÉtatsAccessibilité
Gérer (admin)
Informations
Type
Scène animée
Dimensions
960 × 600
Cadence
30 img/s
Durée
10.0 s · 300 images
Téléchargements
Page web autonome Ouvrir dans l'éditeur
FlatInk