feat: uses web components to simplify javascript logic
This commit is contained in:
@@ -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: {
|
||||
|
||||
@@ -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');
|
||||
|
||||
@@ -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;
|
||||
|
||||
@@ -6,9 +6,6 @@ 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 values = {
|
||||
title: String,
|
||||
tmdbId: String,
|
||||
|
||||
@@ -19,7 +19,7 @@ export default class extends Controller {
|
||||
"quality": "",
|
||||
}
|
||||
|
||||
static outlets = ['movie-results', 'tv-results', 'tv-episode-list']
|
||||
static outlets = ['tv-episode-list']
|
||||
static targets = ['resolution', 'codec', 'language', 'provider', 'season', 'quality', 'selectAll', 'downloadSelected']
|
||||
static values = {
|
||||
'imdbId': String,
|
||||
@@ -55,6 +55,10 @@ export default class extends Controller {
|
||||
}));
|
||||
}
|
||||
|
||||
downloadSelectedEpisodes() {
|
||||
document.dispatchEvent(new CustomEvent('downloadSelectedEpisodes', {}));
|
||||
}
|
||||
|
||||
addLanguages(option) {
|
||||
const languages = Object.assign([], option.languages);
|
||||
languages.forEach((language) => {
|
||||
@@ -171,8 +175,4 @@ export default class extends Controller {
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
downloadSelectedEpisodes() {
|
||||
document.dispatchEvent(new CustomEvent('downloadSelectedEpisodes', {}));
|
||||
}
|
||||
}
|
||||
|
||||
@@ -18,7 +18,7 @@ export default class extends Controller {
|
||||
active: Boolean,
|
||||
};
|
||||
|
||||
static targets = ['list', 'count', 'episodeSelector', 'toggleButton', 'listContainer']
|
||||
static targets = ['list', 'count', 'episodeSelector',]
|
||||
static outlets = ['loading-icon']
|
||||
|
||||
options = []
|
||||
@@ -37,17 +37,4 @@ export default class extends Controller {
|
||||
this.episodeSelectorTarget.disabled = true;
|
||||
}
|
||||
}
|
||||
|
||||
download() {
|
||||
this.element.options.forEach(option => {
|
||||
const optionSelector = option.querySelector('input[type="checkbox"]');
|
||||
if (true === optionSelector.checked) {
|
||||
const downloadBtn = option.querySelector('button.download-btn');
|
||||
const downloadBtnController = this.application.getControllerForElementAndIdentifier(downloadBtn, 'download-button');
|
||||
downloadBtnController.download();
|
||||
optionSelector.checked = false;
|
||||
this.episodeSelectorTarget.checked = false;
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user