diff options
-rw-r--r-- | public/js/calendar.js | 22 | ||||
-rw-r--r-- | public/js/calendar_admin.js | 32 |
2 files changed, 38 insertions, 16 deletions
diff --git a/public/js/calendar.js b/public/js/calendar.js index 2275c10..844d411 100644 --- a/public/js/calendar.js +++ b/public/js/calendar.js | |||
@@ -28,9 +28,8 @@ document.addEventListener('DOMContentLoaded', function(){ | |||
28 | // pour recalculer la taille au redimensionnement du parent, exécuter: calendar.updateSize() | 28 | // pour recalculer la taille au redimensionnement du parent, exécuter: calendar.updateSize() |
29 | stickyHeaderDates: true, // garder les en-tête de colonnes lors du scroll | 29 | stickyHeaderDates: true, // garder les en-tête de colonnes lors du scroll |
30 | fixedWeekCount: false, // avec false, affiche 4, 5 ou 6 semaines selon le mois | 30 | fixedWeekCount: false, // avec false, affiche 4, 5 ou 6 semaines selon le mois |
31 | selectable: true, // sélection de jours multiples | 31 | selectable: true, // sélection de jours en cliquant dessus |
32 | longPressDelay: 0, /* par défaut sur mobile, select est déclenché avec un appui d'une seconde, | 32 | longPressDelay: 300, // 1000ms par défaut |
33 | chatgpt déconseille 0 par risque de conflit entre selection et scrolling, mettre plutôt 200 ou 300ms */ | ||
34 | navLinks: true, // numéros de jour et de semaines clicables | 33 | navLinks: true, // numéros de jour et de semaines clicables |
35 | 34 | ||
36 | // vue semaine | 35 | // vue semaine |
@@ -45,14 +44,17 @@ document.addEventListener('DOMContentLoaded', function(){ | |||
45 | selected_start_string = info.startStr; // variable "globale" | 44 | selected_start_string = info.startStr; // variable "globale" |
46 | hideModal(); | 45 | hideModal(); |
47 | }, | 46 | }, |
48 | // méthode alternative à longPressDelay: 0 pour obtenir une sélection d'un simple "tap" sur écran tactile (mettre le if inverse dans select) | 47 | // sélection d'une date simple sur mobile, évite des problèmes de conflit avec eventClick |
49 | /*dateClick: function(info) { | 48 | dateClick: function(info){ |
50 | if (window.matchMedia('(pointer: coarse)').matches) { | 49 | if(window.matchMedia('(pointer: coarse)').matches){ |
51 | // utile sur mobile/tablette : déclenche sur un tap | 50 | const end = new Date(info.date.getTime()); |
52 | console.log('dateClick', info.dateStr); | 51 | calendar.view.type == 'dayGridMonth' ? end.setDate(end.getDate() + 1) : end.setMinutes(end.getMinutes() + 30); |
53 | calendar.select(info.date, info.date); // hack permettant de sélectionner une journée seule uniquement | 52 | // vue date: la fin est une date exclue |
53 | // vue semaine: durée de 30min par défaut | ||
54 | |||
55 | calendar.select(info.date, end); // appeler select() avec un seul paramètre ne marche pas avec la vue "mois" | ||
54 | } | 56 | } |
55 | },*/ | 57 | }, |
56 | //unselect: function(event, view){}, | 58 | //unselect: function(event, view){}, |
57 | 59 | ||
58 | eventClick: function(info){ | 60 | eventClick: function(info){ |
diff --git a/public/js/calendar_admin.js b/public/js/calendar_admin.js index 7f167a4..90e2942 100644 --- a/public/js/calendar_admin.js +++ b/public/js/calendar_admin.js | |||
@@ -29,9 +29,8 @@ document.addEventListener('DOMContentLoaded', function(){ | |||
29 | // pour recalculer la taille au redimensionnement du parent, exécuter: calendar.updateSize() | 29 | // pour recalculer la taille au redimensionnement du parent, exécuter: calendar.updateSize() |
30 | stickyHeaderDates: true, // garder les en-tête de colonnes lors du scroll | 30 | stickyHeaderDates: true, // garder les en-tête de colonnes lors du scroll |
31 | fixedWeekCount: false, // avec false, affiche 4, 5 ou 6 semaines selon le mois | 31 | fixedWeekCount: false, // avec false, affiche 4, 5 ou 6 semaines selon le mois |
32 | selectable: true, // sélection de jours multiples | 32 | selectable: true, // sélection de jours en cliquant dessus |
33 | longPressDelay: 0, /* par défaut sur mobile, select est déclenché avec un appui d'une seconde, | 33 | longPressDelay: 300, // 1000ms par défaut |
34 | chatgpt déconseille 0 par risque de conflit entre selection et scrolling, mettre plutôt 200 ou 300ms */ | ||
35 | navLinks: true, // numéros de jour et de semaines clicables | 34 | navLinks: true, // numéros de jour et de semaines clicables |
36 | 35 | ||
37 | // vue semaine | 36 | // vue semaine |
@@ -58,10 +57,11 @@ document.addEventListener('DOMContentLoaded', function(){ | |||
58 | const end = new Date(info.endStr); | 57 | const end = new Date(info.endStr); |
59 | 58 | ||
60 | if(calendar.view.type == 'dayGridMonth'){ | 59 | if(calendar.view.type == 'dayGridMonth'){ |
61 | start_value = info.startStr + 'T10:00'; | 60 | const start = new Date(info.startStr); |
61 | start_value = start.toISOString().split('T')[0] + 'T10:00'; | ||
62 | |||
62 | end.setDate(end.getDate() - 1); // jour de fin modifié pour ne pas faire bizarre pour l'utilisateur | 63 | end.setDate(end.getDate() - 1); // jour de fin modifié pour ne pas faire bizarre pour l'utilisateur |
63 | end.setHours(11); | 64 | end_value = end.toISOString().split('T')[0] + 'T10:30'; |
64 | end_value = end.toISOString().split('T')[0] + 'T11:00'; | ||
65 | } | 65 | } |
66 | else if(calendar.view.type == 'timeGridWeek' || calendar.view.type == 'timeGridDay'){ | 66 | else if(calendar.view.type == 'timeGridWeek' || calendar.view.type == 'timeGridDay'){ |
67 | const start_array = info.startStr.split("T"); | 67 | const start_array = info.startStr.split("T"); |
@@ -115,6 +115,26 @@ document.addEventListener('DOMContentLoaded', function(){ | |||
115 | aside.innerHTML = aside_content; | 115 | aside.innerHTML = aside_content; |
116 | calendar.updateSize(); | 116 | calendar.updateSize(); |
117 | }, | 117 | }, |
118 | // sélection d'une date simple sur mobile, évite des problèmes de conflit avec eventClick | ||
119 | dateClick: function(info){ | ||
120 | if(window.matchMedia('(pointer: coarse)').matches){ | ||
121 | const end = new Date(info.date); | ||
122 | calendar.view.type == 'dayGridMonth' ? end.setDate(end.getDate() + 1) : end.setMinutes(end.getMinutes() + 30); | ||
123 | // vue date: la fin est une date exclue | ||
124 | // vue semaine: durée de 30min par défaut | ||
125 | |||
126 | const local_end_date_array = end.toLocaleDateString().split('/'); | ||
127 | let local_end_str = local_end_date_array[2] + '-' + local_end_date_array[1] + '-' + local_end_date_array[0]; | ||
128 | |||
129 | if(calendar.view.type != 'dayGridMonth'){ | ||
130 | local_end_str += 'T' + end.toLocaleTimeString(); | ||
131 | } | ||
132 | |||
133 | // on a besoin de deux chaînes représentant l'heure locale pour obtenir le même objet "info" qu'avec l'évènement select | ||
134 | // la vue "dayGridMonth" nécessite deux paramètres, par sécurité on en enverra toujours deux | ||
135 | calendar.select(info.dateStr, local_end_str); | ||
136 | } | ||
137 | }, | ||
118 | //unselect: function(event, view){}, | 138 | //unselect: function(event, view){}, |
119 | eventClick: function(info){ | 139 | eventClick: function(info){ |
120 | event_selected = true; // variable "globale" | 140 | event_selected = true; // variable "globale" |