kryten-webqueue 0.3.2__tar.gz → 0.4.1__tar.gz

{kryten_webqueue-0.3.2 → kryten_webqueue-0.4.1}/PKG-INFO

@@ -1,6 +1,6 @@
 Metadata-Version: 2.4
 Name: kryten-webqueue
-Version: 0.3.2
+Version: 0.4.1
 Summary: Netflix/Tubi-style catalog browser and pay-to-play queue management for CyTube
 Author: grobertson
 License-Expression: MIT

{kryten_webqueue-0.3.2 → kryten_webqueue-0.4.1}/kryten_webqueue/catalog/db.py

@@ -164,6 +164,11 @@ MIGRATIONS = [
     );
     CREATE INDEX IF NOT EXISTS idx_queue_history_user ON queue_history(username);
     """,
+    # v3: Clear all cached cover art to force a full repoll (fixes TMDB poster/person
+    # preference and /static/images -> /images path correction)
+    """
+    UPDATE catalog SET cover_art_path = NULL, cover_art_source = NULL;
+    """,
 ]
 
 
@@ -242,6 +247,28 @@ class Database:
         params.extend([per_page, (page - 1) * per_page])
         return await self._fetch_all(query, params)
 
+    async def browse_count(self, *, category: str | None = None) -> int:
+        query = """
+            SELECT COUNT(*) as cnt FROM catalog c
+            WHERE c.friendly_token NOT IN (
+                SELECT spi.media_id FROM saved_playlist_items spi
+                JOIN saved_playlists sp ON spi.playlist_id = sp.id
+                WHERE sp.is_immutable = 1 AND spi.media_type = 'cm'
+            )
+        """
+        params: list = []
+        if category:
+            query += """
+                AND c.friendly_token IN (
+                    SELECT cc.friendly_token FROM catalog_categories cc
+                    JOIN categories cat ON cc.category_id = cat.id
+                    WHERE cat.slug = ?
+                )
+            """
+            params.append(category)
+        row = await self._fetch_one(query, params)
+        return row["cnt"] if row else 0
+
     async def search(self, query_text: str, *, page: int = 1, per_page: int = 24) -> list[dict]:
         sql = """
             SELECT c.friendly_token, c.title, c.duration_sec, c.cover_art_path, c.thumbnail_url, c.manifest_url,
@@ -259,6 +286,21 @@ class Database:
         """
         return await self._fetch_all(sql, [query_text, per_page, (page - 1) * per_page])
 
+    async def search_count(self, query_text: str) -> int:
+        sql = """
+            SELECT COUNT(*) as cnt
+            FROM catalog_fts fts
+            JOIN catalog c ON c.rowid = fts.rowid
+            WHERE catalog_fts MATCH ?
+              AND c.friendly_token NOT IN (
+                  SELECT spi.media_id FROM saved_playlist_items spi
+                  JOIN saved_playlists sp ON spi.playlist_id = sp.id
+                  WHERE sp.is_immutable = 1 AND spi.media_type = 'cm'
+              )
+        """
+        row = await self._fetch_one(sql, [query_text])
+        return row["cnt"] if row else 0
+
     async def get_item(self, friendly_token: str) -> dict | None:
         sql = """
             SELECT * FROM catalog

{kryten_webqueue-0.3.2 → kryten_webqueue-0.4.1}/kryten_webqueue/catalog/images.py

@@ -1,13 +1,31 @@
-import httpx
+import asyncio
+import hashlib
+import io
 import logging
+import re
 from pathlib import Path
+
+import httpx
 from PIL import Image
-import io
-import hashlib
 
 logger = logging.getLogger(__name__)
 
 
+def _clean_title(title: str) -> tuple[str, str | None]:
+    """Return (cleaned_title, year_or_None) stripping common noise."""
+    # Extract 4-digit year in parens or at end: "Title (2019)" or "Title 2019"
+    year = None
+    m = re.search(r"\b((?:19|20)\d{2})\b", title)
+    if m:
+        year = m.group(1)
+    # Remove year, episode tags, resolution tags, etc.
+    cleaned = re.sub(r"\s*[\(\[]?(?:19|20)\d{2}[\)\]]?", "", title)
+    cleaned = re.sub(r"\s*[Ss]\d{1,2}[Ee]\d{1,2}.*", "", cleaned)
+    cleaned = re.sub(r"\s*\b(?:720p|1080p|2160p|4K|HDR|BluRay|BDRip|WEB[-.]?DL|HDTV)\b.*", "", cleaned, flags=re.IGNORECASE)
+    cleaned = cleaned.strip(" .-")
+    return cleaned or title, year
+
+
 class CoverArtResolver:
     """Downloads and caches cover art for catalog items."""
 
@@ -37,9 +55,9 @@ class CoverArtResolver:
             logger.warning("No TMDB or OMDB API keys configured — cover art lookup skipped")
             return None
 
-        # Try TMDB first
         image_url = None
         source = None
+
         if self._tmdb_key:
             image_url = await self._search_tmdb(title)
             if image_url:
