home/torsearch
1
0
Fork 0
Code Issues 22 Pull Requests 1 Actions 3 Packages Projects 4 Releases Wiki Activity

wip-feat: movie result filter

Browse Source
This commit is contained in:
brock
2025-04-22 13:27:08 -05:00
parent d6328786ba
commit 5c3aa595bf
5 changed files with 115 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
assets/controllers/movie_results_controller.js
View File

@@ -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);
}
}

97
assets/controllers/result_filter_controller.js
View File

@@ -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));
}
}
}

4
templates/search/result.html.twig
View File

@@ -26,6 +26,9 @@
<div id="filter" class="w-full p-4 flex flex-row gap-4 bg-stone-500 text-md text-gray-500 dark:text-gray-50 rounded-lg"
{{ stimulus_controller('result_filter') }}
{{ stimulus_action('result_filter', 'filter', 'change') }}
data-result-filter-media-type-value="{{ results.media.mediaType }}"
data-result-filter-movie-results-outlet=".results"
>
<label for="resolution">
Resolution
@@ -100,7 +103,6 @@
{% endfor %}
{% endfor %}
{% endif %}
</twig:Card>
</div>
</div>

18
templates/torrentio/movies.html.twig
View File

@@ -1,10 +1,6 @@
<div class="p-4 flex flex-col gap-6 bg-orange-500 bg-clip-padding backdrop-filter backdrop-blur-md bg-opacity-60 rounded-md">
<div class="overflow-hidden rounded-md">
<table class="w-full text-sm text-left rtl:text-right text-gray-500 dark:text-gray-400"
data-movies-list-target="list"
>
<table class="w-full text-sm text-left rtl:text-right text-gray-500 dark:text-gray-400" {{ stimulus_target('movie_results', 'list') }} >
<thead class="text-xs text-gray-700 uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400">
<tr class="dark:bg-stone-600 overflow-hidden">
<th scope="col"
@@ -39,22 +35,22 @@
<tbody>
{% for result in results.results %}
<tr class="bg-white border-b dark:bg-slate-700 dark:border-gray-600 border-gray-200">
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-800 dark:text-gray-50">
<td id="size" class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-800 dark:text-gray-50">
{{ result.size }}
</td>
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-800 dark:text-gray-50">
<td id="resolution" class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-800 dark:text-gray-50">
{{ result.resolution }}
</td>
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-800 dark:text-gray-50">
<td id="codec" class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-800 dark:text-gray-50">
{{ result.codec }}
</td>
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-800 dark:text-gray-50">
<td id="seeders" class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-800 dark:text-gray-50">
{{ result.seeders }}
</td>
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-800 dark:text-gray-50">
<td id="provider" class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-800 dark:text-gray-50">
{{ result.provider }}
</td>
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-800 dark:text-gray-50">
<td id="language" class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-800 dark:text-gray-50">
{{ result.languageFlags }}
</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-end text-gray-800 dark:text-gray-50 flex flex-row gap-2 items-center justify-end">

3
templates/torrentio/tvshows.html.twig
View File

@@ -84,9 +84,6 @@
</tr>
{% endfor %}
</tbody>
<caption>
{{ results.results|length }} results
</caption>
</table>
</div>
</div>