Aller au contenu principal

Code JSON d'un formulaire

Cette section vous donne un exemple de code JSON pour les différents composants d'un "Formulaire"" Retorik Studio, présenté dans la documentation fonctionnelle au chapitre Formulaires.

Composants d'un formulaire​

Section​

Code
{
    "$type": "K2.Bot.Forms.Models.Section, K2.Bot.Forms",
    "Introduction": "Début du formulaire",
    // Mettre Null si le message d'intro est géré dans un composant d'affichage de type Sentence indépendant 
    // de la section.
    "Title": "",
    "AskToBegin": false,
    "StopFormsIfLaunchRefused": false,
    "ForceLaunch": false,
    "AskToBeginSentence": null,
    "MessageIfLaunchRefused": null,
    "Items":[
                //Insérer ici le code JSON de chaque composant du formulaire
    ],
    "Choices": {},
    "LocalizationContainer": {},
     "Identifier": "1",
    "NextItemIdentifier": null,   //Une section peut en appeler une autre
    "GoToIdentifier": null
    "Condition": null,            //Une section peut être condition par une expression
    "Validation": null,
    "DisplayExternal": true,
    "Value": null,
    "DefaultValue": null,
    "Locked": false,
    "ColumnPosition": 0, 
    "RowPosition": 0, 
    "SizePercentage": 0, 
    "Meta": null 
 }

Liste de propositions avec Bouton Radio​

Liste de boutons radio sur une colonne​

Code
{
"$type": "K2.Bot.Forms.Models.Question, K2.Bot.Forms",
        "Text": "Voici un exemple de boutons radio sur une colonne",
        "Speak": null,
        "RepromptInvalidText": null,
        "RepromptUnrecognizedText": null,
        "StoragePath": "Conversation.Patient.radioUniqueChoice", //Variable qui récupère la donnée saisie
        "ForcePrompt": true,
        "ValidationButtonText": "Valider",
        "ValidationButtonPosition": "fullwidth",
        "ValidationButtonDisplay": "button",
        "ChoicesActions": {},
        "Choices": [
          "Choix numéro 1",
          "Choix numéro 2",
          "Choix numéro 3",
          "Choix numéro 4",
          "Choix numéro 5",
          "Choix numéro 6",
          "Choix numéro 7"
        ],
        "ChoicesOrder": 0,
        "StyleChoice": 7,
        "QuizOption": null,
        "OutputFormat": 0,
        "Split": 0,
        "LocalizationContainer": {},
        "Identifier": "0.6",
        "NextItemIdentifier": "0.7",
        "GoToIdentifier": null,
        "Condition": null,
        "Validation": null,
        "DisplayExternal": true,
        "Value": null,
        "DefaultValue": null,
        "Locked": false,
        "ColumnPosition": 0,
        "RowPosition": 0,
        "SizePercentage": 0,
        "Meta": null
}

Liste de boutons radio sur deux colonnes​

Même code que pour une liste à une colonne mais la propriété Split change :
** "Split": 2,**

Valeurs possibles pour StyleChoice​

Code
    None = 0,
    Auto = 1,
    Inline = 2,
    List = 3,
    SuggestedAction = 4,
    HeroCard = 5,
    CustomListSelect = 6,
    CustomListRadio = 7
    /*
        * 1 : Auto : le bot choisi la forme la plus adaptée selon le nombre de choix
        * 2 : Inline : tout sur une seule ligne
        * 3 : List : liste précédée de numéros
        * 4 : SuggestedAction : Liste de boutons
        * 5 : HeroCard :  liste de boutons avec texte à l'intérieur (comme le choix multiple de FAQ)
        * 6 : CustomListSelect :  liste déroulante
        * 7 : CustomListRadio : liste avec des boutons radio (choix unique)
        */

Liste de propositions avec Cases à Cocher​

Liste de cases à cocher sur une colonne​

