@mevdragon/vidfarm-devcli 0.2.11 → 0.2.13

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (199) hide show
  1. package/.env.example +37 -1
  2. package/README.md +27 -183
  3. package/SKILL.director.md +293 -0
  4. package/SKILL.platform.md +312 -0
  5. package/auto-create-hyperframe-templates/AUTO_CREATE_HYPERFRAME_TEMPLATES.md +275 -0
  6. package/auto-create-hyperframe-templates/extractor-system-prompt.md +128 -0
  7. package/auto-create-hyperframe-templates/input-manifest.schema.json +56 -0
  8. package/auto-create-hyperframe-templates/lambda-memory-estimator.md +118 -0
  9. package/auto-create-hyperframe-templates/production-graph.schema.json +314 -0
  10. package/auto-create-hyperframe-templates/runbook.md +198 -0
  11. package/auto-create-hyperframe-templates/scripts/create-hyperframe-template.mjs +368 -0
  12. package/auto-create-hyperframe-templates/template-plan.schema.json +311 -0
  13. package/auto-create-hyperframe-templates/template-planner-prompt.md +144 -0
  14. package/auto-create-templates/AUTO_CREATE_TEMPLATES.md +124 -0
  15. package/auto-create-templates/extractor-system-prompt.md +8 -2
  16. package/auto-create-templates/template-plan.schema.json +73 -2
  17. package/auto-create-templates/template-planner-prompt.md +63 -1
  18. package/dist/src/account-pages-legacy.js +361 -89
  19. package/dist/src/account-pages-legacy.js.map +1 -0
  20. package/dist/src/account-pages.js +13 -3
  21. package/dist/src/account-pages.js.map +1 -0
  22. package/dist/src/app.js +7060 -946
  23. package/dist/src/app.js.map +1 -0
  24. package/dist/src/cli.js +111 -29
  25. package/dist/src/cli.js.map +1 -0
  26. package/dist/src/composition-runtime.js +581 -0
  27. package/dist/src/composition-runtime.js.map +1 -0
  28. package/dist/src/config.js +69 -11
  29. package/dist/src/config.js.map +1 -0
  30. package/dist/src/context.js +280 -21
  31. package/dist/src/context.js.map +1 -0
  32. package/dist/src/dev-app-legacy.js +18 -17
  33. package/dist/src/dev-app-legacy.js.map +1 -0
  34. package/dist/src/dev-app.js +1 -0
  35. package/dist/src/dev-app.js.map +1 -0
  36. package/dist/src/domain.js +2 -1
  37. package/dist/src/domain.js.map +1 -0
  38. package/dist/src/editor-chat-history.js +10 -0
  39. package/dist/src/editor-chat-history.js.map +1 -0
  40. package/dist/src/editor-chat.js +133 -24
  41. package/dist/src/editor-chat.js.map +1 -0
  42. package/dist/src/frontend/flockposter-cache-store.js +10 -2
  43. package/dist/src/frontend/flockposter-cache-store.js.map +1 -0
  44. package/dist/src/frontend/homepage-client.js +6 -3
  45. package/dist/src/frontend/homepage-client.js.map +1 -0
  46. package/dist/src/frontend/homepage-shared.js +1 -0
  47. package/dist/src/frontend/homepage-shared.js.map +1 -0
  48. package/dist/src/frontend/homepage-store.js +1 -0
  49. package/dist/src/frontend/homepage-store.js.map +1 -0
  50. package/dist/src/frontend/homepage-view.js +131 -18
  51. package/dist/src/frontend/homepage-view.js.map +1 -0
  52. package/dist/src/frontend/page-runtime-client.js +5 -2
  53. package/dist/src/frontend/page-runtime-client.js.map +1 -0
  54. package/dist/src/frontend/page-runtime-store.js +1 -0
  55. package/dist/src/frontend/page-runtime-store.js.map +1 -0
  56. package/dist/src/frontend/sentry.js +42 -0
  57. package/dist/src/frontend/sentry.js.map +1 -0
  58. package/dist/src/frontend/template-editor-chat.js +1719 -213
  59. package/dist/src/frontend/template-editor-chat.js.map +1 -0
  60. package/dist/src/help-page.js +333 -0
  61. package/dist/src/help-page.js.map +1 -0
  62. package/dist/src/homepage.js +169 -47
  63. package/dist/src/homepage.js.map +1 -0
  64. package/dist/src/hyperframes/composition.js +180 -0
  65. package/dist/src/hyperframes/composition.js.map +1 -0
  66. package/dist/src/index.js +1 -0
  67. package/dist/src/index.js.map +1 -0
  68. package/dist/src/instrument.js +30 -0
  69. package/dist/src/instrument.js.map +1 -0
  70. package/dist/src/lib/crypto.js +1 -0
  71. package/dist/src/lib/crypto.js.map +1 -0
  72. package/dist/src/lib/dev-log.js +54 -0
  73. package/dist/src/lib/dev-log.js.map +1 -0
  74. package/dist/src/lib/display-name.js +11 -0
  75. package/dist/src/lib/display-name.js.map +1 -0
  76. package/dist/src/lib/ids.js +21 -1
  77. package/dist/src/lib/ids.js.map +1 -0
  78. package/dist/src/lib/images.js +1 -0
  79. package/dist/src/lib/images.js.map +1 -0
  80. package/dist/src/lib/json.js +1 -0
  81. package/dist/src/lib/json.js.map +1 -0
  82. package/dist/src/lib/template-dna.js +1 -0
  83. package/dist/src/lib/template-dna.js.map +1 -0
  84. package/dist/src/lib/template-paths.js +1 -0
  85. package/dist/src/lib/template-paths.js.map +1 -0
  86. package/dist/src/lib/template-style-options.js +40 -2
  87. package/dist/src/lib/template-style-options.js.map +1 -0
  88. package/dist/src/lib/time.js +1 -0
  89. package/dist/src/lib/time.js.map +1 -0
  90. package/dist/src/lib/video-quality-harness.js +60 -0
  91. package/dist/src/lib/video-quality-harness.js.map +1 -0
  92. package/dist/src/page-runtime.js +1 -0
  93. package/dist/src/page-runtime.js.map +1 -0
  94. package/dist/src/page-shell.js +1501 -49
  95. package/dist/src/page-shell.js.map +1 -0
  96. package/dist/src/primitive-context.js +144 -8
  97. package/dist/src/primitive-context.js.map +1 -0
  98. package/dist/src/primitive-registry.js +1919 -78
  99. package/dist/src/primitive-registry.js.map +1 -0
  100. package/dist/src/primitive-sdk.js +1 -0
  101. package/dist/src/primitive-sdk.js.map +1 -0
  102. package/dist/src/primitives/remotion/html-image.js +3 -1
  103. package/dist/src/primitives/remotion/html-image.js.map +1 -0
  104. package/dist/src/primitives/remotion/media-slideshow.js +60 -0
  105. package/dist/src/primitives/remotion/media-slideshow.js.map +1 -0
  106. package/dist/src/react-page-shell.js +1 -0
  107. package/dist/src/react-page-shell.js.map +1 -0
  108. package/dist/src/ready-post-schedule-component.js +1 -0
  109. package/dist/src/ready-post-schedule-component.js.map +1 -0
  110. package/dist/src/registry.js +237 -24
  111. package/dist/src/registry.js.map +1 -0
  112. package/dist/src/runtime.js +3 -0
  113. package/dist/src/runtime.js.map +1 -0
  114. package/dist/src/services/api-call-history.js +4 -0
  115. package/dist/src/services/api-call-history.js.map +1 -0
  116. package/dist/src/services/auth.js +40 -50
  117. package/dist/src/services/auth.js.map +1 -0
  118. package/dist/src/services/billing.js +20 -44
  119. package/dist/src/services/billing.js.map +1 -0
  120. package/dist/src/services/chat-threads.js +10 -6
  121. package/dist/src/services/chat-threads.js.map +1 -0
  122. package/dist/src/services/fork-access.js +94 -0
  123. package/dist/src/services/fork-access.js.map +1 -0
  124. package/dist/src/services/ghostcut.js +132 -0
  125. package/dist/src/services/ghostcut.js.map +1 -0
  126. package/dist/src/services/hyperframes.js +1014 -0
  127. package/dist/src/services/hyperframes.js.map +1 -0
  128. package/dist/src/services/job-capacity.js +14 -0
  129. package/dist/src/services/job-capacity.js.map +1 -0
  130. package/dist/src/services/job-logs.js +4 -0
  131. package/dist/src/services/job-logs.js.map +1 -0
  132. package/dist/src/services/jobs.js +99 -91
  133. package/dist/src/services/jobs.js.map +1 -0
  134. package/dist/src/services/media-processing.js +743 -0
  135. package/dist/src/services/media-processing.js.map +1 -0
  136. package/dist/src/services/primitive-media-lambda.js +280 -0
  137. package/dist/src/services/primitive-media-lambda.js.map +1 -0
  138. package/dist/src/services/providers.js +1560 -178
  139. package/dist/src/services/providers.js.map +1 -0
  140. package/dist/src/services/rate-limits.js +3 -2
  141. package/dist/src/services/rate-limits.js.map +1 -0
  142. package/dist/src/services/remotion.js +495 -92
  143. package/dist/src/services/remotion.js.map +1 -0
  144. package/dist/src/services/serverless-auth.js +374 -0
  145. package/dist/src/services/serverless-auth.js.map +1 -0
  146. package/dist/src/services/serverless-jobs.js +1074 -0
  147. package/dist/src/services/serverless-jobs.js.map +1 -0
  148. package/dist/src/services/serverless-provider-keys.js +401 -0
  149. package/dist/src/services/serverless-provider-keys.js.map +1 -0
  150. package/dist/src/services/serverless-records.js +1086 -0
  151. package/dist/src/services/serverless-records.js.map +1 -0
  152. package/dist/src/services/serverless-template-configs.js +67 -0
  153. package/dist/src/services/serverless-template-configs.js.map +1 -0
  154. package/dist/src/services/storage.js +170 -35
  155. package/dist/src/services/storage.js.map +1 -0
  156. package/dist/src/services/template-certification.js +295 -3
  157. package/dist/src/services/template-certification.js.map +1 -0
  158. package/dist/src/services/template-loader.js +45 -1
  159. package/dist/src/services/template-loader.js.map +1 -0
  160. package/dist/src/services/template-runtime-bundles.js +217 -0
  161. package/dist/src/services/template-runtime-bundles.js.map +1 -0
  162. package/dist/src/services/template-sources.js +452 -87
  163. package/dist/src/services/template-sources.js.map +1 -0
  164. package/dist/src/services/video-normalization.js +2 -0
  165. package/dist/src/services/video-normalization.js.map +1 -0
  166. package/dist/src/services/webhooks.js +7 -6
  167. package/dist/src/services/webhooks.js.map +1 -0
  168. package/dist/src/template-editor-pages.js +5637 -1322
  169. package/dist/src/template-editor-pages.js.map +1 -0
  170. package/dist/src/template-editor-shell.js +1376 -170
  171. package/dist/src/template-editor-shell.js.map +1 -0
  172. package/dist/src/template-sdk.js +1 -0
  173. package/dist/src/template-sdk.js.map +1 -0
  174. package/dist/src/worker.js +11 -226
  175. package/dist/src/worker.js.map +1 -0
  176. package/package.json +47 -12
  177. package/public/assets/homepage-client-app.js +34 -8
  178. package/public/assets/page-runtime-client-app.js +44 -18
  179. package/readme.secret.md +89 -0
  180. package/templates/vidfarm_template_0000/README.md +106 -0
  181. package/templates/vidfarm_template_0000/SKILL.md +266 -0
  182. package/templates/vidfarm_template_0000/assets/Abel-Regular.ttf +0 -0
  183. package/templates/vidfarm_template_0000/assets/DMSerifDisplay-Regular.ttf +0 -0
  184. package/templates/vidfarm_template_0000/assets/Montserrat[wght].ttf +0 -0
  185. package/templates/vidfarm_template_0000/assets/SourceCodePro[wght].ttf +0 -0
  186. package/templates/vidfarm_template_0000/assets/TikTokSans-SemiBold.ttf +0 -0
  187. package/templates/vidfarm_template_0000/assets/Yesteryear-Regular.ttf +0 -0
  188. package/templates/vidfarm_template_0000/composition.json +11 -0
  189. package/templates/vidfarm_template_0000/src/lib/images.js +221 -0
  190. package/templates/vidfarm_template_0000/src/remotion/Root.js +33 -0
  191. package/templates/vidfarm_template_0000/src/remotion/index.js +3 -0
  192. package/templates/vidfarm_template_0000/src/sdk.js +3 -0
  193. package/templates/vidfarm_template_0000/src/style-options.js +200 -0
  194. package/templates/vidfarm_template_0000/src/template-dna.js +9 -0
  195. package/templates/vidfarm_template_0000/src/template.js +1566 -0
  196. package/templates/vidfarm_template_0000/template.config.json +21 -0
  197. package/GETTING_STARTED.developers.md +0 -87
  198. package/SKILL.developer.md +0 -1177
  199. package/dist/src/db.js +0 -2007
