feat: lazy loads torrentio results on episodes, adds loading indicator for episodes and movies

This commit is contained in:
2025-09-16 21:48:23 -05:00
parent 36836c4d36
commit 9653189bff
6 changed files with 9 additions and 17 deletions

View File

@@ -44,7 +44,6 @@
{{ stimulus_target('result-filter', 'loadingIcon') }}
{{ stimulus_controller('loading_icon', {total: (results.media.mediaType == "tvshows") ? results.media.episodes[1]|length : 1, count: 0}) }}
class="loading-icon">
<twig:ux:icon name="codex:loader" height="20" width="20" data-loading-icon-target="icon" class="text-end" />
</span>
{% if results.media.mediaType == "tvshows" %}

View File

@@ -5,7 +5,6 @@
{% for episode in this.getEpisodes().items %}
<episode-container id="{{ episode_anchor(episode.seasonNumber, episode.episodeNumber) }}" class="results"
show-title="{{ this.title }}"
data-tv-results-loading-icon-outlet=".loading-icon"
data-download-button-outlet=".download-btn"
{{ stimulus_controller('tv_results', {
title: this.title,
@@ -32,7 +31,7 @@
<p>{{ episode.description|truncate }}</p>
<div class="text-xs font-bold">
<button class="results-count-badge py-1 px-1.5 mr-1 grow-0 bg-green-600 rounded-lg hover:cursor-pointer hover:bg-green-700 text-white" title="Click to expand the results table for season {{ episode.seasonNumber }} episode {{ episode.episodeNumber }}.">
<span class="results-count-number" {{ stimulus_target('tv-results', 'count') }}>-</span> results
<span class="results-count-number" {{ stimulus_target('tv-results', 'count') }}></span> results
</button>
<span class="py-1 px-1.5 mr-1 grow-0 bg-gray-700 rounded-lg text-white" title='"{{ episode.name }}" aired on {{ episode.airDate|date(null, 'UTC') }}.'>
@@ -72,14 +71,16 @@
</div>
</div>
<div class="results-container inline-block overflow-hidden rounded-lg hidden">
<twig:Turbo:Frame id="results_{{ episode_id(episode.seasonNumber, episode.episodeNumber) }}" src="{{ path('app_torrentio_tvshows', {
<twig:Turbo:Frame loading="lazy" id="results_{{ episode_id(episode.seasonNumber, episode.episodeNumber) }}" src="{{ path('app_torrentio_tvshows', {
tmdbId: this.tmdbId,
imdbId: this.imdbId,
season: episode.seasonNumber,
episode: episode.episodeNumber,
target: 'results_' ~ episode_id(episode.seasonNumber, episode.episodeNumber),
block: 'tvshow_results'
}) }}" />
}) }}">
<twig:ux:icon name="codex:loader" height="20" width="20" data-loading-icon-target="icon" class="text-end" />
</twig:Turbo:Frame>
</div>
</div>
</episode-container>