Les langages Interfaces NUI FiveM L interface : JavaScript

La page du guichet

Les exercices de ce chapitre écrivent le script.js de l'interface. La page HTML est fournie ; l'élément #app porte la classe cache, que le CSS de l'interface traduit par display: none. Les tests jouent le rôle du jeu : ils envoient des messages à la page et lisent ses appels.

Recevoir

window.addEventListener("message", (e) => {
    const message = e.data;
    switch (message.action) { ... }
});

Un message inconnu est simplement ignoré.

Rendre la main

La touche Échap est le réflexe du joueur pour quitter une interface : on l'écoute sur le document.

document.addEventListener("keydown", (e) => {
    if (e.key === "Escape") { ... }
});

Demander, puis attendre la réponse

const reponse = await fetch(`https://${GetParentResourceName()}/retirer`, {
    method: "POST",
    body: JSON.stringify({ montant: 100 }),
});
const resultat = await reponse.json();   // ce que le Lua a passé à cb

await n'est permis que dans une fonction async : le gestionnaire d'événement peut l'être.

Un formulaire qui s'envoie sans preventDefault() recharge la page : dans une interface NUI, tout son état disparaît.

Une saisie de formulaire est toujours du texte : Number(champ.value) la convertit. Envoyer "100" au lieu de 100, c'est se faire refuser par un script Lua qui vérifie bien ses types.

3 exercices pour cette lecon

Les exercices demandent un compte : il faut bien enregistrer votre progression quelque part. La lecture, elle, reste libre. Creer un compte

Écouter le jeu facile lecon a valider
Rendre la main au jeu moyen lecon a valider
Demander un retrait difficile lecon a valider