Moteurs côté client et Web

Les plug-ins FormIt utilisent deux moteurs JavaScript distincts :

  • Groupe de fonctions affichant le code HTML (côté Web)

  • Le côté client (FormIt) effectue des appels à FormIt et à son noyau de géométrie.

Ces deux moteurs JavaScript fonctionnent selon des processus distincts.

Côté client (FormIt) et côté Web (HTML)

FormIt exécute plusieurs moteurs JavaScript simultanément :

  • L’application FormIt possède son propre moteur JavaScript

  • Chaque barre d’outils de plug-in possède son propre moteur JavaScript.

  • Chaque groupe de fonctions de plug-in possède son propre moteur JavaScript (Chromium).

Les plug-ins peuvent spécifier l’emplacement de chargement du script JavaScript :

Côté client (FormIt)

Spécifié à l’aide du fichiermanifest.json

    "Scripts": [
        "PLUGINLOCATION/blockFormItSide.js",
        "https://formit3d.github.io/FormItExamplePlugins/SharedPluginFiles/PluginUtils18_0.js"
    ]

Côté Web (HTML)

Spécifié à l’aide du fichier index.html

  • Les scripts côté Web sont chargés à partir de la page Web.

  • Les scripts côté Web peuvent appeler le script JavaScript côté client (FormIt) à l’aide de plusieurs appels asynchrones.

Trois méthodes pour appeler des commandes côté client (FormIt) à partir d’un plug-in Web :

Méthode 1 : FormItInterface.CallMethod

CallMethod prend un nom de fonction et les arguments qui seront exécutés côté FormIt. La fonction transmise sera appelée avec le résultat de l’appel de la fonction.

    var args = {
        "w": 10,
        "l": 10,
        "h": 10
    }
    FormItInterface.CallMethod("CreateBlock", args, function(result)
    {
        // Result of the function call
    });

Avantages :

➕ Pas besoin de await.

Inconvénients :

➖ Un rappel est nécessaire pour obtenir le résultat et s’appelle « who know when ».

➖ Les scripts sont définis à deux emplacements différents.

➖ La logique du plug-in doit être divisée en deux fichiers différents.

Méthode 2 : FormIt.CallJS

*Disponible uniquement dans FormIt 2022.1 et versions ultérieures

CallJS utilise la fonction JavaScript pour un appel côté FormIt et l’objet arguments.json.

var args =
{
    "w": 10,
    "l": 10,
    "h": 10
};
var result = await FormIt.CallJS("CreateBlock", args);

Avantages :

➕ Le résultat est disponible en cas de besoin

Inconvénients :

➖ **** Vous devez ajouter await à tous les appels asynchrones. Si vous oubliez, rien ne fonctionnera comme prévu.

➖ **** Potentiellement plus lent en raison de await

Méthode 3 (asynchrone/await)

const pt1 = await WSM.Geom.Point3d(0,0,0);

Avec un appel asynchrone, le côté Web appelle le côté FormIt. Cet appel commence dans un processus, est envoyé à un autre processus, puis le résultat est transmis au processus de départ. C’est pourquoi await est nécessaire.

Seules les API FormIt intégrées peuvent être appelées par défaut.

Avantages :

➕ Le résultat est disponible en cas de besoin.

➕ Permet de combiner tout le code dans un seul fichier JS exécuté côté Web, sans script défini dans manifest.json.

Inconvénients :

➖ **** Vous devez ajouter await à tous les appels asynchrones. Si vous oubliez, rien ne fonctionnera comme prévu.

➖ **** Potentiellement plus lent en raison de await.

Méthode 4 (RegisterAsyncAPI)

*Disponible uniquement dans FormIt 2023.0 et versions ultérieures

Pour appeler une fonction définie par l’utilisateur dans FormIt, la fonction doit être enregistrée. Par exemple :

Côté client (FormIt)

FormIt.RegisterAsyncAPI("HelloBlockAsync", "CreateBlock", "l, w, h");
// CreateBlock runs from FormIt.
HelloBlockAsync.CreateBlock = function(args)
{
    return { "Result" : "It Worked!!"};
}

Côté Web (HTML)

var result = await HelloBlockAsync.CreateBlock(l, w, h);

Reportez-vous à HelloBlockAsync pour obtenir un exemple.

Avantages :

➕ Le résultat est disponible en cas de besoin.

➕ Permet de combiner tout le code dans un seul fichier JS exécuté côté Web, sans script défini dans manifest.json.

Inconvénients :

➖ **** Vous devez ajouter await à tous les appels asynchrones. Si vous oubliez, rien ne fonctionnera comme prévu.

➖ **** Potentiellement plus lent en raison de await.

Last updated