docker.videokonverter/video-konverter/app/templates/tv/home.html

{% extends "tv/base.html" %}
{% block title %}Startseite - VideoKonverter TV{% endblock %}

{% block content %}
<!-- Weiterschauen -->
{% if continue_watching %}
<section class="tv-section">
    <h2 class="tv-section-title">Weiterschauen</h2>
    <div class="tv-row">
        {% for item in continue_watching %}
        <a href="/tv/player?v={{ item.video_id }}" class="tv-card tv-card-wide" data-focusable>
            {% if item.series_poster %}
            <img src="{{ item.series_poster }}" alt="" class="tv-card-img" loading="lazy">
            {% else %}
            <div class="tv-card-placeholder">&#9654;</div>
            {% endif %}
            <div class="tv-card-progress">
                <div class="tv-card-progress-bar"
                     style="width:{{ ((item.position_sec / item.duration_sec) * 100) if item.duration_sec else 0 }}%"></div>
            </div>
            <div class="tv-card-info">
                <span class="tv-card-title">{{ item.series_title or item.file_name }}</span>
                <span class="tv-card-meta">{{ item.file_name }}</span>
            </div>
        </a>
        {% endfor %}
    </div>
</section>
{% endif %}

<!-- Neu hinzugefuegt -->
{% if new_series or new_movies %}
<section class="tv-section">
    <h2 class="tv-section-title">Neu hinzugef&uuml;gt</h2>
    <div class="tv-row">
        {% for s in new_series %}
        <a href="/tv/series/{{ s.id }}" class="tv-card" data-focusable>
            {% if s.poster_url %}
            <img src="{{ s.poster_url }}" alt="" class="tv-card-img" loading="lazy">
            {% else %}
            <div class="tv-card-placeholder">{{ s.title or s.folder_name }}</div>
            {% endif %}
            <div class="tv-card-info">
                <span class="tv-card-title">{{ s.title or s.folder_name }}</span>
                <span class="tv-card-meta">{{ s.episode_count or 0 }} Episoden</span>
            </div>
        </a>
        {% endfor %}
        {% for m in new_movies %}
        <a href="/tv/movies/{{ m.id }}" class="tv-card" data-focusable>
            {% if m.poster_url %}
            <img src="{{ m.poster_url }}" alt="" class="tv-card-img" loading="lazy">
            {% else %}
            <div class="tv-card-placeholder">{{ m.title or m.folder_name }}</div>
            {% endif %}
            <div class="tv-card-info">
                <span class="tv-card-title">{{ m.title or m.folder_name }}</span>
                <span class="tv-card-meta">{{ m.year or "" }}{% if m.genres %} &middot; {{ m.genres }}{% endif %}</span>
            </div>
        </a>
        {% endfor %}
    </div>
</section>
{% endif %}

<!-- Serien -->
{% if series %}
<section class="tv-section">
    <div class="tv-section-header">
        <h2 class="tv-section-title">Serien</h2>
        <a href="/tv/series" class="tv-section-more" data-focusable>Alle anzeigen</a>
    </div>
    <div class="tv-row">
        {% for s in series %}
        <a href="/tv/series/{{ s.id }}" class="tv-card" data-focusable>
            {% if s.poster_url %}
            <img src="{{ s.poster_url }}" alt="" class="tv-card-img" loading="lazy">
            {% else %}
            <div class="tv-card-placeholder">{{ s.title or s.folder_name }}</div>
            {% endif %}
            <div class="tv-card-info">
                <span class="tv-card-title">{{ s.title or s.folder_name }}</span>
                <span class="tv-card-meta">{{ s.episode_count or 0 }} Episoden</span>
            </div>
        </a>
        {% endfor %}
    </div>
</section>
{% endif %}

<!-- Filme -->
{% if movies %}
<section class="tv-section">
    <div class="tv-section-header">
        <h2 class="tv-section-title">Filme</h2>
        <a href="/tv/movies" class="tv-section-more" data-focusable>Alle anzeigen</a>
    </div>
    <div class="tv-row">
        {% for m in movies %}
        <a href="/tv/movies/{{ m.id }}" class="tv-card" data-focusable>
            {% if m.poster_url %}
            <img src="{{ m.poster_url }}" alt="" class="tv-card-img" loading="lazy">
            {% else %}
            <div class="tv-card-placeholder">{{ m.title or m.folder_name }}</div>
            {% endif %}
            <div class="tv-card-info">
                <span class="tv-card-title">{{ m.title or m.folder_name }}</span>
                <span class="tv-card-meta">{{ m.year or "" }}{% if m.genres %} &middot; {{ m.genres }}{% endif %}</span>
            </div>
        </a>
        {% endfor %}
    </div>
</section>
{% endif %}

<!-- Schon gesehen -->
{% if watched_series or watched_movies %}
<section class="tv-section">
    <h2 class="tv-section-title tv-title-muted">Schon gesehen</h2>
    <div class="tv-row">
        {% for s in watched_series %}
        <a href="/tv/series/{{ s.id }}" class="tv-card tv-card-watched" data-focusable>
            {% if s.poster_url %}
            <img src="{{ s.poster_url }}" alt="" class="tv-card-img" loading="lazy">
            {% else %}
            <div class="tv-card-placeholder">{{ s.title or s.folder_name }}</div>
            {% endif %}
            <div class="tv-card-watched-badge">&#10003;</div>
            <div class="tv-card-info">
                <span class="tv-card-title">{{ s.title or s.folder_name }}</span>
                <span class="tv-card-meta">{{ s.episode_count or 0 }} Episoden</span>
            </div>
        </a>
        {% endfor %}
        {% for m in watched_movies %}
        <a href="/tv/movies/{{ m.id }}" class="tv-card tv-card-watched" data-focusable>
            {% if m.poster_url %}
            <img src="{{ m.poster_url }}" alt="" class="tv-card-img" loading="lazy">
            {% else %}
            <div class="tv-card-placeholder">{{ m.title or m.folder_name }}</div>
            {% endif %}
            <div class="tv-card-watched-badge">&#10003;</div>
            <div class="tv-card-info">
                <span class="tv-card-title">{{ m.title or m.folder_name }}</span>
                <span class="tv-card-meta">{{ m.year or "" }}{% if m.genres %} &middot; {{ m.genres }}{% endif %}</span>
            </div>
        </a>
        {% endfor %}
    </div>
</section>
{% endif %}

{% if not series and not movies and not new_series and not new_movies and not continue_watching %}
<div class="tv-empty">
    <p>Noch keine Inhalte in der Bibliothek.</p>
    <p>Fuege Serien oder Filme ueber die Admin-Oberflaeche hinzu.</p>
</div>
{% endif %}
{% endblock %}