|
|
|
@@ -0,0 +1,55 @@
|
|
|
|
|
# 0012. Mode immersif : le plateau en paysage, sur demande
|
|
|
|
|
|
|
|
|
|
- **Statut** : accepté
|
|
|
|
|
- **Date** : 2026-11-03
|
|
|
|
|
- **Décideurs** : Pierre
|
|
|
|
|
|
|
|
|
|
## Contexte
|
|
|
|
|
|
|
|
|
|
Sur l'écran de jeu en portrait, le plateau n'occupe qu'environ 35 % de l'écran
|
|
|
|
|
d'un téléphone (pions de 24 px sur un écran de 390 px de large). Pierre le
|
|
|
|
|
trouve peu immersif et a demandé un mode où le plateau prend le maximum de
|
|
|
|
|
l'écran.
|
|
|
|
|
|
|
|
|
|
Deux pistes ont été maquettées
|
|
|
|
|
(https://claude.ai/artifact/CQw6vbDpi6XQqVWQa4sANe, rangée « Mode immersif ») :
|
|
|
|
|
le téléphone en paysage, plateau sur toute la hauteur ; ou le portrait avec le
|
|
|
|
|
plateau tourné d'un quart de tour. Toutes deux donnent environ 57 % de l'écran
|
|
|
|
|
au plateau et des pions de 30 px : le petit côté de l'écran limite la taille
|
|
|
|
|
des pions dans les deux cas.
|
|
|
|
|
|
|
|
|
|
## Décision
|
|
|
|
|
|
|
|
|
|
- Un **mode immersif en paysage** : le plateau occupe toute la hauteur, dans
|
|
|
|
|
son orientation habituelle. À gauche : le menu, les comptes de points et la
|
|
|
|
|
consigne. À droite : l'aide et les actions. Le fond est en noyer jusqu'aux
|
|
|
|
|
bords de l'écran.
|
|
|
|
|
- On y entre **par un geste explicite** : un bouton « Plein écran » sur l'écran
|
|
|
|
|
de jeu en portrait. On en sort par le menu ou par le retour du téléphone.
|
|
|
|
|
- Le bouton force la vue paysage même si le téléphone est tenu droit ou si sa
|
|
|
|
|
rotation automatique est verrouillée : passage en plein écran
|
|
|
|
|
(`requestFullscreen`), puis verrouillage de l'orientation
|
|
|
|
|
(`screen.orientation.lock("landscape")`).
|
|
|
|
|
- Si le verrouillage est refusé (navigateur ou système qui ne le permet pas,
|
|
|
|
|
iPhone), l'app affiche la vue paysage tournée d'un quart de tour dans l'écran
|
|
|
|
|
portrait. Le résultat est le même en main.
|
|
|
|
|
- L'écran de jeu en portrait reste la vue par défaut, pour jouer d'une main.
|
|
|
|
|
|
|
|
|
|
## Alternatives écartées
|
|
|
|
|
|
|
|
|
|
- **Plateau tourné en portrait** : il change la lecture du plateau (numéros de
|
|
|
|
|
côté, camps à gauche et à droite) et risque de dérouter les débutants habitués
|
|
|
|
|
à une vraie table.
|
|
|
|
|
- **Bascule automatique quand on tourne le téléphone** : elle ne marche pas si
|
|
|
|
|
la rotation est verrouillée, et elle surprend en cours de partie. Elle reste
|
|
|
|
|
possible en plus du bouton, plus tard.
|
|
|
|
|
|
|
|
|
|
## Conséquences
|
|
|
|
|
|
|
|
|
|
- Le rendu du plateau doit s'adapter à deux mises en page (portrait et paysage)
|
|
|
|
|
sans changer le domaine ni le moteur : seule la vue change (ADR 0007).
|
|
|
|
|
- `screen.orientation.lock` n'est accepté qu'en plein écran, et pas partout :
|
|
|
|
|
la solution de repli par rotation CSS est obligatoire, et elle doit être
|
|
|
|
|
testée (`make test-browser`).
|
|
|
|
|
- Le plein écran masque la barre d'état du téléphone, ce qui libère encore un
|
|
|
|
|
peu de place.
|