Bryan Van Deusen
42 lines
1.6 KiB
HTML
42 lines
1.6 KiB
HTML
<!-- /app/templates/_gallery_grid.html -->
|
|
<div class="gallery-grid">
|
|
{% for image in images.items %}
|
|
<div class="gallery-item">
|
|
<div class="gallery-thumb img-clickable"
|
|
data-full="{{ url_for('main.serve_image', filename=image.filepath | replace('/images/', '') ) }}"
|
|
data-type="{{ 'video' if image.filename.lower().endswith(('.mp4', '.mov')) else 'image' }}"
|
|
style="background-image: url('{{ url_for('main.serve_image', filename=(image.thumb_path or image.filepath) | replace('/images/', '') ) }}');"
|
|
data-filename="{{ image.filename }}">
|
|
{% if image.filename.lower().endswith(('.mp4', '.mov')) %}
|
|
<div class="play-overlay">▶</div>
|
|
{% endif %}
|
|
</div>
|
|
|
|
<a href="{{ url_for('main.artist_gallery', artist_name=image.artist) }}">{{ image.artist }}</a>
|
|
<span class="image-date">{{ image.taken_at or image.imported_at | datetimeformat }}</span>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
|
|
<!-- Modal -->
|
|
<div id="imageModal" class="modal">
|
|
<div class="modal-content">
|
|
<!-- Navigation buttons -->
|
|
<button id="modalPrev" class="modal-button modal-prev">←</button>
|
|
<button id="modalNext" class="modal-button modal-next">→</button>
|
|
|
|
<div class="modal-body">
|
|
<div id="modalImageWrapper" class="modal-image-wrapper">
|
|
<img id="modalImage" src="" alt="Full View">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="{{ url_for('static', filename='js/modal-pagination.js') }}"></script>
|
|
|
|
{% if request.args.get('page', '1') == '1' and not request.args.get('per_page') %}
|
|
<script src="{{ url_for('static', filename='js/dynamic_gallery_paging.js') }}"></script>
|
|
{% endif %}
|
|
|