Evolution #87
ferméPersonnalisation de l'interface (générale + GEPN)
100%
Description
L'application d'origine dispose d'une section pour sa configuration générale, or toute cette partie est restée codée avec l'ancien code d'EPNadmin. Le passage de l'ensemble de l'application sur le framework Symfony nécessite une réécriture du code.
En plus de proposer au "superadmin" la personalisation de certains éléments de l'interface, chaque groupement d'EPN dispose aussi d'une page d'accueil dont il peut modifier le contenu, mais aussi ajouter son propre logo, voire surcharger la feuille de style de base.
Toutes ces fonctionnalités doivent être maintenues en utilisant cette fois Symfony, son système de layout et ses modules/templates.
Demandes liées 6 (2 ouvertes — 4 fermées)
Mis à jour par Grégory MARIGOT - TEICEE il y a presque 14 ans
- Statut changé de Nouveau à In Progress
- % réalisé changé de 0 à 90
Modifications publiées sur le svn (r345 et r346) :
Interface générale / Interface d'un GEPN¶
Chaque GEPN dispose d'un sous-domaine, en accédant à l'application via cette URL :- la page d'accueil est propre au GEPN
- le titre dans la fenêtre du navigateur reprend le nom du GEPN
- le logo du GEPN peut être utilisé comme logo de l'interface
- des styles CSS personalisés peuvent s'ajouter à la CSS générale
- Pour un usager normal : le GEPN de son EPN de rattachement
- Pour un animateur ou coordinateur : le GEPN de l'un des EPN sur lesquels il exerce son rôle
- Si l'animateur/coordinateur couvre plusieurs EPN appartenant à différents GEPN, alors son EPN de rattachement est utisé en priorité (s'il fait partie des EPN assignés), sinon l'un des GEPN sera pris arbitrairement
- Mais dans tous les cas, si un sous-domaine est utilisé, c'est le GEPN correspondant qui fait foi
Personnalisation de l'interface¶
Certains éléments de l'interface sont personnalisables jusqu'à 3 niveaux :- default : version de base fournie avec les sources de l'application
- main : personnalisation générale effectuée par le "superadmin"
- gepn : personnalisation propre à chaque groupement d'EPN
Celà concerne les pages d'accueil, la signature de bas de page, le logo, les styles CSS.
Les versions de base incluses dans les sources sont :- data/html/homepage_main.html
- data/html/homepage_gepn.html
- data/html/signature.html
- web/css/theme_proxyepn.css
- web/images/logo_proxyepn.png
- web/uploads/assets/homepage.html
- web/uploads/assets/signature.html
- web/uploads/assets/styles.css
- web/uploads/assets/"nom_du_logo"
- web/uploads/gepn/homepage.html
- web/uploads/gepn/styles.css
- web/uploads/gepn/"id_du_gepn"/homepage.html
- web/uploads/gepn/"id_du_gepn"/styles.css
- web/uploads/gepn/"id_du_gepn"/"nom_du_logo"
- La signature est commune pour toute l'application (pas de personnalisation pour les GEPN).
- Le style CSS de base est toujours utilisé, les styles personnalisables (général ou GEPN) sont uniquement additionnels.
- L'extension des logo pouvant variée, les noms des fichiers ne sont pas fixes : ils sont stockés dans la BdD pour les GEPN et dans le fichier de configuration app.yml pour le général.
Styles et thèmes¶
Les feuilles de styles CSS gèrent l'essentiel de l'apparence de l'interface. En mettant en place différentes CSS, elles offrent un moyen simple pour obtenir des présentations alternatives. Afin de gérer cette possibilité au mieux, la notion de "thème" a été introduite.
Ainsi dans la configuration générale, au lieu de spécifier un nom de CSS, on renseigne une liste de thèmes disponibles, le premier étant celui par défaut de l'interface générale.
Le nom du thème est essentiellement utilisé pour le choix de la feuille de style de base (ie thème "proxyepn" => web/css/theme_proxyepn.css), mais pas uniquement ! Il existe quelques autres éléments qui méritent de suivre ces changements de CSS, tels le nom du logo ou le thème CSS de jQuery-UI. Ainsi le choix du thème courant influencera l'ensemble des modifications nécessaires pour conserver une interface au look cohérent.
Pour faire la démonstration du système de thème, un second thème a été mis en place nommé "epnadmin" : il reprend l'ancienne charte graphique de l'application (couleurs, logo, style "humanity" de jQuery-UI, dispositions...)
Enfin, chaque GEPN a la possibilité de choisir parmis la liste de thèmes disponibles celui qu'il souhaite utiliser pour son interface. Celà laisse donc le choix à chacun du style et permettra facilement de proposer de nouveaux styles, que ce soit par goût personnel, soucis purement esthétique, mais aussi choix d'ergonomie.
Mise en place du système¶
La gestion de l'ensemble est quasiment aboutie :- détermination du contexte de l'interface (général ou GEPN)
- utilisation des bons fichiers selon leur existence et la personnalisation en cascade
- personnalisation sur la fiche des GEPN du logo, homepage, style et choix du thème
Le point qui resterait à travailler concerne la configuration générale par l'administrateur du site : pour le moment ces paramètres ne sont pas administrables via l'interface web (configuration du app.yml et fichiers à placer à la main en ayant accès au filesystem du serveur)
Mis à jour par Grégory MARIGOT - TEICEE il y a presque 14 ans
- % réalisé changé de 90 à 100
Modifications publiées sur le svn (r375) :
Génération des pages d'accueil des GEPN¶
Les modèles de homepage sont à présent traités pour générer les pages d'accueil des GEPN avec l'ensemble des informations dynamiques spécifiées (le nouvel helper Homepage se charge d'effectuer les substitutions des motifs).
Le modèle par défaut a été restylisé. A partir du moment où celui-ci convient, il est inutile d'aller le recopier dans le dossier de chaque GEPN. Placer un modèle homepage.html propre à un GEPN n'a d'intérêt que s'il s'agit de remplacer le modèle par défaut, sinon autant ne rien mettre.
Moralité : find ./web/uploads/gepn/ -name homepage.html -exec rm '{}' \;
Liste des motifs utilisables¶
- Pour le GEPN : #NOM_USAGE, #NOM_OFFICIEL, #WEB
- Pour les EPN : #NOM, #GEPN, #STRUCTURE_DACCUEIL, #ADRESSE, #CODE_POSTAL, #CODE_INSEE, #VILLE, #PAYS, #TELEPHONE1, #TELEPHONE2, #TELEPHONES, #COURRIEL, #WEB, #H_SCOLAIRE, #H_VACANCES, #H_TELEFORMATION, #LOGO, #PLAN, #PHOTO_EXT, #PHOTO_INT1, #PHOTO_INT2, #PHOTO_INT3, #THUMB_LOGO, #THUMB_PLAN, #THUMB_EXT, #THUMB_INT1, #THUMB_INT2, #THUMB_INT3, #URL_DETAIL
- Pour les sessions : #NOM, #TYPE, #DESCRIPTION, #HORAIRES, #DATE, #H_DEBUT, #H_FIN, #SALLE, #EPN, #GEPN, #VILLE, #URL_DETAIL
- #NOM_OFFICIEL et #WEB sont ajoutés pour les données du groupement
- #TELEPHONES qui donne le ou les numéros de téléphones 1 et 2 (comme sur les fiches des EPN)
- #HORAIRES qui donne directement la date formatée avec heure de début et de fin
- #THUMB_### qui retourne directement le code HTML complet pour l'affichage de l'image en vignette
- #URL_DETAIL disponible pour les EPN afin de proposer un lien vers leur fiche
- #WEB qui appelé sur l'EPN est capable de retourner l'url du GEPN s'il n'y en a pas sur l'EPN
(à noter que cette méthode est également mise en application sur les fiches des EPN)
Affichage des listes d'EPN et de sessions¶
Le même principe est conservé avec l'utilisation des blocs :- #D_EPNS ... #F_EPNS pour le modèle à utiliser en boucle sur chaque EPN du groupement
- #D_SESSIONS ... #F_SESSIONS pour le modèle à utiliser en bouche sur chaque session à venir
- Les filtres bas-niveaux (sécurité) standart s'appliquent comme d'habitude selon le profil de l'utilisateur
- Les accès libres sont toujours exclus (même en ayant les droits nécessaires pour les voir)
- Il est possible de spécifier dans le modèle le nombre max de sessions futures à lister (10 par défaut, utiliser le tag #LIMIT_25 par exemple pour afficher les 25 sessions à venir)
Liens contextuels dans l'interface¶
A noter qu'il est désormais possible de voir la page d'accueil de n'importe quel GEPN, sans pour autant devoir utiliser le sous-domaine qui lui est propre ou encore devoir se connecter avec un usager en faisant parti. Une nouvelle route du type "/gepn/1" permet par exemple de voir la page d'accueil du GEPN n°1.
Plusieurs liens ont été ajoutés dans le menu contextuel de la page d'accueil du GEPN, à l'instar de ceux présents sur la fiche du GEPN : liste des EPN, des salles, des sessions, des usagers... du groupement (liens disponibles selon le profil de l'utilisateur).
Les liens existent aussi pour aller de la fiche du GEPN vers sa page d'accueil et vice-versa.
Mis à jour par Grégory MARIGOT - TEICEE il y a plus de 13 ans
- Statut changé de In Progress à Résolu
Les possibilités de personnalisation sont en place pour la version 2.0.
Des évolutions notamment pour la mise en place d'une interface web permettant au superadmin de configurer l'application (plutot que de devoir modifier les fichiers sur le serveur) seront traitées dans la nouvelle demande #102.
Mis à jour par Grégory MARIGOT - TEICEE il y a plus de 13 ans
- Statut changé de Résolu à Fermé