Développement #104406
Nouvelle cellule "Événements" - Affichage en vue hebdomadaire en front-office des événements réservables
0%
Description
Ce développement permettra d'afficher sur le portail usager une semaine d'événements (à partir d'un ou plusieurs agendas de type "Événements") sous forme calendaire, avec la possibilité de passer d'une semaine à l'autre. Le paramétrage permettra d'indiquer la démarche associée à la réservation, et un clic sur l'événement permettra d'arriver directement sur cette démarche (avec l'événement choisi pré-sélectionné si cela a été implémenté dans le formulaire).
La cellule affichera pour chaque événement au minimum son intitulé, son heure de début et son heure de fin. D'autres informations pourront être affichées via un gabarit (par exemple, un tarif, une description, mais pas de HTML ni d'image).
Files
Related issues
Associated revisions
History
Updated by Stéphanie Bouvier 7 months ago
- Assignee changed from Thomas Jund to Lauréline Guérin (absente)
Updated by Stéphanie Bouvier 7 months ago
- Assignee changed from Stéphanie Bouvier to Lauréline Guérin (absente)
Updated by Thomas Jund 4 months ago
un premier proto est disponible pour en discuter
https://codepen.io/Sacripant/pen/qEdaEQv
Updated by Thomas Jund 4 months ago
- Status changed from Nouveau to Information nécessaire
- Assignee changed from Thomas Jund to Valentin Deniaud
Updated by Frédéric Péters 4 months ago
- File une-ou-deux-lignes.png une-ou-deux-lignes.png added
De la description : "avec la possibilité de passer d'une semaine à l'autre" ça me semble manquer.
~~
"réserver + d'infos" parfois sur une ligne parfois sur deux, s'agit-il de faire un choix ?
Updated by Frédéric Péters 4 months ago
Aussi, quel rendu pour plusieurs évènements à la même heure ou qui se chevauchent ?
Dans le codepen lundi il y a Pilate 10h - 11h puis Pilate 10h30 - 12h30, avec ce dernier qui apparait uniquement sur la zone "11h - 12h30", mais je ne sais pas si c'est volontaire (puisque l'après-midi, et les autres jours, les éléments disent "10h-11h" et ne sont pas du tout calés sur ces heures).
Aussi (bis), quel rendu avec des libellés d'évènements qui seraient "un peu long" ?
Updated by Valentin Deniaud 4 months ago
- Status changed from Information nécessaire to En cours
🤖 Une pull request concernant ce ticket a été ouverte :
- URL : https://git.entrouvert.org/entrouvert/combo/pulls/554
- Titre : WIP: chrono: add new events calendar cell (#104406)
- Modifications : https://git.entrouvert.org/entrouvert/combo/pulls/554/files
Updated by Valentin Deniaud 4 months ago
- Assignee changed from Valentin Deniaud to Thomas Jund
C'est intégré en mode très wip.
Pour le moment le paramétrage prend juste des slugs d'agenda séparés par des virgules, plus tard je verrais pour remplacer ça par une liste dynamique sourcée depuis chrono.
Points d'attention :- Les évènements peuvent ne pas avoir de durée et donc pas d'heure de fin, j'ai pour le moment ignoré, certainement que mon code crashe dans ce cas. À discuter de comment les gérer (on peut simplement ne pas les afficher).
- Il faut corriger le JS pour que les checks eslint passent, actuellement le commit ne passe pas la CI. (on peut lancer un pre-commit run --all-files pour les voir, même si la sortie affiche des erreurs sur d'autres choses sans lien pour moi)
- Pour le moment les évènements affichés sont bornés sur les délais de réservation : ça veut dire que si on regarde le calendrier le vendredi, alors on est assuré d'avoir les quatre premiers jours de la semaine vide car non réservables. Je ne trouve pas ça très joli mais si il faut faire autrement ça ajoutera pas mal de complexité.
Frédéric Péters a écrit :
De la description : "avec la possibilité de passer d'une semaine à l'autre" ça me semble manquer.
Vu avec Fred via jabber, j'ai fait ça en ajax, qui est simplement de redemander le rendu de la cellule sur une autre semaine. Il faut améliorer ça : d'abord réussir à attacher à nouveau le EventListener aux boutons après refresh (actuellement les boutons ne marchent que la première fois) (il y a certainement un truc à creuser autour de l'event JS combo:load-cell), ensuite les intégrer de manière propre au calendrier.
Updated by Valentin Deniaud 4 months ago
Valentin Deniaud a écrit :
Points d'attention :
Aussi, le bouton « + d'infos » ne fonctionne pas
Updated by Marie Kuntz 3 months ago
Les évènements peuvent ne pas avoir de durée et donc pas d'heure de fin, j'ai pour le moment ignoré, certainement que mon code crashe dans ce cas. À discuter de comment les gérer (on peut simplement ne pas les afficher).
Je ne sais pas quel cas d'usage justifie le fait de ne pas avoir de durée, mais en attendant d'avoir résolu ce mystère, je dirais bien que l'événement prend fin à 23h59 du jour de début. Alternativement, on peut décider de ne pas afficher, cela forcera à mettre une durée, mais le support des "je ne comprends pas pourquoi mon événement n'apparait pas" va être un peu pénible dans les premiers temps.
Pour le moment les évènements affichés sont bornés sur les délais de réservation : ça veut dire que si on regarde le calendrier le vendredi, alors on est assuré d'avoir les quatre premiers jours de la semaine vide car non réservables. Je ne trouve pas ça très joli mais si il faut faire autrement ça ajoutera pas mal de complexité.
Pourrait-on voir les événements sans les liens pour réserver/plus d'infos ?
Updated by Thomas Jund 2 months ago
- Related to Développement #109712: ajouter css buttons-group added
Updated by Thomas Jund 2 months ago
- File Capture d’écran du 2025-09-04 15-54-02.png Capture d’écran du 2025-09-04 15-54-02.png added
- Assignee changed from Thomas Jund to Valentin Deniaud
Mise à jour du dépot niveau template, CSS et JS :
- mise à jour du template avec ajout titre de la cellule et des class cell--title, cell--body
- déplacement des boutons dans le header du calendrier
- scssify des styles
- Ajustements typo
- Amélioration vue mobile en masquant les jours vides et les heures du calendrier
- JS suppression des erreurs eslint
- JS réécriture pour fonctionnement auprès refresh ajax
- Ajout d'un support pour passer un paramètre couleur pour les events
Des ajouts necessaires :
- Pouvoir donner une valeur à la hauteur d'une heure du calendrier, permettant de gérer manuellement la heuteur du calendrier et donc des événements (voir var --hour-height dans events-calendar.html)
- Pouvoir passer une option couleur (via un input type color) dans les options de l'événement (voir capture jointe pour exemple de rendu
Il manque
L'affichage du popup quand on clic sur "+ de détails". Pour le moment le code JS gère cela via jQueryUI. Mais JqeuryUI n'est plus chargé côté portail usager. Alors :
- C'est possible de l'ajouter et ça ira vite pour finaliser la cellule
- C'est pas possible et je dois écrire le code d'une modale specifique
- Voir écrire un truc en vue de remplacer jQueryUI dialog et donc un dev encore plus propre avec tests
Updated by Valentin Deniaud 2 months ago
- Related to Développement #109908: Ajouter un champ couleur dans les types d'évènements added
Updated by Frédéric Péters 2 months ago
J'avais ces questions dans un commentaire plus haut :
Aussi, quel rendu pour plusieurs évènements à la même heure ou qui se chevauchent ?
(...)
Aussi (bis), quel rendu avec des libellés d'évènements qui seraient "un peu long" ?
Updated by Valentin Deniaud 2 months ago
Frédéric Péters a écrit :
Aussi, quel rendu pour plusieurs évènements à la même heure ou qui se chevauchent ?
Les évènements vont se superposer, la transparence fera que ça sera un peu lisible mais pas beau en cas de chevauchement, pas du tout lisible en cas de superposition.
Aussi (bis), quel rendu avec des libellés d'évènements qui seraient "un peu long" ?
Vu qu'on gère le passage des semaines côté serveur, le JS n'est pas au courant de la taille que peuvent faire les libellés d'une semaine à l'autre. Donc si la taille s'adaptait automatiquement, ça ferait des variations bizarres d'une semaine à l'autre. Le plus simple c'est donc d'avoir la hauteur des heures configurable dans les paramètres de la cellule, charge à chacun de choisir quelque chose d'adapté
Updated by Valentin Deniaud about 2 months ago
- Assignee changed from Valentin Deniaud to Thomas Jund
Updated by Thomas Jund about 2 months ago
- Related to Développement #110428: Revoir les styles de JqueryUI Dialog added
Updated by Valentin Deniaud about 2 months ago
- Status changed from En cours to Solution proposée
Updated by Gael Pasgrimaud about 1 month ago
- Status changed from Solution proposée to En cours
🤖 Modifications demandées sur la pull request :
Updated by Valentin Deniaud about 1 month ago
🤖 Relecture de Gael Pasgrimaud (gpasgrimaud) demandée sur la pull request :
Updated by Gael Pasgrimaud about 1 month ago
- Status changed from Solution proposée to Solution validée
🤖 Pull request approuvée :
Updated by Thomas Jund about 1 month ago
- Status changed from Solution validée to Résolu (à déployer)
🤖 Pull request fusionnée :
- URL : https://git.entrouvert.org/entrouvert/combo/pulls/554
- Titre : chrono: add new events calendar cell (#104406)
- Modifications : https://git.entrouvert.org/entrouvert/combo/pulls/554/files
Updated by Valentin Deniaud about 1 month ago
- Related to Développement #111062: cellule évènements, inclure les fichiers css dans le manifest added
Updated by Transition automatique about 1 month ago
- Status changed from Résolu (à déployer) to Solution déployée
Updated by Marie Kuntz about 1 month ago
- Related to Développement #111067: Nouvelle cellule "Événements" : deux événements concurrents se chevauchent de manière illisible added
Updated by Marie Kuntz about 1 month ago
- Related to Développement #111069: Nouvelle cellule "Événements" : si la hauteur de l'heure est trop petite, l'intitulé est tronqué et le lien "Réserver" est inaccessible added
Updated by Marie Kuntz about 1 month ago
- Related to Développement #111070: Nouvelle cellule "Événements" : ça manque un peu de help text added
Updated by Marie Kuntz about 1 month ago
- Related to Développement #111071: Nouvelle cellule "Événements" : ça manque un peu de place sur les champs de paramétrage added
chrono: add new events calendar cell (#104406)