# MVP https://agenda.inha.fr/events/presentation-de-louvrage-fragments-sur-aby-warburg-de-gertrud-bing?nc=eyJpbmRleCI6MCwidG90YWwiOjUzfQ%3D%3D https://agenda.toulouse-metropole.fr/ ## Résumé Nous voulons publier un plugin Wordpress en logiciel libre pour simplifier l'intégration d'un OpenAgenda. Il faciliterait la personnalisation de l'affichage d'une programmation sur son site Wordpress et permetterait l'utilisation des composants de recherche disponibles sur OpenAgenda, similairement à ce que permet [ce projet](https://www.npmjs.com/package/@openagenda/agenda-portal) Une première publication du plugin comprendrait les fonctionnalités suivantes: * **Un fonctionnement en 'Proxy'**: Pas de stockage d'événements en local, le plugin fonctionne comme un agenda-portal: il fait proxy entre le visiteur du site et l’export JSON de l’agenda. Il prend la recherche de l’utilisateur pour la passer directement à l'URL export JSON de l’agenda. En retour il prend les données fournies par l'export pour construire les pages agenda ou événement à afficher en les appliquant aux gabarits personnalisés par l'intégrateur. * **Une librairie PHP** dissociable de wordpress: Elle permettrait de simplifier par la suite la mise à disposition de fonctionnalités similaires sur d'autres CMS wordpress (cache, génération de liens de partage, de navigation précédent/suivant) * **Les données récupérées de l'agenda sont décorées par le plugin**: Le plugin ajoute les valeurs utiles pour les gabarits aux données fournies par l'export. Celles-ci incluent les urls de navigation, le formattage des dates, les liens de partage * **Configuration de référence**: Le plugin permetterait de spécifier coté administration la configuration d'intégration d'un agenda. Elle rassemblerait entre autre: * L'identifiant de l'agenda * Un éventuel préfiltre * Un gabarit "liste", un autre "événement" * La route de base pour l'affichage du gabarit list, une sous-route pour le gabarit événement * La clé de compte de l'utilisateur * **Configurations additionnelles** (*ne fait plus partie de la première livraison, donc du cadre de ce développement*): Des configurations additionnelles pourraient étendre la configuration de référence pour permettre la création de pages déclinées. * **UI de personnalisation des gabarits (ou contre-proposition)**: [Gutenberg](https://fr.wordpress.org/gutenberg/) pourrait servir d'interface principale de personnalisation des pages "liste" et "événement" en permettant d'ajuster des gabarits de référence selon son besoin, similairement à ce que propose le plugin [JSON Content Importer](https://fr.wordpress.org/plugins/json-content-importer/) - [illustration](https://i.imgur.com/2DYYr37.png) * **Le moteur de template pour le contenu des blocs serait handlebars (ou contre-proposition)**: une mutualisation des gabarits serait alors possibles entre les projets *agenda-portal* déployés et les implémentations sur WP * **Filtres de navigation**: Des widgets ou blocs gutenberg pour simplement ajouter les filtres OA déjà utilisés sur la plateforme et sur [agenda-portal](https://www.npmjs.com/package/@openagenda/agenda-portal). Les codes configurables existent déjà, il faut mettre en place la couche WP qui permettra leur config depuis l’admin: recherche, carte, calendrier, tags. ## Données & Navigation Le plugin wordpress aura pour source de données l'export JSON d'un agenda maintenu sur OpenAgenda du choix de l'utilisateur du plugin. Chaque agenda expose le même flux. Exemple avec l'agenda de [l'INHA](https://openagenda.com/inha), qui par défaut présente les événements à venir. L'URL de l'agenda sur OA: https://openagenda.com/inha En activant un filtre via les éléments de la barre latérale, l'url prend la valeur du filtre. Un clic sur 'Projection' donne: https://openagenda.com/inha?oaq[tags][0]=projection Un clic sur le bouton Exporter nous amène sur la page d'exports qui propose le flux JSON correspondant: https://openagenda.com/agendas/58503441/events.json?oaq[tags][0]=projection L'UID de l'agenda est utilisé pour ses URLs d'exports, on le retrouve en pied de barre latérale. Une documentation de l'export JSON se trouve [ici](https://openagenda.zendesk.com/hc/fr/articles/203034982-L-export-JSON-d-un-agenda) Une intégration sur un site devra utiliser la même synthaxe de filtres, ce qui permettra la réutilisation des composants js front de filtrage qu'on retrouve sur les agendas OpenAgenda. Ceux-ci évolueront en parallèle du moteur de recherche OA. L'agenda de l'INHA a une intégration en marque blanche, on y retrouve les mêmes filtres: https://agenda.inha.fr/?oaq%5Btags%5D%5B0%5D=projection Chaque script de filtre devra être mis à disposition de l'intégrateur dans le plugin WP pour lui simplifier son utilisation. En plus d'être utilisés sur OA, ils sont présents sur des *partials* sur les gabarits par défaut du projet *agenda-portal*. Visibles sur github, où le projet est occasionnellement mis à jour: [les codes d'intégration des filtres d'agenda](https://github.com/Oagenda/oa/tree/master/packages/agenda-portal/dev/views/partials/widgets). Ils se chargent d'ajouter le bout *?oaq[typedufiltre]=valeur* qui est interpreté par l'export JSON. A voir: une cache locale de courte durée de vie éviterait d'avoir à soliciter l'export sur OA, en particulier pour les vues au premier affichage ## Détail des blocs gutenberg (ou autre) Chaque type de page agenda proposerait une sélection de blocs gutenberg à placer. Ils seraient préconfigurés pour afficher les données propres au contexte de la configuration et des données récupérées et décorées du JSON. Voici les blocs essentiels: ### Blocs disponibles sur la page liste * **Tête de liste**: affiche les filtres actifs, le total * **Liste**: boucle sur les événements à afficher de la page courante * **Pagination**: alternative au chargement progressif ### Blocs disponibles sur la page de détail * **Evenement**: bloc principal de l'événement, comporte le titre, les descriptions, l'image * **Horaires (timings)**: liste complète & navigable des horaires - voir sur OA/agenda-portal * **Lieu**: détails sur le lieu ### Blocs disponibles sur les deux pages * **Filtre Carte**: voir sur OA/agenda-portal * **Filtre Calendrier**: voir sur OA/agenda-portal * **Filtre Tags**: voir sur OA/agenda-portal * **Filtre Recherche**: voir sur OA/agenda-portal * **Filtres actifs**: se placent en tête de liste et permettent de retirer un filtre * **JSONLD**: voir sur OA/agenda-portal * **Partages** ## Liens utiles https://bayot.org/testsite https://www.npmjs.com/package/@openagenda/agenda-portal