Code
{
       "$type": "K2.Bot.Forms.Models.CustomCheckboxInput, K2.Bot.Forms",
        "Text": "Voici un exemple de checkbox sur une colonne",
        "Speak": null,
        "ListCheckBoxes": {
          "Choix numéro 1": "Conversation.Patient.choice1_1", //Variable qui récupère la valeur de la case 1
          "Choix numéro 2": "Conversation.Patient.choice1_2", //Variable qui récupère la valeur de la case 2
          "Choix numéro 3": "Conversation.Patient.choice1_3", //Variable qui récupère la valeur de la case 3
          "Choix numéro 4": "Conversation.Patient.choice1_4", //Variable qui récupère la valeur de la case 4
          "Choix numéro 5": "Conversation.Patient.choice1_5"  //Variable qui récupère la valeur de la case 5
       },
        "ValidationButtonText": "Valider",
        "ValidationButtonPosition": "fullwidth",
        "ValidationButtonDisplay": "button",
        "Split": 0,
        "ForcePrompt": false,
        "LocalizationContainer": {},
        "Identifier": "0.1",
        "NextItemIdentifier": "0.2",
        "GoToIdentifier": null,
        "Condition": null,
        "Validation": null,
        "DisplayExternal": true,
        "Value": null,
        "DefaultValue": null,
        "Locked": false,
        "ColumnPosition": 0,
        "RowPosition": 0,
        "SizePercentage": 0,
        "Meta": null
}

Liste de cases à cocher sur deux colonnes​

Même code que pour une liste à une colonne mais la propriété Split change :
** "Split": 2,**

Liste de propositions au format Boutons​

Liste de boutons à choix unique​

Code
{
       "$type": "K2.Bot.Forms.Models.CustomButtonInput, K2.Bot.Forms",
        "Text": "Voici un exemple de bouton à choix unique",
        "Speak": null,
        "ListButtons": {
          "Bouton 1": "",
          "Bouton 2": "",
          "Bouton 3": "",
          "Bouton 4": "",
          "Bouton 5": ""
       },
        "ValidationButtonText": "Valider",
        "ValidationButtonPosition": "fullwidth",
        "ValidationButtonDisplay": "button",
        "IsMultiple": false,
        "StoragePath": "Conversation.Patient.uniqueBtn",
        "ForcePrompt": false,
        "LocalizationContainer": {},
        "Identifier": "0.3",
        "NextItemIdentifier": "0.4",
        "GoToIdentifier": null,
        "Condition": null,
        "Validation": null,
        "DisplayExternal": true,
        "Value": null,
        "DefaultValue": null,
        "Locked": false,
        "ColumnPosition": 0,
        "RowPosition": 0,
        "SizePercentage": 0,
        "Meta": null
}

Liste de boutons à choix multiple​

Même code que pour une liste à boutons à choix unique mais la propriété IsMultiple change : :
"IsMultiple": true,

Liste de propositions avec Bouton Toggle Switch​

Code
{
        "$type": "K2.Bot.Forms.Models.CustomToggleInput, K2.Bot.Forms",
        "Text": "Voici un exemple de boutons toggle",
        "Speak": null,
        "ListToggles": {
          "Choix numéro 1": "*Conversation.Patient.choice3_1*",  // Variable qui récupère la valeur du bouton 1
          "Choix numéro 2": "*Conversation.Patient.choice3_2*",  // Variable qui récupère la valeur du bouton 2
          "Choix numéro 3": "*Conversation.Patient.choice3_3*",  // Variable qui récupère la valeur du bouton 3
          "Choix numéro 4": "*Conversation.Patient.choice3_4*",  // Variable qui récupère la valeur du bouton 4
          "Choix numéro 5": "*Conversation.Patient.choice3_5*"   // Variable qui récupère la valeur du bouton 5
        },
        "ValidationButtonText": "**Valider**",
        "ValidationButtonPosition": "fullwidth",
        "ValidationButtonDisplay": "button",
        "ForcePrompt": false,
        "LocalizationContainer": {},
        "Identifier": "0.5",
        "NextItemIdentifier": "0.6",
        "GoToIdentifier": null,
        "Condition": null,
        "Validation": null,
        "DisplayExternal": true,
        "Value": null,
        "DefaultValue": null,
        "Locked": false,
        "ColumnPosition": 0,
        "RowPosition": 0,
        "SizePercentage": 0,
        "Meta": null
}

