@tomorrowos/sdk 0.1.8 → 0.1.9

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tomorrowos/sdk",
-  "version": "0.1.8",
+  "version": "0.1.9",
   "description": "TomorrowOS CMS server SDK — WebSocket transport, pairing, device commands, optional static CMS UI. Includes CLI (tomorrowos init / build) and starter templates.",
   "type": "module",
   "main": "./dist/index.js",

package/templates/cms-starter/package.json

@@ -1,6 +1,6 @@
 {
   "name": "my-cms",
-  "version": "0.1.8",
+  "version": "0.1.9",
   "description": "CMS server on @tomorrowos/sdk. Add your UI (React, static files, etc.) alongside this server.",
   "private": true,
   "type": "module",
@@ -10,7 +10,7 @@
     "build-player": "tomorrowos build --platform tizen"
   },
   "dependencies": {
-    "@tomorrowos/sdk": "^0.1.8"
+    "@tomorrowos/sdk": "^0.1.9"
   },
   "devDependencies": {
     "@types/node": "^20.0.0",

package/templates/cms-starter/public/index.html

@@ -23,6 +23,23 @@
           <input type="hidden" id="deviceId" />
         </section>
 
+        <section class="card">
+          <h2>CMS URL for screens</h2>
+          <p style="margin: 0 0 0.5rem; font-size: 0.8rem; color: #666">
+            HTTP(S) base URL your TV uses to download uploads (same host as <code>ws://</code> on the
+            device, not <code>localhost</code>).
+          </p>
+          <div class="row">
+            <input
+              id="cmsDeviceBaseUrl"
+              type="text"
+              style="flex: 1; min-width: 16rem"
+              placeholder="http://192.168.1.105:3000"
+            />
+            <button type="button" onclick="saveCmsDeviceBaseUrl()">Save</button>
+          </div>
+        </section>
+
         <section class="card">
           <h2>When this playlist plays</h2>
           <p style="margin: 0 0 0.75rem; font-size: 0.8rem; color: #666">

package/templates/cms-starter/public/methods.js

@@ -1,6 +1,7 @@
 const PANEL_DEVICE_ID_KEY = "tomorrowos.panel.deviceId";
 const PANEL_PLAYLIST_KEY = "tomorrowos.panel.playlistDraft";
 const PANEL_SCHEDULE_KEY = "tomorrowos.panel.scheduleDraft";
+const PANEL_MEDIA_BASE_KEY = "tomorrowos.panel.mediaBaseUrl";
 
 /** @type {{ id: string, url: string, name: string, type: string, durationMs: number }[]} */
 let playlistItems = [];
@@ -25,11 +26,65 @@ function showResult(data) {
   document.getElementById("result").textContent = JSON.stringify(data, null, 2);
 }
 
+function isLocalPanelHost(hostname) {
+  const h = String(hostname || "").toLowerCase();
+  return h === "localhost" || h === "127.0.0.1" || h === "[::1]";
+}
+
+function normalizeMediaBaseUrl(raw) {
+  let s = String(raw || "").trim();
+  if (!s) return "";
+  if (!/^https?:\/\//i.test(s)) {
+    s = `http://${s}`;
+  }
+  try {
+    const u = new URL(s);
+    return u.origin;
+  } catch {
+    return "";
+  }
+}
+
+function getMediaBaseOrigin() {
+  const fromInput = normalizeMediaBaseUrl(
+    document.getElementById("cmsDeviceBaseUrl")?.value ||
+      localStorage.getItem(PANEL_MEDIA_BASE_KEY) ||
+      ""
+  );
+  if (fromInput) return fromInput;
+
+  if (!isLocalPanelHost(window.location.hostname)) {
+    return window.location.origin;
+  }
+
+  return "";
+}
+
+function saveCmsDeviceBaseUrl() {
+  const normalized = normalizeMediaBaseUrl(
+    document.getElementById("cmsDeviceBaseUrl")?.value
+  );
+  if (!normalized) {
+    alert("Enter a valid URL, e.g. http://192.168.1.105:3000");
+    return;
+  }
+  document.getElementById("cmsDeviceBaseUrl").value = normalized;
+  localStorage.setItem(PANEL_MEDIA_BASE_KEY, normalized);
+  showResult({ status: "saved", mediaBaseUrl: normalized });
+}
+
 function absoluteMediaUrl(path) {
   const p = String(path || "").trim();
   if (!p) return "";
   if (/^https?:\/\//i.test(p)) return p;
-  return `${window.location.origin}${p.startsWith("/") ? p : `/${p}`}`;
+
+  const base = getMediaBaseOrigin();
+  if (!base) {
+    throw new Error(
+      "Set CMS URL for screens (use your PC LAN IP or Replit https URL, not localhost)."
+    );
+  }
+  return `${base}${p.startsWith("/") ? p : `/${p}`}`;
 }
 
 function inferMediaType(filename, mime) {
@@ -271,8 +326,28 @@ async function publish() {
     return;
   }
 
+  const mediaBase = getMediaBaseOrigin();
+  if (!mediaBase) {
+    alert(
+      "Set CMS URL for screens first (e.g. http://192.168.1.105:3000 — same machine as the TV ws:// address)."
+    );
+    return;
+  }
+  if (isLocalPanelHost(new URL(mediaBase).hostname)) {
+    const ok = confirm(
+      "Media URLs use localhost. TVs cannot download from localhost unless the player runs on this PC. Continue anyway?"
+    );
+    if (!ok) return;
+  }
+
   saveScheduleDraft();
-  const payload = buildPolicyPayload();
+  let payload;
+  try {
+    payload = buildPolicyPayload();
+  } catch (err) {
+    alert(err.message);
+    return;
+  }
 
   const res = await fetch(`/device/${deviceId}/content/set-policy`, {
     method: "POST",
@@ -330,6 +405,14 @@ document.addEventListener("DOMContentLoaded", () => {
   const saved = localStorage.getItem(PANEL_DEVICE_ID_KEY);
   if (saved) setPanelDeviceId(saved);
 
+  const savedMediaBase = localStorage.getItem(PANEL_MEDIA_BASE_KEY);
+  const cmsBaseInput = document.getElementById("cmsDeviceBaseUrl");
+  if (savedMediaBase && cmsBaseInput) {
+    cmsBaseInput.value = savedMediaBase;
+  } else if (cmsBaseInput && !isLocalPanelHost(window.location.hostname)) {
+    cmsBaseInput.value = window.location.origin;
+  }
+
   loadPlaylistDraft();
   loadScheduleDraft();