fdsa
This commit is contained in:
@@ -1,56 +1,153 @@
|
||||
<div id="excluded-tags-overlay" style="display: none;">
|
||||
<div id="excluded-tags-close">×</div>
|
||||
<div class="search-container">
|
||||
<div id="nav_excluded_tags_list"></div>
|
||||
<div class="nav-exclude">
|
||||
<input type="text" id="nav_exclude_tag_input" class="input" placeholder="{{ t('filter.tag_placeholder') }}" autocomplete="off" enterkeyhint="enter">
|
||||
<div id="nav_exclude_suggestions" class="tag-suggestions"></div>
|
||||
<div class="filter-modal-container search-container" id="filter-modal-box">
|
||||
<div class="filter-modal-header">
|
||||
<h3 class="filter-modal-title"><i class="fa-solid fa-sliders"></i> {{ t('filter.title') || 'Content Filters' }}</h3>
|
||||
<div id="excluded-tags-close" title="Close Filters">×</div>
|
||||
</div>
|
||||
<!-- modes -->
|
||||
<div class="mode-filter">
|
||||
<button id="nav-shuffle-btn" class="shuffle-btn" title="Random Mode — shuffle all items"><span class="shuffle-icon">( - _ - )</span> {{ t('filter.random_mode') }}</button>
|
||||
<div class="rating-selector" id="rating-selector">
|
||||
<button class="rating-toggle-btn" data-rating="sfw" id="rating-btn-sfw" title="SFW">SFW</button>
|
||||
<button class="rating-toggle-btn" data-rating="nsfw" id="rating-btn-nsfw" title="NSFW">NSFW</button>
|
||||
@if(enable_nsfl)
|
||||
<button class="rating-toggle-btn" data-rating="nsfl" id="rating-btn-nsfl" title="NSFL">NSFL</button>
|
||||
@endif
|
||||
@if(session && session.admin || session && session.is_moderator)
|
||||
<button class="rating-toggle-btn" data-rating="untagged" id="rating-btn-untagged" title="Untagged">UNT</button>
|
||||
@endif
|
||||
<button class="rating-toggle-btn rating-toggle-all" id="rating-btn-all" title="Show All Ratings">ALL</button>
|
||||
|
||||
<div class="filter-modal-body">
|
||||
<!-- Section 1: View Layout -->
|
||||
<div class="modal-filter-group">
|
||||
<label class="modal-filter-label"><i class="fa-solid fa-table-cells"></i> {{ t('filter.layout') || 'Layout' }}</label>
|
||||
<div class="filter-btn-group layout-group">
|
||||
<button class="filter-btn layout-btn {{ (!layout || layout == 'grid') ? 'active' : '' }}" data-layout="grid" title="Classic Grid Layout">
|
||||
<i class="fa-solid fa-border-all"></i> <span class="btn-text">Grid</span>
|
||||
</button>
|
||||
<button class="filter-btn layout-btn {{ (layout == 'masonry') ? 'active' : '' }}" data-layout="masonry" title="Fluid Masonry Layout">
|
||||
<i class="fa-solid fa-cubes"></i> <span class="btn-text">Masonry</span>
|
||||
</button>
|
||||
<button class="filter-btn layout-btn {{ (layout == 'stream') ? 'active' : '' }}" data-layout="stream" title="Vertical Stream / Feed Layout">
|
||||
<i class="fa-solid fa-list-ul"></i> <span class="btn-text">Stream</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Section 2: Sorting & Timeframe -->
|
||||
<div class="modal-filter-group">
|
||||
<label class="modal-filter-label"><i class="fa-solid fa-arrow-down-short-wide"></i> {{ t('filter.sort') || 'Sort' }}</label>
|
||||
<div class="filter-btn-group sort-group">
|
||||
<button class="filter-btn sort-btn {{ (!sort || sort == 'newest') ? 'active' : '' }}" data-sort="newest" title="Newest First">
|
||||
<i class="fa-solid fa-clock"></i> Newest
|
||||
</button>
|
||||
<button class="filter-btn sort-btn {{ (sort == 'oldest') ? 'active' : '' }}" data-sort="oldest" title="Oldest First">
|
||||
<i class="fa-solid fa-clock-rotate-left"></i> Oldest
|
||||
</button>
|
||||
<button class="filter-btn sort-btn {{ (sort == 'popular' || sort == 'top' || sort == 'xd') ? 'active' : '' }}" data-sort="popular" title="Highest xD Score">
|
||||
<i class="fa-solid fa-fire"></i> Top xD
|
||||
</button>
|
||||
<button class="filter-btn sort-btn {{ (sort == 'comments') ? 'active' : '' }}" data-sort="comments" title="Most Discussed">
|
||||
<i class="fa-solid fa-comments"></i> Most Comments
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="filter-timeframe-subgroup {{ (sort == 'popular' || sort == 'top' || sort == 'xd' || sort == 'comments') ? 'visible' : '' }}" id="filter-timeframe-section" style="margin-top: 8px;">
|
||||
<div class="filter-btn-group timeframe-group">
|
||||
<button class="filter-btn timeframe-btn {{ (!timeframe || timeframe == 'all') ? 'active' : '' }}" data-timeframe="all">All</button>
|
||||
<button class="filter-btn timeframe-btn {{ (timeframe == 'day') ? 'active' : '' }}" data-timeframe="day">24h</button>
|
||||
<button class="filter-btn timeframe-btn {{ (timeframe == 'week') ? 'active' : '' }}" data-timeframe="week">Week</button>
|
||||
<button class="filter-btn timeframe-btn {{ (timeframe == 'month') ? 'active' : '' }}" data-timeframe="month">Month</button>
|
||||
<button class="filter-btn timeframe-btn {{ (timeframe == 'year') ? 'active' : '' }}" data-timeframe="year">Year</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Section 3: Rating Selection -->
|
||||
<div class="modal-filter-group">
|
||||
<label class="modal-filter-label"><i class="fa-solid fa-shield-halved"></i> {{ t('filter.rating') || 'Rating' }}</label>
|
||||
<div class="rating-selector filter-toggles rating-group" id="rating-selector">
|
||||
<button class="rating-toggle-btn rating-sfw {{ rating_sfw ? 'active' : '' }}" data-rating="sfw" id="rating-btn-sfw" title="Safe For Work">
|
||||
<i class="fa-solid fa-circle-check"></i> SFW
|
||||
</button>
|
||||
<button class="rating-toggle-btn rating-nsfw {{ rating_nsfw ? 'active' : '' }}" data-rating="nsfw" id="rating-btn-nsfw" title="Not Safe For Work">
|
||||
<i class="fa-solid fa-triangle-exclamation"></i> NSFW
|
||||
</button>
|
||||
@if(enable_nsfl)
|
||||
<button class="rating-toggle-btn rating-nsfl {{ rating_nsfl ? 'active' : '' }}" data-rating="nsfl" id="rating-btn-nsfl" title="Not Safe For Life">
|
||||
<i class="fa-solid fa-skull"></i> NSFL
|
||||
</button>
|
||||
@endif
|
||||
@if(session && (session.admin || session.is_moderator))
|
||||
<button class="rating-toggle-btn rating-untagged {{ rating_untagged ? 'active' : '' }}" data-rating="untagged" id="rating-btn-untagged" title="Untagged">
|
||||
<i class="fa-solid fa-question"></i> Untagged
|
||||
</button>
|
||||
@endif
|
||||
<button class="rating-toggle-btn rating-toggle-all {{ (!rating_sfw && !rating_nsfw && !rating_nsfl && !rating_untagged) || (rating_sfw && rating_nsfw && rating_untagged) ? 'active' : '' }}" id="rating-btn-all" data-rating="" title="Show All Ratings">
|
||||
<i class="fa-solid fa-border-all"></i> ALL
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Section 4: Media Types -->
|
||||
<div class="modal-filter-group">
|
||||
<label class="modal-filter-label"><i class="fa-solid fa-photo-film"></i> {{ t('filter.media_types') || 'Media Types' }}</label>
|
||||
<div class="filter-toggles mime-group">
|
||||
<button class="filter-toggle-pill mime-pill {{ mime_image ? 'active' : '' }}" data-mime="image" title="Images">
|
||||
<i class="fa-regular fa-image"></i> Image
|
||||
</button>
|
||||
<button class="filter-toggle-pill mime-pill {{ mime_video ? 'active' : '' }}" data-mime="video" title="Videos">
|
||||
<i class="fa-solid fa-film"></i> Video
|
||||
</button>
|
||||
<button class="filter-toggle-pill mime-pill {{ mime_audio ? 'active' : '' }}" data-mime="audio" title="Audio / Music">
|
||||
<i class="fa-solid fa-music"></i> Audio
|
||||
</button>
|
||||
@if(enable_swf)
|
||||
<button class="filter-toggle-pill mime-pill {{ mime_flash ? 'active' : '' }}" data-mime="flash" title="Flash Animations / Games">
|
||||
<i class="fa-solid fa-bolt"></i> Flash
|
||||
</button>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Section 5: Attributes & Flags -->
|
||||
<div class="modal-filter-group">
|
||||
<label class="modal-filter-label"><i class="fa-solid fa-tags"></i> {{ t('filter.attributes') || 'Attributes' }}</label>
|
||||
<div class="filter-toggles">
|
||||
<button class="filter-toggle-pill {{ (oc == '1' || oc == 'true') ? 'active' : '' }}" id="toggle-oc-btn" data-toggle="oc" title="Original Content Only">
|
||||
<i class="fa-solid fa-certificate"></i> OC Only
|
||||
</button>
|
||||
<button class="filter-toggle-pill {{ (hasComments == '1' || hasComments == 'true') ? 'active' : '' }}" id="toggle-comments-btn" data-toggle="has_comments" title="Posts with Comments Only">
|
||||
<i class="fa-solid fa-comment-dots"></i> Discussed
|
||||
</button>
|
||||
<button id="nav-shuffle-btn" class="filter-toggle-pill shuffle-btn" title="Random Mode — shuffle items">
|
||||
<i class="fa-solid fa-shuffle"></i> Random Mode
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Section 6: Excluded Tags Blacklist -->
|
||||
<div class="modal-filter-group">
|
||||
<label class="modal-filter-label"><i class="fa-solid fa-ban"></i> {{ t('filter.excluded_tags') || 'Excluded Tags' }}</label>
|
||||
<div id="nav_excluded_tags_list" style="margin-bottom: 8px;"></div>
|
||||
<div class="nav-exclude">
|
||||
<input type="text" id="nav_exclude_tag_input" class="input" placeholder="{{ t('filter.tag_placeholder') || 'Type a tag to exclude...' }}" autocomplete="off" enterkeyhint="enter">
|
||||
<div id="nav_exclude_suggestions" class="tag-suggestions"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@if(session && enable_xd_score)
|
||||
<!-- Section 7: xD Score Filter -->
|
||||
<div class="modal-filter-group nav-xd-filter">
|
||||
<label class="modal-filter-label"><i class="fa-solid fa-gauge-high"></i> {{ t('filter.min_xd_score') }}</label>
|
||||
<div class="nav-xd-controls">
|
||||
<input type="range" id="nav_min_xd_score" min="0" max="100" step="1" value="{{ session.min_xd_score || 0 }}" class="xd-slider" style="display:none;" aria-hidden="true">
|
||||
<div id="nav_xd_slider_container" class="nav-xd-custom-slider"></div>
|
||||
<span id="nav_xd_val" class="xd-slider-val">{{ session.min_xd_score || 0 }}</span>
|
||||
<span id="nav_xd_tier_label" class="xd-score-badge" style="display:none; font-size: 0.75em;"></span>
|
||||
</div>
|
||||
<button id="nav_xd_save_btn" class="mode-btn" style="margin-top: 6px; width: 100%;">{{ t('filter.apply_filter') }}</button>
|
||||
<div id="nav_xd_status" style="font-size: 0.8em; color: #9f0; min-height: 1em; margin-top: 3px;"></div>
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
<!-- mimes -->
|
||||
@if(show_mime_picker)
|
||||
<div class="nav-mime-filter nav-mime-menu" id="nav-mime-menu">
|
||||
@if(scroller_mime_cats && scroller_mime_cats.includes('video'))
|
||||
<label class="nav-mime-item"><input type="checkbox" value="video" id="mime-video">{{ t('filter.video') }}</label>
|
||||
@endif
|
||||
@if(scroller_mime_cats && scroller_mime_cats.includes('audio'))
|
||||
<label class="nav-mime-item"><input type="checkbox" value="audio" id="mime-audio">{{ t('filter.audio') }}</label>
|
||||
@endif
|
||||
@if(scroller_mime_cats && scroller_mime_cats.includes('image'))
|
||||
<label class="nav-mime-item"><input type="checkbox" value="image" id="mime-image">{{ t('filter.image') }}</label>
|
||||
@endif
|
||||
@if(enable_swf)
|
||||
<label class="nav-mime-item"><input type="checkbox" value="flash" id="mime-flash">{{ t('filter.flash') }}</label>
|
||||
@endif
|
||||
</div>
|
||||
@endif
|
||||
@if(session && enable_xd_score)
|
||||
<!-- xD score filter -->
|
||||
<div class="nav-xd-filter">
|
||||
<label class="nav-xd-label">{{ t('filter.min_xd_score') }}</label>
|
||||
<div class="nav-xd-controls">
|
||||
<input type="range" id="nav_min_xd_score" min="0" max="100" step="1" value="{{ session.min_xd_score || 0 }}" class="xd-slider" style="display:none;" aria-hidden="true">
|
||||
<div id="nav_xd_slider_container" class="nav-xd-custom-slider"></div>
|
||||
<span id="nav_xd_val" class="xd-slider-val">{{ session.min_xd_score || 0 }}</span>
|
||||
<span id="nav_xd_tier_label" class="xd-score-badge" style="display:none; font-size: 0.75em;"></span>
|
||||
</div>
|
||||
<button id="nav_xd_save_btn" class="mode-btn" style="margin-top: 6px; width: 100%;">{{ t('filter.apply_filter') }}</button>
|
||||
<div id="nav_xd_status" style="font-size: 0.8em; color: #9f0; min-height: 1em; margin-top: 3px;"></div>
|
||||
|
||||
<!-- Modal Footer Actions -->
|
||||
<div class="filter-modal-footer">
|
||||
<button class="filter-reset-btn" id="filter-reset-btn" title="Reset All Filters to Default">
|
||||
<i class="fa-solid fa-rotate-left"></i> Reset All
|
||||
</button>
|
||||
<button class="filter-apply-btn" id="filter-modal-done-btn">
|
||||
<i class="fa-solid fa-check"></i> Done
|
||||
</button>
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
|
||||
1
views/snippets/filter-bar.html
Normal file
1
views/snippets/filter-bar.html
Normal file
@@ -0,0 +1 @@
|
||||
<!-- Filter bar has been integrated into excluded-tags-modal.html -->
|
||||
@@ -1,3 +1,40 @@
|
||||
@if(layout == 'stream')
|
||||
<!-- Stream / Vertical Feed Layout -->
|
||||
@each(items as item)
|
||||
<div class="stream-card {{ item.is_pinned ? 'is-pinned' : '' }} {{ item.has_notification ? 'has-notif' : '' }}" data-id="{{ item.id }}">
|
||||
<div class="stream-card-header">
|
||||
<a href="/user/{{ item.username.toLowerCase() }}" class="stream-author">
|
||||
<span class="stream-username" @if(item.author_color)style="color: {{ item.author_color }}"@endif>{!! item.display_name || item.username !!}</span>
|
||||
</a>
|
||||
<div class="stream-meta">
|
||||
@if(item.is_pinned)
|
||||
<span class="badge-pin"><i class="fa-solid fa-thumbtack"></i> Pinned</span>
|
||||
@endif
|
||||
@if(item.is_oc)
|
||||
<span class="badge-oc">OC</span>
|
||||
@endif
|
||||
@if(enable_xd_score && item.xd_tier > 0)
|
||||
<span class="thumb-xd-indicator xd-tier-{{ item.xd_tier }}">xD: {{ item.xd_score }}</span>
|
||||
@endif
|
||||
<a href="{{ link.main }}{{ (enable_item_slugs && item.slug) ? item.slug : item.id }}" class="stream-permalink"><i class="fa-solid fa-arrow-up-right-from-square"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<a href="{{ link.main }}{{ (enable_item_slugs && item.slug) ? item.slug : item.id }}" class="stream-media-wrapper">
|
||||
<img src="/t/{{ item.id }}.webp" alt="Media thumbnail" class="stream-media-img" loading="lazy">
|
||||
<span class="stream-media-badge">{{ item.mime.split('/')[1].replace('youtube', 'YT').replace('x-shockwave-flash', 'FLASH').toUpperCase() }}</span>
|
||||
</a>
|
||||
|
||||
<div class="stream-card-footer">
|
||||
<a href="{{ link.main }}{{ (enable_item_slugs && item.slug) ? item.slug : item.id }}" class="stream-action-btn">
|
||||
<i class="fa-regular fa-comments"></i> View Post & Comments
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
@endeach
|
||||
|
||||
@else
|
||||
<!-- Grid & Masonry Layout (Default) -->
|
||||
@each(items as item)
|
||||
<a href="{{ link.main }}{{ (enable_item_slugs && item.slug) ? item.slug : item.id }}" class="{{ item.is_pinned ? 'anim-boxshadow ' : '' }}thumb lazy-thumb {{ item.has_notification ? 'has-notif' : '' }} {{ item.is_pinned ? 'is-pinned' : '' }}" data-file="{{ item.dest }}" data-mime="{{ item.mime }}" data-user="{!! item.display_name || item.username !!}" data-ext="{{ item.mime.split('/')[1].replace('youtube', 'yt').replace('x-shockwave-flash', 'flash').replace('vnd.adobe.flash.movie', 'flash').replace('x-zip-compressed', 'zip').replace('x-rar-compressed', 'rar').replace('vnd.rar', 'rar').replace('x-7z-compressed', '7z').replace('x-tar', 'tar').replace('x-bzip2', 'bz2').replace('x-xz', 'xz').toUpperCase() }}" data-mode="{{ item.tag_id == nsfl_tag_id ? 'nsfl' : (item.tag_id == 2 ? 'nsfw' : (item.tag_id == 1 ? 'sfw' : 'null')) }}" data-bg="/t/{{ item.id }}.webp" data-size="{{ enable_dynamic_thumbs ? (item.thumb_size || 1) : 1 }}">
|
||||
<div class="thumb-indicators">
|
||||
@@ -13,4 +50,5 @@
|
||||
</div>
|
||||
<p></p>
|
||||
</a>
|
||||
@endeach
|
||||
@endeach
|
||||
@endif
|
||||
Reference in New Issue
Block a user