176 lines
6.4 KiB
PHP
176 lines
6.4 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';
|
|
session_start();
|
|
$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>
|
|
|
|
<h4>avif</h4>
|
|
<picture>
|
|
<!--source srcset="avif/2022-04-16_Brocard_8996.avif" type="image/avif" />
|
|
<source srcset="avif/2022-04-16_Brocard_8996.webp" type="image/webp" /-->
|
|
<img src="photos/avif/2022-04-16_Brocard_8996.avif" alt="No avif support" />
|
|
</picture>
|
|
|
|
<h4>webp</h4>
|
|
<picture>
|
|
<!--source srcset="avif/2022-04-16_Brocard_8996.avif" type="image/avif" />
|
|
<source srcset="avif/2022-04-16_Brocard_8996.webp" type="image/webp" /-->
|
|
<img src="photos/webp/2022-04-16_Brocard_8996.webp" alt="No webp support" />
|
|
</picture>
|
|
|
|
<h4>heic</h4>
|
|
<picture>
|
|
<!--source srcset="avif/2022-04-16_Brocard_8996.avif" type="image/avif" />
|
|
<source srcset="avif/2022-04-16_Brocard_8996.webp" type="image/webp" /-->
|
|
<img src="photos/heic/2022-04-16_Brocard_8996.heic" alt="No heic support" />
|
|
</picture>
|
|
|
|
<h4>jpg</h4>
|
|
<picture>
|
|
<!--source srcset="avif/2022-04-16_Brocard_8996.avif" type="image/avif" />
|
|
<source srcset="avif/2022-04-16_Brocard_8996.webp" type="image/webp" /-->
|
|
<img src="photos/img/2022-04-16_Brocard_8996.jpg" alt="No jpg support" />
|
|
</picture>
|
|
|
|
|
|
<?php
|
|
/*
|
|
Safari : webp (mozjpeg ok)
|
|
Firefox 100 : avif (webp ok)(mozjpeg ok)
|
|
Chromium 101 : avif (webp ok)(mozjpeg ok)
|
|
*/
|
|
|
|
/*
|
|
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>';
|
|
}
|
|
*/
|
|
?>
|
|
|
|
|
|
|
|
<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>
|
|
|
|
|
|
|
|
<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>© 2013-<?php echo date('Y'); ?> sur-le-sentier.fr</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>
|