feat: uses web components to simplify javascript logic

assets/components/download-option-tr.js

@@ -40,15 +40,9 @@ export default class DownloadOptionTr extends HTMLTableRowElement {
         this.episodeId = this.getAttribute('episode-id') ?? null;
         this.#downloadBtnEl = this.querySelector('.download-btn');
         this.#selectEpisodeInputEl = this.querySelector('input[type="checkbox"]');
-        console.log(this.#selectEpisodeInputEl)
 
         this.#downloadBtnEl.addEventListener('click', () => this.download());
-        // document.addEventListener('filterDownloadOptions', this.filter.bind(this));
     }
-    connectedCallback() {
-
-    }
-
     get isSelected() {
         return this.#selectEpisodeInputEl.checked;
     }
@@ -57,16 +51,6 @@ export default class DownloadOptionTr extends HTMLTableRowElement {
         this.#selectEpisodeInputEl.checked = value;
     }
 
-    // attribute change
-    attributeChangedCallback(property, oldValue, newValue) {
-        if (oldValue === newValue) return;
-        this[ property ] = newValue;
-    }
-
-    static get observedAttributes() {
-        return ['size', 'quality', 'resolution', 'codec', 'seeders', 'provider'];
-    }
-
     filter({ detail: { activeFilter } }) {
         const optionHeader = document.querySelector(`[data-option-id="${this.dataset['localId']}"]`)
         const props = {
@@ -117,7 +101,6 @@ export default class DownloadOptionTr extends HTMLTableRowElement {
     }
 
     download() {
-        console.log('Downloading dis bihh')
         fetch('/api/download', {
             method: 'POST',
             headers: {

assets/components/episode-container.js

@@ -1,7 +1,4 @@
 export default class EpisodeContainer extends HTMLElement {
-    H264_CODECS = ['h264', 'h.264', 'x264']
-    H265_CODECS = ['h265', 'h.265', 'x265', 'hevc']
-
     options = [];
     showTitle;
 
@@ -27,19 +24,6 @@ export default class EpisodeContainer extends HTMLElement {
         document.addEventListener('downloadSelectedEpisodes', this.downloadSelectedResults.bind(this));
         document.addEventListener('selectEpisodeForDownload', (e) => this.selectEpisodeForDownload(e.detail.select));
     }
-    connectedCallback() {
-
-    }
-
-    // attribute change
-    attributeChangedCallback(property, oldValue, newValue) {
-        if (oldValue === newValue) return;
-        this[ property ] = newValue;
-    }
-
-    static get observedAttributes() {
-        return ['name'];
-    }
 
     toggleResults() {
         this.#resultsToggleBtnEl.classList.toggle('rotate-90');

assets/components/movie-container.js

@@ -1,7 +1,4 @@
 export default class MovieContainer extends HTMLElement {
-    H264_CODECS = ['h264', 'h.264', 'x264']
-    H265_CODECS = ['h265', 'h.265', 'x265', 'hevc']
-
     #resultsTableEl;
     #resultsCountNumberEl;
 
@@ -13,12 +10,6 @@ export default class MovieContainer extends HTMLElement {
         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;