139 lines
4.6 KiB
PHP
139 lines
4.6 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><?php gettext('View photos in Sqlite base'); ?></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();
|
|
/*
|
|
// Redirects user to login.php if not logged in
|
|
if($_SESSION['Active'] == false){
|
|
header("location:admin/login.php");
|
|
exit;
|
|
}
|
|
*/
|
|
$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><?php echo gettext('avif - heic - webp - jpg'); ?></h1>
|
|
|
|
<?php
|
|
$image = "2022-04-16_Brocard_8996";
|
|
$avif_path = "photos/avif/";
|
|
$webp_path = "photos/webp/";
|
|
$heic_path = "photos/heic/";
|
|
$jpg_path = "photos/img/";
|
|
|
|
|
|
$code = '
|
|
<picture>
|
|
<source srcset="photos/avif/2022-04-16_Brocard_8996.avif" type="image/avif" />
|
|
<source srcset="photos/webp/2022-04-16_Brocard_8996.webp" type="image/webp" />
|
|
<img src="photos/img/2022-04-16_Brocard_8996.jpg" alt="Pic Description" />
|
|
</picture>';
|
|
?>
|
|
|
|
<pre>
|
|
<?= htmlspecialchars($code); ?>
|
|
</pre>
|
|
|
|
<div class="cadre" id="lcl_month">
|
|
<a href ="<?php echo host() . $jpg_path . $image; ?>.jpg">
|
|
<picture>
|
|
<source srcset="<?php echo $avif_path . $image; ?>.avif" type="image/avif" />
|
|
<source srcset="<?php echo $webp_path . $image; ?>.webp" type="image/webp" />
|
|
<img src="<?php echo host() . $jpg_path . $image; ?>.jpg" class="trois" alt="Pic Description" />
|
|
</picture>
|
|
</a>
|
|
|
|
<!--a href ="<?php echo host() . $webp_path . $image; ?>.webp">
|
|
<img src="<?php echo host() . $webp_path . $image; ?>.webp" class="trois" alt="Pic Description" />
|
|
</a>
|
|
|
|
<a href="<?php echo host() . $jpg_path . $image; ?>.jpg">
|
|
<img src="<?php echo host() . $jpg_path . $image; ?>.jpg" class="trois" alt="Pic Description" />
|
|
</a-->
|
|
|
|
</div>
|
|
|
|
<script type='text/javascript'>
|
|
$(document).ready(function() {
|
|
|
|
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,
|
|
});
|
|
|
|
});
|
|
</script>
|
|
|
|
<table class="styled-table">
|
|
<thead>
|
|
<th>OS</th><th>Browser</th><th>Format affiché</th><th>Formats reconnus</th>
|
|
</thead>
|
|
<tbody>
|
|
<tr><td>macOS 12.4 arm</td><td>Safari 15.5</td><td>webp</td><td>webp jpg</td></tr>
|
|
<tr><td>macOS 12.4 arm</td><td>Firefox 100.0.2</td><td>avif</td><td>avif webp jpg</td></tr>
|
|
<tr><td>macOS 12.4 arm</td><td>Chromium 101.0.4951.64</td><td>avif</td><td>avif webp jpg</td></tr>
|
|
<tr><td>W10 21H2 19044.1706</td><td>Edge 101.0.1210.53</td><td>webp</td><td>webp jpg</td></tr>
|
|
<tr><td>W10 21H2 19044.1706</td><td>Firefox 91.8.0esr</td><td>webp</td><td>webp jpg</td></tr>
|
|
<tr><td>W10 21H2 19044.1706</td><td>Chrome 102.0.5005.62</td><td>avif</td><td>avif webp jpg</td></tr>
|
|
<tr><td>W11 21H2 22000.613 arm</td><td>Edge 101.0.1210.39</td><td>webp</td><td></td></tr>
|
|
<tr><td>W11 21H2 22000.613 arm</td><td>Firefox 100.0.2</td><td>avif</td><td></td></tr>
|
|
<tr><td>W11 21H2 22000.613 arm</td><td>Brave 1.39.111</td><td>avif</td><td></td></tr>
|
|
<tr><td>W11 21H2 22000.613 arm</td><td>Vivaldi 5.2.2623.48</td><td>avif</td><td></td></tr>
|
|
<tr><td>iOS 15.5</td><td>Safari</td><td></td><td>webp jpg</td></tr>
|
|
<tr><td>iOS 15.5</td><td>Firefox</td><td></td><td>webp jpg</td></tr>
|
|
<tr><td>iOS 15.5</td><td>Brave</td><td></td><td>webp jpg</td></tr>
|
|
<tr><td>Android</td><td>Chrome 101.0.4951.41</td><td></td><td>avif webp jpg</td></tr>
|
|
<tr><td>Android</td><td>Firefox 100.1.1</td><td></td><td>avif webp jpg</td></tr>
|
|
<tr><td>Android</td><td></td><td></td><td></td></tr>
|
|
<tr><td colpsan="4">No support for heic on any platform [<a href="https://shkspr.mobi/blog/2020/12/coping-with-heic-in-the-browser/"link]</a></td></tr>
|
|
</tbody>
|
|
</table>
|
|
|
|
https://developer.mozilla.org/en-US/docs/Web/Performance/Lazy_loading
|
|
https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/decoding
|
|
<!--img
|
|
...
|
|
loading="lazy"
|
|
decoding="async"
|
|
width="2032"
|
|
height="1076"
|
|
/-->
|
|
|
|
<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>
|