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.tar.gz fullcalendar-f007bac3b9172711dc0fcca1306270ab99dbd8a4.tar.bz2 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(); |