Liste déroulante​

Code
{
        "$type": "K2.Bot.Forms.Models.Question, K2.Bot.Forms",
        "Text": "Voici un exemple de liste déroulante",
        "Speak": null,
        "RepromptInvalidText": null,
        "RepromptUnrecognizedText": null,
        "StoragePath": "Conversation.Patient.selectList", //Variable qui récupère la valeur sélectionnée
        "ForcePrompt": true,
        "ValidationButtonText": "***Valider***",
        "ValidationButtonPosition": "fullwidth",
        "ValidationButtonDisplay": "button",
        "ChoicesActions": {},
        "Choices": [
        "Réponse 1",
        "Réponse 2",
        "Réponse 3",
         "Réponse 4",
         "Réponse 5",
         "Réponse 6",
         "Réponse 7"
        ],
        "ChoicesOrder": 0,
        "StyleChoice": 6,
        "QuizOption": null,
        "OutputFormat": 0,
        "Split": 1,
        "LocalizationContainer": {},
        "Identifier": "0.8",
        "NextItemIdentifier": "0.9",
        "GoToIdentifier": null,
        "Condition": null,
        "Validation": null,
        "DisplayExternal": true,
        "Value": null,
        "DefaultValue": "Réponse 6",
        "Locked": false,
        "ColumnPosition": 0,
        "RowPosition": 0,
        "SizePercentage": 0,
        "Meta": null
}

Sélection d'image(s)​

Code
{
        "$type": "K2.Bot.Forms.Models.CustomImageChoiceSetInput, K2.Bot.Forms",
        "Text": "Quelle image préférez-vous ?",
        "Speak": null,
        "ValidationButtonText": "Valider",
        "ValidationButtonPosition": "fullwidth",
        "ValidationButtonDisplay": "button",
        "StoragePath": "Conversation.Patient.ImageSelection1", // Variable qui récupère la valeur de l'image 
                                                              // sélectionnée
        "IsMultiple": false,  // Mettre true (choix multiple) ou false(choix unique) selon votre souhait
        "SmallImages": true,  // Mettre true ou false selon votre souhait
        "ShowCaptions": true, // Mettre true (légendes visible) ou false (légendes invisible) selon votre souhait
        "choicesWithUrl": [
          {
           "title": "Image1",   // Légende visible à l'écran si ShowCaptions est à true
           "value":  "test1",   // Valeur récupérée par la variable définie par StoragePath
           "url": "https://picsum.photos/300/300.jpg",
           "LocalizationContainer": {}
          },

        //Recopier le code JSON de l'image 1 autant de fois que nécessaire

        ],
        "ForcePrompt": false,
        "LocalizationContainer": {},
        "Identifier": "0.03",
        "NextItemIdentifier": "0.04",
        "GoToIdentifier": null,
        "Condition": null,
        "Validation": null,
        "DisplayExternal": true,
        "Value": null,
        "DefaultValue": null,
        "Locked": false,
        "ColumnPosition": 0,
        "RowPosition": 0,
        "SizePercentage": 0,
        "Meta": null
}

Sélection d'une date​

Code
{
        "$type": "K2.Bot.Forms.Models.Input, K2.Bot.Forms",
        "Text": "Quelle est votre date de naissance ?",
        "Speak": null,
        "RepromptInvalidText": null,
        "RepromptUnrecognizedText": null,
        "StoragePath": "Conversation.Patient.Date", //Variable qui récupère la donnée saisie
        "ForcePrompt": false,
        "**TypeInput": "DateWithPicker",
        "ValidationButtonText": "Valider",
        "ValidationButtonPosition": "fullwidth",
        "ValidationButtonDisplay": "button",
        "LocalizationContainer": {},
        "Identifier": "0.000011",
        "NextItemIdentifier": "0.0002",
        "GoToIdentifier": null,
        "Condition": null,
        "Validation": null,
        "DisplayExternal": true,
        "Value": null,
        "DefaultValue": null,
        "Locked": false,
        "ColumnPosition": 0,
        "RowPosition": 0,
        "SizePercentage": 0,
        "Meta": null
}

