Les outils de développement dans eGroupware

Présentation

Il existe trois outils de développement intégrés dans eGroupWare. Ces outils permettent de modifier des modules existants ou d'en créer de nouveaux. Ces outils sont :

• Un éditeur d'eTemplate.
• Un outil de modification/création de bases de données.
• Un outil de traduction.

L'éditeur eTemplate

L'éditeur d'eTemplate est un outil puissant permettant de modifier assez facilement les templates d'affichage utilisés par eGroupWare. Il permet notemment de modifier les templates contenus dans la base de données mais aussi de les exporter dans des fichier au format XML (très similaire à XUL de Mozilla).

L'interface

L'interface principale de l'outil se compose comme suit :

• champ "Nom" : permet de spécifier le nom du template à éditer ou le nom sous lequel enregistrer le template.
• champ "Template" : spécifie l'ensemble phpgw-template (mettre ' ' pour utiliser le template par défaut).
• champ "Langue" : spécifie la langue du template (par défaut il utilise la langue spécifiée dans les préférences).
• champ "version" : permet de spécifier la version du template.

• bouton "Lire" : permet de lire le template spécifié par les champs "Nom", "Template", "Langue" et "Version". Pour avoir un résultat, le champ "Nom" et obligatoire. Pour accéder à la liste de tous les templates, il ne faut rien mettre dans les champs "Nom", "Template", "Langue" et "Version".
• bouton "Enregistrer" : permet d'enregistrer le template, c'est à dire de mettre à jour la base de données.
• bouton "Supprimer" : permet de supprimer le template, c'est à dire de le supprimer complètement de la base de données.

• bouton "Styles CSS" : permet d'éditer les CSS du template.
• bouton "Montrer les valeurs" : permet d'effectuer des tests en entrant des données de test.
• bouton "Dump pour réglage" : écrit un fichier etemplates.inc.php dans le fichier setup de l'application.
• bouton "Ecrire le fichier de langue" :crée un fichier de langue à partir des labels et des textes d'aide du template
• bouton "Exporter XML": permet d'exporter le template dans un fichier au format XML.
• bouton "Importer XML" : permet d'importer un template à partir d'un fichier XML. ATTENTION : cette fonctionnalité n'est pas opérationnelle et risque d'effacer la définition du template de la base de données. Mieux vaut ne pas l'utiliser .

Modifier les CSS

L'éditeur d'eTemplate donne la possibilité de modifier les feuilles de styles. Pour éditer les CSS :

• choisir le template à modifier.
• une fois le template affiché, cliquer sur le bouton "Styles CSS". Une nouvelle fenêtre s'ouvre.
• sélectionner le fichier de CSS à modifier dans la liste déroulante "styles CSS".
• modifier les css affichées.
• pour sauvegarder ou quitter :
  • cliquer sur le bouton "enregistrer" pour sauvegarder et fermer la fenêtre.
  • cliquer sur le bouton "appliquer" pour sauvegarder.
  • cliquer sur "annuler" pour fermer la fenêtre sans sauvegarder.

Modifier les templates

Pour modifier un template :

• Il y a deux méthodes pour accéder au template à modifier :
  • Entrer le nom du template et cliquer sur le bouton "Lire".
  • Laisser les champs "Nom", "Template", "Langue" et "version" vides et cliquer sur le bouton "Lire". Choisir ensuite le template à modifier dans la liste nouvellement affichée en cliquant sur l'icône "modifier" située en face du nom du template.
• Chaque élément du template est modifiable. Pour accéder à la fenêtre d'édition d'un élément, double-cliquer sur le carré rose qui apparait quand vous passer le curseur de la souris sur l'élément. Un élément vide ou caché n'est représenté que par son petit carré rose. Pour le repérer, passer le curseur de la souris à l'endroit où devrait se trouver l'élément.

La fenêtre d'édition d'éléments

• liste "Modifier..." : permet de sélectionner l'action à exécuter sur le template. Les actions possibles sont :
  • "Modifier..." : permet de modifier l'élément.
  • "Supprimer" : permet de supprimer l'élément.
  • "Couper" : permet d'effectuer un 'couper' sur l'élément.
  • "Copier" : permet d'effectuer un 'copier' sur l'élément.
  • "Coller" : permet de 'coller' un élément.
  • "rocade"
• liste "Ligne..." : permet d'effectuer une opération sur la ligne contenant l'élément. Les opérations possibles sont :
  • "supprimer cette ligne" : permet de supprimer la ligne contenant l'élément.
  • "insérer une ligne au-dessus" : permet d'insérer une ligne au-dessus de la ligne contenant l'élément.
  • "insérer une ligne au-dessous" : permet d'insérer une ligne au-dessous de la ligne contenant l'élément.
  • "faire un rocade avec la ligne suivante".
