<!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>Document</title>
    <link rel="stylesheet" href="css/photoswipe.css">
    <!--script src="js/photoswipe.esm.js"></script>
    <script src="js/photoswipe-lightbox.esm.js"></script-->
    <link rel="stylesheet" href="css/sls.css">
     
    
<?php include 'functions.php'; ?>

<script type="module">
// Include Lightbox 
import PhotoSwipeLightbox from './js/photoswipe-lightbox.esm.js';

const backEasing = {
  in: 'cubic-bezier(0.6, -0.28, 0.7, 1)',
  out: 'cubic-bezier(0.3, 0, 0.32, 1.275)',
  inOut: 'cubic-bezier(0.68, -0.55, 0.265, 1.55)'
};

const options = {
  // may select multiple "galleries"
  gallery: '#gallery--simple',

  // Elements within gallery (slides)
  children: 'a',
  //showHideAnimationType: 'zoom',
  //showAnimationDuration: 1000,
  //hideAnimationDuration: 1000,

  // Include PhotoSwipe Core
  // and use absolute path (that starts with http(s)://)
  //pswpModule: 'https://airbook.local/sls/js/photoswipe.esm.js'
  pswpModule: 'https://<?php echo $_SERVER["SERVER_NAME"]; ?>/sls/js/photoswipe.esm.js'
};

const lightbox = new PhotoSwipeLightbox(options);
lightbox.on('uiRegister', function() {
  lightbox.pswp.ui.registerElement({
    name: 'custom-caption',
    order: 9,
    isButton: false,
    appendTo: 'root',
    html: 'Caption text',
    onInit: (el, pswp) => {
      lightbox.pswp.on('change', () => {
        const currSlideElement = lightbox.pswp.currSlide.data.element;
        let captionHTML = '';
        if (currSlideElement) {
          const hiddenCaption = currSlideElement.querySelector('.hidden-caption-content');
          if (hiddenCaption) {
            // get caption from element with class hidden-caption-content
            captionHTML = hiddenCaption.innerHTML;
          } else {
            // get caption from alt attribute
            captionHTML = currSlideElement.querySelector('img').getAttribute('alt');
          }
        }
        el.innerHTML = captionHTML || '';
      });
    }
  });
});
lightbox.init();

lightbox.on('firstUpdate', () => {
  lightbox.pswp.options.easing = backEasing.out;
});
lightbox.on('initialZoomInEnd', () => {
  lightbox.pswp.options.easing = backEasing.inOut;
});
lightbox.on('close', () => {
  lightbox.pswp.options.easing = backEasing.in;
});

lightbox.init();
</script>

</head>

<body>

<h1 class="_h1"><?php echo gettext("Photo du mois"); ?></h1>

<?php
if (!isset($_GET['page'])) $page = 1;
// sinon on recupere la valeur numerique reçue en paramètre
else $page = intval($_GET['page']);

?>

<?php
try {
	$conn4 = new PDO('sqlite:db_photo.sqlite3');
	$query4 = "SELECT filename, date, lens, exposure, iso, width, height, html, aperture, model, lat, long, alt, legende, copyright, titre, createur, keywords FROM photos ORDER BY date DESC LIMIT ? OFFSET ?";
	//nb d'archive par page
	$limit = 13;
	$offset = $limit * ($page -1);
	//echo "offset: " . $offset;

	$stmt = $conn4->prepare($query4);
	$stmt->execute(array($limit, $offset));
	
	$result = $stmt->fetchAll(PDO::FETCH_ASSOC);
	$rowcount = count($result);
	
	$conn4 = null;
    }
    catch(PDOException $e) {
        echo $e->getMessage();
        }
        
    $photo_du_mois = $result[0];
    $z = $photo_du_mois['date'];
    
    $photo_du_mois['titre'] = "Titre";
    $photo_du_mois['legende'] = "Légende";
    
?>

<p class="month"><?php echo month($z); ?></p>

<?php

	//_pr($photo_du_mois);
	echo '<div class="cadre">';
	echo '<img src="' . $photo_du_mois['filename'] . '" class="trois" />';
	echo '</div>';
	
	if (!empty($photo_du_mois['titre']) || !empty($photo_du_mois['legende'])) {
	?>
		<p class="titrePhoto"><?php echo $photo_du_mois['titre']; ?></p>
		<p class="legendePhoto"><?php echo $photo_du_mois['legende']; ?></p>
	<?php } 

	echo '<div class="exif">';
	echo $photo_du_mois['model'] . " \u{30FB} " .  $photo_du_mois['lens'] . " \u{30FB} ";
	echo $photo_du_mois['exposure'] . " \u{30FB} " .  $photo_du_mois['aperture'] . " \u{30FB} " . $photo_du_mois['iso'] . " ISO";
	echo '</div>';
?>


<div class="myGallery" id="gallery--simple">
	
	<?php
	/**/
	for ($i = 1; $i <= ($rowcount -1); $i++) {
    $file = $result[$i]['filename'];
 	  $date = $result[$i]['date'];
	 	$objectif = $result[$i]['lens'];
	  $exposure = $result[$i]['exposure'];
 		$iso = $result[$i]['iso'];
 		$width = $result[$i]['width'];
 		$height = $result[$i]['height'];
	 	$html = $result[$i]['html'];
 		$aperture = $result[$i]['aperture'];
 		$model = $result[$i]['model'];
 		
 		$lat = $result[$i]['lat']; 
 		$long = $result[$i]['long']; 
 		$alt = $result[$i]['alt'];
 		
 		$legende = $result[$i]['legende'];
 		$copy = $result[$i]['copyright'];
 		$titre = $result[$i]['titre'];
 		$createur = $result[$i]['createur']; 
 		$keywords = $result[$i]['keywords'];
 		//$keywords = str_replace(',', ' - ', $keywords);
 		$keywords = "\u{1F3F7} " . str_replace(',', " \u{30FB} ", $keywords);
     
    if (!empty($titre)) $x = $titre;
    elseif (!empty($legende)) $x = $legende;
    else $x = basename($file);
    
    $exif = $model . " \u{30FB} " .  $objectif . " \u{30FB} " .  $exposure . " \u{30FB} " .  $aperture . " \u{30FB} " .  $iso ;
   // $x  = $x . "\r\n" . $exif;


		$thumb = str_replace("photos/img", "photos/thumb", $file);
		echo '<div class="item">';
		echo '<a href ="' . $file . '" data-pswp-width="' . $width . '"' . '" data-pswp-height="'. $height . '" target="_blank">';
		echo '<img src="' . $thumb . '" alt="' . $x . '" />';
		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>


<?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 / 12);
$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").'">&laquo; '.gettext("prev").'</a>&nbsp;';
for ($i = 1; $i <= $nbpages; $i++) {
	if ($i != $page) {
		echo '<a href="'.$_SERVER['PHP_SELF'].'?page='.$i.'" title="'.gettext("Page").' '.$i.'">'.$i.' </a>&nbsp;';
		}
	else {
		echo "<span class='gras'>".$i."</span>&nbsp;&nbsp;";
		}
	}
if ($page < $nbpages) echo '<a href="'.$_SERVER['PHP_SELF'].'?page='.$suiv.'" title="'.gettext("Next Page").'">'.gettext("next").' &raquo;</a>&nbsp;';

echo '</div>';

?>

<p><em><small>@ 2022</small></em></p>
</body>

</html>