285 lines
9.3 KiB
PHP
285 lines
9.3 KiB
PHP
<!DOCTYPE html>
|
||
<html lang="en">
|
||
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||
<title><?= _("Picture of the month");?></title>
|
||
<link rel="stylesheet" href="css/sls.css">
|
||
|
||
<link rel='stylesheet' href='css/lc_lightbox.min.css' />
|
||
<link rel='stylesheet' href='css/open_close_fx.css' />
|
||
<link rel='stylesheet' href='css/minimal.css' />
|
||
|
||
<?php include 'functions.php';
|
||
$domain = 'sentier';
|
||
localize($domain);
|
||
?>
|
||
|
||
<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
|
||
|
||
</head>
|
||
|
||
<body>
|
||
|
||
<h1 class="_h1"> <?= _("Picture of the month");?></h1>
|
||
|
||
<?php
|
||
if (!isset($_GET['page'])) $page = 1;
|
||
else $page = intval($_GET['page']);
|
||
?>
|
||
|
||
<?php
|
||
try {
|
||
$conn4 = new PDO('sqlite:db_photo.sqlite3');
|
||
// WHERE id='26'
|
||
$query4 = "SELECT filename, date, lens, speed, iso, width, height, html, aperture, model, lat, long, alt, legende, copyright, title, creator, keywords, metering, flash, focal, wb, program FROM photos ORDER BY date DESC LIMIT ? OFFSET ?";
|
||
//nb d'archive par page
|
||
$limit = 13;
|
||
$offset = $limit * ($page -1);
|
||
|
||
$stmt = $conn4->prepare($query4);
|
||
$stmt->execute(array($limit, $offset));
|
||
|
||
$result = $stmt->fetchAll(PDO::FETCH_ASSOC);
|
||
$rowcount = count($result);
|
||
|
||
//_pr($result);
|
||
|
||
$conn4 = null;
|
||
}
|
||
catch(PDOException $e) {
|
||
echo $e->getMessage();
|
||
}
|
||
?>
|
||
|
||
<p class="month"><?php echo month($result[0]['date']); ?></p>
|
||
|
||
<?php
|
||
$lb = data_for_lightbox($result[0]);
|
||
|
||
echo '<div class="cadre" id="lcl_month">';
|
||
echo '<a href ="' . $lb['big'] . '" title="' . $lb['title'] . '" data-lcl-txt="' . $lb['title'] .'" data-lcl-author="' . $lb['exif'] . '">';
|
||
echo '<img src="' . $lb['big'] . '" class="trois" />';
|
||
echo "</a>";
|
||
echo '</div>';
|
||
|
||
if (!empty($lb['title']) || !empty($lb['legende'])) {
|
||
?>
|
||
<p class="titrePhoto"><?php echo $lb['title']; ?></p>
|
||
<p class="legendePhoto"><?php echo $lb['legende']; ?></p>
|
||
<?php if (!empty($lb['gps']) && false) { ?>
|
||
<p class="titrePhoto">
|
||
<a href = "https://maps.google.com/maps?q=<?php echo $lb['gps']; ?>&t=&z=9&ie=UTF8&iwloc=&output=embed" title="Google Maps Iframe" data-lcl-txt="LC Lightbox can handle any iframe:<br/> for example you can also display websites and Google Documents <em>(then Word docs, PDFs, etc)</em>" data-lcl-author="@sur-le-sentier.fr"><?php echo "\u{2693} "; ?></a>
|
||
</p>
|
||
<?php } ?>
|
||
<?php
|
||
/*
|
||
🌍
|
||
globe centré sur l’Europe et l’Afrique
|
||
Unicode: U+1F30D, UTF-8: F0 9F 8C 8D
|
||
⚓︎
|
||
ANCHOR
|
||
Unicode: U+2693 U+FE0E, UTF-8: E2 9A 93 EF B8 8E
|
||
*/
|
||
//echo "\u{1F30D} ";
|
||
/*
|
||
<!--
|
||
# Feature-Policy
|
||
<IfModule mod_headers.c>
|
||
Header set Feature-Policy "geolocation 'self'; vibrate 'none'"
|
||
</IfModule>
|
||
-->
|
||
|
||
*/
|
||
?>
|
||
|
||
<?php
|
||
}
|
||
|
||
if (!empty($lb['gps'])) {
|
||
$map = '<a href = "https://maps.google.com/maps?q=' . $lb['gps'] . '&t=&z=9&ie=UTF8&iwloc=&output=embed" title="' . $lb['title'] . '" data-lcl-txt="' . $lb['legende'] . '">' . " \u{30FB} \u{2693} " . '</a>';
|
||
}
|
||
else {
|
||
$map = '';
|
||
}
|
||
|
||
echo '<div class="exif" id="lcl_gm">';
|
||
echo $lb['exif'] . $map;
|
||
echo '</div>';
|
||
?>
|
||
|
||
|
||
<div class="myGallery" id="lcl_gallery">
|
||
|
||
<?php
|
||
|
||
for ($i = 1; $i <= ($rowcount -1); $i++) {
|
||
$date = $result[$i]['date'];
|
||
|
||
$lb = data_for_lightbox($result[$i]);
|
||
|
||
//
|
||
if (!empty($lb['gps'])) {
|
||
$map = '<a href = "https://maps.google.com/maps?q=' . $lb['gps'] . '&t=&z=9&ie=UTF8&iwloc=&output=embed" title="' . $lb['title'] . '" data-lcl-txt="' . $lb['legende'] . '">' . " \u{30FB} \u{2693} " . '</a>';
|
||
|
||
$meta = $lb['exif'] . $map;
|
||
} else {
|
||
$meta = '';
|
||
}
|
||
|
||
|
||
|
||
// data-lcl-author="' . htmlspecialchars($lb['exif']) . '"
|
||
//
|
||
|
||
_pr($lb);
|
||
//echo $lb['exif'];
|
||
|
||
echo '<div class="item">';
|
||
echo '<a href ="' . $lb['big'] . '" title="' . htmlspecialchars($lb['title']) . '" data-lcl-txt="' . htmlspecialchars($lb['title']) .'" data-lcl-author="' . htmlspecialchars($meta) . '">';
|
||
echo '<img src="' . $lb['thumb'] . '" alt="' . htmlspecialchars($lb['title']) . '" />';
|
||
echo "</a>";
|
||
echo '<span class="caption">' . month($date) . '</span>';
|
||
echo '</div>';
|
||
}
|
||
|
||
/*
|
||
$rowcount = 5 - 10 - 15 => add 0
|
||
$rowcount = 4 - 9 - 14 => add 1
|
||
$rowcount = 3 - 8 - 13 => add 2
|
||
$rowcount = 2 - 7 - 12 => add 3
|
||
$rowcount = 1 - 6 - 11 => add 4
|
||
*/
|
||
|
||
if ($rowcount % 4 == 0) $blank = 1;
|
||
elseif ($rowcount % 3 == 0) $blank = 2;
|
||
elseif ($rowcount % 2 == 0) $blank = 3;
|
||
elseif ($rowcount % 1 == 0) $blank = 4;
|
||
|
||
for ($i = 1; $i <= $blank; $i++) {
|
||
echo '<div class="item">';
|
||
echo '</div>';
|
||
}
|
||
?>
|
||
|
||
</div>
|
||
|
||
<script type='text/javascript'>
|
||
$(document).ready(function() {
|
||
var $obj = lc_lightbox('#lcl_gallery a', {
|
||
img_zoom : true,
|
||
open_close_time : 200, // durée de l'animation pour l'ouverture et la fermeture de la lightbox
|
||
ol_time_diff : 100, // animation de superposition avance (à l'ouverture) et retard (à la fermeture) à la fenêtre
|
||
fading_time : 50, // durée de l'animation de fondu des éléments
|
||
slideshow_time : 4000, // durée de l'intervalle du diaporama
|
||
animation_time : 100,
|
||
counter : false, // s'il faut afficher le compteur d'éléments
|
||
progressbar : false, // s'il faut afficher une barre de progression lors de l'exécution du diaporama
|
||
max_width : '95%', // largeur maximale de la lightbox
|
||
max_height : '95%', // hauteur maximale de la lightbox
|
||
wrap_class : 'lcl_fade_oc', // Classes personnalisées ajoutées au wrapper: effet à l'ouverture de la lb (lcl_fade_oc | lcl_zoomin_oc | lcl_rtl_oc)
|
||
skin : 'minimal', // minimal | light | dark
|
||
data_position : 'over', // Spécifie où les données des éléments seront affichées. Les modes disponibles sont :over, under|rside|lside
|
||
cmd_position : 'inner', // Déclare où les commandes doivent être affichées : inner|outer
|
||
nav_btn_pos : 'normal', // Régle les flèches et la position de lecture/pause. Options disponibles: normal|middle
|
||
shox_title : true, // s'il faut afficher les titres
|
||
show_descr : false, // s'il faut afficher les descriptions
|
||
show_author : true, // s'il faut afficher les auteurs
|
||
thumbs_nav : false, // permet la navigation par vignettes (nécessite des éléments affiche ou images)
|
||
fullscreen : true, // Autoriser ou non le mode plein écran
|
||
fs_img_behavior : 'smart', //Comportement de l'image en plein écran : fit|fill|smart
|
||
fs_only : 500, // s'il faut utiliser uniquement l'ouverture de la lightbox en mode plein écran (utile pour les appareils mobiles) : false | (integer)
|
||
browser_fs_mode : true, // utiliser ou non le mode plein écran du navigateur
|
||
txt_toggle_cmd : true, // s'il faut afficher le bouton de basculement du texte de l'élément
|
||
download : true, // whether to show element's file download button
|
||
touchswipe : true, // permet les interactions tactiles (nécessite AlloyFinger)
|
||
rclick_prevent : true, // s'il faut éviter le clic droit sur les éléments de la lightbox
|
||
});
|
||
|
||
var $obj = lc_lightbox('#lcl_month a', {
|
||
img_zoom : true,
|
||
deeplink : true,
|
||
open_close_time : 200,
|
||
ol_time_diff : 100,
|
||
wrap_class : 'lcl_zoomin_oc',
|
||
skin : 'minimal',
|
||
txt_hidden : true,
|
||
fullscreen : true,
|
||
fs_img_behavior : 'smart',
|
||
browser_fs_mode : true,
|
||
rclick_prevent : true,
|
||
});
|
||
|
||
var $obj3 = lc_lightbox('#lcl_gm a', {
|
||
img_zoom : true,
|
||
open_close_time : 100,
|
||
ol_time_diff : 100,
|
||
max_width : '65%',
|
||
max_height : '65%',
|
||
wrap_class : 'lcl_zoomin_oc',
|
||
skin : 'minimal',
|
||
data_position : 'rside',
|
||
cmd_position : 'inner',
|
||
show_title : true,
|
||
show_descr : true,
|
||
show_author : true,
|
||
fullscreen : true,
|
||
fs_img_behavior : 'smart',
|
||
browser_fs_mode : false,
|
||
touchswipe : true,
|
||
rclick_prevent : true,
|
||
});
|
||
|
||
});
|
||
</script>
|
||
|
||
|
||
<?php
|
||
|
||
try {
|
||
$conn4 = new PDO('sqlite:db_photo.sqlite3');
|
||
$query4 = "SELECT COUNT(*) AS count FROM photos";
|
||
|
||
$stmt = $conn4->prepare($query4);
|
||
$stmt->execute();
|
||
|
||
$result = $stmt->fetch(PDO::FETCH_ASSOC);
|
||
$numRows = $result['count'];
|
||
|
||
$conn4 = null;
|
||
}
|
||
catch(PDOException $e) {
|
||
echo $e->getMessage();
|
||
}
|
||
|
||
// calcul du nombre de pages (arrondi a l'entier supérieur)
|
||
$nbpages = ceil($numRows / 13);
|
||
$prec = $page - 1;
|
||
$suiv = $page + 1;
|
||
|
||
echo '<div class="navPage">' . gettext("Page") . ': ';
|
||
if ($page >= 2) echo '<a href="'.$_SERVER['PHP_SELF'].'?page='.$prec.'" title="'.gettext("Previous Page").'">« '.gettext("prev").'</a> ';
|
||
for ($i = 1; $i <= $nbpages; $i++) {
|
||
if ($i != $page) {
|
||
echo '<a href="'.$_SERVER['PHP_SELF'].'?page='.$i.'" title="'.gettext("Page").' '.$i.'">'.$i.' </a> ';
|
||
}
|
||
else {
|
||
echo "<span class='gras'>".$i."</span> ";
|
||
}
|
||
}
|
||
if ($page < $nbpages) echo '<a href="'.$_SERVER['PHP_SELF'].'?page='.$suiv.'" title="'.gettext("Next Page").'">'.gettext("next").' »</a> ';
|
||
echo '</div>';
|
||
?>
|
||
|
||
<p class="navPage"><a href="index.php" title="<?php echo gettext("Home"); ?>"><?php echo gettext("Home"); ?></a> | <a href="maps.php" title="<?php echo gettext("Maps"); ?>"><?php echo gettext("Maps"); ?></a></p>
|
||
|
||
<p><em><small>sur-le-sentier.fr@ 2022</small></em></p>
|
||
|
||
<script src='js/lc_lightbox.min.js' type='text/javascript'></script>
|
||
<script src='js/alloy_finger.min.js' type='text/javascript'></script>
|
||
|
||
</body>
|
||
|
||
</html>
|