LegbaWhiteboard
LegbaWhiteboard
Ce que ça fait
Tableau blanc partagé (<legba-whiteboard for="id">) qui réutilise la
connexion RTC d’un <legba-call> référencé par id — jamais sa propre
connexion, même patron que <legba-chat>. Chaque trait dessiné est envoyé
segment par segment via sendData() de la connexion partagée et rendu chez
tous les autres participants au fil de l’eau via dataReceived. Un
participant qui rejoint en cours d’appel demande l’état actuel du tableau
(traits et couleur de fond) ; seul l’hôte de la salle y répond (avec
l’historique des traits qu’il a vus). Chaque participant qui peut dessiner
choisit sa propre couleur et épaisseur de trait, et dispose d’une gomme
(LGB-061). Seul l’hôte peut tout effacer ou changer la couleur de fond du
tableau (partagée par toute la salle).
Signature
class LegbaWhiteboard extends LegbaElement {
for: string;
}
Tag : legba-whiteboard.
Paramètres
| Propriété | Type | Requis | Défaut | Description |
|---|---|---|---|---|
for | string | oui | "" | id de l’élément <legba-call> référencé, dont la connexion est réutilisée |
Retour
N/A — un élément DOM. Aucun événement propre émis.
Erreurs
Aucune exception : un for invalide produit un console.error explicite
(comme <legba-chat>) ; un message reçu via dataReceived qui n’est pas
une enveloppe de tableau blanc reconnue (type inconnu, coordonnées hors de
[0, 1], JSON malformé) est ignoré silencieusement, jamais une exception
qui casse la boucle d’écouteurs de LegbaClientRoom.
Exemple minimal
<legba-call id="salle-1" room="salle-demo" token-endpoint="/api/token"></legba-call>
<legba-call-button for="salle-1"></legba-call-button>
<legba-whiteboard for="salle-1"></legba-whiteboard>
Exemple complet
import type { LegbaWhiteboard } from "@legba-core/ui";
// Le rôle "hôte" (qui contrôle qui peut effacer et qui répond aux
// demandes d'état) vient des métadonnées RÉELLES du participant, posées
// côté serveur (jeton ou changeParticipantRole) — jamais d'un attribut à
// régler soi-même sur ce composant.
function mountBoard(): void {
const board = document.querySelector<LegbaWhiteboard>("#tableau")!;
board.for = "salle-1";
}
Pièges
- Ne réutilise QUE la connexion, pas l’identité ni l’UI de
<legba-call>: litLegbaCall.clientRoomà chaque changement delegba-call-phase-changede la cible, exactement comme<legba-chat>. - Le rôle hôte n’est jamais transmis par le message lui-même : un
legba-whiteboard-clearreçu n’est appliqué que si les VRAIES métadonnées du participant expéditeur (room.raw.remoteParticipants, posées uniquement par un appel serveur de confiance) portentrole: "host"— défense en profondeur, un client modifié qui forgerait ce message est sans effet chez les autres. - Aucune persistance, aucun rejeu. Un participant qui rejoint après
qu’un dessin a eu lieu ne le voit que si un hôte est présent pour
répondre à sa demande d’état (
legba-whiteboard-request-state) — sans hôte connecté à ce moment, il repart d’un tableau vide. Ce n’est pas une limite desendData/dataReceived(voir LGB-013/015) réinterprétée à tort comme un bug. - Coordonnées en fractions
[0, 1], jamais en pixels bruts : deux participants avec des fenêtres de tailles différentes voient le même dessin aligné. - La gomme n’efface rien au sens vectoriel (LGB-061) : elle dessine un trait de la couleur de fond courante, redessiné par-dessus les traits existants — cohérent tant que la couleur de fond ne change pas ensuite. Un trait de gomme déjà posé garde la couleur de fond qu’il avait au moment où il a été tracé, même si la couleur de fond change plus tard ; documenté, pas un vrai effaçage.
- La couleur du tableau est partagée par toute la salle, comme
l’effacement complet : même défense en profondeur que
legba-whiteboard-clear(rôle réel de l’expéditeur vérifié via ses métadonnées, jamais un champ du message). - Consomme les jetons
--legba-*comme tout composant@legba-core/ui: ne redéclare jamais un jeton public directement, voirLegbaElement.