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

feat: updates option count for each episode when filter changes

Browse Source
This commit is contained in:
brock
2025-04-22 13:54:37 -05:00
parent 5c3aa595bf
commit 88851169f9
4 changed files with 28 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
assets/controllers/result_filter_controller.js
View File

@@ -9,15 +9,14 @@ export default class extends Controller {
H264_CODECS = ['h264', 'h.264', 'x264']
H265_CODECS = ['h265', 'h.265', 'x265', 'hevc']
static outlets = ['movie-results']
static outlets = ['movie-results', 'tv-results']
static targets = ['resolution', 'codec', 'language', 'provider', 'season', 'episode']
static values = {
'media-type': String
}
filter() {
let resultList = this.movieResultsOutlet;
let results = [];
this.activeFilter = {
"resolution": this.resolutionTarget.value,
"codec": this.codecTarget.value,
@@ -25,12 +24,13 @@ export default class extends Controller {
// "episodeNumber": this.episodeTarget.value,
}
if ("tvshows" === this.mediaTypeValue) {
if ("movies" === this.mediaTypeValue) {
results = this.movieResultsOutlets;
} else if ("tvshows" === this.mediaTypeValue) {
results = this.tvResultsOutlets;
this.activeFilter.season = this.seasonTarget.value;
}
console.log(this.activeFilter);
const filterOperation = (resultList) => {
if (resultList.options.length <= 0) {
return false;
@@ -41,10 +41,6 @@ export default class extends Controller {
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(),
@@ -88,6 +84,10 @@ export default class extends Controller {
} else {
count = count + 1;
}
if ("tvshows" === this.mediaTypeValue) {
resultList.countTarget.innerText = count;
}
});
// resultList.getOptionCountEl().innerHTML = `${count} options`;
// resultList.getSelectedCountEl().innerHTML = `${selectedCount} selected`;
@@ -96,10 +96,6 @@ export default class extends Controller {
});
}
if (resultList) {
filterOperation(resultList);
} else {
this.resultListOutlets.forEach((resultList) => filterOperation(resultList));
}
results.forEach((list) => filterOperation(list));
}
}

6
assets/controllers/tv_results_controller.js
View File

@@ -14,16 +14,18 @@ export default class extends Controller {
active: Boolean,
};
static targets = ['list']
static targets = ['list', 'count']
static outlets = ['loading-icon']
options = []
connect() {
if (true === this.activeValue) {
fetch(`/torrentio/tvshows/${this.tmdbIdValue}/${this.imdbIdValue}/${this.seasonValue}/${this.episodeValue}`)
.then(res => res.text())
.then(response => {
this.element.innerHTML = response;
this.options = this.element.querySelectorAll('tbody tr');
this.loadingIconOutlet.increaseCount();
});
}

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

@@ -29,6 +29,7 @@
{{ stimulus_action('result_filter', 'filter', 'change') }}
data-result-filter-media-type-value="{{ results.media.mediaType }}"
data-result-filter-movie-results-outlet=".results"
data-result-filter-tv-results-outlet=".results"
>
<label for="resolution">
Resolution
@@ -36,7 +37,7 @@
<option {{ filter.resolution == "n/a" ? "selected" }}
value="">n/a</option>
<option {{ filter.resolution == "720p" ? "selected" }}
value="720p">780p</option>
value="720p">720p</option>
<option {{ filter.resolution == "1080p" ? "selected" }}
value="1080p">1080p</option>
<option {{ filter.resolution == "2160p" ? "selected" }}
@@ -91,7 +92,7 @@
{% for season, episodes in results.media.episodes %}
{% set active = (season == '1') ? true : false %}
{% for episode in episodes %}
<div class="{{ (active == false) ? 'hidden' }}"
<div class="results {{ (active == false) ? 'hidden' }}"
data-tv-results-loading-icon-outlet=".loading-icon"
{{ stimulus_controller('tv_results', {
tmdbId: results.media.tmdbId,

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

@@ -7,7 +7,7 @@
<span>
<small class="py-1 px-1.5 grow-0 font-bold bg-green-600 rounded-lg hover:cursor-pointer hover:bg-green-700 text-white"
{{ stimulus_action('tv-results', 'toggleList', 'click') }}
>{{ results.results|length }} results</small>
><span {{ stimulus_target('tv-results', 'count') }}>{{ results.results|length }}</span> results</small>
</span>
</div>
<div class="flex flex-col items-end hover:cursor-pointer"
@@ -55,28 +55,28 @@
<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">
<span class="p-1.5 bg-green-600 rounded-md text-gray-50">
Download
</span>
<span class="p-1.5 bg-green-600 rounded-md text-gray-50">
Download
</span>
<label for="select">
<input id="select" type="checkbox" name="select" />
</label>