@@ -0,0 +1,581 @@
1
+ // Runtime script injected into composition iframes so the studio editor can
2
+ // see a `__player` adapter and drive playback. The script lives in src/ so the
3
+ // API lambda can inject it into both draft and fork composition HTML before
4
+ // serving it to the editor iframe.
5
+ //
6
+ // IMPORTANT: this body is executed inside the iframe, NOT in the Node API
7
+ // runtime. Keep it browser-only (no node imports, no top-level await).
8
+ export const COMPOSITION_RUNTIME_SCRIPT_BODY = `
9
+ (() => {
10
+ const root = document.querySelector("[data-composition-id]");
11
+ const duration = Number(root?.getAttribute("data-duration") || 0);
12
+ let time = 0;
13
+ let playing = false;
14
+ let playbackRate = 1;
15
+ let previewMuted = false;
16
+ let raf = 0;
17
+ let last = 0;
18
+ const backingVideo = document.querySelector("[data-vf-playback-source]");
19
+ const initialMuted = new WeakMap();
20
+ if (backingVideo instanceof HTMLMediaElement) {
21
+ initialMuted.set(backingVideo, backingVideo.muted || backingVideo.hasAttribute("muted"));
22
+ }
23
+ let clips = [];
24
+ let activeVideoProxyKey = null;
25
+ let activeVideoProxyNode = null;
26
+ let hasVideoProxies = false;
27
+ const activeMedia = new WeakSet();
28
+ const mediaStateKeys = new WeakMap();
29
+ const visibilityStates = new WeakMap();
30
+
31
+ function clampTime(nextTime) {
32
+ const safe = Number(nextTime);
33
+ if (!Number.isFinite(safe)) return 0;
34
+ return Math.max(0, Math.min(duration, safe));
35
+ }
36
+
37
+ function readNumberAttr(node, names, fallback = 0) {
38
+ for (const name of names) {
39
+ const raw = node.getAttribute(name);
40
+ if (raw !== null) {
41
+ const value = Number(raw);
42
+ return Number.isFinite(value) ? value : fallback;
43
+ }
44
+ }
45
+ return fallback;
46
+ }
47
+
48
+ function readTiming(clip) {
49
+ const start = readNumberAttr(clip, ["data-start"], 0);
50
+ const clipDuration = readNumberAttr(clip, ["data-duration"], 0);
51
+ const mediaStart = readNumberAttr(clip, ["data-playback-start", "data-media-start"], 0);
52
+ return { start, duration: clipDuration, end: start + clipDuration, mediaStart };
53
+ }
54
+
55
+ function refreshClips() {
56
+ clips = Array.from(document.querySelectorAll("[data-start]")).filter((node) => node !== root);
57
+ for (const clip of clips) {
58
+ if (clip instanceof HTMLMediaElement && !initialMuted.has(clip)) {
59
+ initialMuted.set(clip, clip.muted || clip.hasAttribute("muted"));
60
+ }
61
+ if (clip instanceof HTMLMediaElement) {
62
+ clip.preload = "auto";
63
+ if (clip.readyState === 0) {
64
+ try { clip.load(); } catch {}
65
+ }
66
+ }
67
+ }
68
+ if (backingVideo instanceof HTMLMediaElement) {
69
+ backingVideo.preload = "auto";
70
+ if (backingVideo.readyState === 0) {
71
+ try { backingVideo.load(); } catch {}
72
+ }
73
+ }
74
+ activeVideoProxyKey = null;
75
+ activeVideoProxyNode = null;
76
+ hasVideoProxies = clips.some((clip) => clip instanceof Element && clip.getAttribute("data-vf-timeline-proxy") === "video");
77
+ apply(time, { forceSeek: true });
78
+ }
79
+
80
+ function applyMediaState(clip) {
81
+ const volume = Number(clip.getAttribute("data-volume") || 1);
82
+ const nextMuted = previewMuted || initialMuted.get(clip) === true;
83
+ const stateKey = playbackRate + "|" + volume + "|" + nextMuted;
84
+ if (mediaStateKeys.get(clip) === stateKey) return;
85
+ mediaStateKeys.set(clip, stateKey);
86
+ if (Number.isFinite(volume)) clip.volume = Math.max(0, Math.min(1, volume));
87
+ clip.muted = nextMuted;
88
+ try { clip.playbackRate = playbackRate; } catch {}
89
+ try { clip.defaultPlaybackRate = playbackRate; } catch {}
90
+ try {
91
+ if ("preservesPitch" in clip) clip.preservesPitch = true;
92
+ if ("mozPreservesPitch" in clip) clip.mozPreservesPitch = true;
93
+ if ("webkitPreservesPitch" in clip) clip.webkitPreservesPitch = true;
94
+ } catch {}
95
+ }
96
+
97
+ function setVisibility(node, active) {
98
+ const next = active ? "visible" : "hidden";
99
+ if (visibilityStates.get(node) === next) return;
100
+ visibilityStates.set(node, next);
101
+ node.style.visibility = next;
102
+ }
103
+
104
+ function setPlaybackRate(nextRate) {
105
+ const next = Number(nextRate);
106
+ playbackRate = Number.isFinite(next) && next > 0 ? Math.max(0.05, Math.min(8, next)) : 1;
107
+ for (const clip of clips) {
108
+ if (clip instanceof HTMLMediaElement) applyMediaState(clip);
109
+ }
110
+ if (backingVideo instanceof HTMLMediaElement) applyMediaState(backingVideo);
111
+ }
112
+
113
+ function setMuted(nextMuted) {
114
+ previewMuted = Boolean(nextMuted);
115
+ for (const clip of clips) {
116
+ if (clip instanceof HTMLMediaElement) applyMediaState(clip);
117
+ }
118
+ if (backingVideo instanceof HTMLMediaElement) applyMediaState(backingVideo);
119
+ }
120
+
121
+ function clipKey(clip) {
122
+ return clip.getAttribute("data-hf-id") || clip.id || clip.getAttribute("data-label") || "";
123
+ }
124
+
125
+ function ensurePlaying(media) {
126
+ if (!playing) {
127
+ if (!media.paused) media.pause();
128
+ activeMedia.delete(media);
129
+ return;
130
+ }
131
+ if (!activeMedia.has(media) || media.paused) {
132
+ activeMedia.add(media);
133
+ void media.play().catch(() => {});
134
+ }
135
+ }
136
+
137
+ function pauseInactiveMedia(media) {
138
+ activeMedia.delete(media);
139
+ if (!media.paused) media.pause();
140
+ }
141
+
142
+ function seekMedia(media, target, forceSeek, driftLimit) {
143
+ if (!Number.isFinite(target)) return;
144
+ if (forceSeek || Math.abs(media.currentTime - target) > driftLimit) {
145
+ try { media.currentTime = Math.max(0, target); } catch {}
146
+ }
147
+ }
148
+
149
+ function apply(nextTime, options = {}) {
150
+ const forceSeek = Boolean(options.forceSeek);
151
+ const fromClock = Boolean(options.fromClock);
152
+ time = clampTime(nextTime);
153
+ let activeVideoProxy = null;
154
+ for (const clip of clips) {
155
+ const timing = readTiming(clip);
156
+ const active = time >= timing.start && time < timing.end;
157
+ if (clip instanceof HTMLElement && !(clip instanceof HTMLAudioElement)) {
158
+ if (clip.getAttribute("data-vf-timeline-proxy") === "video") {
159
+ if (active) activeVideoProxy = clip;
160
+ } else {
161
+ setVisibility(clip, active);
162
+ }
163
+ }
164
+ if (clip instanceof HTMLMediaElement) {
165
+ applyMediaState(clip);
166
+ if (active) {
167
+ const target = Math.max(0, timing.mediaStart + time - timing.start);
168
+ const enteringClip = !activeMedia.has(clip);
169
+ seekMedia(clip, target, forceSeek || enteringClip, playing ? 0.75 : 0.08);
170
+ if (playing) {
171
+ ensurePlaying(clip);
172
+ } else {
173
+ pauseInactiveMedia(clip);
174
+ }
175
+ } else {
176
+ pauseInactiveMedia(clip);
177
+ }
178
+ }
179
+ }
180
+ if (backingVideo instanceof HTMLVideoElement) {
181
+ applyMediaState(backingVideo);
182
+ const shouldShowBackingVideo = !hasVideoProxies || Boolean(activeVideoProxy);
183
+ backingVideo.style.visibility = shouldShowBackingVideo ? "visible" : "hidden";
184
+ if (activeVideoProxy) {
185
+ const nextProxyKey = clipKey(activeVideoProxy);
186
+ const proxyChanged = nextProxyKey !== activeVideoProxyKey;
187
+ activeVideoProxyKey = nextProxyKey;
188
+ activeVideoProxyNode = activeVideoProxy;
189
+ const timing = readTiming(activeVideoProxy);
190
+ const target = Math.max(0, timing.mediaStart + time - timing.start);
191
+ const driftLimit = playing ? (fromClock ? 0.75 : 2.0) : 0.08;
192
+ const drifting = !backingVideo.seeking && Math.abs(backingVideo.currentTime - target) > driftLimit;
193
+ if (forceSeek || proxyChanged || !playing || drifting) {
194
+ seekMedia(backingVideo, target, true, 0.08);
195
+ }
196
+ } else {
197
+ activeVideoProxyKey = null;
198
+ activeVideoProxyNode = null;
199
+ if (!hasVideoProxies && !fromClock) seekMedia(backingVideo, time, forceSeek, playing ? 1.25 : 0.08);
200
+ }
201
+ if (playing && shouldShowBackingVideo) {
202
+ ensurePlaying(backingVideo);
203
+ } else {
204
+ pauseInactiveMedia(backingVideo);
205
+ }
206
+ }
207
+ }
208
+
209
+ function tick(now) {
210
+ if (!playing) return;
211
+ if (!last) last = now;
212
+ const delta = ((now - last) / 1000) * playbackRate;
213
+ const next = time + delta;
214
+ last = now;
215
+ apply(next >= duration ? duration : next, { fromClock: true });
216
+ if (time >= duration) {
217
+ playing = false;
218
+ for (const clip of clips) {
219
+ if (clip instanceof HTMLMediaElement) pauseInactiveMedia(clip);
220
+ }
221
+ if (backingVideo instanceof HTMLMediaElement) pauseInactiveMedia(backingVideo);
222
+ return;
223
+ }
224
+ raf = requestAnimationFrame(tick);
225
+ }
226
+
227
+ window.__player = {
228
+ play() {
229
+ if (playing) return;
230
+ if (time >= duration) time = 0;
231
+ playing = true;
232
+ last = 0;
233
+ apply(time, { forceSeek: true });
234
+ cancelAnimationFrame(raf);
235
+ raf = requestAnimationFrame(tick);
236
+ },
237
+ pause() {
238
+ playing = false;
239
+ cancelAnimationFrame(raf);
240
+ for (const clip of clips) {
241
+ if (clip instanceof HTMLMediaElement) pauseInactiveMedia(clip);
242
+ }
243
+ if (backingVideo instanceof HTMLMediaElement) pauseInactiveMedia(backingVideo);
244
+ },
245
+ seek(nextTime, options = {}) {
246
+ const shouldKeepPlaying = playing || options.keepPlaying === true;
247
+ playing = shouldKeepPlaying;
248
+ if (!shouldKeepPlaying) cancelAnimationFrame(raf);
249
+ apply(nextTime, { forceSeek: true });
250
+ if (shouldKeepPlaying) {
251
+ last = 0;
252
+ cancelAnimationFrame(raf);
253
+ raf = requestAnimationFrame(tick);
254
+ }
255
+ },
256
+ getTime() {
257
+ return time;
258
+ },
259
+ getDuration() {
260
+ return duration;
261
+ },
262
+ isPlaying() {
263
+ return playing;
264
+ },
265
+ setPlaybackRate,
266
+ getPlaybackRate() {
267
+ return playbackRate;
268
+ },
269
+ setMuted,
270
+ refreshClips
271
+ };
272
+
273
+ refreshClips();
274
+ if (backingVideo instanceof HTMLMediaElement) {
275
+ backingVideo.addEventListener("loadedmetadata", () => {
276
+ if (!playing) apply(time, { forceSeek: true });
277
+ });
278
+ }
279
+
280
+ window.addEventListener("message", (event) => {
281
+ const data = event.data || {};
282
+ if (data.type !== "control" && data.source !== "hf-parent") return;
283
+ if (data.action === "play") {
284
+ window.__player.play();
285
+ }
286
+ if (data.action === "pause" || data.action === "stop-media") {
287
+ window.__player.pause();
288
+ }
289
+ if (data.action === "seek") {
290
+ const nextTime = Number.isFinite(Number(data.time))
291
+ ? Number(data.time)
292
+ : Number.isFinite(Number(data.frame))
293
+ ? Number(data.frame) / 30
294
+ : Number.isFinite(Number(data.payload?.time))
295
+ ? Number(data.payload.time)
296
+ : time;
297
+ window.__player.seek(nextTime);
298
+ }
299
+ if (data.action === "set-playback-rate") {
300
+ setPlaybackRate(data.playbackRate ?? data.payload?.playbackRate);
301
+ }
302
+ if (data.action === "set-muted") {
303
+ setMuted(data.muted ?? data.payload?.muted);
304
+ }
305
+ });
306
+
307
+ function selectTargetFromEvent(event) {
308
+ const handle = event.target instanceof Element
309
+ ? event.target.closest("[data-vf-frame-handle]")
310
+ : null;
311
+ const handleTargetId = handle?.getAttribute("data-vf-target-id") || null;
312
+ if (handleTargetId) {
313
+ return document.querySelector("[data-hf-id='" + CSS.escape(handleTargetId) + "'], #" + CSS.escape(handleTargetId));
314
+ }
315
+ return event.target instanceof Element
316
+ ? event.target.closest("[data-start]")
317
+ : null;
318
+ }
319
+
320
+ function postSelectedLayer(event) {
321
+ const target = selectTargetFromEvent(event);
322
+ const rawId = target?.getAttribute("data-hf-id") || target?.id || null;
323
+ const id = rawId === "source-video" ? null : rawId;
324
+ window.parent?.postMessage({
325
+ source: "vidfarm-composition",
326
+ action: "select-layer",
327
+ id
328
+ }, "*");
329
+ }
330
+
331
+ function postPreviewContextMenu(event) {
332
+ event.preventDefault();
333
+ const root = document.querySelector("[data-composition-id]");
334
+ const rect = root instanceof HTMLElement ? root.getBoundingClientRect() : null;
335
+ const target = selectTargetFromEvent(event);
336
+ const rawId = target?.getAttribute("data-hf-id") || target?.id || null;
337
+ const id = rawId === "source-video" ? null : rawId;
338
+ const x = rect ? ((event.clientX - rect.left) / Math.max(1, rect.width)) * 100 : 12;
339
+ const y = rect ? ((event.clientY - rect.top) / Math.max(1, rect.height)) * 100 : 70;
340
+ window.parent?.postMessage({
341
+ source: "vidfarm-composition",
342
+ action: "preview-context-menu",
343
+ id,
344
+ clientX: event.clientX,
345
+ clientY: event.clientY,
346
+ time,
347
+ frame: {
348
+ x: Math.max(0, Math.min(95, x)),
349
+ y: Math.max(0, Math.min(95, y)),
350
+ width: 42,
351
+ height: 12
352
+ }
353
+ }, "*");
354
+ }
355
+
356
+ function frameFromNode(node) {
357
+ return {
358
+ x: Number.parseFloat(node.style.left || "0") || 0,
359
+ y: Number.parseFloat(node.style.top || "0") || 0,
360
+ width: Number.parseFloat(node.style.width || "100") || 100,
361
+ height: Number.parseFloat(node.style.height || "100") || 100,
362
+ fontSize: Number.parseFloat(node.style.fontSize || "18") || 18
363
+ };
364
+ }
365
+
366
+ function isVisualFrameTarget(node) {
367
+ if (!(node instanceof HTMLElement) || node instanceof HTMLAudioElement) return false;
368
+ const id = node.getAttribute("data-hf-id") || node.id || "";
369
+ return id !== "source-video";
370
+ }
371
+
372
+ function isTextFrameTarget(node) {
373
+ return node instanceof HTMLElement &&
374
+ !(node instanceof HTMLAudioElement) &&
375
+ !(node instanceof HTMLVideoElement) &&
376
+ !(node instanceof HTMLImageElement);
377
+ }
378
+
379
+ function syncRuntimeFrameControls(node) {
380
+ if (!isVisualFrameTarget(node)) return;
381
+ const root = document.querySelector("[data-composition-id]");
382
+ if (!(root instanceof HTMLElement)) return;
383
+ const targetId = node.getAttribute("data-hf-id") || node.id || "";
384
+ if (!targetId) return;
385
+ let ring = document.querySelector("[data-vf-selection-ring='true']");
386
+ if (!(ring instanceof HTMLElement)) {
387
+ ring = document.createElement("div");
388
+ ring.setAttribute("data-vf-selection-ring", "true");
389
+ root.append(ring);
390
+ }
391
+ ring.style.display = "block";
392
+ ring.style.position = "absolute";
393
+ ring.style.left = node.style.left || "0%";
394
+ ring.style.top = node.style.top || "0%";
395
+ ring.style.width = node.style.width || "100%";
396
+ ring.style.height = node.style.height || "100%";
397
+ ring.style.borderRadius = node.style.borderRadius || "0";
398
+ ring.style.zIndex = "9999";
399
+ ring.style.pointerEvents = "auto";
400
+ ring.style.cursor = "grab";
401
+ ring.style.border = "1px dashed #F2CD46";
402
+ ring.style.boxShadow = "0 0 0 2px #118df2";
403
+ ring.setAttribute("data-vf-frame-handle", "move");
404
+ ring.setAttribute("data-vf-target-id", targetId);
405
+ for (const handle of Array.from(ring.querySelectorAll("[data-vf-frame-handle]"))) {
406
+ if (handle !== ring) handle.remove();
407
+ }
408
+ for (const [mode, cssText] of [
409
+ ["top-left", "left:-7px;top:-7px;cursor:nwse-resize;"],
410
+ ["top", "top:-7px;left:50%;transform:translateX(-50%);cursor:ns-resize;"],
411
+ ["top-right", "right:-7px;top:-7px;cursor:nesw-resize;"],
412
+ ["right", "right:-7px;top:50%;transform:translateY(-50%);cursor:ew-resize;"],
413
+ ["bottom-right", "right:-7px;bottom:-7px;cursor:nwse-resize;"],
414
+ ["bottom", "bottom:-7px;left:50%;transform:translateX(-50%);cursor:ns-resize;"],
415
+ ["bottom-left", "left:-7px;bottom:-7px;cursor:nesw-resize;"],
416
+ ["left", "left:-7px;top:50%;transform:translateY(-50%);cursor:ew-resize;"]
417
+ ]) {
418
+ const handle = document.createElement("span");
419
+ handle.setAttribute("data-vf-frame-handle", mode);
420
+ handle.setAttribute("data-vf-target-id", targetId);
421
+ handle.style.cssText = [
422
+ "position:absolute",
423
+ "display:block",
424
+ "width:14px",
425
+ "height:14px",
426
+ "box-sizing:border-box",
427
+ "border-radius:999px",
428
+ "border:2px solid #0b0d0a",
429
+ "background:#F2CD46",
430
+ "box-shadow:0 0 0 2px rgba(242,205,70,0.32),0 1px 4px rgba(0,0,0,0.38)",
431
+ "pointer-events:auto",
432
+ "touch-action:none",
433
+ cssText
434
+ ].join(";");
435
+ ring.append(handle);
436
+ }
437
+ }
438
+
439
+ function applyFrameToNode(node, frame) {
440
+ node.style.left = frame.x + "%";
441
+ node.style.top = frame.y + "%";
442
+ node.style.width = frame.width + "%";
443
+ node.style.height = frame.height + "%";
444
+ if (Number.isFinite(frame.fontSize)) {
445
+ node.style.fontSize = frame.fontSize + "px";
446
+ }
447
+ syncRuntimeFrameControls(node);
448
+ }
449
+
450
+ function postFrameDraft(node, phase) {
451
+ const id = node.getAttribute("data-hf-id") || node.id || null;
452
+ if (!id) return;
453
+ window.parent?.postMessage({
454
+ source: "vidfarm-composition",
455
+ action: "visual-frame-draft",
456
+ phase,
457
+ id,
458
+ frame: frameFromNode(node)
459
+ }, "*");
460
+ }
461
+
462
+ let visualFrameDrag = null;
463
+
464
+ function beginVisualFrameDrag(event) {
465
+ if (event.button !== 0) return;
466
+ const handle = event.target instanceof Element
467
+ ? event.target.closest("[data-vf-frame-handle]")
468
+ : null;
469
+ const handleTargetId = handle?.getAttribute("data-vf-target-id") || null;
470
+ const target = handleTargetId
471
+ ? document.querySelector("[data-hf-id='" + CSS.escape(handleTargetId) + "'], #" + CSS.escape(handleTargetId))
472
+ : event.target instanceof Element
473
+ ? event.target.closest("[data-start]")
474
+ : null;
475
+ if (!isVisualFrameTarget(target)) return;
476
+ const root = document.querySelector("[data-composition-id]");
477
+ if (!(root instanceof HTMLElement)) return;
478
+ const rootRect = root.getBoundingClientRect();
479
+ event.preventDefault();
480
+ event.stopPropagation();
481
+ postSelectedLayer(event);
482
+ visualFrameDrag = {
483
+ node: target,
484
+ mode: handle?.getAttribute("data-vf-frame-handle") || "move",
485
+ startX: event.clientX,
486
+ startY: event.clientY,
487
+ rootWidth: Math.max(1, rootRect.width),
488
+ rootHeight: Math.max(1, rootRect.height),
489
+ frame: frameFromNode(target),
490
+ moved: false
491
+ };
492
+ syncRuntimeFrameControls(target);
493
+ target.style.cursor = "grabbing";
494
+ postFrameDraft(target, "start");
495
+ }
496
+
497
+ function updateVisualFrameDrag(event) {
498
+ if (!visualFrameDrag) return;
499
+ const drag = visualFrameDrag;
500
+ const dx = ((event.clientX - drag.startX) / drag.rootWidth) * 100;
501
+ const dy = ((event.clientY - drag.startY) / drag.rootHeight) * 100;
502
+ if (!drag.moved && Math.hypot(event.clientX - drag.startX, event.clientY - drag.startY) < 2) return;
503
+ drag.moved = true;
504
+ event.preventDefault();
505
+ const next = { ...drag.frame };
506
+ if (drag.mode === "move") {
507
+ next.x = Math.max(0, Math.min(100 - drag.frame.width, drag.frame.x + dx));
508
+ next.y = Math.max(0, Math.min(100 - drag.frame.height, drag.frame.y + dy));
509
+ }
510
+ if (drag.mode === "left" || drag.mode === "top-left" || drag.mode === "bottom-left") {
511
+ const nextX = Math.max(0, Math.min(drag.frame.x + drag.frame.width - 1, drag.frame.x + dx));
512
+ next.x = nextX;
513
+ next.width = Math.max(1, Math.min(100 - nextX, drag.frame.width + (drag.frame.x - nextX)));
514
+ }
515
+ if (drag.mode === "right" || drag.mode === "top-right" || drag.mode === "bottom-right") {
516
+ next.width = Math.max(1, Math.min(100 - drag.frame.x, drag.frame.width + dx));
517
+ }
518
+ if (drag.mode === "top" || drag.mode === "top-left" || drag.mode === "top-right") {
519
+ const nextY = Math.max(0, Math.min(drag.frame.y + drag.frame.height - 1, drag.frame.y + dy));
520
+ next.y = nextY;
521
+ next.height = Math.max(1, Math.min(100 - nextY, drag.frame.height + (drag.frame.y - nextY)));
522
+ }
523
+ if (drag.mode === "bottom" || drag.mode === "bottom-left" || drag.mode === "bottom-right") {
524
+ next.height = Math.max(1, Math.min(100 - drag.frame.y, drag.frame.height + dy));
525
+ }
526
+ if (
527
+ isTextFrameTarget(drag.node) &&
528
+ ["top-left", "top-right", "bottom-left", "bottom-right"].includes(drag.mode)
529
+ ) {
530
+ const widthScale = next.width / Math.max(1, drag.frame.width);
531
+ const heightScale = next.height / Math.max(1, drag.frame.height);
532
+ const scale = Math.sqrt(Math.max(0.05, widthScale * heightScale));
533
+ next.fontSize = Math.max(8, Math.min(180, (drag.frame.fontSize || 18) * scale));
534
+ }
535
+ applyFrameToNode(drag.node, next);
536
+ postFrameDraft(drag.node, "move");
537
+ }
538
+
539
+ function endVisualFrameDrag() {
540
+ if (!visualFrameDrag) return;
541
+ visualFrameDrag.node.style.cursor = "";
542
+ postFrameDraft(visualFrameDrag.node, visualFrameDrag.moved ? "end" : "tap");
543
+ visualFrameDrag = null;
544
+ }
545
+
546
+ function hoverVisualFrameTarget(event) {
547
+ const handle = event.target instanceof Element
548
+ ? event.target.closest("[data-vf-frame-handle]")
549
+ : null;
550
+ const handleTargetId = handle?.getAttribute("data-vf-target-id") || null;
551
+ const target = handleTargetId
552
+ ? document.querySelector("[data-hf-id='" + CSS.escape(handleTargetId) + "'], #" + CSS.escape(handleTargetId))
553
+ : event.target instanceof Element
554
+ ? event.target.closest("[data-start]")
555
+ : null;
556
+ if (!isVisualFrameTarget(target)) return;
557
+ target.style.cursor = "grab";
558
+ syncRuntimeFrameControls(target);
559
+ }
560
+
561
+ document.addEventListener("pointerover", hoverVisualFrameTarget, true);
562
+ document.addEventListener("pointerdown", beginVisualFrameDrag, true);
563
+ document.addEventListener("pointermove", updateVisualFrameDrag, { passive: false });
564
+ document.addEventListener("pointerup", endVisualFrameDrag);
565
+ document.addEventListener("pointercancel", endVisualFrameDrag);
566
+ document.addEventListener("pointerdown", postSelectedLayer);
567
+ document.addEventListener("click", postSelectedLayer);
568
+ document.addEventListener("contextmenu", postPreviewContextMenu, true);
569
+
570
+ try {
571
+ console.info("[hf-runtime] ready", {
572
+ compositionId: root?.getAttribute("data-composition-id"),
573
+ duration,
574
+ clipCount: document.querySelectorAll("[data-start]").length
575
+ });
576
+ } catch {}
577
+
578
+ apply(0);
579
+ })();
580
+ `;
581
+ //# sourceMappingURL=composition-runtime.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"composition-runtime.js","sourceRoot":"","sources":["../../src/composition-runtime.ts"],"names":[],"mappings":"AAAA,4EAA4E;AAC5E,+EAA+E;AAC/E,4EAA4E;AAC5E,mCAAmC;AACnC,EAAE;AACF,0EAA0E;AAC1E,uEAAuE;AACvE,MAAM,CAAC,MAAM,+BAA+B,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4jB9C,CAAC"}