Convenzione immagini gallerie (repo l-e-a-p.github.io)

I post (_posts/) di questo repo pubblicano le gallerie usando immagini che vivono qui come file statici, sotto images/posts/. Organizzazione sempre uguale, una cartella per fotografo identificato dalla sua sigla:

images/posts/EVENTO/<sigla-fotografo>/org/    foto originali scattate (full-res) — NON pubblicate, sorgente
images/posts/EVENTO/<sigla-fotografo>/edit/   resize alleggerite, CON logo + nome del fotografo — aperte nel lightbox
images/posts/EVENTO/<sigla-fotografo>/thumb/  miniature mostrate nella griglia

org/, edit/, thumb/ contengono gli stessi nomi file. Questa struttura deve valere SEMPRE. (NB: la vecchia cartella full/ è legacy, va rinominata in edit/.)

Sigle fotografo

  • ac = Alice Cortegiani
  • dt = Davide Tedesco
  • altre sigle in uso nei repo LEAP: gmd, lz, gs
  • nome esteso da normalizzare a sigla: marco-iacobucci

Uso nei post

Si imposta gallery_path nel front-matter e si fa un include per cartella-fotografo (il match thumb/ del motore NON è ricorsivo):

---
gallery_path: /images/posts/EVENTO/ac/
---
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/glightbox/dist/css/glightbox.min.css">

<style>
.gallery { display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:0.25rem; margin:1rem 0; }
.gallery a { display:block; aspect-ratio:1; overflow:hidden; }
.gallery img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .3s ease; }
.gallery a:hover img { transform:scale(1.04); }
</style>

<div class="gallery "></div>

<script src="https://cdn.jsdelivr.net/npm/glightbox/dist/js/glightbox.min.js"></script>
<script>
  (function () {
    if (!window.__glightboxInit) {
      window.__glightboxInit = true;
      // Inizializza dopo il parsing completo: cosi raccoglie TUTTE le griglie
      // anche quando ci sono piu include gallery nella stessa pagina.
      var init = function () { GLightbox({ selector: '.glightbox', loop: true, touchNavigation: true }); };
      if (document.readyState !== 'loading') { init(); }
      else { document.addEventListener('DOMContentLoaded', init); }
    }
    // Il main.min.js del tema aggiunge data-lity a OGNI link immagine (al ready di
    // jQuery), aprendo una seconda lightbox (Lity) sopra GLightbox. Lo togliamo dai
    // link della griglia DOPO il load, quando quel tagging e gia avvenuto.
    var strip = function () {
      var links = document.querySelectorAll('.gallery a.glightbox[data-lity]');
      for (var i = 0; i < links.length; i++) { links[i].removeAttribute('data-lity'); }
    };
    if (document.readyState === 'complete') { strip(); }
    else { window.addEventListener('load', strip); }
  })();
</script>

Il motore del tema (so-leap-theme/_includes/gallery) è source-agnostic: prende le miniature da thumb/ e le immagini complete del lightbox da edit/, scorrendo sia le collezioni sia i file statici di questo repo (site.static_files). Le immagini delle pagine delle collezioni (_lazzaro, _archi-di-pietra) stanno invece nei rispettivi submodule.

TODO futuro

Quando tutte le gallerie sono operative: automatizzare con uno script il watermark (logo + nome fotografo) sulle immagini in edit/ — finora fatto a mano con un programma a pagamento.