Tuto de l'atelier Twine avec HTML CSS et un peu de code:
Exemple créé le 29 avril
Remplir un sac à dos en manif
On commence par définir une variable $i qui va nous servir à compter le nombre de fois qu'on choisit un objet.
(set: $i to 0)
Ensuite on crée une liste pour choisir un objet. La liste est entre les balises <ul> </ul> (pour Unordered List) et chaque ligne entre les balises <li> et </li>.
Choisissez un objet : <ul> <li>[Serum phi]<Serumphi|</li> <li>[Lunettes]<Lunettes|</li> <li>[Masque à gaz]<MasqueAGaz|</li> <li>[Écharpe]<Echarpe|</li> <li>[Bouteille d'eau]<BouteilleDEau|</li> <li>[Pansements]<Pansements|</li> <li>[Sandwich]<Sandwich|</li> </ul>
À chaque objet est associé un tag. L'objet est entre crochets [ ] et le tag a un chevron et une barre horizontale (comme un dessin de tag) <…|
[Sandwich]<Sandwich|
Grace à ces tags, nous allons pouvoir faire référence à chaque objet pour définir ce qu'il se passe quand on clique dessus.
(click: ?Serumphi)[ (set: $objets_dans_mon_sac to (ds:"Serum phi")) (set: $i to $i +1) (if: $i is 3)[(go-to: "Page suivante")] ]
Explication de la syntaxe :
(
parenthèse = on va mettre une fonction
click:
c'est la fonction “click” qui définit un truc à faire quand on clique sur…
?Serumphi
Là, on fait référence à la partie tagguée “Serumphi”.
)
parenthèse = fin de la condition
Là, on retrouve la fonction set:
pour définir la variable $objet_dans_mon_sac
à laquelle on donne la valeur “Serum phi”
. (dans (ds:
parce que on crée une liste)
Ensuite on incrémente $i de 1, ce qui permet de dire qu'on a choisit un objet de plus.
ensuite, si (if:
) $i est 3, on va (go-to:
) à la page suivante. Sinon, on fait rien.
Ensuite, on répète pour chaque objet.
(click: ?Lunettes)[ (set: $objets_dans_mon_sac to (ds:"Lunettes")) (set: $i to $i +1) (if: $i is 3)[(go-to: "Page suivante")] ]
(click: ?MasqueAGaz)[ (set: $objets_dans_mon_sac to (ds:"Masque à gaz")) (set: $i to $i +1) (if: $i is 3)[(go-to: "Page suivante")] ]
(click: ?Echarpe)[ (set: $objets_dans_mon_sac to (ds:"Écharpe")) (set: $i to $i +1) (if: $i is 3)[(go-to: "Page suivante")] ]