375 lines
24 KiB
HTML
375 lines
24 KiB
HTML
{{-- LEGACY LAYOUT — 2-column (main + fixed right sidebar) --}}
|
||
{{-- Used by: members with use_new_layout = false --}}
|
||
<div class="item-layout-container">
|
||
|
||
{{-- MAIN CONTENT: media + navigation + metadata + comments --}}
|
||
<div class="item-main-content">
|
||
|
||
<div class="_204863">
|
||
<div class="location">{{ link.mainDisplay || link.main }}{{ item.slug || item.id }}{{ link.suffix }}</div>
|
||
<div class="gapLeft"></div>
|
||
</div>
|
||
@if(enable_item_title)
|
||
<div class="item_title">{!! item.title || '' !!}</div>
|
||
@endif
|
||
|
||
<div class="content">
|
||
<div class="previous-post">
|
||
@if(pagination.next)
|
||
<div class="arrow-prev">
|
||
<a id="prev" href="{{ link.main }}{{ pagination.next }}{{ link.suffix }}"></a>
|
||
</div>
|
||
@else
|
||
<div class="arrow-prev">
|
||
<a id="prev" href="#" style="color: #ccc !important;"></a>
|
||
</div>
|
||
@endif
|
||
</div>
|
||
<div class="media-object" data-mode="@if(item.is_nsfl)nsfl@elseif(item.is_nsfw)nsfw@elseif(item.is_sfw)sfw@elseuntagged@endif">
|
||
@include(snippets/item-media)
|
||
</div>
|
||
<div class="next-post">
|
||
@if(pagination.prev)
|
||
<div class="arrow-next">
|
||
<a id="next" href="{{ link.main }}{{ pagination.prev }}{{ link.suffix }}"></a>
|
||
</div>
|
||
@else
|
||
<div class="arrow-next">
|
||
<a id="next" href="#" style="color: #ccc !important;"></a>
|
||
</div>
|
||
@endif
|
||
</div>
|
||
</div>
|
||
<div class="metadata">
|
||
|
||
<div class="kontrollelement">
|
||
<div class="einheit">
|
||
@if(typeof pagination !== "undefined")
|
||
@if(!user_alternative_steuerung)
|
||
<nav class="steuerung">
|
||
@if(pagination.next)
|
||
<a class="nav-prev" href="{{ link.main }}{{ pagination.next }}{{ link.suffix }}">← {{ t('nav.prev') }}</a>
|
||
@else
|
||
<a class="nav-prev" href="#" style="visibility: hidden">← {{ t('nav.prev') }}</a>
|
||
@endif
|
||
<span>|</span>
|
||
<a id="random" class="" href="/random">
|
||
<span>{{ t('nav.random_nav') }}</span>
|
||
</a>
|
||
<span>|</span>
|
||
@if(pagination.prev)
|
||
<a class="nav-next" href="{{ link.main }}{{ pagination.prev }}{{ link.suffix }}">{{ t('nav.next') }} →</a>
|
||
@else
|
||
<a class="nav-next" href="#" style="visibility: hidden">{{ t('nav.next') }} →</a>
|
||
@endif
|
||
</nav>
|
||
@else
|
||
<nav class="steuerung steuerung-icon">
|
||
@if(pagination.next)
|
||
<a class="nav-prev" href="{{ link.main }}{{ pagination.next }}{{ link.suffix }}"><i class="fa-solid fa-chevron-left"></i></a>
|
||
@else
|
||
<a class="nav-prev" href="#" style="visibility: hidden"><i class="fa-solid fa-chevron-left"></i></a>
|
||
@endif
|
||
<button class="steuerung-scroll-down"><i class="fa-solid fa-chevron-down"></i></button>
|
||
@if(pagination.prev)
|
||
<a class="nav-next" href="{{ link.main }}{{ pagination.prev }}{{ link.suffix }}"><i class="fa-solid fa-chevron-right"></i></a>
|
||
@else
|
||
<a class="nav-next" href="#" style="visibility: hidden"><i class="fa-solid fa-chevron-right"></i></a>
|
||
@endif
|
||
</nav>
|
||
@endif
|
||
@endif
|
||
</div>
|
||
</div>
|
||
|
||
<div class="blahlol">
|
||
@if(user_alternative_infobox)
|
||
<div class="user-infobox-block" data-banner-user="{{ item.username || '' }}" style="--author-accent: @if(item.author_color){{ item.author_color }}@else var(--accent) @endif; --author-border: @if(item.author_color){{ item.author_color }}@else var(--accent) @endif;@if(item.author_banner_file && user_banner_enabled) --author-banner: url('/a/{{ item.author_banner_file }}'); --author-banner-position: {{ item.author_banner_position === 'center' ? 'center top' : (item.author_banner_position || 'center top') }}; --author-banner-size: {{ item.author_banner_size || 'cover' }};@endif">
|
||
|
||
<div class="user-infobox-avatar">
|
||
<a href="/user/{{ (item.username || '').toLowerCase() }}">
|
||
@if(item.author_avatar_file)
|
||
<img src="/a/{{ item.author_avatar_file }}" />
|
||
@elseif(item.author_avatar && item.author_avatar > 0)
|
||
<img src="/t/{{ item.author_avatar }}.webp" />
|
||
@else
|
||
<img src="/a/default.png" style="border-color: #444;" />
|
||
@endif
|
||
</a>
|
||
</div>
|
||
<div class="user-infobox-info">
|
||
<div class="user-infobox-header">
|
||
<div class="user-infobox-username-container">
|
||
<a id="a_username" data-username="{{ item.username || '' }}" data-author-id="{{ item.author_id || '' }}" href="/user/{{ (item.username || '').toLowerCase() }}" tooltip="ID: {{ item.author_id }}" class="user-infobox-username">{!! item.author_display_name || item.username !!}</a>
|
||
</div>
|
||
<span class="user-infobox-timestamp"><a href="/{{ item.slug || item.id }}" class="timestamp-link"><time class="timeago" tooltip="{{ item.timestamp.timefull }}">{{item.timestamp.timeago }}</time></a></span>
|
||
</div>
|
||
<div class="user-infobox-body">
|
||
<div class="user-infobox-description">
|
||
{!! item.author_description || '' !!}
|
||
</div>
|
||
<div class="user-infobox-actions">
|
||
@if(session)
|
||
@if(user_has_favorited)
|
||
<i class="iconset fa-solid fa-heart" id="a_favo" data-item-id="{{ item.id }}" title="Favorite"></i>
|
||
@else
|
||
<i class="iconset fa-regular fa-heart" id="a_favo" data-item-id="{{ item.id }}" title="Favorite"></i>
|
||
@endif
|
||
@endif
|
||
<span id="oc-badge-container-infobox">@if(item.is_oc)<span class="oc-badge" tooltip="Original Content">OC</span>@endif</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
@endif
|
||
|
||
<span class="badge badge-dark">
|
||
|
||
<a href="/{{ item.slug || item.id }}" class="id-link" data-item-id="{{ item.id }}" @if(user_alternative_infobox)style="display:none"@endif>{{ item.slug || item.id }}</a>
|
||
@if(!user_alternative_infobox) — [<a id="a_username" data-username="{{ item.username || '' }}" @if(session) data-author-id="{{ item.author_id || '' }}" @endif href="/user/{{ (item.username || '').toLowerCase() }}" @if(session && item.author_id) tooltip="ID: {{ item.author_id }}" @endif @if(item.author_color) style="color: {{ item.author_color }}" @endif>{!! item.author_display_name || item.username || 'unknown' !!}</a>] @endif
|
||
@if(!user_alternative_infobox)
|
||
<span id="oc-badge-container">@if(item.is_oc) — <span class="oc-badge" tooltip="Original Content">OC</span>@endif</span>
|
||
@endif
|
||
</span>
|
||
@if(!user_alternative_infobox) — <span class="badge badge-dark"><a href="/{{ item.slug || item.id }}" class="timestamp-link"><time class="timeago" tooltip="{{ item.timestamp.timefull }}">{{item.timestamp.timeago }}</time></a></span>@if(halls_enabled && item.primaryHall) — @endif @endif
|
||
@if(halls_enabled && item.primaryHall)
|
||
<span class="badge hall-badge-wrap">
|
||
<a href="/h/{{ item.primaryHall.slug }}" class="hall-badge-primary"><i class="fa-solid fa-layer-group"></i> {{ item.primaryHall.name }}</a>@if(item.otherHalls && item.otherHalls.length)<span class="hall-overflow-pill">+{{ item.otherHalls.length }}<span class="hall-overflow-tooltip">@each(item.otherHalls as oh)<a href="/h/{{ oh.slug }}">{{ oh.name }}</a>@endeach</span></span>@endif
|
||
</span>
|
||
@endif
|
||
|
||
|
||
<div class="gapRight">
|
||
@if(session)
|
||
@if(!user_alternative_infobox)
|
||
@if(user_has_favorited)
|
||
<i class="iconset fa-solid fa-heart" id="a_favo" data-item-id="{{ item.id }}" title="Favorite"></i>
|
||
@else
|
||
<i class="iconset fa-regular fa-heart" id="a_favo" data-item-id="{{ item.id }}" title="Favorite"></i>
|
||
@endif
|
||
@endif
|
||
<i class="iconset fa-solid fa-circle-info" id="a_info" data-item-id="{{ item.id }}" title="{{ t('info_modal.button_title') || 'Post & File Info' }}"></i>
|
||
<i class="iconset {{ isSubscribed ? 'fa-solid' : 'fa-regular' }} fa-bell" id="subscribe-btn" data-item-id="{{ item.id }}" title="{{ isSubscribed ? 'Subscribed' : 'Subscribe' }}"></i>
|
||
<i class="iconset fa-solid fa-triangle-exclamation report-item-btn" data-item-id="{{ item.id }}" title="Report this post"></i>
|
||
@if(halls_enabled)
|
||
<i class="iconset fa-solid fa-layer-group" id="a_hall" data-item-id="{{ item.id }}" data-halls="{{ halls_slugs }}" data-user-halls="{{ user_halls_slugs }}" data-current-hall="{{ (tmp.hall && typeof tmp.hall === 'object') ? tmp.hall.slug : (tmp.hall || '') }}" data-current-user-hall="{{ (tmp.userHall && typeof tmp.userHall === 'object') ? tmp.userHall.slug : (tmp.userHall || '') }}" data-current-user-hall-owner="{{ tmp.userHallOwner || '' }}" title="Add to Hall"></i>
|
||
@endif
|
||
@if(can_manage_item)
|
||
<i class="iconset fa-solid fa-eye" id="a_visibility" data-item-id="{{ item.id }}" data-visibility="{{ item.visibility || 0 }}" title="Visibility: {{ item.visibility === 2 ? 'Private' : (item.visibility === 1 ? 'Unlisted' : 'Public') }} (Click to change)"></i>
|
||
<i class="iconset {{ item.is_oc ? 'fa-solid' : 'fa-regular' }} fa-star" id="a_oc" data-item-id="{{ item.id }}" data-is-oc="{{ item.is_oc }}" title="{{ item.is_oc ? 'Remove OC status' : 'Mark as OC' }}"></i>
|
||
@if(can_extract_meta)
|
||
<i class="iconset fa-solid fa-magic" id="a_metadata" data-item-id="{{ item.id }}" @if(item.mime === 'video/youtube') data-src="https://www.youtube.com/watch?v={{ item.dest.replace('yt:', '') }}" @endif title="Extract Metadata"></i>
|
||
@endif
|
||
@if(item.mime === 'application/x-shockwave-flash' || item.mime === 'application/vnd.adobe.flash.movie')
|
||
<i class="iconset fa-solid fa-image" id="a_rethumb" data-item-id="{{ item.id }}" title="Re-upload Thumbnail"></i>
|
||
@endif
|
||
@endif
|
||
@if(is_mod_or_admin)
|
||
<i class="iconset fa-solid fa-thumbtack{{ item.is_pinned ? ' active' : '' }}" id="a_pin" data-pinned="{{ item.is_pinned }}" title="{{ item.is_pinned ? 'Unpin from main' : 'Pin to main' }}"></i>
|
||
<i class="iconset fa-solid fa-xmark" id="a_delete" title="Delete"></i>
|
||
@endif
|
||
@else
|
||
<i class="iconset fa-solid fa-circle-info" id="a_info" data-item-id="{{ item.id }}" title="{{ t('info_modal.button_title') || 'Post & File Info' }}"></i>
|
||
@endif
|
||
</div>
|
||
<span class="badge badge-dark" id="tags">
|
||
<span class="tags-inner">
|
||
@if(typeof item.tags !== "undefined")
|
||
@each(item.tags as tag)
|
||
<span tooltip="{!! tag.display_name || tag.user !!}" class="badge {{ tag.badge }}">
|
||
<a href="/tag/{{ tag.normalized }}">{!! tag.tag !!}</a>@if(is_mod_or_admin) <a class="removetag" href="#"><i class="fa-solid fa-xmark"></i></a>@endif
|
||
</span>
|
||
@endeach
|
||
@endif
|
||
</span>
|
||
@if(item.tags && item.tags.length > 10)
|
||
<a href="#" class="show-tags-toggle" data-count="{{ item.tags.length - 10 }}">show {{ item.tags.length - 10 }} more</a>
|
||
@endif
|
||
@if(session)
|
||
<div class="tag-controls">
|
||
<a href="#" id="a_addtag" class="tag-btn" flow="up-left">
|
||
<i class="fa-solid fa-plus"></i>
|
||
</a>
|
||
@if(can_manage_item)
|
||
<button class="rating-btn {{ item.is_nsfl ? 'is-nsfl' : (item.is_nsfw ? 'is-nsfw' : (item.is_sfw ? 'is-sfw' : 'is-untagged')) }}" id="a_toggle" title="Toggle Rating"><i class="fa-solid fa-arrow-right-arrow-left"></i></button>
|
||
@endif
|
||
</div>
|
||
@endif
|
||
</span>
|
||
<span class="badge" id="favs" @if(!item.favorites.length) hidden@endif>
|
||
@each(item.favorites as fav)
|
||
@if(fav.hide_fav_badge && (!session || session.user !== fav.user))
|
||
<a class="ghost-fav" tooltip="?" flow="up" style="cursor: default;"><img src="/s/img/ghost_fav.svg" style="height: 32px; width: 32px;" loading="lazy" /></a>
|
||
@else
|
||
<a href="/user/{{ fav.user.toLowerCase() }}" tooltip="{!! fav.display_name || fav.user !!}" flow="up"><img src="@if(fav.avatar_file)/a/{{ fav.avatar_file }}@elseif(fav.avatar)/t/{{ fav.avatar }}.webp@else/a/default.png@endif" style="height: 32px; width: 32px@if(fav.username_color); border-color: {{ fav.username_color }}@endif" loading="lazy" /></a>
|
||
@endif
|
||
@endeach
|
||
</span>
|
||
@if(enable_xd_score && item.xd_score > 0)
|
||
<div class="xd-score-wrapper">
|
||
<span class="xd-score-badge xd-tier-{{ item.xd_tier }}" tooltip="xD Score: {{ item.xd_score }} pts" flow="up">
|
||
{{ item.xd_label }} <span class="xd-score-num">{{ item.xd_score }}</span>
|
||
</span>
|
||
</div>
|
||
@endif
|
||
</div>
|
||
</div>
|
||
|
||
<div id="comments-container"
|
||
data-item-id="{{ item.id }}"
|
||
@if(session) data-user="{{ session.user }}" @endif
|
||
@if(session && (session.admin || session.is_moderator)) data-is-admin="true" @endif
|
||
@if(item.is_comments_locked) data-is-locked="true" @endif>
|
||
@if(!item.is_comments_locked)
|
||
<div class="comment-input main-input">
|
||
<textarea disabled></textarea>
|
||
</div>
|
||
@endif
|
||
</div>
|
||
<button class="mobile-scroll-to-top" title="Back to top" aria-label="Scroll to top"><i class="fa-solid fa-chevron-up"></i></button>
|
||
<script id="initial-subscription" type="application/json">{{ isSubscribed }}</script>
|
||
|
||
</div>
|
||
|
||
{{-- RIGHT SIDEBAR: recent activity (fixed to viewport) --}}
|
||
|
||
</div>
|
||
|
||
<div id="info-modal" class="modal-overlay" style="display: none;">
|
||
<div class="modal-content" style="max-width: 500px;">
|
||
<div class="modal-body" style="padding: 20px 0; text-align: left;">
|
||
<table class="info-table">
|
||
@if(enable_item_title && can_manage_item)
|
||
<tr class="info-title-row">
|
||
<th>Title</th>
|
||
<td>
|
||
<div class="info-title-edit-wrap">
|
||
<input type="text" id="info-title-input" class="info-title-input" value="{!! item.title || '' !!}" placeholder="Add a title…" maxlength="500" data-item-id="{{ item.id }}" />
|
||
<button id="info-title-save" class="info-title-save-btn"><i class="fa-solid fa-check"></i></button>
|
||
</div>
|
||
<span id="info-title-status" class="info-title-status" style="display:none"></span>
|
||
</td>
|
||
</tr>
|
||
@elseif(enable_item_title && item.title)
|
||
<tr>
|
||
<th>Title</th>
|
||
<td>{!! item.title !!}</td>
|
||
</tr>
|
||
@endif
|
||
<tr class="info-id-row">
|
||
<th>ID</th>
|
||
<td><code>{{ item.id }}</code></td>
|
||
</tr>
|
||
<tr class="info-visibility-row">
|
||
<th>Visibility</th>
|
||
<td>
|
||
<span id="info-visibility-label" style="display: inline-flex; align-items: center; gap: 6px;">
|
||
@if(item.visibility === 2)
|
||
<i class="fa-solid fa-lock" style="color: var(--color-danger, #ff4444);"></i> Private
|
||
@elseif(item.visibility === 1)
|
||
<i class="fa-solid fa-link" style="color: var(--color-warning, #ffbb33);"></i> Unlisted
|
||
@else
|
||
<i class="fa-solid fa-globe" style="color: var(--color-success, #00C851);"></i> Public
|
||
@endif
|
||
</span>
|
||
@if(can_manage_item)
|
||
<button id="info-visibility-edit-btn" class="btn-secondary btn-sm" style="margin-left: 8px; padding: 2px 8px; font-size: 0.8em;" data-item-id="{{ item.id }}" data-visibility="{{ item.visibility || 0 }}"><i class="fa-solid fa-pen"></i> Edit</button>
|
||
@endif
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<th>{{ t('info_modal.file_size') || 'File Size' }}</th>
|
||
<td>{{ item.size }}</td>
|
||
</tr>
|
||
@if(item_has_dimensions)
|
||
<tr>
|
||
<th>{{ t('info_modal.dimensions') || 'Dimensions' }}</th>
|
||
<td>{{ item.width }} × {{ item.height }}</td>
|
||
</tr>
|
||
@endif
|
||
<tr>
|
||
<th>{{ t('info_modal.mime_type') || 'MIME Type' }}</th>
|
||
<td><code>{{ item.mime }}</code></td>
|
||
</tr>
|
||
@if(item.checksum)
|
||
<tr>
|
||
<th>{{ t('info_modal.sha256') || 'SHA-256 Hash' }}</th>
|
||
<td><pre class="info-hash-codeblock"><code style="word-break: break-all;">{{ item.checksum.split('_bypass_')[0] }}</code></pre></td>
|
||
</tr>
|
||
@endif
|
||
@if(item.is_repost || (item.reposts && item.reposts.length > 0))
|
||
<tr class="info-repost-row">
|
||
<th>Repost</th>
|
||
<td>
|
||
@each(item.reposts as rp)
|
||
@if(rp.match_type === 'phash')
|
||
<a href="/{{ rp.slug || rp.id }}" style="margin-right: 4px; opacity: 0.75;" tooltip="Visually similar (perceptual hash)" flow="up">~#{{ rp.slug || rp.id }}</a>
|
||
@else
|
||
<a href="/{{ rp.slug || rp.id }}" style="margin-right: 4px;" tooltip="Exact duplicate (checksum)" flow="up">#{{ rp.slug || rp.id }}</a>
|
||
@endif
|
||
@endeach
|
||
</td>
|
||
</tr>
|
||
@endif
|
||
<tr>
|
||
<th>{{ t('info_modal.direct_url') || 'Direct URL' }}</th>
|
||
<td>
|
||
<a href="{{ item.mime === 'video/youtube' ? 'https://www.youtube.com/watch?v=' + item.dest.replace('yt:', '') : item.dest }}" target="_blank">
|
||
{{ t('info_modal.view_file') || 'View File' }}
|
||
</a>
|
||
</td>
|
||
</tr>
|
||
@if(item.src.short)
|
||
<tr>
|
||
<th>{{ t('info_modal.source') || 'Source' }}</th>
|
||
<td><a href="{{ item.src.long }}" target="_blank" style="word-break: break-all;">{{ item.src.short }}</a></td>
|
||
</tr>
|
||
@endif
|
||
</table>
|
||
</div>
|
||
<div class="modal-actions" style="display: flex; justify-content: flex-end; gap: 10px;">
|
||
<button class="btn-secondary" id="info-modal-close">{{ t('common.close') || 'Close' }}</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="visibility-modal" class="modal-overlay" style="display: none;">
|
||
<div class="modal-content" style="max-width: 420px;">
|
||
<div class="modal-header" style="margin-bottom: 15px; border-bottom: 1px solid var(--border-color, #333); padding-bottom: 10px;">
|
||
<h3 style="margin: 0; font-size: 1.1em; color: var(--text-color, #fff);"><i class="fa-solid fa-eye"></i> Change Visibility</h3>
|
||
</div>
|
||
<div class="modal-body" style="padding: 10px 0; text-align: left;">
|
||
<form id="visibility-form" onsubmit="return false;">
|
||
<input type="hidden" id="visibility-item-id" value="{{ item.id }}" />
|
||
<div class="visibility-options" style="display: flex; flex-direction: column; gap: 10px;">
|
||
<label class="visibility-option" style="display: flex; align-items: flex-start; gap: 12px; padding: 12px; border: 1px solid var(--nav-border-color, #444); border-radius: 6px; cursor: pointer; background: var(--bg-secondary, rgba(255,255,255,0.03));">
|
||
<input type="radio" name="visibility" value="0" style="margin-top: 3px;" />
|
||
<div>
|
||
<strong style="display: block; color: var(--text-color, #fff);"><i class="fa-solid fa-globe"></i> Public</strong>
|
||
<span style="font-size: 0.85em; color: var(--text-muted, #aaa);">Visible to everyone in main feeds, search, and rankings.</span>
|
||
</div>
|
||
</label>
|
||
<label class="visibility-option" style="display: flex; align-items: flex-start; gap: 12px; padding: 12px; border: 1px solid var(--nav-border-color, #444); border-radius: 6px; cursor: pointer; background: var(--bg-secondary, rgba(255,255,255,0.03));">
|
||
<input type="radio" name="visibility" value="1" style="margin-top: 3px;" />
|
||
<div>
|
||
<strong style="display: block; color: var(--text-color, #fff);"><i class="fa-solid fa-link"></i> Unlisted</strong>
|
||
<span style="font-size: 0.85em; color: var(--text-muted, #aaa);">Hidden from main feeds; accessible only via direct link or slug.</span>
|
||
</div>
|
||
</label>
|
||
<label class="visibility-option" style="display: flex; align-items: flex-start; gap: 12px; padding: 12px; border: 1px solid var(--nav-border-color, #444); border-radius: 6px; cursor: pointer; background: var(--bg-secondary, rgba(255,255,255,0.03));">
|
||
<input type="radio" name="visibility" value="2" style="margin-top: 3px;" />
|
||
<div>
|
||
<strong style="display: block; color: var(--text-color, #fff);"><i class="fa-solid fa-lock"></i> Private</strong>
|
||
<span style="font-size: 0.85em; color: var(--text-muted, #aaa);">Only visible to you and site moderators.</span>
|
||
</div>
|
||
</label>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
<div class="modal-actions" style="display: flex; justify-content: flex-end; gap: 10px; margin-top: 15px;">
|
||
<button class="btn-secondary" id="visibility-modal-cancel">Cancel</button>
|
||
<button class="btn-primary" id="visibility-modal-save">Save Visibility</button>
|
||
</div>
|
||
</div>
|
||
</div>
|