**Language / Langue :** **FR** | [[en:ui:presentation|EN]]

====== Modes d'interface (UI) ======

Depuis la version 4.13, un scénario peut changer l'**interface de jeu** côté joueur avec la clé ''ui:''. Sans cette clé, l'interface classique reste strictement inchangée : les scénarios existants ne sont pas affectés.

Les modes d'interface fonctionnent sur le **web**, en **version locale** et dans l'**export HTML5 standalone**. Sur Discord et en terminal, le scénario reste jouable avec l'interface classique (boutons et texte).

===== Choisir un mode =====

<code yaml>
titre: "Mon scénario"
ui: cartes
</code>

^ Valeur ^ Mode ^ Description ^
| ''defaut'' / ''default'' | Classique | Interface habituelle (texte + panneau de choix). |
| ''cartes'' / ''cards'' | [[fr:ui:cards|Cartes]] | Les choix deviennent des cartes sur un rail horizontal. |
| ''plein-ecran'' / ''fullscreen'' | [[fr:ui:fullscreen|Plein écran]] | Scène point & clic en plein écran, texte dans un bandeau. |
| ''deck'' | [[fr:ui:deck|Deck]] | Une carte à glisser dans 4 directions, façon jeu de cartes narratif. |
| ''phone'' | [[fr:ui:phone|Téléphone]] | Chaque salle devient un écran de smartphone. |

Les valeurs ''livre''/''book'', ''vn'' et ''ds'' sont réservées pour de futures versions : elles sont acceptées mais affichent l'interface classique pour le moment.

===== Un mode par salle =====

La clé ''ui:'' peut aussi être posée sur une **salle**. L'interface active est toujours celle de la salle courante : ''ui:'' de la salle s'il est présent, sinon ''ui:'' du scénario, sinon l'interface classique. En quittant la salle, l'interface globale revient automatiquement.

<code yaml>
ui: cartes            # tout le scénario en mode cartes

salles:
  - id: taverne
    ui: plein-ecran   # ... sauf cette salle, en point & clic
    texte: "[[#map:scene:image.png|masque.png]]"

  - id: bibliotheque
    ui: defaut        # ... et celle-ci, en interface classique
    texte: "Retour à une salle de lecture traditionnelle."
</code>

On peut ainsi mélanger les ambiances : une enquête classique, une scène point & clic, un passage sur téléphone.

===== Masquer la barre de saisie =====

''masquer_saisie:'' (''hide_input:'') contrôle la barre de commande textuelle :

^ Valeur ^ Effet ^
| absente | Automatique : masquée dans les modes immersifs (''cartes'', ''plein-ecran'', ''deck''), visible sinon. |
| ''true'' | Barre masquée, jeu 100% boutons/tactile. |
| ''false'' | Barre toujours visible. |

La clé existe au niveau du scénario et au niveau d'une salle. Les boutons Abandonner et Accueil restent toujours accessibles, quel que soit le mode.

<code yaml>
ui: cartes
masquer_saisie: false   # mode cartes, mais saisie conservée
</code>

===== Boutons enrichis (tous les modes) =====

Deux améliorations des boutons de choix accompagnent les modes d'interface et fonctionnent partout :

**Image dans un libellé** : un lien ''%%[[url]]%%'' dans le libellé d'un choix affiche une image. Seule, elle remplit le bouton (icône d'app, vignette) ; accompagnée de texte, elle devient une petite icône à gauche.

<code yaml>
choix:
  - bouton: "[[https://exemple.com/icone-carte.png]] Consulter la carte"
    vers: carte
</code>

**Forme du bouton** : la clé ''forme:'' (''shape:'') d'un choix ajuste son apparence - surtout utile en mode téléphone.

<code yaml>
choix:
  - bouton: "📞"
    forme: rond          # classique, icone_carre, rond, large
    vers: appel
</code>

===== L'essentiel =====

  * ''ui:'' au niveau scénario ou salle, [[fr:ui:cards|cartes]] / [[fr:ui:fullscreen|plein écran]] / [[fr:ui:deck|deck]] / [[fr:ui:phone|téléphone]].
  * Rétrocompatibilité totale : sans ''ui:'', rien ne change.
  * Discord et terminal restent jouables en interface classique.
  * Le [[fr:editeur:linter-export|linter]] valide les valeurs de ''ui:'' et signale les fautes de frappe.

**Retrouvez nous sur le [[https://discord.gg/Z63DtVV|discord Make&Play]]**