camelia-studio/ICO
camelia-studio/ICO
2
0
Fork 0
Code Issues 10 Pull Requests Actions Packages Projects Releases 15 Wiki Activity

le carrousel utilise les images d'un dossier qui lui ait dédié

Browse Source
This commit is contained in:
Esenjin 2025-01-03 00:19:11 +01:00
parent d304eca78d
commit 04fd71ed5f
6 changed files with 107 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
arbre-img.php
View File

@ -128,9 +128,9 @@ $images = array_map(function($img) {
<link rel="stylesheet" href="styles.css"> <link rel="stylesheet" href="styles.css">
<link rel="stylesheet" href="styles-admin.css"> <link rel="stylesheet" href="styles-admin.css">
</head> </head>
<body class="admin-page"> <body class="admin-page" data-page="<?php echo strpos($currentPath, 'img_carrousel') !== false ? 'carrousel' : 'default'; ?>">
<div class="admin-header"> <div class="admin-header">
<h1>Gestion des images</h1> <h1><?php echo strpos($currentPath, 'img_carrousel') !== false ? 'Images du carrousel' : 'Gestion des images'; ?></h1>
<div class="admin-actions"> <div class="admin-actions">
<button onclick="document.getElementById('imageUploadForm').click()" class="action-button action-button-success"> <button onclick="document.getElementById('imageUploadForm').click()" class="action-button action-button-success">
Ajouter des images Ajouter des images
@ -167,7 +167,14 @@ $images = array_map(function($img) {
<input type="hidden" name="action" value="delete"> <input type="hidden" name="action" value="delete">
<div class="images-grid"> <div class="images-grid">
<?php foreach($images as $image): <?php foreach($images as $image):
$imageUrl = getBaseUrl() . '/liste_albums/' . substr($currentPath, strpos($currentPath, '/liste_albums/') + strlen('/liste_albums/')) . '/' . $image; // Déterminer si nous sommes dans le dossier du carrousel
$isCarousel = strpos($currentPath, 'img_carrousel') !== false;
if ($isCarousel) {
$imageUrl = getBaseUrl() . '/img_carrousel/' . $image;
} else {
$imageUrl = getBaseUrl() . '/liste_albums/' . substr($currentPath, strpos($currentPath, '/liste_albums/') + strlen('/liste_albums/')) . '/' . $image;
}
?> ?>
<div class="image-item"> <div class="image-item">
<input type="checkbox" name="images[]" value="<?php echo htmlspecialchars($image); ?>" <input type="checkbox" name="images[]" value="<?php echo htmlspecialchars($image); ?>"

11
arbre.php
View File

@ -83,6 +83,17 @@ function generateTree($path, $currentPath) {
// Si c'est le dossier racine, ajoutons-le à l'arborescence // Si c'est le dossier racine, ajoutons-le à l'arborescence
if ($path === './liste_albums') { if ($path === './liste_albums') {
$carouselPath = './img_carrousel';
if (is_dir($carouselPath)) {
$output .= '<li class="tree-item carousel-folder' . ($carouselPath === $currentPath ? ' active' : '') . '">';
$output .= '<div class="tree-item-content">';
$output .= '<span class="tree-link">';
$output .= '<span class="folder-icon">🎞️</span> Images du carrousel';
$output .= '</span>';
$output .= '<div class="tree-actions">';
$output .= '<a href="arbre-img.php?path=' . urlencode($carouselPath) . '" class="tree-button carousel-button" title="Gérer les images">🖼️</a>';
$output .= '</div></div></li>';
}
$info = getAlbumInfo($path); $info = getAlbumInfo($path);
$output .= '<li class="tree-item root-folder' . ($path === $currentPath ? ' active' : '') . '">'; $output .= '<li class="tree-item root-folder' . ($path === $currentPath ? ' active' : '') . '">';
$output .= '<div class="tree-item-content">'; $output .= '<div class="tree-item-content">';

7
fonctions.php
View File

@ -145,7 +145,12 @@ function hasImages($path) {
function isSecurePath($path) { function isSecurePath($path) {
$realPath = realpath($path); $realPath = realpath($path);
$rootPath = realpath('./liste_albums'); $rootPath = realpath('./liste_albums');
return $realPath && strpos($realPath, $rootPath) === 0; $carouselPath = realpath('./img_carrousel');
return $realPath && (
(strpos($realPath, $rootPath) === 0) ||
($carouselPath && $realPath === $carouselPath)
);
} }
/** /**

2
img_carrousel/infos.txt Normal file
View File

@ -0,0 +1,2 @@
Images du carrousel
Mettre dans ce dossier les images pour le carrousel de la page d'accueil.

49
index.php
View File

@ -1,35 +1,26 @@
<?php <?php
// Fonction pour vérifier si un dossier contient du contenu mature function getCarouselImages($limit = 5) {
function isMatureContent($path) {
$infoFile = dirname($path) . '/infos.txt';
if (file_exists($infoFile)) {
$content = file_get_contents($infoFile);
$lines = explode("\n", $content);
return isset($lines[2]) && trim($lines[2]) === '18+';
}
return false;
}
// Fonction pour récupérer les 5 dernières images (excluant le contenu mature)
function getLatestImages($rootDir = './liste_albums', $limit = 5) {
$images = []; $images = [];
$iterator = new RecursiveIteratorIterator( $carouselDir = './img_carrousel';
new RecursiveDirectoryIterator($rootDir),
RecursiveIteratorIterator::SELF_FIRST
);
foreach ($iterator as $file) { // Vérifier si le dossier existe
if (!is_dir($carouselDir)) {
// Créer le dossier s'il n'existe pas
mkdir($carouselDir, 0755, true);
return $images;
}
foreach (new DirectoryIterator($carouselDir) as $file) {
if ($file->isDot()) continue;
if ($file->isFile()) { if ($file->isFile()) {
$extension = strtolower($file->getExtension()); $extension = strtolower($file->getExtension());
if (in_array($extension, ['jpg', 'jpeg', 'png', 'gif'])) { if (in_array($extension, ['jpg', 'jpeg', 'png', 'gif'])) {
// Vérifier si l'image provient d'un dossier mature $images[] = str_replace('\\', '/', $file->getPathname());
if (!isMatureContent($file->getPathname())) {
$images[] = str_replace('\\', '/', $file->getPathname());
}
} }
} }
} }
// Trier par date de création décroissante
usort($images, function($a, $b) { usort($images, function($a, $b) {
return filectime($b) - filectime($a); return filectime($b) - filectime($a);
}); });
@ -37,7 +28,7 @@ function getLatestImages($rootDir = './liste_albums', $limit = 5) {
return array_slice($images, 0, $limit); return array_slice($images, 0, $limit);
} }
$latestImages = getLatestImages(); $carouselImages = getCarouselImages();
?> ?>
<!DOCTYPE html> <!DOCTYPE html>
@ -51,9 +42,9 @@ $latestImages = getLatestImages();
</head> </head>
<body> <body>
<div class="carousel"> <div class="carousel">
<?php foreach($latestImages as $index => $image): ?> <?php foreach($carouselImages as $index => $image): ?>
<div class="carousel-slide <?php echo $index === 0 ? 'active' : ''; ?>"> <div class="carousel-slide <?php echo $index === 0 ? 'active' : ''; ?>">
<img src="<?php echo htmlspecialchars($image); ?>" alt="Image de la galerie"> <img src="<?php echo htmlspecialchars($image); ?>" alt="Image du carrousel">
</div> </div>
<?php endforeach; ?> <?php endforeach; ?>
</div> </div>
@ -69,6 +60,8 @@ $latestImages = getLatestImages();
let currentSlide = 0; let currentSlide = 0;
const slides = document.querySelectorAll('.carousel-slide'); const slides = document.querySelectorAll('.carousel-slide');
if (slides.length === 0) return; // Sortir si aucune image
function showSlide(index) { function showSlide(index) {
slides.forEach(slide => { slides.forEach(slide => {
slide.classList.remove('active'); slide.classList.remove('active');
@ -85,8 +78,10 @@ $latestImages = getLatestImages();
// Initialiser le premier slide // Initialiser le premier slide
showSlide(0); showSlide(0);
// Changer de slide toutes les 5 secondes // Changer de slide toutes les 5 secondes seulement s'il y a plus d'une image
setInterval(nextSlide, 5000); if (slides.length > 1) {
setInterval(nextSlide, 5000);
}
}); });
</script> </script>
</body> </body>

54
styles-admin.css
View File

@ -424,6 +424,42 @@ body {
color: #ffffff; color: #ffffff;
} }
/* Styles pour le dossier carousel */
.carousel-folder > .tree-item-content {
background: rgba(255, 140, 0, 0.1);
border-left: 4px solid #ff8c00;
margin-bottom: 1rem;
padding: 1rem;
transition: all 0.3s ease;
}
.carousel-folder > .tree-item-content:hover {
background: rgba(255, 140, 0, 0.2);
}
.carousel-folder .tree-link {
color: #ff8c00;
font-weight: 500;
}
.carousel-folder .folder-icon {
color: #ff8c00;
font-size: 1.2rem;
}
.carousel-button {
background: rgba(255, 140, 0, 0.2) !important;
color: #ff8c00 !important;
padding: 0.5rem !important;
border-radius: 0.5rem !important;
transition: all 0.3s ease !important;
}
.carousel-button:hover {
background: rgba(255, 140, 0, 0.3) !important;
transform: scale(1.1) !important;
}
.folder-icon { .folder-icon {
font-size: 1.2rem; font-size: 1.2rem;
} }
@ -635,6 +671,24 @@ body {
border-color: #1976d2; border-color: #1976d2;
} }
/* Styles spécifiques pour la page de gestion du carrousel */
body[data-page="carrousel"] .upload-zone {
border-color: #ff8c00;
background-color: rgba(255, 140, 0, 0.1);
}
body[data-page="carrousel"] .action-button-success {
background-color: #ff8c00;
}
body[data-page="carrousel"] .action-button-success:hover {
background-color: #ff7700;
}
body[data-page="carrousel"] .admin-header {
border-bottom-color: rgba(255, 140, 0, 0.3);
}
#imageUploadForm { #imageUploadForm {
display: none; display: none;
} }