From 9db0bfd4c6d46f48d6abe95cff1e1fb7fcb0ebb3 Mon Sep 17 00:00:00 2001 From: Brock H Caldwell Date: Sat, 26 Jul 2025 17:39:28 -0500 Subject: [PATCH] fix: filter style tweaks, loading icon patch --- assets/controllers/loading_icon_controller.js | 15 +++++ .../controllers/result_filter_controller.js | 17 ++++-- assets/icons/zondicons/checkmark.svg | 1 + .../Form/UserMediaPreferencesForm.php | 11 +++- tailwind.config.js | 1 + templates/components/Filter.html.twig | 57 ++++++++++--------- templates/components/SearchResult.html.twig | 2 +- templates/components/SubmitButton.html.twig | 8 +++ templates/search/result.html.twig | 2 +- templates/user/preferences.html.twig | 10 ++-- 10 files changed, 82 insertions(+), 42 deletions(-) create mode 100644 assets/icons/zondicons/checkmark.svg create mode 100644 templates/components/SubmitButton.html.twig diff --git a/assets/controllers/loading_icon_controller.js b/assets/controllers/loading_icon_controller.js index b803c3f..021db91 100644 --- a/assets/controllers/loading_icon_controller.js +++ b/assets/controllers/loading_icon_controller.js @@ -14,7 +14,22 @@ export default class extends Controller { static targets = ['icon'] connect() { + this.element.hideIcon = this.hideIcon.bind(this); + this.element.showIcon = this.showIcon.bind(this); + this.element.toggleIcon = this.toggleIcon.bind(this); + this.element.isVisibile = this.isVisible.bind(this); + } + isVisible() { + return !this.iconTarget.classList.contains('hidden'); + } + + showIcon() { + this.iconTarget.classList.remove('hidden'); + } + + hideIcon() { + this.iconTarget.classList.add('hidden'); } toggleIcon() { diff --git a/assets/controllers/result_filter_controller.js b/assets/controllers/result_filter_controller.js index 0e00634..78b1ac6 100644 --- a/assets/controllers/result_filter_controller.js +++ b/assets/controllers/result_filter_controller.js @@ -22,7 +22,7 @@ export default class extends Controller { defaultOptions = ''; static outlets = ['tv-episode-list'] - static targets = ['resolution', 'codec', 'language', 'provider', 'season', 'quality', 'selectAll', 'downloadSelected'] + static targets = ['resolution', 'codec', 'language', 'provider', 'season', 'quality', 'loadingIcon', 'selectAll', 'downloadSelected'] static values = { 'imdbId': String, 'media-type': String, @@ -34,19 +34,24 @@ export default class extends Controller { if (this.mediaTypeValue === "tvshows") { this.activeFilter['season'] = 1; } - await this.filter(); + this.filter(); + this.setTimerToStopLoadingIcon(); document.addEventListener('optionsLoaded', this.loadOptions.bind(this)); } + setTimerToStopLoadingIcon() { + setTimeout(() => this.loadingIconTarget.hideIcon(), 10000); + } + // Event is fired from movies/tvshows controllers to populate this data - async loadOptions({detail: { options }}) { - await options.forEach((option) => { + loadOptions({detail: { options }}) { + options.forEach((option) => { this.addLanguages(option); this.addProviders(option); this.addQualities(option); }) - await this.filter(); + this.filter(); } selectAllEpisodes() { @@ -96,7 +101,7 @@ export default class extends Controller { this.qualityTarget.tomselect.items = preferred; } - async filter() { + filter() { const downloadSeasonSpan = document.querySelector("#downloadSeasonModal"); this.activeFilter = { diff --git a/assets/icons/zondicons/checkmark.svg b/assets/icons/zondicons/checkmark.svg new file mode 100644 index 0000000..5c77e98 --- /dev/null +++ b/assets/icons/zondicons/checkmark.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/User/Framework/Form/UserMediaPreferencesForm.php b/src/User/Framework/Form/UserMediaPreferencesForm.php index e560c76..08e2735 100644 --- a/src/User/Framework/Form/UserMediaPreferencesForm.php +++ b/src/User/Framework/Form/UserMediaPreferencesForm.php @@ -8,7 +8,10 @@ use App\User\Database\CountryLanguages; use App\User\Database\ProviderList; use App\User\Database\QualityList; use App\User\Database\ResolutionList; +use App\User\Dto\UserPreferences; +use App\User\Dto\UserPreferencesFactory; use App\User\Framework\Repository\PreferenceOptionRepository; +use Symfony\Bundle\SecurityBundle\Security; use Symfony\Component\Form\AbstractType; use Symfony\Component\Form\Event\PreSetDataEvent; use Symfony\Component\Form\Event\PreSubmitEvent; @@ -21,9 +24,14 @@ use Symfony\Component\Routing\Generator\UrlGeneratorInterface; class UserMediaPreferencesForm extends AbstractType { + private UserPreferences $userPreferences; + public function __construct( private readonly UrlGeneratorInterface $urlGenerator, - ) {} + private readonly Security $security, + ) { + $this->userPreferences = UserPreferencesFactory::createFromUser($security->getUser()); + } public function buildForm(FormBuilderInterface $builder, array $options): void { @@ -42,6 +50,7 @@ class UserMediaPreferencesForm extends AbstractType 'data-result-filter-target' => $fieldName, 'data-controller' => 'symfony--ux-autocomplete--autocomplete', 'data-symfony--ux-autocomplete--autocomplete-tom-select-options-value' => '{"highlight":false}', + 'data-preferred' => \json_encode($this->userPreferences->$fieldName), ], 'row_attr' => [ 'class' => 'filter-label' diff --git a/tailwind.config.js b/tailwind.config.js index 55a4a9c..47ed93b 100644 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -20,6 +20,7 @@ module.exports = { "bg-orange-400", "bg-blue-600", "bg-rose-600", + "bg-black/20", "alert-success", "alert-warning", "font-bold", diff --git a/templates/components/Filter.html.twig b/templates/components/Filter.html.twig index dec37a9..cd029c0 100644 --- a/templates/components/Filter.html.twig +++ b/templates/components/Filter.html.twig @@ -8,7 +8,7 @@ > {% set preferences_form = form %} {{ form_start(preferences_form) }} -
+
{{ form_row(preferences_form.resolution) }} {{ form_row(preferences_form.codec) }} {{ form_row(preferences_form.language) }} @@ -16,11 +16,11 @@ {{ form_row(preferences_form.quality) }} {% if results.media.mediaType == "tvshows" %} -
+
- -
- {% endif %} + +
+ {% endif %} +
\ No newline at end of file diff --git a/templates/components/SearchResult.html.twig b/templates/components/SearchResult.html.twig index 24ca51a..19a37e9 100644 --- a/templates/components/SearchResult.html.twig +++ b/templates/components/SearchResult.html.twig @@ -10,7 +10,7 @@

- {{ title }} - {{ year }} + {{ title }} ({{ year }})

- {{ results.media.title }} - {{ results.media.year }} + {{ results.media.title }} ({{ results.media.year }})

{% if results.media.mediaType == "tvshows" %} diff --git a/templates/user/preferences.html.twig b/templates/user/preferences.html.twig index cb9d624..8c69958 100644 --- a/templates/user/preferences.html.twig +++ b/templates/user/preferences.html.twig @@ -7,17 +7,15 @@

Define a filter to be pre-applied to your download options.

- {{ form_start(preferences_form.instantiateForm) }} -
+ {{ form_start(preferences_form) }} +
{{ form_row(preferences_form.resolution) }} {{ form_row(preferences_form.codec) }} {{ form_row(preferences_form.language) }} {{ form_row(preferences_form.provider) }} {{ form_row(preferences_form.quality) }} -
-
-
- +
+
{{ form_end(preferences_form) }}