• liste "Colonne..." : permet d'effectuer une opération sur la colonne contenant l'élément. Les opérations possibles sont :
  • "supprimer cette colonne" : permet de supprimer la colonne contenant l'élément.
  • "insérer une colonne avant" : permet d'insérer une colonne avant la colonne contenant l'élément.
  • "insérer une colonne entre" : permet d'insérer une colonne après la colonne contenant l'élément.
  • "faire une rocade avec la colonne suivante".
• Nom : indique le nom du template auquel appartient l'élément en cours d'édition.
• Version : indique la version du template auquel appartient l'élément en cours d'édition.
• chemin
• liste "Type" : spécifie le type de l'élément. Parmi les types proposés on a :
• champ "Label" : titre de l'élément qui doit apparaitre dans le template.
• champ "Nom" : nom de l'élément qui doit servir de clé pour l'utiliser dans le code.
• champ "texteFlou"
• champ "Aide" : spécifie le message d'aide qui doit être affiché dans le bas de la fenêtre quand l'élément a le focus. Laisser vide s'il n'y a as de message d'aide.
• champ "Options" : permet de spécifier les paramètres correspondants au "type" défini. Les paramètres doivent être séparés par des virgules. Si un paramètre n'est pas utilisé, il faut mettre un vide à sa place (par exemple 3 paramètres dont le deuxième n'est pas utilisé : 3,,4). Voici quelques exemples de paramètres en fonction des types :
  • type "Label" : [gras][italique]
  • type "Texte" : [longueur][,max]
  • type "Nombre entier" : [min][,max][,longueur]
  • type "Virgule flottante" : [min][,max][,longueur]
  • type "Textarea" : [lignes][,colonnes]
  • type "Radiob" : valeur
  • type "Règle horizontale" : [longueur]
  • type "Templ" : [indexDansContenu]
  • type "Select" : [multiselection],multiselection est un chiffre indiquant la largeur de la boite de sélection (par ex 2 correspond à 2 options de la boite de sélection sont affichées ).
  • type "Date" : [valeurs : p.e. 'A-m-j']
