98 lines
3.1 KiB
JavaScript
98 lines
3.1 KiB
JavaScript
/**
|
|
* Script de compte à rebours pour la page de maintenance
|
|
*/
|
|
|
|
class CountdownTimer {
|
|
constructor(targetDate) {
|
|
this.targetDate = new Date(targetDate).getTime();
|
|
this.elements = {
|
|
days: document.getElementById('countdown-days'),
|
|
hours: document.getElementById('countdown-hours'),
|
|
minutes: document.getElementById('countdown-minutes'),
|
|
seconds: document.getElementById('countdown-seconds')
|
|
};
|
|
|
|
this.start();
|
|
}
|
|
|
|
start() {
|
|
// Mise à jour immédiate
|
|
this.updateTimer();
|
|
|
|
// Mise à jour chaque seconde
|
|
this.interval = setInterval(() => {
|
|
this.updateTimer();
|
|
}, 1000);
|
|
}
|
|
|
|
updateTimer() {
|
|
const now = new Date().getTime();
|
|
const distance = this.targetDate - now;
|
|
|
|
if (distance < 0) {
|
|
// Le compte à rebours est terminé
|
|
this.stop();
|
|
this.onComplete();
|
|
return;
|
|
}
|
|
|
|
const days = Math.floor(distance / (1000 * 60 * 60 * 24));
|
|
const hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
|
|
const minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
|
|
const seconds = Math.floor((distance % (1000 * 60)) / 1000);
|
|
|
|
// Mise à jour des éléments du DOM
|
|
if (this.elements.days) this.elements.days.textContent = this.formatNumber(days);
|
|
if (this.elements.hours) this.elements.hours.textContent = this.formatNumber(hours);
|
|
if (this.elements.minutes) this.elements.minutes.textContent = this.formatNumber(minutes);
|
|
if (this.elements.seconds) this.elements.seconds.textContent = this.formatNumber(seconds);
|
|
}
|
|
|
|
formatNumber(num) {
|
|
return num.toString().padStart(2, '0');
|
|
}
|
|
|
|
stop() {
|
|
if (this.interval) {
|
|
clearInterval(this.interval);
|
|
}
|
|
}
|
|
|
|
onComplete() {
|
|
// Rediriger vers la page principale quand le compte à rebours est terminé
|
|
window.location.href = '/';
|
|
}
|
|
}
|
|
|
|
// Animation des éléments au chargement
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
// Initialiser le compte à rebours si les éléments existent
|
|
if (document.getElementById('countdown-days')) {
|
|
// La date cible est fournie par PHP
|
|
if (typeof COUNTDOWN_TARGET_DATE !== 'undefined') {
|
|
new CountdownTimer(COUNTDOWN_TARGET_DATE);
|
|
}
|
|
}
|
|
|
|
// Animation d'apparition progressive
|
|
const elements = document.querySelectorAll('.countdown-container > *');
|
|
elements.forEach((element, index) => {
|
|
element.style.opacity = '0';
|
|
element.style.transform = 'translateY(30px)';
|
|
|
|
setTimeout(() => {
|
|
element.style.transition = 'opacity 0.8s ease, transform 0.8s ease';
|
|
element.style.opacity = '1';
|
|
element.style.transform = 'translateY(0)';
|
|
}, 100 * (index + 1));
|
|
});
|
|
});
|
|
|
|
// Gérer la fermeture propre du timer
|
|
window.addEventListener('beforeunload', function() {
|
|
// Arrêter le timer si il existe
|
|
if (window.countdownTimer) {
|
|
window.countdownTimer.stop();
|
|
}
|
|
});
|