rebillar/site-accueil-insa
1
1
Fork 1
forked from vergnet/site-accueil-insa
Code Issues Pull requests Releases Wiki Activity

photos

Browse source
This commit is contained in:
Baptiste 2022-06-20 15:45:48 +02:00
parent 48b8939529
commit 9197447e89
3 changed files with 201 additions and 132 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

45
assets/css/page/photos.css
View file

@ -0,0 +1,45 @@
body {
text-align: center;
}
section {
display: block;
background-color: rgba(255,255,255,0.5);
width: 80vw;
margin-left: auto;
margin-right: auto;
padding: 50px;
font-size: 1.2rem;
margin-top: 40px;
}
a {
text-decoration: none;
}
ul {
margin: 0;
padding: 0;
}
li {
display: inline-block;
}
.directory-ul {
list-style: none;
}
.directory-li {
display: block;
color: black;
padding: 10px;
margin: 10px;
background-color: white;
}
.directory-li:hover {
transform: scale(1.05);
transition: 0.3s ease-out;
}

121
photos.php
View file

@ -1,7 +1,7 @@
<?php <?php
ob_start(); // Start reading html ob_start(); // Start reading html
header('Location: construction.php'); //header('Location: construction.php');
define("urlParam", "path"); define("urlParam", "path");
define("photoRoot", "photos_folders/photos"); define("photoRoot", "photos_folders/photos");
@ -73,6 +73,7 @@ function createDirectories($path)
$folderLink = "?" . urlParam . "=" . getActivePath() . DIRECTORY_SEPARATOR . $value; $folderLink = "?" . urlParam . "=" . getActivePath() . DIRECTORY_SEPARATOR . $value;
?> ?>
<a href="<?= $folderLink ?>"> <a href="<?= $folderLink ?>">
<li class="directory-li">
<span id="folderTitle"><?= $folderTitle ?></span> <span id="folderTitle"><?= $folderTitle ?></span>
<?php if ($photos > 1): ?> <?php if ($photos > 1): ?>
<span id="folderPhotos"><?= $photos ?> photos</span> <span id="folderPhotos"><?= $photos ?> photos</span>
@ -87,6 +88,7 @@ function createDirectories($path)
<?php elseif ($albums == 1): ?> <?php elseif ($albums == 1): ?>
<span id="folderAlbums"><?= $albums ?> album</span> <span id="folderAlbums"><?= $albums ?> album</span>
<?php endif; ?> <?php endif; ?>
</li>
</a> </a>
<?php <?php
$displayedItems++; $displayedItems++;
@ -99,17 +101,20 @@ function createDirectories($path)
* Get all photos in the specified path and creates them on the page * Get all photos in the specified path and creates them on the page
* @param string $path path to search photos in * @param string $path path to search photos in
*/ */
function createPhotos($path) function createPhotos($path_in)
{ {
$path = photoRoot . "_thumb" . $path; $path = photoRoot . "_thumb" . $path_in;
$path_no_thumb = photoRoot . $path_in;
$files = scandir($path); $files = scandir($path);
$displayedItems = 0; $displayedItems = 0;
foreach ($files as $key => $value) { foreach ($files as $key => $value) {
$realPath = realpath($path . DIRECTORY_SEPARATOR . $value); $realPath = realpath($path . DIRECTORY_SEPARATOR . $value);
if (isValidImage($realPath)) { $realPath_no_thumb = realpath($path_no_thumb . DIRECTORY_SEPARATOR . $value);
if (isValidImage($realPath) AND isValidImage($realPath_no_thumb)) {
$imageSrc = $path . DIRECTORY_SEPARATOR . $value; $imageSrc = $path . DIRECTORY_SEPARATOR . $value;
$imageId = "photo-" . $displayedItems; $img_no_thumb = $path_no_thumb . DIRECTORY_SEPARATOR . $value;
?><img src="<?= $imageSrc ?>" onclick="displayBig(this);" class="photo" id="<?= $imageId ?>" alt=""/><?php $imageId = "photo-" . $displayedItems;
?><a download="" href="<?= $img_no_thumb ?>"><img src="<?= $imageSrc ?>" class="photo" id="<?= $imageId ?>" alt=""/></a><?php
$displayedItems++; $displayedItems++;
} }
} }
@ -227,88 +232,72 @@ function generatePath($path)
$currentPath = ""; $currentPath = "";
$pathTitle = "Menu"; $pathTitle = "Menu";
$pathLink = "?" . urlParam . "="; $pathLink = "?" . urlParam . "=";
echo '<li><a href="'.$pathLink.'">'.$pathTitle.'</a></li>'; echo '<li><a href="'.$pathLink.'" class="link">'.$pathTitle.'</a></li>';
foreach ($folders as $value) { foreach ($folders as $value) {
if ($value != "") { if ($value != "") {
$pathTitle = $value; $pathTitle = $value;
$currentPath .= DIRECTORY_SEPARATOR . $value; $currentPath .= DIRECTORY_SEPARATOR . $value;
$pathLink = "?" . urlParam . "=" . $currentPath; $pathLink = "?" . urlParam . "=" . $currentPath;
echo '<li><a href="'.$pathLink.'">'.$pathTitle.'</a></li>'; echo ' > <li><a href="'.$pathLink.'" class="link">'.$pathTitle.'</a></li>';
} }
} }
} }
?> ?>
<div class="inner"> <div class="inner">
<div id="photoOverlay" style="display:none">
<img src="" id="imgBig"> <div class="box-jaune">
<span class="corners corners-top"></span>
<span class="corners corners-bottom"></span>
<div id="closeBack" onclick="closeBig()"></div> <div class="title">Les photos</div>
<div id="loadingIconContainer" onclick="closeBig()">
<i class="fas fa-spinner fa-spin"></i>
</div>
<div id="photoButtonsContainer"> <span class="circles circles-top"></span>
<div id="rightButton" onclick="displayNext(1)"> <span class="circles circles-bottom"></span>
<i class="fas fa-arrow-right"></i> </div>
</div> <section>
<div id="leftButton" onclick="displayNext(-1)">
<i class="fas fa-arrow-left"></i>
</div>
<a id="downloadButton" download="" href="">
<i class="fas fa-download"></i>
</a>
<div id="closeButton">
<i class="fas fa-times" onclick="closeBig()"></i>
</div>
</div>
</div>
<h1 id="photosTitle">Photos</h1>
<p>Clique sur le dossier de ton choix pour afficher les photos. Il faut que tu sois inscrit à l'INSA pour pouvoir <p>Clique sur le dossier de ton choix pour afficher les photos. Il faut que tu sois inscrit à l'INSA pour pouvoir
les regarder (et oui, pas de spoiler). les regarder (et oui, pas de spoiler).</p>
</p> <p>Il te suffit ensuite de cliquer sur la photo que tu veux télécharger.</p>
<p> <p>Si tu ne peux pas voir les photos (la fenêtre pour entrer le mot de passe ne s'affiche pas), ouvre cette page avec un autre navigateur.</p>
Si tu ne peux pas voir les photos (la fenêtre pour entrer le mot de passe ne s'affiche pas), ouvre cette page </section>
avec <section align="left">
un autre navigateur. <ul class="photos-path">
</p> <li>Chemin : </li>
<ul class="photos-path">
<li><p>Chemin : </p></li>
<?php <?php
generatePath(getActivePath()); generatePath(getActivePath());
?> ?>
</ul> </ul>
</div> <ul class="directory-ul">
<div id="photoContainer"> <?php if (getDirectoriesCount(photoRoot . getActivePath()) > 0): ?>
<?php if (getDirectoriesCount(photoRoot . getActivePath()) > 0): ?> <div class="photos-folder-container">
<div class="photos-folder-container"> <?php
<?php createDirectories(getActivePath());
createDirectories(getActivePath()); ?>
?> </div>
</div> <?php endif; ?>
<?php endif; ?> </ul>
<?php if (isAlbumAvailable(getActivePath())): ?> <?php if (isAlbumAvailable(getActivePath())): ?>
<a download="" <a download=""
href="photos_folders/photos<?php echo getActivePath() . DIRECTORY_SEPARATOR . GetActiveFolder(getActivePath()) ?>.zip" href="photos_folders/photos<?php echo getActivePath() . DIRECTORY_SEPARATOR . GetActiveFolder(getActivePath()) ?>.zip"
id="downloadAlbum"> id="downloadAlbum">
<span id="downloadText"><i class="fas fa-download"></i>Télécharger</span> <span id="downloadText"><i class="fas fa-download"></i>Télécharger</span>
<span id="albumPhotoCount"><?php echo getPhotoCount(photoRoot . getActivePath()) ?> photos</span> <span id="albumPhotoCount"><?php echo getPhotoCount(photoRoot . getActivePath()) ?> photos</span>
</a> </a>
<?php endif; ?> <?php endif; ?>
<?php if (getPhotoCount(photoRoot . getActivePath()) > 0): ?> <?php if (getPhotoCount(photoRoot . getActivePath()) > 0): ?>
<div class="photos"> <div class="photos">
<?php <?php
createPhotos(getActivePath()); createPhotos(getActivePath());
?> ?>
</div> </div>
<?php endif; ?> <?php endif; ?>
</section>
</div> </div>
<br> <br>
<?php <?php
$infopage = ["", "Photos", ob_get_clean(), "<script src='assets/js/photos.js'></script><script type='text/javascript' src='assets/js/jquery.mousewheel.min.js'>", "photos"]; //relativepath, pagetitle, pagecontent, pagescript, pagename | cf structure/template.php ligne 2 à 6 $infopage = ["", "Photos", ob_get_clean(), "", "photos"]; //relativepath, pagetitle, pagecontent, pagescript, pagename | cf structure/template.php ligne 2 à 6
include("structure/template.php"); include("structure/template.php");
?> ?>

167
test.php
View file

@ -73,6 +73,7 @@ function createDirectories($path)
$folderLink = "?" . urlParam . "=" . getActivePath() . DIRECTORY_SEPARATOR . $value; $folderLink = "?" . urlParam . "=" . getActivePath() . DIRECTORY_SEPARATOR . $value;
?> ?>
<a href="<?= $folderLink ?>"> <a href="<?= $folderLink ?>">
<li class="directory-li">
<span id="folderTitle"><?= $folderTitle ?></span> <span id="folderTitle"><?= $folderTitle ?></span>
<?php if ($photos > 1): ?> <?php if ($photos > 1): ?>
<span id="folderPhotos"><?= $photos ?> photos</span> <span id="folderPhotos"><?= $photos ?> photos</span>
@ -87,6 +88,7 @@ function createDirectories($path)
<?php elseif ($albums == 1): ?> <?php elseif ($albums == 1): ?>
<span id="folderAlbums"><?= $albums ?> album</span> <span id="folderAlbums"><?= $albums ?> album</span>
<?php endif; ?> <?php endif; ?>
</li>
</a> </a>
<?php <?php
$displayedItems++; $displayedItems++;
@ -99,17 +101,20 @@ function createDirectories($path)
* Get all photos in the specified path and creates them on the page * Get all photos in the specified path and creates them on the page
* @param string $path path to search photos in * @param string $path path to search photos in
*/ */
function createPhotos($path) function createPhotos($path_in)
{ {
$path = photoRoot . "_thumb" . $path; $path = photoRoot . "_thumb" . $path_in;
$path_no_thumb = photoRoot . $path_in;
$files = scandir($path); $files = scandir($path);
$displayedItems = 0; $displayedItems = 0;
foreach ($files as $key => $value) { foreach ($files as $key => $value) {
$realPath = realpath($path . DIRECTORY_SEPARATOR . $value); $realPath = realpath($path . DIRECTORY_SEPARATOR . $value);
if (isValidImage($realPath)) { $realPath_no_thumb = realpath($path_no_thumb . DIRECTORY_SEPARATOR . $value);
if (isValidImage($realPath) AND isValidImage($realPath_no_thumb)) {
$imageSrc = $path . DIRECTORY_SEPARATOR . $value; $imageSrc = $path . DIRECTORY_SEPARATOR . $value;
$imageId = "photo-" . $displayedItems; $img_no_thumb = $path_no_thumb . DIRECTORY_SEPARATOR . $value;
?><img src="<?= $imageSrc ?>" class="photo" id="<?= $imageId ?>" alt=""/><?php $imageId = "photo-" . $displayedItems;
?><a download="" href="<?= $img_no_thumb ?>"><img src="<?= $imageSrc ?>" class="photo" id="<?= $imageId ?>" alt=""/></a><?php
$displayedItems++; $displayedItems++;
} }
} }
@ -227,89 +232,119 @@ function generatePath($path)
$currentPath = ""; $currentPath = "";
$pathTitle = "Menu"; $pathTitle = "Menu";
$pathLink = "?" . urlParam . "="; $pathLink = "?" . urlParam . "=";
echo '<li><a href="'.$pathLink.'">'.$pathTitle.'</a></li>'; echo '<li><a href="'.$pathLink.'" class="link">'.$pathTitle.'</a></li>';
foreach ($folders as $value) { foreach ($folders as $value) {
if ($value != "") { if ($value != "") {
$pathTitle = $value; $pathTitle = $value;
$currentPath .= DIRECTORY_SEPARATOR . $value; $currentPath .= DIRECTORY_SEPARATOR . $value;
$pathLink = "?" . urlParam . "=" . $currentPath; $pathLink = "?" . urlParam . "=" . $currentPath;
echo '<li><a href="'.$pathLink.'">'.$pathTitle.'</a></li>'; echo ' > <li><a href="'.$pathLink.'" class="link">'.$pathTitle.'</a></li>';
} }
} }
} }
?> ?>
<img src="photos_folders/photos_thumb/2019/1 - Lundi/001.JPG"> <style>
body {
text-align: center;
}
section {
display: block;
background-color: rgba(255,255,255,0.5);
width: 80vw;
margin-left: auto;
margin-right: auto;
padding: 50px;
font-size: 1.2rem;
margin-top: 40px;
}
a {
text-decoration: none;
}
ul {
margin: 0;
padding: 0;
}
li {
display: inline-block;
}
.directory-ul {
list-style: none;
}
.directory-li {
display: block;
color: black;
padding: 10px;
margin: 10px;
background-color: white;
}
.directory-li:hover {
transform: scale(1.05);
transition: 0.3s ease-out;
}
</style>
<div class="inner"> <div class="inner">
<div id="photoOverlay" style="display:none">
<img src="" id="imgBig"> <div class="box-jaune">
<span class="corners corners-top"></span>
<span class="corners corners-bottom"></span>
<div id="closeBack" onclick="closeBig()"></div> <div class="title">Les photos</div>
<div id="loadingIconContainer" onclick="closeBig()">
<i class="fas fa-spinner fa-spin"></i>
</div>
<div id="photoButtonsContainer"> <span class="circles circles-top"></span>
<div id="rightButton" onclick="displayNext(1)"> <span class="circles circles-bottom"></span>
<i class="fas fa-arrow-right"></i> </div>
</div> <section>
<div id="leftButton" onclick="displayNext(-1)">
<i class="fas fa-arrow-left"></i>
</div>
<a id="downloadButton" download="" href="">
<i class="fas fa-download"></i>
</a>
<div id="closeButton">
<i class="fas fa-times" onclick="closeBig()"></i>
</div>
</div>
</div>
<h1 id="photosTitle">Photos</h1>
<p>Clique sur le dossier de ton choix pour afficher les photos. Il faut que tu sois inscrit à l'INSA pour pouvoir <p>Clique sur le dossier de ton choix pour afficher les photos. Il faut que tu sois inscrit à l'INSA pour pouvoir
les regarder (et oui, pas de spoiler). les regarder (et oui, pas de spoiler).</p>
</p> <p>Il te suffit ensuite de cliquer sur la photo que tu veux télécharger.</p>
<p> <p>Si tu ne peux pas voir les photos (la fenêtre pour entrer le mot de passe ne s'affiche pas), ouvre cette page avec un autre navigateur.</p>
Si tu ne peux pas voir les photos (la fenêtre pour entrer le mot de passe ne s'affiche pas), ouvre cette page </section>
avec <section align="left">
un autre navigateur. <ul class="photos-path">
</p> <li>Chemin : </li>
<ul class="photos-path">
<li><p>Chemin : </p></li>
<?php <?php
generatePath(getActivePath()); generatePath(getActivePath());
?> ?>
</ul> </ul>
</div> <ul class="directory-ul">
<div id="photoContainer"> <?php if (getDirectoriesCount(photoRoot . getActivePath()) > 0): ?>
<?php if (getDirectoriesCount(photoRoot . getActivePath()) > 0): ?> <div class="photos-folder-container">
<div class="photos-folder-container"> <?php
<?php createDirectories(getActivePath());
createDirectories(getActivePath()); ?>
?> </div>
</div> <?php endif; ?>
<?php endif; ?> </ul>
<?php if (isAlbumAvailable(getActivePath())): ?> <?php if (isAlbumAvailable(getActivePath())): ?>
<a download="" <a download=""
href="photos_folders/photos<?php echo getActivePath() . DIRECTORY_SEPARATOR . GetActiveFolder(getActivePath()) ?>.zip" href="photos_folders/photos<?php echo getActivePath() . DIRECTORY_SEPARATOR . GetActiveFolder(getActivePath()) ?>.zip"
id="downloadAlbum"> id="downloadAlbum">
<span id="downloadText"><i class="fas fa-download"></i>Télécharger</span> <span id="downloadText"><i class="fas fa-download"></i>Télécharger</span>
<span id="albumPhotoCount"><?php echo getPhotoCount(photoRoot . getActivePath()) ?> photos</span> <span id="albumPhotoCount"><?php echo getPhotoCount(photoRoot . getActivePath()) ?> photos</span>
</a> </a>
<?php endif; ?> <?php endif; ?>
<?php if (getPhotoCount(photoRoot . getActivePath()) > 0): ?> <?php if (getPhotoCount(photoRoot . getActivePath()) > 0): ?>
<div class="photos"> <div class="photos">
<?php <?php
createPhotos(getActivePath()); createPhotos(getActivePath());
?> ?>
</div> </div>
<?php endif; ?> <?php endif; ?>
</section>
</div> </div>
<br> <br>
<?php <?php
$infopage = ["", "Photos", ob_get_clean(), "<script src='assets/js/photos.js'></script><script type='text/javascript' src='assets/js/jquery.mousewheel.min.js'>", "photos"]; //relativepath, pagetitle, pagecontent, pagescript, pagename | cf structure/template.php ligne 2 à 6 $infopage = ["", "Photos", ob_get_clean(), "", "photos"]; //relativepath, pagetitle, pagecontent, pagescript, pagename | cf structure/template.php ligne 2 à 6
include("structure/template.php"); include("structure/template.php");
?> ?>