eTemplate est un moteur de rendu utilisé dans les versions précédentes d’EGroupware pour générer l’interface utilisateur de la plupart des applications. Il prend le contenu d’une application et d’un modèle et le rend sur le serveur sous forme de HTML. Lorsque l’utilisateur soumet ce formulaire HTML dans son navigateur, le moteur eTemplate le reçoit à nouveau sur le serveur, valide l’entrée et la renvoie à l’application.

Tout cela se faisait sur le serveur et la réaction aux entrées de l’utilisateur nécessitait le plus souvent un aller-retour du serveur. Il n’y avait pas d’API pour manipuler un modèle déjà rendu du côté du client ou du navigateur.

Tout cela change avec eTemplate2 dans la version 14.1 :
utilisent une API largement identique côté serveur, elles sont faciles à porter vers la version 14.1.
que l’API eT2 envoie le contenu sous forme de JSON (JavaScript Object Notation) incl. une url vers une description de modèle XML pour le navigateur
Le moteur eTemplate2 du navigateur charge le modèle et rend l’interface utilisateur (IU).
la partie de l’application côté client interagit directement avec eTemplate : par exemple, la partie de l’application côté client qui n’a pas d’accès à l’Internet. afficher ou masquer un élément d’interface utilisateur / widget ou modifier son apparence
eTemplate et l’application utilisent l’API EGroupware côté client, par exemple. pour interroger une préférence d’utilisateur, un détail de compte ou un titre de lien
si un nouveau modèle à onglets est utilisé, par exemple le modèle Pixelegg 14.1, l’API persiste sur le client et met en cache les données demandées au serveur.

Vous pourriez vous demander : tout cela est très théorique, qu’est-ce que j’en retire ? Je décrirai quelques nouveaux widgets, afin d’illustrer les grandes améliorations de la convivialité de la version 14.1 et les nouvelles possibilités offertes :

Menus contextuels et barres d’outils
Les listes, les arbres en fait tous les éléments de l’interface utilisateur peuvent maintenant avoir un menu contextuel montrant quelles actions sont disponibles sur une ligne ou un élément d’arbre. Cela remplace parfois un grand nombre d’icônes que nous avions auparavant dans les listes. Certaines applications, par exemple Le nouveau courrier utilise maintenant des barres d’outils pour montrer les actions disponibles. L’utilisateur peut réorganiser ces icônes selon ses propres besoins et même masquer celles qui sont moins utilisées dans une liste déroulante « plus… ».

Glisser et déposer à l’intérieur d’EGroupware et vers et depuis votre bureau.
Les fichiers peuvent être téléchargés en les faisant glisser de votre bureau vers une fenêtre d’édition d’une entrée, par exemple. un InfoLog ou un courrier composé. Vous pouvez également faire glisser un fichier sur une ligne d’une liste.

Le fichier peut être glissé vers l’extérieur, par exemple. de l’application Filemanager sur votre bureau, si votre navigateur le supporte, actuellement seul Chrome le fait.

Téléchargement de fichiers
ne sont plus limités par la limite de mémoire de PHP, grâce à notre support de l’API de fichier html5.

L’application Filemanager est désormais un citoyen de première classe et les fichiers qui y sont stockés sont disponibles partout pour être attachés ou liés, alors que les versions précédentes d’EGroupware nécessitaient de télécharger et de retélécharger un tel fichier.

Les entrées d’EGroupware peuvent également être liées en les faisant glisser sur une autre entrée.

Défilement sans fin dans les listes
Avant EGroupware 14.1, toutes les applications Web devaient mettre en œuvre un système de pagination pour leurs listes. L’application n’affichait qu’un nombre limité de lignes dans une liste et des flèches pour charger le jeu de lignes suivant ou précédent. Les utilisateurs devaient toujours choisir entre une liste rapide et courte ou une liste longue et plus lente.

Les listes eTemplate2 affichent désormais une barre de défilement pour l’ensemble de la liste et chargent d’autres entrées à la demande lorsque vous faites défiler la liste vers le haut ou vers le bas.

Les listes eTemplate2 permettent désormais de redimensionner leurs colonnes et de bénéficier d’une navigation au clavier. Ils permettent de sélectionner plusieurs lignes et d’exécuter des actions sur celles-ci.

Chargement des pièces de l’interface utilisateur à la demande
eTemplate2 peut reporter le rendu et même le chargement des éléments non visibles de l’interface utilisateur. Eg. un onglet d’historique ne charge pas son contenu avant qu’un utilisateur y apporte des modifications. Il utilise ensuite la liste défilante sans fin décrite ci-dessus pour afficher tout l’historique d’une entrée, mais ne charge que quelques lignes du serveur.

Les ensembles de modèles encadrés, comme le nouveau Pixelegg, ne chargent que l’application active, reportant le chargement de toutes les autres applications ouvertes jusqu’à ce que l’utilisateur décide de les regarder.

Ceci n’est qu’un extrait des nouveaux éléments d’interface utilisateur et des améliorations de la convivialité rendus disponibles par eTemplate2 et l’accent mis sur le rendu et l’interaction avec l’utilisateur sur le client-ka. côté navigateur.

Avec la version 14.1, nous nous sommes surtout concentrés sur le développement du moteur eTemplate2 et sur le portage des applications vers celui-ci avec les fonctionnalités qu’elles possédaient déjà. Les prochaines versions verront une utilisation encore plus importante de ces nouvelles possibilités et des réécritures complètes d’applications comme nous l’avons fait dans la 14.1 avec mail et partiellement avec admin. Je les évoquerai dans mes prochains articles.

Ralf Becker

Directeur du développement logiciel