Sélection d'une heure​

Code
{
       "$type": "K2.Bot.Forms.Models.**Input**, K2.Bot.Forms",<br/>
        "Text": "A quelle heure êtes-vous arrivé ?",
        "Speak": null,
        "RepromptInvalidText": null,
        "RepromptUnrecognizedText": null,
        "StoragePath": "Conversation.Patient.Time",
        "ForcePrompt": false,
        "TypeInput": "Time",
        "ValidationButtonText": "***Valider***",
        "ValidationButtonPosition": "fullwidth",
        "ValidationButtonDisplay": "button",
        "LocalizationContainer": {},
        "Identifier": "0.001",
        "NextItemIdentifier": "0.002",
        "GoToIdentifier": null,
        "Condition": null,
        "Validation": null,
        "DisplayExternal": true,
        "Value": null,
        "DefaultValue": null,
        "Locked": false,
        "ColumnPosition": 0,
        "RowPosition": 0,
        "SizePercentage": 0,
        "Meta": null
}

Echelle de mesure de type curseur​

Code
{
        "$type": "K2.Bot.Forms.Models.CustomSliderInput, K2.Bot.Forms",
        "Text": "Sur une échelle de 1 à 10, comment mesurez-vous votre douleur ?",
        "Speak": null,
        "MinLabel": "1",
        "MaxLabel": "10",
        "MinValue": 1,
        "MaxValue": 10,
        "ValidationButtonText": "Valider",
        "ValidationButtonPosition": "fullwidth",
        "ValidationButtonDisplay": "button",
        "StoragePath": "Conversation.Patient.Slider",
        "ForcePrompt": false,
        "LocalizationContainer": {},
        "Identifier": "0.01",
        "NextItemIdentifier": "0.02",
        "GoToIdentifier": null,
        "Condition": null,
        "Validation": null,
        "DisplayExternal": true,
        "Value": null,
        "DefaultValue": null,
        "Locked": false,
        "ColumnPosition": 0,
        "RowPosition": 0,
        "SizePercentage": 0,
        "Meta": null
}

Echelle de likert​

Code
{
      "$type": "K2.Bot.Forms.Models.CustomLikertInput, K2.Bot.Forms",
        "Text": "Quelle note attribuez-vous à cette application ?",
        "Speak": null,
        "RatingMin": 1,
        "RatingMax": 5,
        "Emojis": [
          "🟊"
        ],
        "StrokeColor": "#ffae00", // Couleur Jaune par défaut
        "ValidationButtonText": "Valider",
        "ValidationButtonPosition": "fullwidth",
        "ValidationButtonDisplay": "button",
        "StoragePath": "*Conversation.Patient.Likert*",
        "ForcePrompt": false,
        "LocalizationContainer": {},
        "Identifier": "0.02",
        "NextItemIdentifier": "0.03",
        "GoToIdentifier": null,
        "Condition": null,
        "Validation": null,
        "DisplayExternal": true,
        "Value": null,
        "DefaultValue": null,
        "Locked": false,
        "ColumnPosition": 0,
        "RowPosition": 0,
        "SizePercentage": 0,
        "Meta": null
}

Affichage d'un message​

Code
{
    "$type": "K2.Bot.Forms.Models.Sentence, K2.Bot.Forms",
    "Text": "Bonjour ${turn.activity.from.name}, je m’appelle Nom de l'assistant digital.",
       // La variable ${turn.activity.from.name} permet de récupérer le prénom de l'utilisateur de la conversation.
    "Speak": null, // Laisser à Null s'il n'y a pas besoin d'ajustement avec la voix
    "LocalizationContainer": {},
    "Identifier": "0.10",
    "NextItemIdentifier": "0.11",
    "GoToIdentifier": null,
    "Condition": null,
    "Validation": null,
    "DisplayExternal": true,
    "Value": null,
    "DefaultValue": null,
    "Locked": false,
    "ColumnPosition": 0,
    "RowPosition": 0,
    "SizePercentage": 0,
    "Meta": null
}

