fix: multi-choice filter styles
This commit is contained in:
@@ -19,6 +19,8 @@ export default class extends Controller {
|
||||
"quality": "",
|
||||
}
|
||||
|
||||
defaultOptions = '<option value="">n/a</option><option value="-">-</option>';
|
||||
|
||||
static outlets = ['tv-episode-list']
|
||||
static targets = ['resolution', 'codec', 'language', 'provider', 'season', 'quality', 'selectAll', 'downloadSelected']
|
||||
static values = {
|
||||
@@ -65,68 +67,33 @@ export default class extends Controller {
|
||||
this.languages.push(language);
|
||||
}
|
||||
});
|
||||
|
||||
this.languageTarget.innerHTML = '<option value="">n/a</option>';
|
||||
this.languageTarget.innerHTML += this.languages.sort()
|
||||
.map((language) => {
|
||||
const preferred = this.languageTarget.dataset.preferred.split(',');
|
||||
if (preferred.includes(language.toLowerCase())) {
|
||||
return '<option value="'+language+'" selected>'+language+'</option>';
|
||||
}
|
||||
return '<option value="'+language+'">'+language+'</option>';
|
||||
})
|
||||
.join();
|
||||
const preferred = JSON.parse(this.languageTarget.dataset.preferred);
|
||||
this.languageTarget.innerHTML = this.#serializeSelectOptions(this.languages);
|
||||
this.languageTarget.tomselect.items = preferred;
|
||||
}
|
||||
|
||||
addProviders(option) {
|
||||
if (!this.providers.includes(option.provider)) {
|
||||
this.providers.push(option.provider);
|
||||
}
|
||||
|
||||
const preferred = this.providerTarget.dataset.preferred;
|
||||
if (preferred) {
|
||||
this.providerTarget.innerHTML = '<option value="'+preferred+'" selected>'+preferred+'</option>';
|
||||
this.providerTarget.innerHTML += '<option value="">n/a</option>';
|
||||
} else {
|
||||
this.providerTarget.innerHTML = '<option value="">n/a</option>';
|
||||
}
|
||||
|
||||
this.providerTarget.innerHTML += this.providers.sort()
|
||||
.map((provider) => {
|
||||
const preferred = this.languageTarget.dataset.preferred;
|
||||
if (preferred === provider) {
|
||||
return;
|
||||
}
|
||||
return '<option value="' + provider + '">' + provider + '</option>'
|
||||
})
|
||||
.join();
|
||||
const preferred = JSON.parse(this.providerTarget.dataset.preferred);
|
||||
this.providerTarget.innerHTML = this.#serializeSelectOptions(this.providers);
|
||||
this.providerTarget.tomselect.items = preferred;
|
||||
|
||||
}
|
||||
|
||||
addQualities(option) {
|
||||
if (!this.qualities.includes(option.quality)) {
|
||||
if (option.quality.toLowerCase() in this.reverseMappedQualitiesValue) {
|
||||
this.qualities.push(option.quality);
|
||||
if (option.quality.toLowerCase() in this.reverseMappedQualitiesValue) {
|
||||
let quality = this.reverseMappedQualitiesValue[option.quality.toLowerCase()];
|
||||
// converts api returned quality with a value the system recognizes
|
||||
option.quality = quality;
|
||||
if (!this.qualities.includes(option.quality)) {
|
||||
this.qualities.push(quality);
|
||||
}
|
||||
}
|
||||
|
||||
const preferred = this.qualityTarget.dataset.preferred;
|
||||
if (preferred) {
|
||||
this.qualityTarget.innerHTML = '<option value="'+preferred+'" selected>'+preferred+'</option>';
|
||||
this.qualityTarget.innerHTML += '<option value="">n/a</option>';
|
||||
} else {
|
||||
this.qualityTarget.innerHTML = '<option value="">n/a</option>';
|
||||
}
|
||||
|
||||
this.qualityTarget.innerHTML += this.qualities.sort()
|
||||
.map((quality) => {
|
||||
const preferred = this.qualityTarget.dataset.preferred;
|
||||
if (preferred === quality) {
|
||||
return;
|
||||
}
|
||||
return '<option value="' + quality + '">' + quality + '</option>'
|
||||
})
|
||||
.join();
|
||||
const preferred = JSON.parse(this.qualityTarget.dataset.preferred) ?? [];
|
||||
this.qualityTarget.innerHTML = this.#serializeSelectOptions(this.qualities);
|
||||
this.qualityTarget.tomselect.items = preferred;
|
||||
}
|
||||
|
||||
async filter() {
|
||||
@@ -169,7 +136,14 @@ export default class extends Controller {
|
||||
}
|
||||
|
||||
#fetchValuesFromNodeList(nodeList) {
|
||||
console.log([...nodeList].map(option => option.value))
|
||||
return [...nodeList].map(option => option.value)
|
||||
}
|
||||
|
||||
#serializeSelectOptions(options) {
|
||||
return this.defaultOptions + options.sort()
|
||||
.map((option) => {
|
||||
return '<option value="' + option + '">' + option + '</option>'
|
||||
})
|
||||
.join();
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user