Plugin POSH
Introduction Plugin : mini application greffée sur Posh Objectif : changer le comportement du portail, sans modifier le cœur de l'outil. Exemples : Modifier une partie de la page d'accueil d'origine de POSH, Ajouter les lignes dans le menu, Faire apparaître le bouton « fermer » du menu, ...
Installation d'un plugin Répertoire placé dans /var/www/html/posh/includes/plugins Gestion des plugins dans : interface administration de Posh > configuration > gestion des plugins Activation d'un plugin : cocher la case à côté du plugin cliquer sur « enregistrer »
Les hooks Plugins basés sur les hooks Hook : instruction placée dans le code, déclenchant les actions définies dans les plugins. Hook est utilisable en PHP et Javascript La syntaxe des hooks : Hook dans un fichier PHP de POSH : launch_hook('userinterface_header') Hook dans un fichier Js de POSH : $p.plugin.hook.launch('app.openHome.end') Appel d'un hook PHP dans un plugin : register_hook('userinterface_header',function(),1,1) Appel d'un hook Js dans un plugin : $p.plugin.hook.register('app.openHome.end','addNewDiv()','1')
Réalisation du plugin « Accueil » (1/5)
Réalisation du plugin « Accueil » (2/5) Recherche de l'emplacement du code à impacter Utilisation de Firebug Recherche des éléments concernée par le plugin dans les fichiers de Posh : les div « homeheader » et « intromessage » Présence dans posh/includes/ajax.js Trouver le hook permettant d'agir sur le comportement du portail au niveau de la page d'accueil (où sont situés homeheader et intromessage) : $p.plugin.hook.launch('app.openHome.end')
Réalisation du plugin « Accueil » (3/5) Création du fichier de configuration du plugin « plugin_accueil.php) <? /* * name: plugin Accueil personnalisé * description: Modifie la page d'accueil * display: style="font-weight:bolder;" * dependencies: no * author: christelle le moine * url: http://eole.orion.education.gouv.fr */ register_hook("userinterface_header","LoadlinkAccueilJs",1,1); function LoadlinkAccueilJs() { echo "<script type='text/javascript' src='../includes/plugins/plugin_accueil/modifaccueil.js'></script>"; echo "<link href='../includes/plugins/plugin_accueil/styleaccueil.css' type='text/css' rel='stylesheet'>"; } ?>
Réalisation du plugin « Accueil » (4/5) Création du fichier « modifaccueil.js » qui ajoute du code au niveau du hook 'app.openHome.end' du fichier ajax.js //register hook action on widget create $p.plugin.hook.register('app.openHome.end','addNewDiv()','1'); $p.plugin.hook.register('app.openHome.end','hideOldDiv()','1'); //Fonction qui crée une nouvelle div « homeheader_aca_menu » dans laquelle on affiche au sein d'une iframe le contenu d'une page html function addNewDiv() { ... } // Fonction qui cache les div « homeheader » et « intromessage » function hideOldDiv ()
Réalisation du plugin « Accueil » (5/5) Création du fichier styleaccueil.css qui modifie l'aspect de la page d'accueil Résultat du plugin