discourse-legacysite-perl/site/articles/include_detailed_slideshow.html
2024-06-17 22:24:05 +10:00

54 lines
1.9 KiB
HTML

<%~init array photos_loop%>
<%~set index = 0%>
<%~loop 1 .. 20%>
<%~set image_path = Plugins::UI::retrieve_param("Image_largest_path", $loop_value)%>
<%~set image_caption = Plugins::UI::retrieve_param('Image_description', $loop_value)%>
<%~set thumbnail_path = Plugins::UI::retrieve_param("Image_thumbnail_path", $loop_value)%>
<%~if image_path%>
<%~init hash image%><%set image.path = $image_path%><%set image.caption = $image_caption%><%set image.thumb = $thumbnail_path%>
<%~set photos_loop.$index = $image%>
<%~set index += 1%>
<%~endif%>
<%~endloop%>
<div class="swiper-container swiper-content" style="position: relative">
<div class="swiper-wrapper">
<%~loop photos_loop%>
<div class="swiper-slide">
<div class="swiper-holder">
<img src="<%path%>" class="img-responsive" />
<div class="index italic right"><%row_num%> of <%photos_loop.length%> photo<%if photos_loop.length > 1%>s<%endif%></div>
<%~if $photos_loop.length%>
<div class="slideshow-controller mobile">
<div class="btn btn-prev">&lt;</div>
<div class="btn btn-next">&gt;</div>
</div>
<%~endif%>
</div>
<div class="caption">
<%caption || ''%>
</div>
</div>
<%~endloop%>
</div>
</div>
<%~if photos_loop.length%>
<div class="slideshow-controller">
<div class="btn btn-prev">PREV</div>
<div class="btn btn-next">NEXT</div>
<div class="index italic right"><span>1</span> of <%photos_loop.length%> photo<%if photos_loop.length > 1%>s<%endif%></div>
</div>
<div class="swiper-container swiper-nav">
<div class="swiper-wrapper">
<%~loop photos_loop%>
<div class="swiper-slide<%if row_num == 1%> active-nav<%endif%>"><img src="<%thumb%>" width="107" height="80" /></div>
<%~endloop%>
</div>
<div class="swiper-button-next swiper-button"> &gt; </div>
<div class="swiper-button-prev swiper-button"> &lt; </div>
</div>
<%~endif%>
<!-- end Slider -->