From dc1fe11604066097ea4c38ed74d1ef1ab7a6dd2a Mon Sep 17 00:00:00 2001 From: "soroush.asadi" Date: Thu, 25 Jun 2026 12:46:53 +0330 Subject: [PATCH] feat(remotion): player default demo = IG promo (bare /player/ URL renders it) Co-Authored-By: Claude Opus 4.8 --- services/remotion/player/main.tsx | 15 ++++++++++++++- 1 file changed, 14 insertions(+), 1 deletion(-) diff --git a/services/remotion/player/main.tsx b/services/remotion/player/main.tsx index accc5e1..0a05a27 100644 --- a/services/remotion/player/main.tsx +++ b/services/remotion/player/main.tsx @@ -25,6 +25,19 @@ interface PlayerInput { watermark?: boolean; } +// Asset-free demo shown when opened with no scene data (so the bare /player/ URL +// renders something real to test the in-browser engine). +const DEFAULT_DEMO = { + scenes: [ + { blockId: "IGIntro", durationSec: 3, props: { badge: "اینستاگرام", headline: "صفحهٔ ما را دنبال کنید", subtitle: "هر روز یک طرح تازه" } }, + { blockId: "IGProfile", durationSec: 5, props: { headline: "صفحهٔ ما را دنبال کنید", handle: "flat.studio", name: "استودیو فلت", category: "هنر و طراحی", bio1: "هر روز یک طرح تازه ✨", bio2: "آموزش، قالب و الهام برای طراحان", bio3: "سفارش و دانلود 👇", link: "flat.studio/shop", posts: "۳۲۰", followers: "۲۴٫۸ هزار", following: "۱۸۰", hi1: "جدید", hi2: "قالب‌ها", hi3: "آموزش", hi4: "نمونه‌کار", followLabel: "دنبال کردن", messageLabel: "پیام" } }, + { blockId: "IGFeed", durationSec: 4, props: { caption: "محتوای ما را ببینید" } }, + { blockId: "IGStats", durationSec: 3, props: { bigValue: "۲۴۸۰۰", bigLabel: "دنبال‌کننده", stat2Value: "۱۲۰۰۰۰۰", stat2Label: "پسند", stat3Value: "۳۲۰", stat3Label: "پست", proofLine: "به جمع هزاران دنبال‌کنندهٔ ما بپیوندید" } }, + { blockId: "IGFollowCTA", durationSec: 3, props: { headline: "همین حالا دنبال کنید", handle: "@flat.studio", buttonLabel: "دنبال کردن", followedLabel: "دنبال شد", footer: "لینک در بایو 👆" } }, + ], + accentColor: "#dc2743", secondaryColor: "#7c5cff", backgroundColor: "#f7f4fa", textColor: "#15151a", music: "", sfx: false, finish: false, +} as unknown as typeof flexStoryDefaults; + function decodeHash(): PlayerInput | null { try { const h = window.location.hash.replace(/^#/, ""); @@ -78,7 +91,7 @@ const App: React.FC = () => { return () => window.removeEventListener("message", onMsg); }, []); - const props = input?.props ?? flexStoryDefaults; + const props = input?.props ?? DEFAULT_DEMO; const aspect = (input?.aspect ?? "9:16") as keyof typeof ASPECTS; const [w, h] = ASPECTS[aspect] ?? ASPECTS["9:16"]; const watermark = input?.watermark ?? true;