Affichage d'un message avec bouton d'action​

Code
{
        "$type": "K2.Bot.Forms.Models.Question, K2.Bot.Forms",
        "Text": "Merci d’avoir pris le temps de répondre à ces questions.",
        "Speak": null,
        "RepromptInvalidText": null,
        "RepromptUnrecognizedText": null,
        "StoragePath": "Conversation.Patient.end",
        "ForcePrompt": false,
        "ValidationButtonText": "Sauvegarder",
        "ValidationButtonPosition": "fullwidth",
        "ValidationButtonDisplay": "button",
        "ChoicesActions": {},
        "Choices": [
          "Continuer"
        ],
        "ChoicesOrder": 0,
        "StyleChoice": 5,
        "QuizOption": null,
        "OutputFormat": 0,
        "Split": 1,
        "LocalizationContainer": {},
        "Identifier": "0.37",
        "NextItemIdentifier": "0.99",
        "GoToIdentifier": null,
        "Condition": null,
        "Validation": null,
        "DisplayExternal": true,
        "Value": null,
        "DefaultValue": null,
        "Locked": false,
        "ColumnPosition": 0,
        "RowPosition": 0,
        "SizePercentage": 0,
        "Meta": null
}

Saisie d'une valeur numérique ou alphanumérique​

Code pour la saisie d'une valeur numérique
{
        "$type": "K2.Bot.Forms.Models.Input, K2.Bot.Forms",
        "Text": "Quelle est votre taille ?",
        "Speak": null,
        "RepromptInvalidText": null,
        "RepromptUnrecognizedText": null,
        "StoragePath": "Conversation.Patient.length", // Variable qui récupère la donnée saisie
        "ForcePrompt": false,
        "TypeInput": "Number",
        "ValidationButtonText": "false",
        "ValidationButtonPosition": "fullwidth",
        "ValidationButtonDisplay": "button",
        "LocalizationContainer": {},
        "Identifier": "0.0002",
        "NextItemIdentifier": "0.000211",
        "GoToIdentifier": null,
        "Condition": null,
        "Validation": null,
        "DisplayExternal": true,
        "Value": null,
        "DefaultValue": null,
        "Locked": false,
        "ColumnPosition": 0,
        "RowPosition": 0,
        "SizePercentage": 0,
        "Meta": null
}

Appel d'un formulaire​

Recopier ce code JSON d'appel d'un formulaire dans la zone nommée JSON de l'élément à envoyer à la fin de formulaire :

Code
[
  {
    "$type": "K2.Bot.Forms.Models.Event K2.Bot.Forms",
    "Name": "FormEvent",
    "Payload": {
      "event": {
      "type": 0,
      "formId": "*Nom du formulaire",
      "sectionId": "0"  //ID de l'élément de départ dans le formulaire appelé
      }
    },
    "StopForm": true,
    "StopSection": false,
    "IsInnerEvent": true,
    "IsWaitingEvent": false,
    "WaitingEventName": null,
    "LocalizationContainer": {},
    "Identifier": "990",
    "NextItemIdentifier": "991",
    "GoToIdentifier": null,
    "Condition": null,
    "Validation": null,
    "DisplayExternal": true,
    "Value": null,
    "DefaultValue": null,
    "Locked": false,
    "ColumnPosition": 0,
    "RowPosition": 0,
    "SizePercentage": 0,
    "Meta": null
  }
]

Démarrage d'un formulaire via le bot​

Code
const customActEvent = new CustomEvent("retorikSendActivity", { 
      detail: {
      type: "event",
      name: "StartFormEvent",
      value: {
        type: 0,
        formId: "Nom de formulaire",
        sectionId: "0",
      },
    },
  });
  document.dispatchEvent(customActEvent);