128 lines
4.5 KiB
JavaScript
128 lines
4.5 KiB
JavaScript
document.addEventListener('DOMContentLoaded', function() {
|
|
// Gestion du menu mobile
|
|
const mobileMenuToggle = document.querySelector('.mobile-menu-toggle');
|
|
const mobileMenuOverlay = document.getElementById('mobileMenuOverlay');
|
|
const mobileMenuClose = document.querySelector('.mobile-menu-close');
|
|
|
|
if (mobileMenuToggle) {
|
|
mobileMenuToggle.addEventListener('click', function() {
|
|
mobileMenuOverlay.style.display = 'block';
|
|
document.body.style.overflow = 'hidden'; // Empêche le défilement de la page
|
|
});
|
|
}
|
|
|
|
if (mobileMenuClose) {
|
|
mobileMenuClose.addEventListener('click', function() {
|
|
mobileMenuOverlay.style.display = 'none';
|
|
document.body.style.overflow = ''; // Réactive le défilement
|
|
});
|
|
}
|
|
|
|
// Fermer le menu en cliquant en dehors
|
|
if (mobileMenuOverlay) {
|
|
mobileMenuOverlay.addEventListener('click', function(e) {
|
|
if (e.target === mobileMenuOverlay) {
|
|
mobileMenuOverlay.style.display = 'none';
|
|
document.body.style.overflow = '';
|
|
}
|
|
});
|
|
}
|
|
|
|
// Gestion des vidéos
|
|
const videoCards = document.querySelectorAll('.video-card');
|
|
|
|
videoCards.forEach(card => {
|
|
card.addEventListener('click', function() {
|
|
const videoId = this.dataset.videoId;
|
|
if (videoId) {
|
|
window.location.href = 'video.php?id=' + videoId;
|
|
}
|
|
});
|
|
});
|
|
|
|
// Lazy loading des images
|
|
if ('IntersectionObserver' in window) {
|
|
const imageObserver = new IntersectionObserver((entries, observer) => {
|
|
entries.forEach(entry => {
|
|
if (entry.isIntersecting) {
|
|
const img = entry.target;
|
|
const src = img.getAttribute('data-src');
|
|
if (src) {
|
|
img.src = src;
|
|
img.removeAttribute('data-src');
|
|
}
|
|
observer.unobserve(img);
|
|
}
|
|
});
|
|
});
|
|
|
|
document.querySelectorAll('img[data-src]').forEach(img => {
|
|
imageObserver.observe(img);
|
|
});
|
|
} else {
|
|
// Fallback pour les navigateurs qui ne supportent pas IntersectionObserver
|
|
document.querySelectorAll('img[data-src]').forEach(img => {
|
|
const src = img.getAttribute('data-src');
|
|
if (src) {
|
|
img.src = src;
|
|
img.removeAttribute('data-src');
|
|
}
|
|
});
|
|
}
|
|
|
|
// Fonction pour formater le nombre de vues
|
|
function formatViewCount(views) {
|
|
if (views >= 1000000) {
|
|
return (views / 1000000).toFixed(1) + 'M';
|
|
} else if (views >= 1000) {
|
|
return (views / 1000).toFixed(1) + 'K';
|
|
} else {
|
|
return views.toString();
|
|
}
|
|
}
|
|
|
|
// Fonction pour formater la durée des vidéos
|
|
function formatDuration(seconds) {
|
|
const hours = Math.floor(seconds / 3600);
|
|
const minutes = Math.floor((seconds % 3600) / 60);
|
|
const remainingSeconds = seconds % 60;
|
|
|
|
if (hours > 0) {
|
|
return `${hours}:${minutes.toString().padStart(2, '0')}:${remainingSeconds.toString().padStart(2, '0')}`;
|
|
} else {
|
|
return `${minutes}:${remainingSeconds.toString().padStart(2, '0')}`;
|
|
}
|
|
}
|
|
|
|
// Fonction pour formater la date
|
|
function formatDate(dateString) {
|
|
const date = new Date(dateString);
|
|
const now = new Date();
|
|
const diffTime = Math.abs(now - date);
|
|
const diffDays = Math.floor(diffTime / (1000 * 60 * 60 * 24));
|
|
|
|
if (diffDays < 1) {
|
|
return 'Aujourd\'hui';
|
|
} else if (diffDays === 1) {
|
|
return 'Hier';
|
|
} else if (diffDays < 7) {
|
|
return `Il y a ${diffDays} jours`;
|
|
} else if (diffDays < 30) {
|
|
const diffWeeks = Math.floor(diffDays / 7);
|
|
return `Il y a ${diffWeeks} semaine${diffWeeks > 1 ? 's' : ''}`;
|
|
} else if (diffDays < 365) {
|
|
const diffMonths = Math.floor(diffDays / 30);
|
|
return `Il y a ${diffMonths} mois`;
|
|
} else {
|
|
const diffYears = Math.floor(diffDays / 365);
|
|
return `Il y a ${diffYears} an${diffYears > 1 ? 's' : ''}`;
|
|
}
|
|
}
|
|
|
|
// Exposer ces fonctions utilitaires globalement
|
|
window.videoUtils = {
|
|
formatViewCount,
|
|
formatDuration,
|
|
formatDate
|
|
};
|
|
});
|