wip: working movies & tvshows w/ filtering

assets/components/movie-container.js

@@ -0,0 +1,45 @@
+export default class MovieContainer extends HTMLElement {
+    H264_CODECS = ['h264', 'h.264', 'x264']
+    H265_CODECS = ['h265', 'h.265', 'x265', 'hevc']
+
+    #resultsTableEl;
+    #resultsCountNumberEl;
+
+    constructor() {
+        super();
+        this.#resultsTableEl = this.querySelector('.results-container');
+        this.#resultsCountNumberEl = document.querySelector('.results-count-number');
+
+        document.addEventListener('filterDownloadOptions', this.filter.bind(this));
+    }
+
+    // attribute change
+    attributeChangedCallback(property, oldValue, newValue) {
+        if (oldValue === newValue) return;
+        this[ property ] = newValue;
+    }
+
+    filter({ detail: { activeFilter } }) {
+        const options = this.querySelectorAll('tr.download-option');
+        let firstIncluded = true;
+        let count = 0;
+        let selectedCount = 0;
+
+        options.forEach((option) => {
+            const include = option.filter({ detail: { activeFilter: activeFilter } });
+
+            if (false === include) {
+                option.classList.remove('r-tablerow');
+                option.classList.add('hidden');
+            } else if (true === firstIncluded) {
+                count = 1;
+                selectedCount = selectedCount + 1;
+                option.querySelector('input[type="checkbox"]').checked = true;
+                firstIncluded = false;
+            } else {
+                count = count + 1;
+            }
+        });
+        this.#resultsCountNumberEl.innerText = count;
+    }
+}