Stocker des données en local

• Téléchargez le module localstorage.zip et insérez-le dans un composant Web au niveau de votre premier écran.
  
  
• A l'ouverture de l'application, il est nécessaire de consulter le localstorage pour connaître son état. Par défaut, celui-ci est ON. Créez l'action : Affichage de l'état / Agir sur un composant [Web] / Obtenir l'état de l'interrupteur 
  
  
• Paramétrez le scénario n°1 correspondant à la première utilisation de l'application. Je souhaite ouvrir automatiquement la pop up. Sélectionnez le composant [Web] / Interrupteur changé [ON] / Agir sur un composant [Pop-up] / Ouvrir la pop up 
  
  
• Il est nécessaire d'envoyer l'information de cette première utilisation au localstorage et changer son état à OFF. Vous pouvez par exemple le lier à la fermeture de la pop up. Sélectionnez le composant [Pop up] / Fermeture de la pop up / Agir sur un composant [Web] / Changer l'état de l'interrupteur
  
  
• Si vous souhaitez créer un autre parcours, vous pouvez ensuite paramétrer le scénario n°2 correspondant aux autres utilisations. Sélectionnez le composant [Web] / Interrupteur changé [OFF] et choisissez l'action de votre choix : aller à un écran etc....

Fonctionnalités avancées (développeur)

Dans cette partie, nous détaillons la construction du module localstorage pour s'adapter à toutes vos problématiques. Cette partie est réservée aux utilisateurs ayant des connaissances en HTML.

Ce module est composé d'un fichier index.html, de la connexion PandaBridge et du fichier de description, pandasuite.json.

a.Le fichier de description : pandasuite.json

Le fichier pandasuite.json décrit les propriétés de ce module.

Les propriétés

Pour utiliser le localStorage dans plusieurs situations, nous avons défini un identifiant pour chaque utilisateur. Elle est de type string, c'est-à-dire qu'il s'agit d'une chaîne de caractère personnalisable.

Elle se retrouve dans la fenêtre Propriétés du composant.

Les déclencheurs

Il est intéressant de lancer une action si le bouton est "ON" ou "OFF" : nous définissons les deux déclencheurs associés.

Les actions

Nous souhaitons également changer l'état du bouton en "ON" ou en "OFF". Il est nécessaire aussi de pouvoir appeler le lieu de stockage pour connaître l'état du bouton : c'est l'action getSwitchState.

b.Le fichier PandaBridge

Pour que le module .zip communique avec le studio, il est nécessaire d'inclure ce fichier qui permet d'accéder à la classe PandaBridge et ses différentes méthodes. Il n'y a aucune modification à apporter à ce fichier. 

c.Les méthodes de la classe PandaBridge

Maintenant que les propriétés ont été déclarées et que la communication a été établie, nous utilisons les méthodes de la classe PandaBridge pour envoyer et recevoir les différentes informations.

• Insertion du script dans le header du code

• Appel au localStorage, description des déclencheurs et des actions

La méthode init permet l'initialisation, c'est elle qui va permettre d'exécuter les fonctionnalités de PandaBridge.

La méthode onLoad est appelée quand le composant se charge visuellement. Elle permet de recevoir les propriétés et les marqueurs personnalisés du composant.

La fonction getSwitchstate s'appuie sur la fonction localStorage pour connaître l'état du bouton. En fonction de la

Avec la méthode listen, nous recevons les informations du studio pour changer l'état du bouton. L'état est donc changé directement au sein du localStorage, en fonction de l'action demandée. Avec la propriété getSwitchState, l'état est remonté du localStorage sans être changé.

L'insertion du dossier .zip

Une fois que vous avez paramétré les fichiers, zippez le tout.

Vous pouvez désormais personnaliser le localstorage en fonction des actions souhaitées :-)