This commit is contained in:
2026-09-13 20:15:48 +02:00
parent ffd32a6b63
commit 399f2be456
24 changed files with 2159 additions and 90 deletions
+43 -1
View File
@@ -1,4 +1,46 @@
@if(item.mime === 'video/youtube')
@if(item.is_album && item.album && item.album.length > 1)
<div class="embed-responsive embed-responsive-16by9 album-gallery-container" data-album-id="{{ item.id }}" data-requested-subf0ck="{{ item.requested_subf0ck_slug || '' }}">
<script type="application/json" class="album-data-json">{{ item.album_json }}</script>
<div class="embed-responsive-image album-media-stage" id="image-scroll">
<a href="{{ item.dest }}" id="elfe" target="_blank" class="album-stage-link">
<img id="f0ck-image" class="img-fluid album-active-image" src="{{ item.dest }}" loading="lazy" decoding="async" />
</a>
<div id="f0ck-album-video-wrapper" class="album-video-wrapper embed-responsive embed-responsive-16by9" style="display: none; position: absolute; inset: 0; width: 100%; height: 100%;">
<video id="f0ck-album-video" class="embed-responsive-item" preload="auto" loop playsinline></video>
</div>
<div id="f0ck-album-audio-wrapper" class="album-audio-wrapper embed-responsive embed-responsive-16by9" style="display: none; position: absolute; inset: 0; width: 100%; height: 100%; background: url('/s/img/audio.webp') no-repeat center / contain black;">
<audio id="f0ck-album-audio" class="embed-responsive-item" preload="auto" loop poster="/s/img/audio.webp"></audio>
</div>
</div>
<!-- Album Gallery Controls Inside View -->
<div class="album-controls-overlay">
<button type="button" class="album-btn album-btn-prev" title="{{ t('album.prev') || 'Previous' }}" aria-label="Previous">
<i class="fa-solid fa-chevron-left"></i>
</button>
<div class="album-counter-pill" title="Subf0cks">
<i class="fa-solid fa-layer-group"></i>
<span class="album-current-idx">1</span> / <span class="album-total-count">{{ item.album.length }}</span>
</div>
<button type="button" class="album-btn album-btn-next" title="{{ t('album.next') || 'Next' }}" aria-label="Next">
<i class="fa-solid fa-chevron-right"></i>
</button>
</div>
<!-- Album Thumbnail Strip (reveals on hover) -->
<div class="album-thumbnails-strip">
@each(item.album as img)
<button type="button" class="album-thumb-item {{ img.is_first ? 'active' : '' }}" data-index="{{ img.order_index }}" data-subf0ck-id="{{ img.slug || img.id }}" data-subf0ck-slug="{{ img.slug || img.id }}" data-src="{{ img.src }}" data-mime="{{ img.mime }}" title="Subf0ck {{ img.slug || img.id }} ({{ img.display_index }}/{{ item.album.length }})">
<img src="{{ img.thumb || img.src }}" loading="lazy" alt="Subf0ck {{ img.slug || img.id }}" />
@if(img.is_video)
<span class="album-thumb-mime-badge"><i class="fa-solid fa-play"></i></span>
@elseif(img.is_audio)
<span class="album-thumb-mime-badge"><i class="fa-solid fa-music"></i></span>
@endif
</button>
@endeach
</div>
<button class="image-modal-btn" title="Open in modal"><i class="fa-solid fa-plus"></i></button>
</div>
@elseif(item.mime === 'video/youtube')
<div class="embed-responsive embed-responsive-16by9">
<iframe id="yt-embed" class="embed-responsive-item" width="640" height="360" src="https://www.youtube.com/embed/{!! item.dest.replace('yt:', '') !!}" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
</div>