diff options
author | polo <ordipolo@gmx.fr> | 2025-06-24 01:04:35 +0200 |
---|---|---|
committer | polo <ordipolo@gmx.fr> | 2025-06-24 01:04:35 +0200 |
commit | f007bac3b9172711dc0fcca1306270ab99dbd8a4 (patch) | |
tree | 7a34c7da793ed212af1e3ae5d879e6c587e3d8bb /public | |
parent | 8ee3440f204dfc6532a49a05719ba37a8c4df359 (diff) | |
download | fullcalendar-f007bac3b9172711dc0fcca1306270ab99dbd8a4.zip |
Diffstat (limited to 'public')
-rw-r--r-- | public/css/calendar.css | 24 | ||||
-rw-r--r-- | public/index.php | 8 | ||||
-rw-r--r-- | public/js/calendar.js | 21 |
3 files changed, 41 insertions, 12 deletions
diff --git a/public/css/calendar.css b/public/css/calendar.css index 5dfb343..b24fe5b 100644 --- a/public/css/calendar.css +++ b/public/css/calendar.css | |||
@@ -2,13 +2,15 @@ | |||
2 | border: 2px double; | 2 | border: 2px double; |
3 | border-radius: 5px; | 3 | border-radius: 5px; |
4 | width: max-content; | 4 | width: max-content; |
5 | padding: 5px; | ||
5 | } | 6 | } |
6 | #calendar_zone{ | 7 | #calendar_zone{ |
7 | display: flex; | 8 | display: flex; |
8 | max-width: 1000px; | 9 | max-width: 1170px; |
10 | gap: 5px; | ||
9 | } | 11 | } |
10 | #calendar{ | 12 | #calendar{ |
11 | width: -moz-available; | 13 | width: 1165px; |
12 | } | 14 | } |
13 | .event_title_box{ | 15 | .event_title_box{ |
14 | display: flex; | 16 | display: flex; |
@@ -46,4 +48,20 @@ td .fc-timegrid-axis{ | |||
46 | color: white; | 48 | color: white; |
47 | background-color: #00679e; | 49 | background-color: #00679e; |
48 | border-radius: 5px; | 50 | border-radius: 5px; |
49 | } \ No newline at end of file | 51 | } |
52 | |||
53 | @media screen and (max-width: 900px){ | ||
54 | #calendar_zone{ | ||
55 | padding: 0; | ||
56 | } | ||
57 | .fc-toolbar-title{ | ||
58 | font-size: large !important; | ||
59 | } | ||
60 | } | ||
61 | @media screen and (max-width: 650px){ | ||
62 | .fc-toolbar-chunk{ | ||
63 | font-size: smaller; | ||
64 | } | ||
65 | } | ||
66 | @media screen and (max-width: 550px){ | ||
67 | } | ||
diff --git a/public/index.php b/public/index.php index 99220e8..540e8ab 100644 --- a/public/index.php +++ b/public/index.php | |||
@@ -8,6 +8,7 @@ require '../src/controller/calendar.php'; | |||
8 | <head> | 8 | <head> |
9 | <meta charset="utf-8" /> | 9 | <meta charset="utf-8" /> |
10 | <title>fullcalendar</title> | 10 | <title>fullcalendar</title> |
11 | <meta name="viewport" content="width=device-width"> | ||
11 | <link rel="stylesheet" href="css/calendar.css"> | 12 | <link rel="stylesheet" href="css/calendar.css"> |
12 | <!-- <link rel='stylesheet' href='https://cdn.jsdelivr.net/npm/fullcalendar/main.min.css' /> --> | 13 | <!-- <link rel='stylesheet' href='https://cdn.jsdelivr.net/npm/fullcalendar/main.min.css' /> --> |
13 | <script src='js/fullcalendar/packages/core/index.global.min.js'></script> | 14 | <script src='js/fullcalendar/packages/core/index.global.min.js'></script> |
@@ -17,7 +18,12 @@ require '../src/controller/calendar.php'; | |||
17 | <script src='js/fullcalendar/packages/interaction/index.global.min.js'></script> | 18 | <script src='js/fullcalendar/packages/interaction/index.global.min.js'></script> |
18 | <script src='js/fullcalendar/packages/core/locales/fr.global.min.js'></script> | 19 | <script src='js/fullcalendar/packages/core/locales/fr.global.min.js'></script> |
19 | <?php | 20 | <?php |
20 | echo (isset($_SESSION['admin']) && $_SESSION['admin'] === true) ? '<script src="js/calendar_admin.js"></script>' . "\n" : '<script src="js/calendar.js"></script>' . "\n"; | 21 | if($_SESSION['admin'] === true){ |
22 | echo '<script src="js/calendar_admin.js"></script>' . "\n"; | ||
23 | } | ||
24 | else{ | ||
25 | echo '<script src="js/calendar.js"></script>' . "\n"; | ||
26 | } | ||
21 | ?> | 27 | ?> |
22 | </head> | 28 | </head> |
23 | 29 | ||
diff --git a/public/js/calendar.js b/public/js/calendar.js index 2193272..a092632 100644 --- a/public/js/calendar.js +++ b/public/js/calendar.js | |||
@@ -62,19 +62,24 @@ document.addEventListener('DOMContentLoaded', function(){ | |||
62 | const start = formatDate(info.event.start); | 62 | const start = formatDate(info.event.start); |
63 | const start_date = start.split('T')[0]; | 63 | const start_date = start.split('T')[0]; |
64 | const start_hour = (info.event.allDay ? '' : '<br>à ' + start.split('T')[1]).replace(":", "h"); | 64 | const start_hour = (info.event.allDay ? '' : '<br>à ' + start.split('T')[1]).replace(":", "h"); |
65 | const formated_start = 'le ' + start_date.split('-')[2] + '/' + start_date.split('-')[1] + '/' + start_date.split('-')[0] + start_hour; | 65 | const formated_start = start_date.split('-')[2] + '/' + start_date.split('-')[1] + '/' + start_date.split('-')[0] + start_hour; |
66 | const end = formatDate(info.event.allDay ? minusOneDay(info.event.end) : info.event.end, info.event.allDay); | 66 | const end = formatDate(info.event.allDay ? minusOneDay(info.event.end) : info.event.end, info.event.allDay); |
67 | const end_date = end.split('T')[0]; | 67 | const end_date = end.split('T')[0]; |
68 | const end_hour = (info.event.allDay ? '' : '<br>à ' + end.split('T')[1]).replace(":", "h"); | 68 | const end_hour = (info.event.allDay ? '' : '<br>à ' + end.split('T')[1]).replace(":", "h"); |
69 | const formated_end = 'le ' + end_date.split('-')[2] + '/' + end_date.split('-')[1] + '/' + end_date.split('-')[0] + end_hour; | 69 | const formated_end = end_date.split('-')[2] + '/' + end_date.split('-')[1] + '/' + end_date.split('-')[0] + end_hour; |
70 | 70 | ||
71 | const aside_content = `<div class="event" style="border-color: ` + info.event.backgroundColor +`;"> | 71 | let aside_content = `<div class="event" style="border-color: ` + info.event.backgroundColor +`;"> |
72 | <h3>` + info.event.title + `</h3> | 72 | <h3>` + info.event.title + `</h3> |
73 | <p><i>` + info.event.extendedProps.description + `</i></p> | 73 | <p><i>` + info.event.extendedProps.description + `</i></p>`; |
74 | <p>Journée entière: <br>` + (checked ? 'oui' : 'non') + `</p> | 74 | if(checked && (formated_start === formated_end)){ // affichage simplifié évènement d'un jour |
75 | <p>Début: <br>` + formated_start + `</p> | 75 | aside_content = aside_content + `<p>le ` + formated_start + `</p> |
76 | <p>Fin: <br> ` + formated_end + `</p> | ||
77 | </div>`; | 76 | </div>`; |
77 | } | ||
78 | else{ | ||
79 | aside_content = aside_content + `<p>du ` + formated_start + `</p> | ||
80 | <p>au ` + formated_end + `</p> | ||
81 | </div>`; | ||
82 | } | ||
78 | 83 | ||
79 | aside.innerHTML = aside_content; | 84 | aside.innerHTML = aside_content; |
80 | calendar.updateSize(); | 85 | calendar.updateSize(); |