aboutsummaryrefslogtreecommitdiff
path: root/public/js/calendar.js
diff options
context:
space:
mode:
Diffstat (limited to 'public/js/calendar.js')
-rw-r--r--public/js/calendar.js27
1 files changed, 17 insertions, 10 deletions
diff --git a/public/js/calendar.js b/public/js/calendar.js
index 8809246..b3aa927 100644
--- a/public/js/calendar.js
+++ b/public/js/calendar.js
@@ -1,7 +1,7 @@
1// js/calendar.js 1// js/calendar.js
2 2
3document.addEventListener('DOMContentLoaded', function(){ 3document.addEventListener('DOMContentLoaded', function(){
4 const calendarEl = document.getElementById('calendar'); 4 const calendarEl = getElementOrThrow('calendar');
5 let selected_start_string = null; 5 let selected_start_string = null;
6 6
7 const calendar = new FullCalendar.Calendar(calendarEl,{ 7 const calendar = new FullCalendar.Calendar(calendarEl,{
@@ -58,7 +58,10 @@ document.addEventListener('DOMContentLoaded', function(){
58 //unselect: function(event, view){}, 58 //unselect: function(event, view){},
59 59
60 eventClick: function(info){ 60 eventClick: function(info){
61 const aside = document.querySelector('aside'); 61 const modal = getElementOrThrow('event_modal');
62 if(!info.event.start || !info.event.end){
63 throw new Error('modale non conforme');
64 }
62 const checked = info.event.allDay ? 'checked' : ''; 65 const checked = info.event.allDay ? 'checked' : '';
63 66
64 // change des objets Date en chaînes compatibles avec les input 67 // change des objets Date en chaînes compatibles avec les input
@@ -75,25 +78,25 @@ document.addEventListener('DOMContentLoaded', function(){
75 const start_date = start.split('T')[0]; 78 const start_date = start.split('T')[0];
76 const start_hour = (info.event.allDay ? '' : '<br>à ' + start.split('T')[1]).replace(":", "h"); 79 const start_hour = (info.event.allDay ? '' : '<br>à ' + start.split('T')[1]).replace(":", "h");
77 const formated_start = start_date.split('-')[2] + '/' + start_date.split('-')[1] + '/' + start_date.split('-')[0] + start_hour; 80 const formated_start = start_date.split('-')[2] + '/' + start_date.split('-')[1] + '/' + start_date.split('-')[0] + start_hour;
78 const end = formatDate(info.event.allDay ? minusOneDay(info.event.end) : info.event.end, info.event.allDay); 81 const end = formatDate(info.event.allDay ? minusOneDay(info.event.end) : info.event.end);
79 const end_date = end.split('T')[0]; 82 const end_date = end.split('T')[0];
80 const end_hour = (info.event.allDay ? '' : '<br>à ' + end.split('T')[1]).replace(":", "h"); 83 const end_hour = (info.event.allDay ? '' : '<br>à ' + end.split('T')[1]).replace(":", "h");
81 const formated_end = end_date.split('-')[2] + '/' + end_date.split('-')[1] + '/' + end_date.split('-')[0] + end_hour; 84 const formated_end = end_date.split('-')[2] + '/' + end_date.split('-')[1] + '/' + end_date.split('-')[0] + end_hour;
82 85
83 let aside_content = `<div id="event" style="border-color: ` + info.event.backgroundColor +`;"> 86 let modal_content = `<div id="event" style="border-color: ` + info.event.backgroundColor +`;">
84 <h3>` + info.event.title + `</h3> 87 <h3>` + info.event.title + `</h3>
85 <p><i>` + info.event.extendedProps.description + `</i></p>`; 88 <p><i>` + info.event.extendedProps.description + `</i></p>`;
86 if(checked && (formated_start === formated_end)){ // affichage simplifié évènement d'un jour 89 if(checked && (formated_start === formated_end)){ // affichage simplifié évènement d'un jour
87 aside_content = aside_content + `<p>le ` + formated_start + `</p>`; 90 modal_content = modal_content + `<p>le ` + formated_start + `</p>`;
88 } 91 }
89 else{ 92 else{
90 aside_content = aside_content + `<p>du ` + formated_start + `</p> 93 modal_content = modal_content + `<p>du ` + formated_start + `</p>
91 <p>au ` + formated_end + `</p>`; 94 <p>au ` + formated_end + `</p>`;
92 } 95 }
93 aside_content += `<button class="event_close_button">Fermer</button> 96 modal_content += `<button class="event_close_button">Fermer</button>
94 </div>`; 97 </div>`;
95 98
96 aside.innerHTML = aside_content; 99 modal.innerHTML = modal_content;
97 calendar.updateSize(); 100 calendar.updateSize();
98 }, 101 },
99 viewDidMount: function(info){ // déclenché lorsque qu'une nouvelle vue est chargée (mois, semaine...) 102 viewDidMount: function(info){ // déclenché lorsque qu'une nouvelle vue est chargée (mois, semaine...)
@@ -105,8 +108,8 @@ document.addEventListener('DOMContentLoaded', function(){
105 }); 108 });
106 109
107 function hideModal(){ 110 function hideModal(){
108 const aside = document.querySelector('aside'); 111 const modal = getElementOrThrow('event_modal');
109 aside.innerHTML = ''; 112 modal.innerHTML = '';
110 calendar.updateSize(); 113 calendar.updateSize();
111 } 114 }
112 115
@@ -118,6 +121,10 @@ document.addEventListener('DOMContentLoaded', function(){
118 121
119 // technique de la délégation d'événements pour utiliser un bouton ajouté dynamiquement 122 // technique de la délégation d'événements pour utiliser un bouton ajouté dynamiquement
120 document.addEventListener('click', function(event){ 123 document.addEventListener('click', function(event){
124 if(!event.target){
125 throw new Error('évènement click non conforme');
126 }
127 assertElementType(event.target, HTMLElement);
121 if(event.target.classList.contains('event_close_button')){ 128 if(event.target.classList.contains('event_close_button')){
122 hideModal(); 129 hideModal();
123 } 130 }