feat: language filter

assets/controllers/movie_results_controller.js

@@ -14,13 +14,19 @@ export default class extends Controller {
 
     options = []
 
-    connect() {
+    async connect() {
-        fetch(`/torrentio/movies/${this.imdbIdValue}`)
+        await this.setOptions();
-            .then(res => res.text())
+    }
-            .then(response => {
+
-                this.element.innerHTML = response;
+    async setOptions() {
-                this.options = this.element.querySelectorAll('tbody tr');
+        if (this.options.length === 0) {
-            });
+            await fetch(`/torrentio/movies/${this.imdbIdValue}`)
+                .then(res => res.text())
+                .then(response => {
+                    this.element.innerHTML = response;
+                    this.options = this.element.querySelectorAll('tbody tr');
+                });
+        }
     }
 
     listTargetConnected(target) {

assets/controllers/result_filter_controller.js

@@ -19,7 +19,15 @@ export default class extends Controller {
         'media-type': String
     }
 
+    async movieResultsOutletConnected(outlet) {
+        await this.parseDownloadOptionForFilter(outlet)
+    }
+
     async tvResultsOutletConnected(outlet) {
+        await this.parseDownloadOptionForFilter(outlet)
+    }
+
+    async parseDownloadOptionForFilter(outlet) {
         if (outlet.options.length === 0) {
             await outlet.setOptions();
         }
@@ -87,7 +95,7 @@ export default class extends Controller {
         this.activeFilter = {
             "resolution": this.resolutionTarget.value,
             "codec": this.codecTarget.value,
-            // "language": this.languageTarget.value,
+            "language": this.languageTarget.value,
             // "episodeNumber": this.episodeTarget.value,
         }
 
@@ -112,7 +120,7 @@ export default class extends Controller {
                     "resolution": option.querySelector('#resolution').textContent.trim(),
                     "codec": option.querySelector('#codec').textContent.trim(),
                     // "provider": option.querySelector('#provider').textContent,
-                    // "language": option.querySelector('#language').textContent,
+                    "languages": JSON.parse(option.dataset['languages']),
                     // "codec": option.querySelector('#codec').textContent,
                 }
 

templates/torrentio/movies.html.twig

@@ -34,7 +34,7 @@
             </thead>
             <tbody>
             {% for result in results.results %}
-                <tr class="bg-white border-b dark:bg-slate-700 dark:border-gray-600 border-gray-200">
+                <tr class="bg-white border-b dark:bg-slate-700 dark:border-gray-600 border-gray-200" data-languages="{{ result.languages|json_encode }}">
                     <td id="size" class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-800 dark:text-gray-50">
                         {{ result.size }}
                     </td>
@@ -50,7 +50,7 @@
                     <td id="provider" class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-800 dark:text-gray-50">
                         {{ result.provider }}
                     </td>
-                    <td id="language" class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-800 dark:text-gray-50">
+                    <td id="language" class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-800 dark:text-gray-50" data-languages="{{ result.languages|json_encode }}">
                         {{ result.languageFlags }}
                     </td>
                     <td class="px-6 py-4 whitespace-nowrap text-sm text-end text-gray-800 dark:text-gray-50 flex flex-row gap-2 items-center justify-end">

templates/torrentio/tvshows.html.twig

@@ -70,7 +70,7 @@
                     <td id="provider" class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-800 dark:text-gray-50">
                         {{ result.provider }}
                     </td>
-                    <td id="language" class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-800 dark:text-gray-50">
+                    <td id="language" class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-800 dark:text-gray-50" data-languages="{{ result.languages|json_encode }}">
                         {{ result.languageFlags }}
                     </td>
                     <td class="px-6 py-4 whitespace-nowrap text-sm text-end text-gray-800 dark:text-gray-50 flex flex-row gap-2 items-center justify-end">