/* PlaylistPlayer — fullscreen single-zone renderer for the Tizen player. * Mirrors the Android player's content rules: * image -> shown for duration_sec (min 3s), then advance * video -> plays to end then advance; single item loops * video/youtube-> iframe embed; single item loops, multi advances after duration * remote_url -> same as image/video but src = remote_url * widget -> iframe of {server}/api/widgets/{id}/render for duration_sec * Content file URL: {server}/api/content/{content_id}/file (public) */ function PlaylistPlayer(stageEl, getBase) { this.stage = stageEl; this.getBase = getBase; this.items = []; this.index = 0; this.timer = null; this.sig = ''; this.DEFAULT_DURATION = 10; this.MIN_DURATION = 3; } PlaylistPlayer.prototype.load = function (assignments) { var items = (assignments || []).filter(function (a) { return a && (a.content_id || a.widget_id || a.remote_url); }); // Stable order items.sort(function (a, b) { return (a.sort_order || 0) - (b.sort_order || 0); }); var sig = JSON.stringify(items.map(function (a) { return [a.content_id, a.widget_id, a.remote_url, a.duration_sec, a.mime_type]; })); if (sig === this.sig && this.items.length) return; // unchanged, keep playing this.sig = sig; this.items = items; this.index = 0; this.playCurrent(); }; PlaylistPlayer.prototype.stop = function () { if (this.timer) { clearTimeout(this.timer); this.timer = null; } this.clearStage(); }; PlaylistPlayer.prototype.clearStage = function () { // Pause any video before removing so audio doesn't linger. var v = this.stage.querySelector('video'); if (v) { try { v.pause(); v.removeAttribute('src'); v.load(); } catch (e) {} } this.stage.innerHTML = ''; }; PlaylistPlayer.prototype.idle = function () { this.clearStage(); this.stage.innerHTML = '

ScreenTinker

' + '

No content assigned yet

'; }; PlaylistPlayer.prototype.durationMs = function (item) { var d = item.duration_sec || this.DEFAULT_DURATION; if (d < this.MIN_DURATION) d = this.MIN_DURATION; return d * 1000; }; PlaylistPlayer.prototype.contentUrl = function (item) { if (item.remote_url) return item.remote_url; if (item.content_id) return this.getBase() + '/api/content/' + item.content_id + '/file'; return null; }; PlaylistPlayer.prototype.advance = function () { if (!this.items.length) return; this.index = (this.index + 1) % this.items.length; this.playCurrent(); }; PlaylistPlayer.prototype.schedule = function (ms) { var self = this; if (this.timer) clearTimeout(this.timer); this.timer = setTimeout(function () { self.advance(); }, ms); }; PlaylistPlayer.prototype.playCurrent = function () { if (this.timer) { clearTimeout(this.timer); this.timer = null; } if (!this.items.length) { this.idle(); return; } var item = this.items[this.index]; var single = this.items.length === 1; var mime = item.mime_type || ''; this.clearStage(); try { if (mime === 'video/youtube') return this.renderYouTube(item, single); if (item.widget_id && !item.content_id) return this.renderWidget(item, single); if (mime.indexOf('video/') === 0) return this.renderVideo(item, single); if (mime.indexOf('image/') === 0) return this.renderImage(item, single); // Fallback: a remote_url with unknown mime -> try iframe if (item.remote_url) return this.renderFrame(item.remote_url, single ? 0 : this.durationMs(item)); } catch (e) { this.skipSoon(); return; } // Unknown item -> skip this.skipSoon(); }; // Give a broken item ~2s then move on so the loop never wedges. PlaylistPlayer.prototype.skipSoon = function () { if (this.items.length > 1) this.schedule(2000); }; PlaylistPlayer.prototype.fit = function (el, item) { // assignment may carry a fit hint; default cover (matches Android default) var f = (item.fit || item.scale || 'cover').toLowerCase(); if (f === 'contain' || f === 'fit') el.className = 'contain'; else if (f === 'fill' || f === 'stretch') el.className = 'fill'; else el.className = 'cover'; }; PlaylistPlayer.prototype.renderImage = function (item, single) { var self = this; var img = document.createElement('img'); this.fit(img, item); img.onerror = function () { self.skipSoon(); }; img.src = this.contentUrl(item); this.stage.appendChild(img); if (!single) this.schedule(this.durationMs(item)); }; PlaylistPlayer.prototype.renderVideo = function (item, single) { var self = this; var v = document.createElement('video'); this.fit(v, item); v.autoplay = true; v.muted = true; v.setAttribute('playsinline', ''); v.loop = single; // single item loops; multi advances on end v.onended = function () { if (!single) self.advance(); }; v.onerror = function () { self.skipSoon(); }; v.src = this.contentUrl(item); this.stage.appendChild(v); var p = v.play(); if (p && p.catch) p.catch(function () {}); // Safety net: if 'ended' never fires (rare), advance after the known // content duration (or the assignment duration) + a buffer. if (!single) { var secs = item.content_duration || item.duration_sec || this.DEFAULT_DURATION; this.schedule((secs + 5) * 1000); } }; PlaylistPlayer.prototype.renderYouTube = function (item, single) { var id = this.youtubeId(item.remote_url); if (!id) { this.skipSoon(); return; } var src = 'https://www.youtube.com/embed/' + id + '?autoplay=1&mute=1&controls=0&rel=0&modestbranding=1&loop=1&playlist=' + id + '&playsinline=1'; this.renderFrame(src, single ? 0 : this.durationMs(item), 'autoplay; encrypted-media'); }; PlaylistPlayer.prototype.renderWidget = function (item, single) { var src = this.getBase() + '/api/widgets/' + item.widget_id + '/render'; this.renderFrame(src, single ? 0 : this.durationMs(item)); }; PlaylistPlayer.prototype.renderFrame = function (src, advanceMs, allow) { var f = document.createElement('iframe'); f.setAttribute('frameborder', '0'); f.setAttribute('allowfullscreen', ''); if (allow) f.setAttribute('allow', allow); f.src = src; this.stage.appendChild(f); if (advanceMs > 0) this.schedule(advanceMs); }; PlaylistPlayer.prototype.youtubeId = function (url) { if (!url) return null; var m = url.match(/(?:youtube\.com\/(?:watch\?v=|embed\/)|youtu\.be\/)([A-Za-z0-9_-]{11})/); if (m) return m[1]; if (/^[A-Za-z0-9_-]{11}$/.test(url)) return url; // bare id return null; };