2024-10-28 19:47:14 +00:00
|
|
|
<!DOCTYPE html>
|
|
|
|
<html lang="en">
|
|
|
|
<head>
|
|
|
|
<title>Gallery</title>
|
|
|
|
<link type="text/css" rel="stylesheet" href="/style.css"/>
|
|
|
|
<link type="text/css" rel="stylesheet" href="/lightgallery-bundle.min.css"/>
|
|
|
|
</head>
|
|
|
|
<body>
|
|
|
|
<div id="lightgallery">
|
2024-10-29 09:29:14 +00:00
|
|
|
<% items.forEach(item => {
|
|
|
|
if (item.video) { %>
|
|
|
|
<a data-video='<%- item.video %>'>
|
|
|
|
<img alt="" src="<%- item.thumbnailUrl %>"/>
|
|
|
|
<div class="play-icon"></div>
|
2024-10-28 19:47:14 +00:00
|
|
|
</a>
|
2024-10-29 09:29:14 +00:00
|
|
|
<% } else { %>
|
|
|
|
<a href="<%- item.originalUrl %>">
|
|
|
|
<img alt="" src="<%- item.thumbnailUrl %>"/>
|
|
|
|
</a>
|
|
|
|
<% }
|
|
|
|
}) %>
|
2024-10-28 19:47:14 +00:00
|
|
|
</div>
|
|
|
|
<script src="/lightgallery.min.js"></script>
|
|
|
|
<script src="/lg-thumbnail.min.js"></script>
|
2024-10-29 09:29:14 +00:00
|
|
|
<script src="/lg-video.min.js"></script>
|
2024-10-28 19:47:14 +00:00
|
|
|
<script src="/lg-zoom.min.js"></script>
|
|
|
|
<script type="text/javascript">
|
|
|
|
lightGallery(document.getElementById('lightgallery'), {
|
2024-10-29 09:29:14 +00:00
|
|
|
plugins: [lgZoom, lgThumbnail, lgVideo],
|
2024-10-28 19:47:14 +00:00
|
|
|
licenseKey: '0000-0000-000-0000',
|
|
|
|
speed: 500
|
2024-10-29 09:29:14 +00:00
|
|
|
})
|
|
|
|
<% if (openItem) { %>
|
|
|
|
const openItem = <%- openItem %>
|
|
|
|
const thumbs = document.querySelectorAll('#lightgallery a')
|
|
|
|
if (thumbs.length >= openItem) {
|
|
|
|
thumbs[openItem - 1].click()
|
|
|
|
}
|
|
|
|
<% } %>
|
2024-10-28 19:47:14 +00:00
|
|
|
</script>
|
|
|
|
</body>
|
|
|
|
</html>
|