@@ -47,6 +65,7 @@ class CoverArtResolver:
                 logger.debug(f"TMDB found art for {friendly_token!r}: {title!r}")
             else:
                 logger.debug(f"TMDB found no art for {friendly_token!r}: {title!r}")
+
         if not image_url and self._omdb_key:
             image_url = await self._search_omdb(title)
             if image_url:
@@ -55,10 +74,15 @@ class CoverArtResolver:
             else:
                 logger.debug(f"OMDB found no art for {friendly_token!r}: {title!r}")
 
+        # Last resort: use the MediaCMS thumbnail already in the DB
+        if not image_url and existing and existing.get("thumbnail_url"):
+            image_url = existing["thumbnail_url"]
+            source = "thumbnail"
+            logger.debug(f"Falling back to thumbnail for {friendly_token!r}")
+
         if not image_url:
             return None
 
-        # Download and generate responsive variants
         try:
             resp = await self._client.get(image_url)
             if resp.status_code != 200:
@@ -72,38 +96,72 @@ class CoverArtResolver:
             return None
 
     async def _search_tmdb(self, title: str) -> str | None:
+        """Search TMDB for a poster: tries movie+TV in parallel, retries with cleaned title."""
+        result = await self._tmdb_search_both(title)
+        if result:
+            return result
+        # Retry with cleaned title if it differs
+        cleaned, year = _clean_title(title)
+        if cleaned != title:
+            result = await self._tmdb_search_both(cleaned, year=year)
+        return result
+
+    async def _tmdb_search_both(self, title: str, year: str | None = None) -> str | None:
+        """Search TMDB movie and TV endpoints in parallel, pick best poster by popularity."""
+        movie_task = asyncio.create_task(self._tmdb_search_type("movie", title, year))
+        tv_task = asyncio.create_task(self._tmdb_search_type("tv", title, year))
+        movie_hit, tv_hit = await asyncio.gather(movie_task, tv_task)
+
+        # Pick whichever has a poster; prefer movie if both have one and similar popularity
+        candidates = [h for h in (movie_hit, tv_hit) if h and h[0]]
+        if not candidates:
+            return None
+        # Sort by popularity descending, return the best poster URL
+        candidates.sort(key=lambda h: h[1], reverse=True)
+        return candidates[0][0]
+
+    async def _tmdb_search_type(self, media_type: str, title: str, year: str | None = None) -> tuple[str | None, float]:
+        """Search a specific TMDB media type. Returns (poster_url_or_None, popularity)."""
+        params: dict = {"api_key": self._tmdb_key, "query": title}
+        if year and media_type == "movie":
+            params["year"] = year
+        elif year and media_type == "tv":
+            params["first_air_date_year"] = year
         try:
             resp = await self._client.get(
-                "https://api.themoviedb.org/3/search/multi",
-                params={"api_key": self._tmdb_key, "query": title},
+                f"https://api.themoviedb.org/3/search/{media_type}",
+                params=params,
             )
             if resp.status_code != 200:
-                logger.warning(f"TMDB API returned {resp.status_code} for {title!r}")
-                return None
+                logger.warning(f"TMDB {media_type} search returned {resp.status_code} for {title!r}")
+                return None, 0.0
             results = resp.json().get("results", [])
-            if results:
-                poster = results[0].get("poster_path")
+            for result in results:
+                poster = result.get("poster_path")
                 if poster:
-                    return f"https://image.tmdb.org/t/p/w500{poster}"
+                    # w780 gives better quality than w500
+                    url = f"https://image.tmdb.org/t/p/w780{poster}"
+                    return url, float(result.get("popularity", 0))
         except Exception as e:
-            logger.warning(f"TMDB search error for {title!r}: {e}")
-        return None
+            logger.warning(f"TMDB {media_type} search error for {title!r}: {e}")
+        return None, 0.0
 
     async def _search_omdb(self, title: str) -> str | None:
-        try:
-            resp = await self._client.get(
-                "https://www.omdbapi.com/",
-                params={"apikey": self._omdb_key, "t": title},
-            )
-            if resp.status_code != 200:
-                logger.warning(f"OMDB API returned {resp.status_code} for {title!r}")
-                return None
-            data = resp.json()
-            poster = data.get("Poster")
-            if poster and poster != "N/A":
-                return poster
-        except Exception as e:
-            logger.warning(f"OMDB search error for {title!r}: {e}")
+        cleaned, year = _clean_title(title)
+        for t in dict.fromkeys([title, cleaned]):  # try original then cleaned, deduped
+            params: dict = {"apikey": self._omdb_key, "t": t}
+            if year:
+                params["y"] = year
+            try:
+                resp = await self._client.get("https://www.omdbapi.com/", params=params)
+                if resp.status_code != 200:
+                    continue
+                data = resp.json()
+                poster = data.get("Poster")
+                if poster and poster != "N/A":
+                    return poster
+            except Exception as e:
+                logger.warning(f"OMDB search error for {t!r}: {e}")
         return None
 
     async def _save_responsive(self, friendly_token: str, data: bytes, source: str, db) -> str:

{kryten_webqueue-0.3.2 → kryten_webqueue-0.4.1}/kryten_webqueue/routes/pages.py

