wip-feat: movie result filter

assets/controllers/movie_results_controller.js

@@ -10,11 +10,20 @@ export default class extends Controller {
         imdbId: String
     };
 
+    static targets = ['list']
+
+    options = []
+
     connect() {
         fetch(`/torrentio/movies/${this.imdbIdValue}`)
             .then(res => res.text())
             .then(response => {
                 this.element.innerHTML = response;
+                this.options = this.element.querySelectorAll('tbody tr');
             });
     }
+
+    listTargetConnected(target) {
+        // console.log(target);
+    }
 }

assets/controllers/result_filter_controller.js

@@ -6,5 +6,100 @@ import { Controller } from '@hotwired/stimulus';
 */
 /* stimulusFetch: 'lazy' */
 export default class extends Controller {
-    // ...
+    H264_CODECS = ['h264', 'h.264', 'x264']
+    H265_CODECS = ['h265', 'h.265', 'x265', 'hevc']
+
+    static outlets = ['movie-results']
+    static targets = ['resolution', 'codec', 'language', 'provider', 'season', 'episode']
+    static values = {
+        'media-type': String
+    }
+
+    filter() {
+        let resultList = this.movieResultsOutlet;
+
+        this.activeFilter = {
+            "resolution": this.resolutionTarget.value,
+            "codec": this.codecTarget.value,
+            // "language": this.languageTarget.value,
+            // "episodeNumber": this.episodeTarget.value,
+        }
+
+        if ("tvshows" === this.mediaTypeValue) {
+            this.activeFilter.season = this.seasonTarget.value;
+        }
+
+        console.log(this.activeFilter);
+
+        const filterOperation = (resultList) => {
+            if (resultList.options.length <= 0) {
+                return false;
+            }
+
+            let firstIncluded = true;
+            let count = 0;
+            let selectedCount = 0;
+
+            resultList.options.forEach((option) => {
+                if (option.classList.contains('header-row')) {
+                    return;
+                }
+
+                const props = {
+                    "resolution": option.querySelector('#resolution').textContent.trim(),
+                    "codec": option.querySelector('#codec').textContent.trim(),
+                    // "provider": option.querySelector('#provider').textContent,
+                    // "language": option.querySelector('#language').textContent,
+                    // "codec": option.querySelector('#codec').textContent,
+                }
+
+                let include = true;
+                option.classList.remove('hidden');
+                // option.selectInput.checked = false;
+
+                for (let [key, value] of Object.entries(this.activeFilter)) {
+                    if (value === "") {
+                        continue;
+                    }
+                    if (key === "codec" && value === "h264") {
+                        if (!this.H264_CODECS.includes(props[key].toLowerCase())) {
+                            include = false;
+                        }
+                    } else if (key === "codec" && value === "h265") {
+                        if (!this.H265_CODECS.includes(props[key].toLowerCase())) {
+                            include = false;
+                        }
+                    } else if (key === "language") {
+                        if (!props["languages"].includes(value)) {
+                            include = false;
+                        }
+                    } else if (props[key] !== value) {
+                        include = false;
+                    }
+                }
+
+                if (false === include) {
+                    option.classList.add('hidden');
+                } else if (true === firstIncluded) {
+                    count = 1;
+                    selectedCount = selectedCount + 1;
+                    // option.selectInput.checked = true;
+                    firstIncluded = false;
+                } else {
+                    count = count + 1;
+                }
+            });
+            // resultList.getOptionCountEl().innerHTML = `${count} options`;
+            // resultList.getSelectedCountEl().innerHTML = `${selectedCount} selected`;
+            this.dispatch('setSeason', {
+                detail: {season: parseInt(this.activeFilter.season)}
+            });
+        }
+
+        if (resultList) {
+            filterOperation(resultList);
+        } else {
+            this.resultListOutlets.forEach((resultList) => filterOperation(resultList));
+        }
+    }
 }