kryten-webqueue 0.6.5__tar.gz → 0.6.6__tar.gz

{kryten_webqueue-0.6.5 → kryten_webqueue-0.6.6}/CHANGELOG.md

@@ -4,6 +4,12 @@ All notable changes to this project will be documented in this file.
 
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
+## [0.6.6] - 2026-06-08
+
+### Changed
+
+- **Queue view polish.** Three refinements to the Queue page: (1) **Predicted start times** now render reliably in the viewer's local timezone — the frontend defensively treats timezone-less timestamps as UTC before converting, so ETAs no longer risk being misread as server time. (2) **Now Playing card** is larger and easier to read — bigger cover art (128px), a larger title that wraps cleanly, and the elapsed/remaining times no longer wrap. (3) **The currently-playing item is now highlighted** in the queue list with an accent tint and ring. The now-playing playlist `uid` is resolved server-side (matching media id/type against the shadow playlist when CyTube's `changeMedia` payload omits it) so the matching queue item is identified reliably.
+
 ## [0.6.5] - 2026-06-08
 
 ### Changed

{kryten_webqueue-0.6.5 → kryten_webqueue-0.6.6}/PKG-INFO

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

{kryten_webqueue-0.6.5 → kryten_webqueue-0.6.6}/kryten_webqueue/queue/shadow.py

@@ -203,6 +203,20 @@ class QueueShadow:
                 np.setdefault("thumbnail_url", meta.get("thumbnail_url"))
                 if not np.get("friendly_token"):
                     np["friendly_token"] = meta.get("friendly_token")
+            # Ensure now-playing carries a playlist uid so the frontend can
+            # highlight the matching queue item. CyTube's changeMedia payload
+            # lacks a uid; recover it by matching media id/type against the
+            # shadow playlist (whose items do carry uids).
+            if np.get("uid") is None:
+                np_id = np.get("id")
+                np_type = np.get("type")
+                if np_id is not None:
+                    for it in enriched_items:
+                        if it.get("media_id") == np_id and (
+                            np_type is None or it.get("media_type") == np_type
+                        ):
+                            np["uid"] = it.get("uid")
+                            break
             state["now_playing"] = np
 
         return state

{kryten_webqueue-0.6.5 → kryten_webqueue-0.6.6}/kryten_webqueue/static/css/main.css

@@ -249,10 +249,10 @@ a:hover {
 .now-playing-card {
     background: var(--bg-card);
     border-radius: var(--radius);
-    padding: 1.5rem;
+    padding: 2rem;
     display: flex;
-    gap: 1rem;
-    align-items: flex-start;
+    gap: 1.5rem;
+    align-items: center;
     /* Highlight the currently-playing item: subtle accent ring + glow. */
     border: 1px solid var(--accent);
     box-shadow: 0 0 0 1px rgba(108, 92, 231, 0.25), 0 6px 18px rgba(108, 92, 231, 0.18);
@@ -263,13 +263,16 @@ a:hover {
 }
 .np-info h3 {
     margin-bottom: 0.5rem;
+    font-size: 1.4rem;
+    line-height: 1.25;
+    overflow-wrap: anywhere;
 }
 .np-progress {
-    height: 4px;
+    height: 6px;
     background: var(--border);
-    border-radius: 2px;
+    border-radius: 3px;
     overflow: hidden;
-    margin: 0.5rem 0;
+    margin: 0.75rem 0;
 }
 .progress-bar {
     height: 100%;
@@ -277,7 +280,7 @@ a:hover {
     transition: width 1s linear;
 }
 .np-time {
-    font-size: 0.8rem;
+    font-size: 0.9rem;
     color: var(--text-secondary);
 }
 
@@ -304,6 +307,15 @@ a:hover {
 .queue-item-paid {
     border-left-color: var(--accent);
 }
+.queue-item-now-playing {
+    border-left-color: var(--accent);
+    background: linear-gradient(90deg, rgba(108, 92, 231, 0.18), var(--bg-card) 60%);
+    box-shadow: inset 0 0 0 1px rgba(108, 92, 231, 0.35);
+}
+.queue-item-now-playing .qi-title {
+    color: var(--accent);
+    font-weight: 600;
+}
 .qi-pos {
     font-size: 0.75rem;
     color: var(--text-secondary);
@@ -332,10 +344,10 @@ a:hover {
     display: block;
 }
 .np-cover {
-    width: 96px;
-    height: 96px;
+    width: 128px;
+    height: 128px;
     flex-shrink: 0;
-    border-radius: 6px;
+    border-radius: 8px;
     overflow: hidden;
     background: var(--bg-elevated, #222);
 }
@@ -397,15 +409,17 @@ a:hover {
     color: var(--text-secondary);
 }
 .np-meta {
-    font-size: 0.8rem;
+    font-size: 0.9rem;
     color: var(--text-secondary);
     margin: 0.25rem 0;
 }
 .np-times {
     display: flex;
     justify-content: space-between;
-    font-size: 0.8rem;
-    margin-top: 0.25rem;
+    gap: 1rem;
+    font-size: 0.9rem;
+    margin-top: 0.5rem;
+    white-space: nowrap;
 }
 .np-remaining {
     color: var(--text-secondary);

{kryten_webqueue-0.6.5 → kryten_webqueue-0.6.6}/kryten_webqueue/templates/queue/index.html

@@ -110,8 +110,10 @@ function renderQueue(state) {
         const totalDuration = state.items.reduce((sum, i) => sum + (i.duration_sec || 0), 0);
         sumEl.innerHTML = `<span>${state.items.length} items · ${formatTime(totalDuration)} total</span>`;
 
+        const nowUid = state.now_playing && state.now_playing.uid != null
+            ? String(state.now_playing.uid) : null;
         qlEl.innerHTML = state.items.map((item, i) => `
-            <div class="queue-item ${item.is_pay ? 'queue-item-paid' : ''}" data-uid="${item.uid}">
+            <div class="queue-item ${item.is_pay ? 'queue-item-paid' : ''} ${nowUid != null && String(item.uid) === nowUid ? 'queue-item-now-playing' : ''}" data-uid="${item.uid}">
                 <span class="qi-drag" title="Drag to reorder">☰</span>
                 <span class="qi-pos">${i + 1}</span>
                 <div class="qi-cover">${coverHtml(item)}</div>
@@ -166,7 +168,15 @@ function coverHtml(item) {
 }
 
 function formatEta(isoStr) {
-    const d = new Date(isoStr);
+    // Server emits UTC ISO timestamps. If a value arrives without an explicit
+    // timezone designator, treat it as UTC so the browser converts it to the
+    // viewer's local timezone rather than misreading it as local time.
+    let s = String(isoStr);
+    if (!/[zZ]|[+-]\d{2}:?\d{2}$/.test(s)) {
+        s += 'Z';
+    }
+    const d = new Date(s);
+    if (isNaN(d.getTime())) return '';
     return d.toLocaleTimeString([], {hour: '2-digit', minute: '2-digit'});
 }
 

{kryten_webqueue-0.6.5 → kryten_webqueue-0.6.6}/pyproject.toml

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