@@ -46,12 +46,15 @@ async def catalog_browse_page(request: Request, category: str | None = None, pag
         return RedirectResponse("/auth/login")
     db = request.app.state.db
     items = await db.browse(category=category, page=page)
+    total = await db.browse_count(category=category)
+    total_pages = max(1, (total + 23) // 24)
     categories = await db.get_categories()
     return templates.TemplateResponse(request, "catalog/browse.html", {
         "user": user,
         "items": items,
         "categories": categories,
         "page": page,
+        "total_pages": total_pages,
         "active_category": category,
         "query": None,
     })
@@ -66,12 +69,15 @@ async def catalog_search_page(request: Request, q: str = "", page: int = 1):
         return RedirectResponse("/catalog/browse")
     db = request.app.state.db
     items = await db.search(q, page=page)
+    total = await db.search_count(q)
+    total_pages = max(1, (total + 23) // 24)
     categories = await db.get_categories()
     return templates.TemplateResponse(request, "catalog/browse.html", {
         "user": user,
         "items": items,
         "categories": categories,
         "page": page,
+        "total_pages": total_pages,
         "active_category": None,
         "query": q,
     })
@@ -99,3 +105,27 @@ async def admin_page(request: Request):
     if not user or user.get("rank", 0) < 3:
         return RedirectResponse("/auth/login")
     return templates.TemplateResponse(request, "admin/index.html", {"user": user})
+
+
+@router.get("/admin/playlists", response_class=HTMLResponse)
+async def admin_playlists_page(request: Request):
+    user = _get_user_or_none(request)
+    if not user or user.get("rank", 0) < 3:
+        return RedirectResponse("/auth/login")
+    return templates.TemplateResponse(request, "admin/playlists.html", {"user": user})
+
+
+@router.get("/admin/schedules", response_class=HTMLResponse)
+async def admin_schedules_page(request: Request):
+    user = _get_user_or_none(request)
+    if not user or user.get("rank", 0) < 3:
+        return RedirectResponse("/auth/login")
+    return templates.TemplateResponse(request, "admin/schedules.html", {"user": user})
+
+
+@router.get("/admin/queue-mgmt", response_class=HTMLResponse)
+async def admin_queue_mgmt_page(request: Request):
+    user = _get_user_or_none(request)
+    if not user or user.get("rank", 0) < 3:
+        return RedirectResponse("/auth/login")
+    return templates.TemplateResponse(request, "admin/queue_mgmt.html", {"user": user})

{kryten_webqueue-0.3.2 → kryten_webqueue-0.4.1}/kryten_webqueue/static/css/main.css

@@ -143,14 +143,16 @@ a:hover {
 
 .catalog-grid {
     display: grid;
-    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
-    gap: 1.5rem;
+    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
+    gap: 1.25rem;
 }
 .catalog-card {
     background: var(--bg-card);
     border-radius: var(--radius);
     overflow: hidden;
     transition: transform 0.2s, box-shadow 0.2s;
+    display: flex;
+    flex-direction: column;
 }
 .catalog-card:hover {
     transform: translateY(-4px);
@@ -177,34 +179,41 @@ a:hover {
     background: linear-gradient(135deg, var(--bg-secondary), var(--bg-card));
 }
 .card-info {
-    padding: 0.75rem;
+    padding: 0.6rem 0.75rem 0.25rem;
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    gap: 0.2rem;
 }
 .card-title {
-    font-size: 0.85rem;
+    font-size: 0.8rem;
     font-weight: 600;
-    margin-bottom: 0.25rem;
-    white-space: nowrap;
+    line-height: 1.3;
+    display: -webkit-box;
+    -webkit-line-clamp: 3;
+    -webkit-box-orient: vertical;
     overflow: hidden;
-    text-overflow: ellipsis;
 }
 .card-duration {
-    font-size: 0.75rem;
+    font-size: 0.7rem;
     color: var(--text-secondary);
 }
 .card-actions {
-    padding: 0 0.75rem 0.75rem;
+    padding: 0.4rem 0.75rem 0.6rem;
     display: flex;
-    gap: 0.5rem;
+    gap: 0.4rem;
 }
 .btn-queue {
     background: var(--accent);
     border-color: var(--accent);
     color: white;
+    flex: 1;
 }
 .btn-playnext {
     background: var(--warning);
     border-color: var(--warning);
     color: #333;
+    flex: 1;
 }
 
 /* Queue Page */
@@ -249,6 +258,12 @@ a:hover {
     flex-direction: column;
     gap: 0.5rem;
 }
+.queue-summary {
+    font-size: 0.8rem;
+    color: var(--text-secondary);
+    margin-top: 0.75rem;
+    text-align: right;
+}
 .queue-item {
     display: flex;
     align-items: center;
@@ -266,13 +281,31 @@ a:hover {
     color: var(--text-secondary);
     min-width: 1.5rem;
 }
-.qi-title {
+.qi-info {
     flex: 1;
+    min-width: 0;
+    display: flex;
+    flex-direction: column;
+    gap: 0.2rem;
+}
+.qi-title {
     font-size: 0.9rem;
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
 }
+.qi-meta {
+    display: flex;
+    gap: 0.5rem;
+    align-items: center;
+}
+.qi-right {
+    display: flex;
+    flex-direction: column;
+    align-items: flex-end;
+    gap: 0.15rem;
+    white-space: nowrap;
+}
 .qi-duration {
     font-size: 0.8rem;
     color: var(--text-secondary);
@@ -292,7 +325,21 @@ a:hover {
     color: var(--text-secondary);
 }
 .qi-eta {
-    font-size: 0.75rem;
+    font-size: 0.7rem;
+    color: var(--text-secondary);
+}
+.np-meta {
+    font-size: 0.8rem;
+    color: var(--text-secondary);
+    margin: 0.25rem 0;
+}
+.np-times {
+    display: flex;
+    justify-content: space-between;
+    font-size: 0.8rem;
+    margin-top: 0.25rem;
+}
+.np-remaining {
     color: var(--text-secondary);
 }
 
@@ -340,6 +387,27 @@ a:hover {
 }
 
 /* User Dashboard */
+.user-header {
+    display: flex;
+    align-items: baseline;
+    gap: 1rem;
+    margin-bottom: 1rem;
+}
+.user-rank {
+    font-size: 0.85rem;
+    color: var(--text-secondary);
+    background: var(--bg-card);
+    padding: 0.2rem 0.6rem;
+    border-radius: var(--radius);
+}
+.user-online {
+    border: 1px solid var(--success);
+}
+.balance-meta {
+    font-size: 0.8rem;
+    color: var(--text-secondary);
+    margin-top: 0.5rem;
+}
 .dashboard-grid {
     display: grid;
     grid-template-columns: 1fr 1fr 1fr;
@@ -365,10 +433,24 @@ a:hover {
 .history-item, .tx-item {
     display: flex;
     justify-content: space-between;
+    align-items: center;
+    gap: 0.5rem;
     padding: 0.5rem 0;
     border-bottom: 1px solid var(--border);
     font-size: 0.85rem;
 }
+.tx-desc, .hi-title {
+    flex: 1;
+    min-width: 0;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+.tx-time {
+    font-size: 0.75rem;
+    color: var(--text-secondary);
+    white-space: nowrap;
+}
 .tx-credit {
     color: var(--success);
 }
@@ -418,13 +500,29 @@ a:hover {
     display: flex;
     align-items: center;
     justify-content: center;
-    gap: 1rem;
+    gap: 0.5rem;
     margin-top: 2rem;
+    flex-wrap: wrap;
 }
 .page-num {
     color: var(--text-secondary);
     font-size: 0.9rem;
 }
+.page-current {
+    background: var(--accent);
+    color: white;
+    padding: 0.3rem 0.6rem;
+    border-radius: var(--radius);
+    font-weight: 700;
+}
+.page-info {
+    color: var(--text-secondary);
+    font-size: 0.85rem;
+}
+.btn-page {
+    min-width: 2rem;
+    text-align: center;
+}
 
 /* Toast */
 .toast {

kryten_webqueue-0.4.1/kryten_webqueue/templates/admin/playlists.html

@@ -0,0 +1,14 @@
+{% extends "base.html" %}
+{% block title %}Playlists - Admin{% endblock %}
+{% block body_class %}admin-page{% endblock %}
+
+{% block content %}
+<div class="admin-dashboard">
+    <h1>Playlists</h1>
+    <p><a href="/admin">&larr; Back to Admin</a></p>
+
+    <div class="admin-section">
+        <p class="empty-state">Playlist management coming soon.</p>
+    </div>
+</div>
+{% endblock %}

kryten_webqueue-0.4.1/kryten_webqueue/templates/admin/queue_mgmt.html

@@ -0,0 +1,14 @@
+{% extends "base.html" %}
+{% block title %}Queue Management - Admin{% endblock %}
+{% block body_class %}admin-page{% endblock %}
+
+{% block content %}
+<div class="admin-dashboard">
+    <h1>Queue Management</h1>
+    <p><a href="/admin">&larr; Back to Admin</a></p>
+
+    <div class="admin-section">
+        <p class="empty-state">Queue management coming soon.</p>
+    </div>
+</div>
+{% endblock %}

kryten_webqueue-0.4.1/kryten_webqueue/templates/admin/schedules.html

@@ -0,0 +1,14 @@
+{% extends "base.html" %}
+{% block title %}Schedules - Admin{% endblock %}
+{% block body_class %}admin-page{% endblock %}
+
+{% block content %}
+<div class="admin-dashboard">
+    <h1>Schedules</h1>
+    <p><a href="/admin">&larr; Back to Admin</a></p>
+
+    <div class="admin-section">
+        <p class="empty-state">Schedule management coming soon.</p>
+    </div>
+</div>
+{% endblock %}

kryten_webqueue-0.4.1/kryten_webqueue/templates/catalog/browse.html

@@ -0,0 +1,130 @@
+{% extends "base.html" %}
+{% block title %}{% if query %}Search: {{ query }}{% else %}Browse{% endif %}{% endblock %}
+{% block body_class %}catalog-page{% endblock %}
+
+{% block content %}
+<div class="catalog-header">
+    <h1>{% if query %}Results for "{{ query }}"{% else %}Browse Catalog{% endif %}</h1>
+    <div class="catalog-controls">
+        <form class="search-form" action="/catalog/search" method="get">
+            <input type="text" name="q" placeholder="Search movies & shows..." value="{{ query or '' }}">
+            <button type="submit" class="btn btn-sm">Search</button>
+        </form>
+        <div class="category-filter">
+            <select id="category-select" onchange="filterCategory(this.value)">
+                <option value="">All Categories</option>
+                {% for cat in categories %}
+                    <option value="{{ cat.slug }}" {% if active_category == cat.slug %}selected{% endif %}>{{ cat.name }}</option>
+                {% endfor %}
+            </select>
+        </div>
+    </div>
+</div>
+
+<div class="catalog-grid">
+    {% for item in items %}
+    <div class="catalog-card" data-token="{{ item.friendly_token }}">
+        <div class="card-poster">
+            {% if item.cover_art_path %}
+                <img src="/images/{{ item.cover_art_path }}/400.webp"
+                     srcset="/images/{{ item.cover_art_path }}/200.webp 200w,
+                             /images/{{ item.cover_art_path }}/400.webp 400w,
+                             /images/{{ item.cover_art_path }}/800.webp 800w"
+                     sizes="(max-width: 600px) 200px, 400px"
+                     alt="{{ item.title }}" loading="lazy">
+            {% elif item.thumbnail_url %}
+                <img src="{{ item.thumbnail_url }}"
+                     alt="{{ item.title }}" loading="lazy">
+            {% else %}
+                <div class="card-poster-placeholder">
+                    <span>{{ item.title[:1] }}</span>
+                </div>
+            {% endif %}
+        </div>
+        <div class="card-info">
+            <h3 class="card-title" title="{{ item.title }}">{{ item.title }}</h3>
+            <span class="card-duration">{{ (item.duration_sec // 60) }}m</span>
+        </div>
+        <div class="card-actions">
+            <button class="btn btn-sm btn-queue" onclick="queueItem('{{ item.friendly_token }}')">Queue</button>
+            <button class="btn btn-sm btn-playnext" onclick="playNext('{{ item.friendly_token }}')">Play Next</button>
+        </div>
+    </div>
+    {% endfor %}
+</div>
+
+{% if not items %}
+<div class="empty-state">
+    <p>No items found.</p>
+</div>
+{% endif %}
+
+<div class="pagination">
+    {% if page > 1 %}
+        <a href="?page={{ page - 1 }}{% if query %}&q={{ query }}{% endif %}{% if active_category %}&category={{ active_category }}{% endif %}" class="btn btn-sm">&larr; Prev</a>
+    {% endif %}
+
+    {% set start_page = [1, page - 2] | max %}
+    {% set end_page = [total_pages, page + 2] | min %}
+    {% for p in range(start_page, end_page + 1) %}
+        {% if p == page %}
+            <span class="page-num page-current">{{ p }}</span>
+        {% else %}
+            <a href="?page={{ p }}{% if query %}&q={{ query }}{% endif %}{% if active_category %}&category={{ active_category }}{% endif %}" class="btn btn-sm btn-page">{{ p }}</a>
+        {% endif %}
+    {% endfor %}
+
+    <span class="page-info">of {{ total_pages }}</span>
+
+    {% if page < total_pages %}
+        <a href="?page={{ page + 1 }}{% if query %}&q={{ query }}{% endif %}{% if active_category %}&category={{ active_category }}{% endif %}" class="btn btn-sm">Next &rarr;</a>
+    {% endif %}
+</div>
+{% endblock %}
+
+{% block scripts %}
+<script>
+function filterCategory(slug) {
+    const url = slug ? `/catalog/browse?category=${slug}` : '/catalog/browse';
+    window.location.href = url;
+}
+
+async function queueItem(token) {
+    try {
+        const resp = await fetch('/queue/add', {
+            method: 'POST',
+            headers: {'Content-Type': 'application/json'},
+            credentials: 'same-origin',
+            body: JSON.stringify({friendly_token: token, tier: 'queue'})
+        });
+        const data = await resp.json();
+        if (resp.ok) {
+            showToast('Added to queue!');
+        } else {
+            showToast(data.detail || `Failed (${resp.status})`, 'error');
+        }
+    } catch (e) {
+        showToast(`Network error: ${e.message}`, 'error');
+    }
+}
+
+async function playNext(token) {
+    try {
+        const resp = await fetch('/queue/playnext', {
+            method: 'POST',
+            headers: {'Content-Type': 'application/json'},
+            credentials: 'same-origin',
+            body: JSON.stringify({friendly_token: token})
+        });
+        const data = await resp.json();
+        if (resp.ok) {
+            showToast('Playing next!');
+        } else {
+            showToast(data.detail || `Failed (${resp.status})`, 'error');
+        }
+    } catch (e) {
+        showToast(`Network error: ${e.message}`, 'error');
+    }
+}
+</script>
+{% endblock %}

{kryten_webqueue-0.3.2 → kryten_webqueue-0.4.1}/kryten_webqueue/templates/queue/index.html

@@ -7,15 +7,16 @@
     <div class="now-playing-section">
         <h2>Now Playing</h2>
         <div id="now-playing" class="now-playing-card">
-            <p class="empty-state">Nothing playing</p>
+            <p class="empty-state">Connecting...</p>
         </div>
     </div>
 
     <div class="queue-section">
         <h2>Up Next</h2>
         <div id="queue-list" class="queue-list">
-            <p class="empty-state">Queue is empty</p>
+            <p class="empty-state">Connecting...</p>
         </div>
+        <div id="queue-summary" class="queue-summary"></div>
     </div>
 
     <div class="queue-info-sidebar">
@@ -25,7 +26,7 @@
             <p id="schedule-time"></p>
         </div>
         <div class="queue-stats">
-            <p>Connected: <span id="ws-status" class="ws-disconnected">●</span></p>
+            <p>Status: <span id="ws-status" class="ws-disconnected">● Disconnected</span></p>
         </div>
     </div>
 </div>
@@ -41,12 +42,15 @@ function connectWebSocket() {
     ws = new WebSocket(`${proto}//${location.host}/ws`);
 
     ws.onopen = () => {
-        document.getElementById('ws-status').className = 'ws-connected';
-        document.getElementById('ws-status').title = 'Connected';
+        const el = document.getElementById('ws-status');
+        el.className = 'ws-connected';
+        el.textContent = '● Live';
     };
 
     ws.onclose = () => {
-        document.getElementById('ws-status').className = 'ws-disconnected';
+        const el = document.getElementById('ws-status');
+        el.className = 'ws-disconnected';
+        el.textContent = '● Disconnected';
         reconnectTimer = setTimeout(connectWebSocket, 3000);
     };
 
@@ -72,16 +76,26 @@ function connectWebSocket() {
 function renderQueue(state) {
     const npEl = document.getElementById('now-playing');
     const qlEl = document.getElementById('queue-list');
+    const sumEl = document.getElementById('queue-summary');
 
     if (state.now_playing) {
         const np = state.now_playing;
+        const elapsed = np.currentTime || 0;
+        const total = np.duration || 0;
+        const remaining = Math.max(0, total - elapsed);
         npEl.innerHTML = `
             <div class="np-info">
                 <h3>${escapeHtml(np.title || 'Unknown')}</h3>
+                <div class="np-meta">
+                    ${np.paid_by ? `<span class="np-user">Queued by ${escapeHtml(np.paid_by)}</span>` : ''}
+                </div>
                 <div class="np-progress">
-                    <div class="progress-bar" style="width: ${((np.currentTime || 0) / (np.duration || 1) * 100)}%"></div>
+                    <div class="progress-bar" style="width: ${total > 0 ? (elapsed / total * 100) : 0}%"></div>
+                </div>
+                <div class="np-times">
+                    <span class="np-time">${formatTime(elapsed)} / ${formatTime(total)}</span>
+                    <span class="np-remaining">${formatTime(remaining)} remaining</span>
                 </div>
-                <span class="np-time">${formatTime(np.currentTime || 0)} / ${formatTime(np.duration || 0)}</span>
             </div>
         `;
     } else {
@@ -89,24 +103,37 @@ function renderQueue(state) {
     }
 
     if (state.items && state.items.length > 0) {
+        const totalDuration = state.items.reduce((sum, i) => sum + (i.duration_sec || 0), 0);
+        sumEl.innerHTML = `<span>${state.items.length} items · ${formatTime(totalDuration)} total</span>`;
+
         qlEl.innerHTML = state.items.map((item, i) => `
             <div class="queue-item ${item.is_pay ? 'queue-item-paid' : ''}" data-uid="${item.uid}">
                 <span class="qi-pos">${i + 1}</span>
-                <span class="qi-title">${escapeHtml(item.title || 'Unknown')}</span>
-                <span class="qi-duration">${formatTime(item.duration_sec || 0)}</span>
-                ${item.is_pay ? `<span class="qi-badge badge-paid">${item.tier}</span>` : ''}
-                ${item.paid_by ? `<span class="qi-user">${escapeHtml(item.paid_by)}</span>` : ''}
-                <span class="qi-eta">${item.estimated_start_at ? formatEta(item.estimated_start_at) : ''}</span>
+                <div class="qi-info">
+                    <span class="qi-title">${escapeHtml(item.title || 'Unknown')}</span>
+                    <span class="qi-meta">
+                        ${item.paid_by ? `<span class="qi-user">by ${escapeHtml(item.paid_by)}</span>` : ''}
+                        ${item.is_pay ? `<span class="qi-badge badge-paid">${item.tier}</span>` : ''}
+                    </span>
+                </div>
+                <div class="qi-right">
+                    <span class="qi-duration">${formatTime(item.duration_sec || 0)}</span>
+                    ${item.estimated_start_at ? `<span class="qi-eta">~${formatEta(item.estimated_start_at)}</span>` : ''}
+                </div>
             </div>
         `).join('');
     } else {
         qlEl.innerHTML = '<p class="empty-state">Queue is empty</p>';
+        sumEl.innerHTML = '';
     }
 }
 
 function formatTime(sec) {
-    const m = Math.floor(sec / 60);
-    const s = Math.floor(sec % 60);
+    sec = Math.floor(sec);
+    const h = Math.floor(sec / 3600);
+    const m = Math.floor((sec % 3600) / 60);
+    const s = sec % 60;
+    if (h > 0) return `${h}:${m.toString().padStart(2, '0')}:${s.toString().padStart(2, '0')}`;
     return `${m}:${s.toString().padStart(2, '0')}`;
 }
 
@@ -121,6 +148,18 @@ function escapeHtml(str) {
     return div.innerHTML;
 }
 
+// Initial load via HTTP (in case WS takes a moment)
+async function initialLoad() {
+    try {
+        const resp = await fetch('/queue/state', {credentials: 'same-origin'});
+        if (resp.ok) {
+            const state = await resp.json();
+            renderQueue(state);
+        }
+    } catch (e) { /* WS will take over */ }
+}
+
+initialLoad();
 connectWebSocket();
 </script>
 {% endblock %}

{kryten_webqueue-0.3.2 → kryten_webqueue-0.4.1}/kryten_webqueue/templates/user/dashboard.html

@@ -4,12 +4,16 @@
 
 {% block content %}
 <div class="user-dashboard">
-    <h1>{{ user.username }}</h1>
+    <div class="user-header">
+        <h1>{{ user.username }}</h1>
+        <span class="user-rank" id="user-rank">Rank {{ user.rank }}</span>
+    </div>
 
     <div class="dashboard-grid">
         <div class="balance-card">
-            <h2>Balance</h2>
+            <h2>Z Coin Balance</h2>
             <p class="balance-amount" id="balance-amount">Loading...</p>
+            <div class="balance-meta" id="balance-meta"></div>
         </div>
 
         <div class="history-card">
@@ -31,12 +35,46 @@
 
 {% block scripts %}
 <script>
+const RANK_NAMES = {1: 'Viewer', 2: 'Regular', 3: 'Moderator', 4: 'Admin', 5: 'Owner'};
+
+function formatZ(amount) {
+    return Number(amount).toLocaleString() + ' Z';
+}
+
+function describeTx(t) {
+    const type = (t.type || '').toLowerCase();
+    if (t.description) return t.description;
+    if (type === 'queue_spend') return `Queued: ${t.title || t.media_id || 'item'}`;
+    if (type === 'playnext_spend') return `Play Next: ${t.title || t.media_id || 'item'}`;
+    if (type === 'refund') return `Refund: ${t.reason || 'queue item removed'}`;
+    if (type === 'daily_bonus' || type === 'bonus') return 'Daily bonus';
+    if (type === 'watch_reward') return 'Watch reward';
+    if (type === 'gift') return `Gift from ${t.from_user || 'system'}`;
+    if (type === 'admin_grant') return 'Admin grant';
+    return type || 'Transaction';
+}
+
 async function loadDashboard() {
+    // Profile + rank
+    const profResp = await fetch('/user/profile');
+    if (profResp.ok) {
+        const prof = await profResp.json();
+        const rankEl = document.getElementById('user-rank');
+        const rankName = RANK_NAMES[prof.rank] || `Rank ${prof.rank}`;
+        rankEl.textContent = rankName;
+        if (prof.online) rankEl.classList.add('user-online');
+    }
+
     // Balance
     const balResp = await fetch('/user/balance');
     if (balResp.ok) {
         const bal = await balResp.json();
-        document.getElementById('balance-amount').textContent = `${bal.balance || 0} Z`;
+        document.getElementById('balance-amount').textContent = formatZ(bal.balance || 0);
+        const meta = document.getElementById('balance-meta');
+        const parts = [];
+        if (bal.earned_today != null) parts.push(`Today: +${formatZ(bal.earned_today)}`);
+        if (bal.spent_today != null) parts.push(`Spent: ${formatZ(bal.spent_today)}`);
+        meta.textContent = parts.join(' · ');
     }
 
     // Queue history
@@ -48,7 +86,7 @@ async function loadDashboard() {
             el.innerHTML = hist.items.slice(0, 20).map(h => `
                 <div class="history-item">
                     <span class="hi-title">${escapeHtml(h.title || 'Unknown')}</span>
-                    <span class="hi-cost">${h.z_cost} Z</span>
+                    <span class="hi-cost">${formatZ(h.z_cost)}</span>
                     <span class="hi-tier badge-${h.tier}">${h.tier}</span>
                 </div>
             `).join('');
@@ -66,8 +104,9 @@ async function loadDashboard() {
         if (items.length > 0) {
             el.innerHTML = items.slice(0, 20).map(t => `
                 <div class="tx-item">
-                    <span class="tx-desc">${escapeHtml(t.description || t.type || '')}</span>
-                    <span class="tx-amount ${t.amount > 0 ? 'tx-credit' : 'tx-debit'}">${t.amount > 0 ? '+' : ''}${t.amount} Z</span>
+                    <span class="tx-desc">${escapeHtml(describeTx(t))}</span>
+                    <span class="tx-amount ${t.amount > 0 ? 'tx-credit' : 'tx-debit'}">${t.amount > 0 ? '+' : ''}${formatZ(t.amount)}</span>
+                    <span class="tx-time">${t.created_at ? new Date(t.created_at).toLocaleDateString() : ''}</span>
                 </div>
             `).join('');
         } else {

{kryten_webqueue-0.3.2 → kryten_webqueue-0.4.1}/pyproject.toml

@@ -1,6 +1,6 @@
 [project]
 name = "kryten-webqueue"
-version = "0.3.2"
+version = "0.4.1"
 description = "Netflix/Tubi-style catalog browser and pay-to-play queue management for CyTube"
 readme = "README.md"
 license = "MIT"

kryten_webqueue-0.3.2/kryten_webqueue/templates/catalog/browse.html

@@ -1,108 +0,0 @@
-{% extends "base.html" %}
-{% block title %}Browse{% endblock %}
-{% block body_class %}catalog-page{% endblock %}
-
-{% block content %}
-<div class="catalog-header">
-    <h1>Browse Catalog</h1>
-    <div class="catalog-controls">
-        <form class="search-form" action="/catalog/search" method="get">
-            <input type="text" name="q" placeholder="Search movies & shows..." value="{{ query or '' }}">
-            <button type="submit" class="btn btn-sm">Search</button>
-        </form>
-        <div class="category-filter">
-            <select id="category-select" onchange="filterCategory(this.value)">
-                <option value="">All Categories</option>
-                {% for cat in categories %}
-                    <option value="{{ cat.slug }}" {% if active_category == cat.slug %}selected{% endif %}>{{ cat.name }}</option>
-                {% endfor %}
-            </select>
-        </div>
-    </div>
-</div>
-
-<div class="catalog-grid">
-    {% for item in items %}
-    <div class="catalog-card" data-token="{{ item.friendly_token }}">
-        <div class="card-poster">
-            {% if item.cover_art_path %}
-                <img src="/static/images/{{ item.cover_art_path }}/400.webp"
-                     srcset="/static/images/{{ item.cover_art_path }}/200.webp 200w,
-                             /static/images/{{ item.cover_art_path }}/400.webp 400w,
-                             /static/images/{{ item.cover_art_path }}/800.webp 800w"
-                     sizes="(max-width: 600px) 200px, 400px"
-                     alt="{{ item.title }}" loading="lazy">
-            {% elif item.thumbnail_url %}
-                <img src="{{ item.thumbnail_url }}"
-                     alt="{{ item.title }}" loading="lazy">
-            {% else %}
-                <div class="card-poster-placeholder">
-                    <span>{{ item.title[:1] }}</span>
-                </div>
-            {% endif %}
-        </div>
-        <div class="card-info">
-            <h3 class="card-title">{{ item.title }}</h3>
-            <span class="card-duration">{{ (item.duration_sec // 60) }}m</span>
-        </div>
-        <div class="card-actions">
-            <button class="btn btn-sm btn-queue" onclick="queueItem('{{ item.friendly_token }}')">Queue</button>
-            <button class="btn btn-sm btn-playnext" onclick="playNext('{{ item.friendly_token }}')">Play Next</button>
-        </div>
-    </div>
-    {% endfor %}
-</div>
-
-{% if not items %}
-<div class="empty-state">
-    <p>No items found.</p>
-</div>
-{% endif %}
-
-<div class="pagination">
-    {% if page > 1 %}
-        <a href="?page={{ page - 1 }}{% if active_category %}&category={{ active_category }}{% endif %}" class="btn btn-sm">← Prev</a>
-    {% endif %}
-    <span class="page-num">Page {{ page }}</span>
-    {% if items | length == 24 %}
-        <a href="?page={{ page + 1 }}{% if active_category %}&category={{ active_category }}{% endif %}" class="btn btn-sm">Next →</a>
-    {% endif %}
-</div>
-{% endblock %}
-
-{% block scripts %}
-<script>
-function filterCategory(slug) {
-    const url = slug ? `/catalog/browse?category=${slug}` : '/catalog/browse';
-    window.location.href = url;
-}
-
-async function queueItem(token) {
-    const resp = await fetch('/queue/add', {
-        method: 'POST',
-        headers: {'Content-Type': 'application/json'},
-        body: JSON.stringify({friendly_token: token, tier: 'queue'})
-    });
-    const data = await resp.json();
-    if (resp.ok) {
-        showToast('Added to queue!');
-    } else {
-        showToast(data.detail || 'Failed to queue', 'error');
-    }
-}
-
-async function playNext(token) {
-    const resp = await fetch('/queue/playnext', {
-        method: 'POST',
-        headers: {'Content-Type': 'application/json'},
-        body: JSON.stringify({friendly_token: token})
-    });
-    const data = await resp.json();
-    if (resp.ok) {
-        showToast('Playing next!');
-    } else {
-        showToast(data.detail || 'Failed', 'error');
-    }
-}
-</script>
-{% endblock %}