TwinXeon by Renaudet
/Accueil/Tous les articles
Gestion des préférences utilisateur dans le VirtualDesktop
Une application peut gérer un grand nombre de variables de configuration que l'utilisateur peut éventuellement modifier. Par exemple, la couleur de fond d'un éditeur de texte, ou bien les dimensions de la fenêtre principale d'une application de dessin.
On souhaite bien sûr conserver ces choix de l'utilisateur d'une session à une autre, surtout s'il y en a plusieurs pour une même application. On appelle généralement cela les Préférences utilisateur, accessible souvent par un menu Préférences...
Je voulais créer un framework pour permettre ce genre de fonctionnalité dans le Virtual Desktop. J'ai donc créé la librairie twinxeon-preferences.js qui offre une abstraction Preference pour gérer des options nommées que l'on peut sauvegarder et charger très simplement.

Utilisation

L'application créé un objet Preference en lui passant un identifiant unique. On utilise en principe l'identifiant de base de l'application. J'ai pris comme principe d'utiliser des identifiants formant un espace de nommage :

var pref = new Preference("com.company.applicationId");

Ensuite, l'application doit personnaliser l'instance de Preference. Il y a deux fonctions à surcharger : onDefaultInitialize() qui sera invoquée à la toute première création de l'objet persistant, et onLoaded() qui sera invoquée à chaque chargement des préférences pour l'identifiant attribué ci-dessus.

On utilisera la fonction onDefaultInitialize() pour déclarer les préférences utilisateur maintenues par notre application :

pref.onDefaultInitialize = function(){
   this.addOption('window.width',this.window.width,this.window.width);
   this.addOption('window.height',this.window.height,this.window.height);
   this.addOption('window.location.x',10,10);
   this.addOption('window.location.y',10,10);
}

On utilisera la fonction onLoaded() pour modifier l'état de l'application en fonction des valeurs courantes des préférences qui viennent d'être chargées :

pref.onLoaded = function(){
   var width = pref.getOption('window.width');
   var height = pref.getOption('window.height');
   var left = pref.getOption('window.location.x');
   var top = pref.getOption('window.location.y');
   if(width!=null && height!=null){
        app.window.setSize(width,height);
   }
   if(left!=null && top!=null){
        app.window.setPosition(left,top);
   }
}

Finalement, l'application doit explicitement invoquer la fonction initialize() sur l'objet Preference pour permettre soit le chargement soit la première sauvegarde de l'objet persistant :

pref.initialize();

Exemples

J'utilise ces objets Preference pour retrouver la position de mes fenêtres au moment où je les ai fermées. Pour cela, il suffit juste de rajouter une petite surcharge à la fonction onExit() des applications basées sur UIApplication :

app.onExit = function(){
   this.preferences.setOption('window.width',this.window.width);
   this.preferences.setOption('window.height',this.window.height);
   this.preferences.setOption('window.location.x',this.window.left);
   this.preferences.setOption('window.location.y',this.window.top);
   this.preferences.save();
}
J'ai également utilisé ce principe pour conserver les positions des deux composants Slider utilisés dans l'interface graphique de mon application de monitoring. Ainsi, je conserve d'une session à l'autre le réglage de position qui me convient le plus.

Certaines applications de base du Virtual Desktop profitent de ce composant pour sauvegarder leur position : l'horloge et la calculatrice.

Principe de fonctionnement

L'objet Preference se sauvegarde sous ou se recharge à partir d'un flux JSON. Celui-ci est enregistré dans le FileSystem virtuel au moyen de la fonction saveResource() sous un nom de fichier masqué (commençant par un '.').

L'objet javascript Preference est un wrapper sur une liste d'objets Option, une option ayant un nom, une valeur et une valeur par défaut (cette dernière devant, prochainement, autoriser le retour à la 'configuration d'usine'). L'attribut autoSaveMode permet de déclencher une sauvegarde à chaque modification de la valeur d'une option par la méthode setOption(). Attention toutefois, en cas de modifications multiples, cette option peut avoir des répercutions sur les performances de l'application.

Lorsque l'objet Preference s'initialise, une requête AJAX est envoyée au serveur TwinXeon pour récupérer le fichier JSON correspondant, dans le FileSystem virtuel de l'utilisateur connecté. Le chargement des préférences est donc asynchrone, d'où le léger décalage perceptible lorsque l'on lance une application dans la bonne mise en place des préférences utilisateur.







Ajoutez votre commentaire :
  Votre pseudo :
  Votre adresse mail (obligatoire):
  Votre commentaire :
 
Site optimisé pour un affichage en 800x600 sous Firefox 8.x - ©Copyright 2011-2012 by Nicolas Renaudet