georges/layouts/index.html

86 lines
2.3 KiB
HTML

{{ define "pagename" -}}
<!-- -->
{{- end }}
{{ define "main" }}
{{ .Content }}
<div
id="blueimp-gallery"
class="blueimp-gallery blueimp-gallery-controls"
aria-label="image gallery"
aria-modal="true"
role="dialog"
>
<div class="slides" aria-live="polite"></div>
<h3 class="title"></h3>
<a
class="prev"
aria-controls="blueimp-gallery"
aria-label="previous slide"
aria-keyshortcuts="ArrowLeft"
></a>
<a
class="next"
aria-controls="blueimp-gallery"
aria-label="next slide"
aria-keyshortcuts="ArrowRight"
></a>
<a
class="close"
aria-controls="blueimp-gallery"
aria-label="close"
aria-keyshortcuts="Escape"
></a>
<a
class="play-pause"
aria-controls="blueimp-gallery"
aria-label="play slideshow"
aria-keyshortcuts="Space"
aria-pressed="false"
role="button"
></a>
<ol class="indicator"></ol>
</div>
{{ range sort .Params.georgespics "date" "desc" }}
<div class="galleryblock">
<div class="blockhead">
<h2>
{{- .name }}
{{ with .osm -}}
<a class="osmlink" href="{{ . }}"><i class="fa fa-map-marker" aria-hidden="true"></i>
</a>
{{- end -}}
</h2>
<div class="gallerydate">
{{ time.Format "January 2006" .date }}
</div>
</div>
<div class="gallery">
{{ range .pics }}
<a href="{{ $.Site.Params.picturesBase }}/{{ .path }}">
<img src="{{ $.Site.Params.thumbBase }}/{{ .path }}" />
</a>
{{ end }}
</div>
</div>
{{ end }}
{{ end }}
{{ define "extrajs" }}
<script src="blueimp/js/blueimp-gallery.min.js"></script>
<script>
var galleries = document.getElementsByClassName('gallery');
for(gallery of galleries) {
gallery.onclick = function (event) {
event = event || window.event
var target = event.target || event.srcElement
var link = target.src ? target.parentNode : target
var options = { index: link, event: event }
var links = this.getElementsByTagName('a')
blueimp.Gallery(links, options)
}
}
</script>
{{ end }}