• champ "Envergure,Classe"
• case à cocher "PasDeTraduction" : cocher cette case pour stipuler qu'il ne faut pas chercher à traduire l'élément.
• liste "Aligner"
• case à cocher "nécessaire" : cocher cette case pour stipuler que l'élément est obligatoire (ex : un champ texte obligatoire), c'est à dire que le formulaire associé à l'élément ne sera pas envoyé tant que le champ n'est pas renseigné.
• case à cocher "LectureSeule" : cocher cette case pour stipuler que l'élément n'est pas éditable.
• case à cocher "désactivé" : cocher cette case pour désactiver l'élément.
• champ "Tabindex"
• champ "clé d'accès"
• liste et champ "onChange" : permet de spécifier une action à exécuter lorsqu'il y a un changement d'état de l'élément causé par une action de l'utilisateur (par exemple une modification d'une liste de sélection). Les actions possibles sont :
  • rien : ne rien faire.
  • soumettre le formulaire : envoyé le formulaire.
  • action personnalisée : exécuter le code javascript donné dans le champ texte situé à côté de la liste "onChange".
• liste et champ "onClick" : permet de spécifier une action à exécuter lorsque l'utilisateur clique sur l'élément. Les actions possibles sont :
  • rien : ne rien faire.
  • confirmé : affiche une fenêtre de confirmation.
  • popup : ouvre une fenêtre popup.
  • personnalisé : exécute le code javascript donné dans le champ texte situé à côté de la liste "onClick".

• "Attributs de la ligne dans la grille"
  • champ "Hauteur"
  • champ "Désactivé"
  • champ "Classe"
  • liste "vAlign"

• "Attributs de la colonne dans la grille"
  • champ "Largeur"
  • champ "Désactivé"

• bouton "Enregistrer" : sauvegarder les modifications effectuées et fermer la fenêtre.
• bouton "Appliquer" : sauvegarder les modifications effectuées.
• bouton "Annuler" : fermer la fenêtre sans sauvegarder les modifications effectuées.

L'outil de modification de la base de données

Cet outil fait partie du module eTemplate. Pour y accéder, lorsque vous êtes dans le module eTemplate, cliquez sur "outils base de données" qui se trouve dans le colonne de gauche.

Séléction/création d'une table

• Choisissez l'application que vous voulez modifier dans la liste "Application".
• Choisissez la table que vous voulez modifier dans la liste "Nom Table". Si vous souhaitez créer une nouvelle table, alors entrez son nom dans le champ de texte de la première ligne et cliquez sur le bouton "Ajouter une table".

Création/modification d'un champ

• Pour créer un nouveau champ dans la table, cliquer sur le bouton "ajouter une colonne".

• Il y a onze attributs pour définir un champ :
  • NomDeLaColonne : nom du champ, doit être unique dans la table et pas un mot SQL réservé. Il est conseillé de préfixé le nom du champ avec une abréviation du nom de l'application d'au moins deux caractères (ex application felamimail : fmail_nomDuChamp).
  • Type : type du champ. Les types possibles sont : varchar, int, auto, blob, char, date, decimal, float, longtext, text, timestamp, boolean.
  • Précision : correspond à la longueur pour les champs de type char et varchar, coorespond à la précision pour les champs de type entiers et float. Pour les entiers, les valeurs possibles sont 2, 4 et 8. Pour les entiers, les valeurs possibles sont 2, 4 et 8. Pour les float, les valeurs possibles sont 4 et 8.
  • Balance : utiliser pour les champs de type float.
  • PAS NULL : indique que le champ ne pourra pas être NULL.
  • Clé primaire : indique que le champ fait partie de la clé primaire.
  • Unique : indique que ce champ ne peut pas contenir deux fois la même valeur.
  • Indexé : permet d'indexer ce champ. L'indexation permet d'accélérer les requêtes qui utilise ce champ. Cependant, plus d'espace est utilisé pour le stockage.
  • Options d'Index : permet de spécifier les options d'index spécifiques à la base de données séparées par des virgules. (ex mysql(FULLTEXT) ou mysql(100) pour la longueur indexée d'un champ)
  • Clé étrangère : permet de donnée le nom de l'autre table dans laquelle le champ est une clé.
  • Défaut : permet de spécifier une valeur par défaut. ' ' spécifie une valeur par défaut vide et ne rien mettre signifie pas de valeur par défaut

• Pour importer les définitions d'une table existant dans la base de données, cliquez sur le bouton "Importer ".
• Pour écrire les fichiers de configuration dans le repertoire setup/ de l'application concernée, cliquez sur le bouton "écrire les tables".

L'outil de traduction

Pour accéder à l'outil de traduction, cliquer sur l'icône "outil de traduction". Sur la nouvelle page qui s'ouvre, selectionner l'application que vous souhaitez traduire en cliquant sur "éditer" en face du nom de l'application. Pour effectuer une traduction, le travail se déroule en quatre étapes :

Etape 1 : Traduction

Dans un premier temps, il faut choisir la langue source et la langue de destination. Les phrases de la langue source vont servir de clés aux traductions de la langue de destination. Normalement, la selection est automatique et il n'est pas utile de modifier les deux listes de sélections. Cependant pour modifier l'une des deux langues, faites votre choix et cliquez sur le bouton "charger".

Vient ensuite le moment d'effectuer la traduction. Celle-ci se fait dans un formulaire à quatre colonnes :

• "Enlever" : cocher la case pour supprimer la traduction correspondante.
• "Application" : selectionner l'application coorespondant à la traduction. Il n'est normalement pas utile de modifier cette colonne.
• "Original" : clé de la traduction.
• "Traduction" : mettre la traduction correspondant à la clé.

Etape 2 : Actions

Cinq actions sont possibles dans cette étape :

• "Enregistrer" : permet d'enregistrer les modifications effectuées. L'enregistrement est obligatoire pour passer aux étapes suivantes.
• "Rechercher les nouvelles phrases" : permet de lancer une recherche dans le but de trouver des phrases non traduites.
• "Ajouter une nouvelle phrase" : permet d'ajouter une nouvelle traduction, c'est à dire un nouveau couple clé=>traduction
• "Revenir"
• "Annuler"

Etape 3 : Modification du fichier de traduction

L'étape 3 permet de générer les fichiers de traductions. Il y a alors deux possibilités :

• "Télécharger" : permet de télécharger le fichier de traductions sans modifier le fichier existant sur le serveur.
• "Ecrire" : permet de modifier directement le fichier de traduction présent sur le serveur.

Si le bouton "Ecrire" n'est pas présent, alors il vous faudra télécharger le fichier et le placer vous-même dans le répertoire de traduction (/var/www/egroupware/nom_appli/setup/).

Etape 4 : Mettre à jour la base de données

L'étape 4 est la mise à jour des traductions dans la base de données. Après avoir réalisé l'étape 3, cliquer sur le bouton "Mettre à jour la base de données". Normalement, les traductions ont été mises à jour.