mirror of
https://github.com/screentinker/screentinker.git
synced 2026-06-29 09:23:16 -06:00
9c4b48800f
Brings the Tizen TV player to parity with the other players: closes the five Tizen issues Bold Media Group filed (#118-#122) and adds the two larger renderer features it was still missing. Fixes (#118-#122) - #118 Sticky "Not authenticated" banner. On TV sleep/wake the socket reconnects and a heartbeat could land on the fresh, not-yet-registered socket; the server rejected it and the old handler painted a permanent banner AND dropped the saved credentials, forcing a re-pair. Heartbeats are now gated on a per-connection authenticated flag (true only between device:registered and disconnect/auth-error), the heartbeat stops on connect/disconnect/auth-error, the banner clears on device:registered, and the auth-error toast is non-sticky. - #119 app_version stuck at 1.0.0. Resolved at runtime from config.xml via the Tizen application API, with a fallback constant that build-wgt.sh stamps from config.xml. - #121 Remote commands. Added a device:command handler (refresh/launch/screen_on/ screen_off; honest no-op toasts for update/reboot/shutdown, which need B2B/MDM privileges a sideloaded app lacks). Removed the dead device:reload listener. - #120 Dashboard preview. Added device:screenshot-request + remote-start/remote-stop. Images capture; video/YouTube fall back to a status card (TV hardware video plane and cross-origin iframes can't be read into a canvas). - #122 Updates/boot. Documented the real paths (re-sideload or URL Launcher/MDM refresh; display-level kiosk/boot settings) since a sideloaded .wgt has no in-app OTA or config.xml autostart. Multi-zone layouts (Android parity) - New ZoneRenderer ports the Android ZoneManager: zones positioned by percent geometry with z_index/fit_mode/background, assignments grouped by zone_id (unassigned content goes to the first zone), each zone rotating independently with the same per-item schedule gating (#74/#75). app.js selects the renderer from payload.layout; single-zone playback is unchanged. Video walls (web-player parity; Android has none) - New WallController mirrors the web player: when payload.wall_config is present the stage is positioned (vw/vh) as this screen's slice of the wall. The leader plays normally and broadcasts wall:sync at 4Hz; followers hold the leader's item, align index, and lock their video to the leader's clock with a latency-compensated drift controller (hard-seek past 0.3s, gentle +/-3% playbackRate nudge past 0.05s), and request an immediate position on (re)connect via wall:sync-request. Per-tile rotation is not applied yet (matches the web player). Wall emits are gated on auth + connection so a pre-register tick can't trip device:auth-error. Not ported: video-wall per-tile rotation, plus the minor Android-only reporting events (device:playback-state, device:log) and the N/A offline-cache events (device:content-ack/content-delete). None affect on-screen playback. Verified: JS syntax + headless unit tests of zone grouping/geometry and wall leader/follower + drift logic. NOT yet validated on Tizen hardware - multi-screen video sync in particular needs a real wall to tune.
78 lines
2.7 KiB
CSS
78 lines
2.7 KiB
CSS
* { margin: 0; padding: 0; box-sizing: border-box; }
|
|
|
|
html, body {
|
|
width: 100%; height: 100%;
|
|
background: #000; color: #f1f5f9;
|
|
font-family: "Samsung One", "Tizen Sans", Arial, sans-serif;
|
|
overflow: hidden;
|
|
cursor: none;
|
|
}
|
|
|
|
.screen {
|
|
position: absolute; top: 0; left: 0;
|
|
width: 100%; height: 100%;
|
|
display: flex; align-items: center; justify-content: center;
|
|
}
|
|
.hidden { display: none !important; }
|
|
|
|
/* Setup / pairing card */
|
|
.card {
|
|
background: #111827;
|
|
border: 1px solid #1f2937;
|
|
border-radius: 18px;
|
|
padding: 48px 64px;
|
|
text-align: center;
|
|
max-width: 760px;
|
|
}
|
|
.card h1 { color: #3b82f6; font-size: 44px; margin-bottom: 6px; }
|
|
.sub { color: #94a3b8; font-size: 22px; margin-bottom: 36px; }
|
|
.card label { display: block; text-align: left; color: #94a3b8; font-size: 18px; margin-bottom: 8px; }
|
|
|
|
#serverUrl {
|
|
width: 100%; font-size: 26px; padding: 16px 20px;
|
|
border-radius: 10px; border: 2px solid #334155;
|
|
background: #0b1220; color: #f1f5f9; margin-bottom: 24px;
|
|
}
|
|
#serverUrl:focus { outline: none; border-color: #3b82f6; }
|
|
|
|
button {
|
|
font-size: 24px; font-weight: bold; color: #fff;
|
|
background: #3b82f6; border: none; border-radius: 10px;
|
|
padding: 16px 40px; cursor: pointer;
|
|
}
|
|
button:focus { outline: 3px solid #93c5fd; }
|
|
button.ghost { background: transparent; color: #64748b; font-size: 18px; margin-top: 24px; padding: 8px; }
|
|
|
|
.status { color: #64748b; font-size: 18px; margin-top: 20px; min-height: 24px; }
|
|
.status.error { color: #ef4444; }
|
|
|
|
/* Pairing code */
|
|
.code {
|
|
font-size: 96px; font-weight: bold; letter-spacing: 16px;
|
|
color: #22c55e; margin: 24px 0; font-family: monospace;
|
|
}
|
|
.hint { color: #94a3b8; font-size: 20px; line-height: 1.5; }
|
|
|
|
/* Playback stage */
|
|
.stage { background: #000; }
|
|
.stage img, .stage video, .stage iframe {
|
|
position: absolute; top: 0; left: 0;
|
|
width: 100%; height: 100%; border: 0;
|
|
}
|
|
.stage img.contain, .stage video.contain { object-fit: contain; }
|
|
.stage img.cover, .stage video.cover { object-fit: cover; }
|
|
.stage img.fill, .stage video.fill { object-fit: fill; }
|
|
|
|
/* Video wall mode: the stage is positioned (in vw/vh) as this screen's slice of the
|
|
wall's player rect; media stretches to fill (object-fit:fill) so a given source row
|
|
lands on the same physical line across every screen that shares a viewport height. */
|
|
.stage.wall-mode img, .stage.wall-mode video, .stage.wall-mode iframe { object-fit: fill; }
|
|
|
|
/* Toast */
|
|
.toast {
|
|
position: absolute; bottom: 24px; left: 50%; transform: translateX(-50%);
|
|
background: rgba(17,24,39,0.92); color: #f1f5f9;
|
|
padding: 12px 24px; border-radius: 10px; font-size: 18px;
|
|
border: 1px solid #334155;
|
|
}
|