Localization (jq1000)

De Wiki1000

jq1000.js gère la localisation des interfaces mobiles en utilisant le plugin jquery localize.

Tip-20px.png Tip : La langue par défaut des applications livrées est l'anglais

Pour cela :

  • Vous devez inclure le code script du plugin.
<script type="text/javascript" src="js/jquery.localize.js"></script>
  • Votre page html doit inclure les boutons de sélection de langage.
<div data-type="horizontal" data-role="controlgroup" class="ui-btn-right">  
    <a href="#" class="languageButton ui-btn-minimini" data-language="fr" data-role="button" data-mini="true" data-icon="fr" data-iconpos="notext">fr</a>
    <a href="#" class="languageButton ui-btn-minimini" data-language="en" data-role="button" data-mini="true" data-icon="gb" data-iconpos="notext">en</a>
</div>
  • Les fichiers de localisation doivent être placés dans un sous répertoire "localize" du répertoire de l'application

Exemple de fichier "home-fr.json" :

{
	"button": {
		"home": "Accueil",
		"back": "Retour",
		"newSearch": "Nouvelle recherche",
		"connect": "Connecter",
		"disconnect": "Déconnecter",
		"clearCache": "Effacer le cache",
		"save" : "Sauvegarder",
		"delete" : "Supprimer",
		"send" : "Envoyer",
		"reset" : "Réinitialiser"
	},
	"app" : {
		"offLineTitle" : "L'application n'est pas connectée",
		"offLineContent": "Cette fonction n'est disponible qu'en mode connecté",
		"connectTitle" : "Connexion au serveur",
		"styleTitle" : "Sélection du thème",
		"selectPicture": "Sélectionez une photo"
	},...
}

Comment localiser dynamiquement un élément

Les éléments statiques sont automatiquement localisés au changement de langage, pour les éléments dynamiques utilisez le code suivant :

if (expenses.count==0) {
  var $li = $('<li>').appendTo($list);
  var $a = $('<h1 data-localize="view.nowaiting">There is no waiting expense</h1>').
           localize("localize/home", {language:$.l1000.appData.language}).
           appendTo($li.get(0));
}
Outils personnels