wip-feat: populates filter from api options

This commit is contained in:
2025-04-29 22:10:47 -05:00
parent c3eaf109e3
commit 8a1a89f17d
9 changed files with 191 additions and 6 deletions

View File

@@ -0,0 +1,88 @@
<div id="filter" class="flex flex-col gap-4"
{{ stimulus_controller('result_filter') }}
{{ stimulus_action('result_filter', 'filter', 'change') }}
data-result-filter-media-type-value="{{ results.media.mediaType }}"
data-result-filter-movie-results-outlet=".results"
data-result-filter-tv-results-outlet=".results"
>
<div class="w-full p-4 flex flex-row gap-4 bg-stone-500 text-md text-gray-500 dark:text-gray-50 rounded-lg">
<label for="resolution">
Resolution
<select id="resolution"
data-result-filter-target="resolution"
class="px-1 py-0.5 bg-stone-100 text-gray-800 rounded-md"
value="{{ app.user.userPreferenceValues["resolution"] }}"
>
{# <option {{ filter.resolution == "n/a" ? "selected" }}#}
{# value="">n/a</option>#}
{# <option {{ filter.resolution == "720p" ? "selected" }}#}
{# value="720p">720p</option>#}
{# <option {{ filter.resolution == "1080p" ? "selected" }}#}
{# value="1080p">1080p</option>#}
{# <option {{ filter.resolution == "2160p" ? "selected" }}#}
{# value="2160p">2160p</option>#}
</select>
</label>
<label for="codec">
Codec
<select id="codec" data-result-filter-target="codec" class="px-1 py-0.5 bg-stone-100 text-sm text-gray-800 rounded-md">
{# <option {{ filter.codec == "n/a" ? "selected" }}#}
{# value="">n/a</option>#}
{# <option {{ filter.codec == "-" ? "selected" }}#}
{# value="-">-</option>#}
{# <option {{ filter.codec == "h264" ? "selected" }}#}
{# value="h264">h264</option>#}
{# <option {{ filter.codec == "h265" ? "selected" }}#}
{# value="h265">h265/HEVC</option>#}
</select>
</label>
<label for="language">
Language
<select id="language" data-result-filter-target="language" class="px-1 py-0.5 bg-stone-100 text-gray-800 rounded-md">
<option selected value="{{ filter.language }}">{{ filter.language }}</option>
</select>
</label>
<label for="provider">
Provider
<select id="provider" data-result-filter-target="provider" class="px-1 py-0.5 bg-stone-100 text-gray-800 rounded-md">
<option selected value="">n/a</option>
</select>
</label>
{% if results.media.mediaType == "tvshows" %}
<label for="season">
Season
<select id="season" name="season" value="1" data-result-filter-target="season" class="px-1 py-0.5 bg-stone-100 text-gray-800 rounded-md"
{{ stimulus_action('result_filter', 'uncheckSelectAllBtn', 'change') }}>
<option selected value="1">1</option>
{% for season in range(2, results.media.episodes|length) %}
<option value="{{ season }}">{{ season }}</option>
{% endfor %}
</select>
</label>
{# <label for="episodeNumber">#}
{# Episode#}
{# <select id="episodeNumber" name="episodeNumber" data-result-filter-target="episode" class="px-1 py-0.5 bg-stone-100 text-gray-800 rounded-sm">#}
{# <option selected value="">n/a</option>#}
{# </select>#}
{# </label>#}
{% endif %}
<span {{ stimulus_controller('loading_icon', {total: (results.media.mediaType == "tvshows") ? results.media.episodes[1]|length : 1, count: 0}) }}
class="loading-icon"
>
<twig:ux:icon name="codex:loader" height="20" width="20" data-loading-icon-target="icon" class="text-end" />
</span>
</div>
{% if results.media.mediaType == "tvshows" %}
<div class="flex flex-row gap-2 justify-end px-8">
<button class="px-1.5 py-1 bg-green-600 rounded-md text-sm"
{{ stimulus_target('result_filter', 'downloadSelected') }}
{{ stimulus_action('result_filter', 'downloadSelectedEpisodes', 'click') }}
>Download Selected</button>
<input type="checkbox" name="selectAll" id="selectAll"
{{ stimulus_target('result_filter', 'selectAll') }}
{{ stimulus_action('result_filter', 'selectAllEpisodes', 'change') }}
/>
</div>
{% endif %}
</div>