Corrige le pb d'affichage de l'heure de l'événement
This commit is contained in:
parent
2e9faf4f11
commit
ae8221caad
@ -23,7 +23,7 @@ const events = generateEvents(objOptions);
|
||||
// https://www.jqueryscript.net/time-clock/animated-calendar-event-gc.html
|
||||
|
||||
$(function (e) {
|
||||
var calendar = $("#calendar").calendarGC({
|
||||
const calendar = $("#calendar").calendarGC({
|
||||
dayBegin: 0,
|
||||
dayNames: ['Lun', 'Mar', 'Mer', 'Jeu', 'Ven', 'Sam', 'Dim'],
|
||||
monthNames: ['Janvier', 'Février', 'Mars', 'Avril', 'Mai', 'Juin', 'Juillet', 'Août', 'Septembre', 'Octobre', 'Novembre', 'Décembre'],
|
||||
@ -42,10 +42,10 @@ $(function (e) {
|
||||
|
||||
onclickDate: function (e, data) {
|
||||
// Extraire la date cliquée au format YYYY-MM-DD
|
||||
var targetDate = formatDate(data.datejs);
|
||||
const targetDate = formatDate(data.datejs);
|
||||
// console.log(data);
|
||||
// Filtrer les événements pour la date cliquée
|
||||
var filteredEvents = $.grep(events, function (event) {
|
||||
const filteredEvents = $.grep(events, function (event) {
|
||||
//console.log("Comparaison avec : " + formatDate(event.date));
|
||||
return formatDate(event.date) === targetDate;
|
||||
});
|
||||
@ -60,7 +60,7 @@ $(function (e) {
|
||||
$.each(filteredEvents, function (index, event) {
|
||||
// Vérifier si une heure est spécifiée et formater correctement
|
||||
//console.log(event);
|
||||
var eventTime = event.eventTime ? event.eventTime : 'toute la journée';
|
||||
const eventTime = event.eventTime ? event.eventTime : 'toute la journée';
|
||||
eventListHtml += '<li><strong>' + event.eventName + '</strong><br>' + eventTime + '</li>';
|
||||
});
|
||||
// Titre de la popup
|
||||
@ -96,10 +96,10 @@ $(function (e) {
|
||||
// Ajoute un écouteur d'événement pour le clic sur l'élément avec la classe gc-calendar-month-year
|
||||
$(document).on('click', '.gc-calendar-month-year', function() {
|
||||
// Obtient la date courante
|
||||
var currentDate = new Date();
|
||||
const currentDate = new Date();
|
||||
|
||||
// Formate la date au format "YYYY-MM-DD"
|
||||
var formattedDate = currentDate.toISOString().split('T')[0];
|
||||
const formattedDate = currentDate.toISOString().split('T')[0];
|
||||
|
||||
// Définit la date du calendrier sur la date courante
|
||||
calendar.setDate(formattedDate);
|
||||
@ -112,29 +112,18 @@ $(function (e) {
|
||||
|
||||
function showPopup(data) {
|
||||
|
||||
var eventName = data.eventName;
|
||||
const eventName = data.eventName;
|
||||
|
||||
// Extraire la date et l'heure
|
||||
var eventDate = data.date.toLocaleDateString(); // Format : 18/08/2024
|
||||
const eventDate = data.date.toLocaleDateString(); // Format : 18/08/2024
|
||||
|
||||
// Vérifier si l'heure est définie et extraire l'heure si disponible
|
||||
var eventTime = data.eventTime === "" || data.date.getMinutes() ?
|
||||
data.date.toLocaleTimeString([], {
|
||||
hour: '2-digit',
|
||||
minute: '2-digit'
|
||||
}) :
|
||||
''; // Format : 12:00
|
||||
|
||||
const eventTime = data.eventTime === '' ?'Toute la journée' : 'à ' + data.eventTime; // Format : 12:00
|
||||
console.log (eventTime);
|
||||
// Injecter les informations dans la popup
|
||||
$('#eventName').text(eventName);
|
||||
$('#eventDate').text(eventDate);
|
||||
//console.log(eventTime);
|
||||
if (eventTime === '') {
|
||||
$('.eventTime').empty();
|
||||
$('.eventTime').append('<span id="eventTime">Toute la journée</span>');
|
||||
} else {
|
||||
$('#eventTime').text(eventTime);
|
||||
}
|
||||
|
||||
$('#eventTime').text(eventTime);
|
||||
|
||||
// Afficher la popup
|
||||
$('#eventPopup').fadeIn();
|
||||
@ -169,25 +158,25 @@ function generateEvents(objOptions) {
|
||||
}
|
||||
|
||||
function formatDate(datejs) {
|
||||
var year = datejs.getFullYear();
|
||||
var month = ('0' + (datejs.getMonth() + 1)).slice(-2); // Ajouter un zéro devant si nécessaire
|
||||
var day = ('0' + datejs.getDate()).slice(-2); // Ajouter un zéro devant si nécessaire
|
||||
const year = datejs.getFullYear();
|
||||
const month = ('0' + (datejs.getMonth() + 1)).slice(-2); // Ajouter un zéro devant si nécessaire
|
||||
const day = ('0' + datejs.getDate()).slice(-2); // Ajouter un zéro devant si nécessaire
|
||||
return year + '-' + month + '-' + day;
|
||||
}
|
||||
|
||||
function formatDateToDMY(dateString) {
|
||||
// Convertir la chaîne de caractères en objet Date
|
||||
var datejs = new Date(dateString);
|
||||
const datejs = new Date(dateString);
|
||||
|
||||
// Créer un tableau des noms de mois
|
||||
var monthNames = ['janvier', 'février', 'mars', 'avril', 'mai', 'juin', 'juillet',
|
||||
const monthNames = ['janvier', 'février', 'mars', 'avril', 'mai', 'juin', 'juillet',
|
||||
'août', 'septembre', 'octobre', 'novembre', 'décembre'
|
||||
];
|
||||
|
||||
// Obtenir le jour, le mois et l'année
|
||||
var day = datejs.getDate();
|
||||
var month = monthNames[datejs.getMonth()];
|
||||
var year = datejs.getFullYear();
|
||||
const day = datejs.getDate();
|
||||
const month = monthNames[datejs.getMonth()];
|
||||
const year = datejs.getFullYear();
|
||||
|
||||
// Retourner la date au format "jour mois année"
|
||||
return day + ' ' + month + ' ' + year;
|
||||
|
@ -5,7 +5,7 @@
|
||||
<span class="close-btn">×</span>
|
||||
<p><strong> <span id="eventName"></strong></span></p>
|
||||
<p>Le <span id="eventDate"></span>
|
||||
<p class="eventTime">à <span id="eventTime"></span></p>
|
||||
<p class="eventTime"><span id="eventTime"></span></p>
|
||||
</div>
|
||||
</div>
|
||||
<div id="eventListPopup" class="popup-overlay">
|
||||
|
Loading…
Reference in New Issue
Block a user