54 lines
1.4 KiB
HTML
54 lines
1.4 KiB
HTML
|
<link rel="stylesheet" href="/css/snap-gallery.css" />
|
||
|
|
<script src="/js/snap-gallery.js"></script>
|
||
|
|
|
||
|
|
{{/* Initialise variables */}}
|
||
|
|
{{ $imgs := slice }}
|
||
|
|
|
||
|
|
|
||
|
|
{{ if .Params.isdir }}
|
||
|
|
{{/* Get images from folder, somehow put into map */}}
|
||
|
|
{{ else }}
|
||
|
|
{{ range (split .Params.src ",") }}
|
||
|
|
{{ $imgs = $imgs | append (trim . " ") }}
|
||
|
|
{{ end }}
|
||
|
|
{{ end }}
|
||
|
|
|
||
|
|
{{/* Visible images */}}
|
||
|
|
<div class="row">
|
||
|
|
{{ range $i, $img := $imgs }}
|
||
|
|
<div class="column">
|
||
|
|
<img src="{{ $img }}" onclick="openModal();currentSlide({{ add $i 1 }});" class="hover-shadow">
|
||
|
|
</div>
|
||
|
|
{{ end }}
|
||
|
|
</div>
|
||
|
|
|
||
|
|
{{/* The Modal/Lightbox */}}
|
||
|
|
<div id="myModal" class="modal">
|
||
|
|
<span class="close cursor" onclick="closeModal()">×</span>
|
||
|
|
<div class="modal-content">
|
||
|
|
|
||
|
|
{{ range $i, $img := $imgs }}
|
||
|
|
<div class="mySlides">
|
||
|
|
<div class="numbertext">{{ add $i 1 }} / {{ len $imgs }}</div>
|
||
|
|
<img src="{{ $img }}" style="width:100%">
|
||
|
|
</div>
|
||
|
|
{{ end }}
|
||
|
|
|
||
|
|
<!-- Next/previous controls -->
|
||
|
|
<a class="prev" onclick="plusSlides(-1)">❮</a>
|
||
|
|
<a class="next" onclick="plusSlides(1)">❯</a>
|
||
|
|
|
||
|
|
<!-- Caption text -->
|
||
|
|
<div class="caption-container">
|
||
|
|
<p id="caption"></p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- Thumbnail image controls -->
|
||
|
|
{{ range $i, $img := $imgs }}
|
||
|
|
<div class="column">
|
||
|
|
<img class="demo" src="{{ $img }}" onclick="currentSlide({{ add $i 1 }})" alt="Nature">
|
||
|
|
</div>
|
||
|
|
{{ end }}
|
||
|
|
</div>
|
||
|
|
</div>
|