@zync/zync-screnplay-player 0.1.209 → 0.1.210

package/dist/screenplay/RemotionRenderer/RemotionRenderer.js

@@ -11,6 +11,7 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
 import { screenplaySchema } from "./main/screenplaySchema.js";
 import { LayoutFactory } from "./main/lib/layouts/LayoutFactory.js";
 import { toFrames, toPascalCase } from "./main/lib/Sequence.js";
+import { getCreatorCollabEffectProps } from "./main/lib/layouts/creatorCollabProps.js";
 import { transitionThemes } from "./config.js";
 import { normalizeDisabledTranscripts } from "./helpers/normalizeDisabledTranscripts.js";
 export var RemotionRenderer = /*#__PURE__*/function () {
@@ -90,12 +91,13 @@ export var RemotionRenderer = /*#__PURE__*/function () {
   }, {
     key: "toRemotionFragment",
     value: function toRemotionFragment(screenPlaySegment, layout) {
-      var _screenPlaySegment$da, _screenPlaySegment$da2, _layout$data, _screenPlaySegment$da3, _screenPlaySegment$da4, _layout$data2, _screenPlaySegment$da5, _screenPlaySegment$da6, _layout$data3, _screenPlaySegment$da7, _screenPlaySegment$da8, _layout$data4, _screenPlaySegment$da9, _screenPlaySegment$da10, _layout$data5, _screenPlaySegment$da11, _toFrames, _screenPlaySegment$da12, _screenPlaySegment$da13;
+      var _screenPlaySegment$da, _screenPlaySegment$da2, _layout$data, _screenPlaySegment$da3, _screenPlaySegment$da4, _layout$data2, _screenPlaySegment$da5, _screenPlaySegment$da6, _layout$data3, _screenPlaySegment$da7, _screenPlaySegment$da8, _layout$data4, _screenPlaySegment$da9, _screenPlaySegment$da10, _layout$data5, _screenPlaySegment$da11, _screenPlaySegment$da12, _ref, _screenPlaySegment$da13, _screenPlaySegment$da14, _screenPlaySegment$da15;
       var trimLeft = 0;
       if (layout) {
         trimLeft = layout.data.trimLeft || 0;
       }
       var component = toPascalCase(screenPlaySegment.type);
+      var creatorCollabProps = component === "Title" || component === "Nametag" ? getCreatorCollabEffectProps(screenPlaySegment.data, layout === null || layout === void 0 ? void 0 : layout.data, this.fps) : {};
       var inheritedProps = component === "HandoffNametag" ? {
         useSquareInLandscape: (_screenPlaySegment$da = (_screenPlaySegment$da2 = screenPlaySegment.data) === null || _screenPlaySegment$da2 === void 0 ? void 0 : _screenPlaySegment$da2.useSquareInLandscape) !== null && _screenPlaySegment$da !== void 0 ? _screenPlaySegment$da : layout === null || layout === void 0 ? void 0 : (_layout$data = layout.data) === null || _layout$data === void 0 ? void 0 : _layout$data.useSquareInLandscape,
         handoffNametagVariant: (_screenPlaySegment$da3 = (_screenPlaySegment$da4 = screenPlaySegment.data) === null || _screenPlaySegment$da4 === void 0 ? void 0 : _screenPlaySegment$da4.handoffNametagVariant) !== null && _screenPlaySegment$da3 !== void 0 ? _screenPlaySegment$da3 : layout === null || layout === void 0 ? void 0 : (_layout$data2 = layout.data) === null || _layout$data2 === void 0 ? void 0 : _layout$data2.handoffNametagVariant,
@@ -107,14 +109,14 @@ export var RemotionRenderer = /*#__PURE__*/function () {
       var from = this.fps * (screenPlaySegment.data.offset - trimLeft) || 0;
       var durationInFrames = toFrames(this.fps * screenPlaySegment.data.duration);
       var to = from + durationInFrames;
-      return _objectSpread(_objectSpread(_objectSpread({}, screenPlaySegment.data), inheritedProps), {}, {
+      return _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, screenPlaySegment.data), creatorCollabProps), inheritedProps), {}, {
         component: component,
-        videoUrl: (_screenPlaySegment$da11 = screenPlaySegment.data.sourceVideo) === null || _screenPlaySegment$da11 === void 0 ? void 0 : _screenPlaySegment$da11.videoUrl,
-        startVideoFrom: (_toFrames = toFrames(this.fps * ((_screenPlaySegment$da12 = screenPlaySegment.data.sourceVideo) === null || _screenPlaySegment$da12 === void 0 ? void 0 : _screenPlaySegment$da12.start), false, true)) !== null && _toFrames !== void 0 ? _toFrames : 0,
+        videoUrl: (_screenPlaySegment$da11 = (_screenPlaySegment$da12 = screenPlaySegment.data.sourceVideo) === null || _screenPlaySegment$da12 === void 0 ? void 0 : _screenPlaySegment$da12.videoUrl) !== null && _screenPlaySegment$da11 !== void 0 ? _screenPlaySegment$da11 : creatorCollabProps.videoUrl,
+        startVideoFrom: (_ref = typeof ((_screenPlaySegment$da13 = screenPlaySegment.data.sourceVideo) === null || _screenPlaySegment$da13 === void 0 ? void 0 : _screenPlaySegment$da13.start) === "number" ? toFrames(this.fps * screenPlaySegment.data.sourceVideo.start, false, true) : creatorCollabProps.startVideoFrom) !== null && _ref !== void 0 ? _ref : 0,
         durationInFrames: durationInFrames,
         from: from,
         to: to,
-        videoZoom: (_screenPlaySegment$da13 = screenPlaySegment.data.sourceVideo) === null || _screenPlaySegment$da13 === void 0 ? void 0 : _screenPlaySegment$da13.zoom,
+        videoZoom: (_screenPlaySegment$da14 = (_screenPlaySegment$da15 = screenPlaySegment.data.sourceVideo) === null || _screenPlaySegment$da15 === void 0 ? void 0 : _screenPlaySegment$da15.zoom) !== null && _screenPlaySegment$da14 !== void 0 ? _screenPlaySegment$da14 : creatorCollabProps.videoZoom,
         offset: toFrames(this.fps * (screenPlaySegment.data.offset - trimLeft)) || 0,
         theme: screenPlaySegment.theme,
         themeSettings: screenPlaySegment === null || screenPlaySegment === void 0 ? void 0 : screenPlaySegment.themeSettings
@@ -123,27 +125,27 @@ export var RemotionRenderer = /*#__PURE__*/function () {
   }, {
     key: "toRemotionAudioFragment",
     value: function toRemotionAudioFragment(screenPlaySegment) {
-      var _screenPlaySegment$da14, _toFrames2, _screenPlaySegment$da15, _screenPlaySegment$da16, _screenPlaySegment$da17, _screenPlaySegment$da18, _screenPlaySegment$da19, _screenPlaySegment$da20;
+      var _screenPlaySegment$da16, _toFrames, _screenPlaySegment$da17, _screenPlaySegment$da18, _screenPlaySegment$da19, _screenPlaySegment$da20, _screenPlaySegment$da21, _screenPlaySegment$da22;
       var from = this.fps * screenPlaySegment.data.offset || 0;
       var durationInFrames = toFrames(this.fps * screenPlaySegment.data.duration) || undefined;
       var to = from + durationInFrames;
       return _objectSpread(_objectSpread({}, screenPlaySegment.data), {}, {
         component: toPascalCase(screenPlaySegment.type),
-        src: (_screenPlaySegment$da14 = screenPlaySegment.data.sourceAudio) === null || _screenPlaySegment$da14 === void 0 ? void 0 : _screenPlaySegment$da14.url,
-        startAudioFrom: (_toFrames2 = toFrames(this.fps * ((_screenPlaySegment$da15 = screenPlaySegment.data.sourceAudio) === null || _screenPlaySegment$da15 === void 0 ? void 0 : _screenPlaySegment$da15.start), false, true)) !== null && _toFrames2 !== void 0 ? _toFrames2 : 0,
+        src: (_screenPlaySegment$da16 = screenPlaySegment.data.sourceAudio) === null || _screenPlaySegment$da16 === void 0 ? void 0 : _screenPlaySegment$da16.url,
+        startAudioFrom: (_toFrames = toFrames(this.fps * ((_screenPlaySegment$da17 = screenPlaySegment.data.sourceAudio) === null || _screenPlaySegment$da17 === void 0 ? void 0 : _screenPlaySegment$da17.start), false, true)) !== null && _toFrames !== void 0 ? _toFrames : 0,
         durationInFrames: durationInFrames,
         from: from,
         to: to,
         offset: this.fps * screenPlaySegment.data.offset || 0,
-        volume: (_screenPlaySegment$da16 = (_screenPlaySegment$da17 = screenPlaySegment.data) === null || _screenPlaySegment$da17 === void 0 ? void 0 : (_screenPlaySegment$da18 = _screenPlaySegment$da17.sourceAudio) === null || _screenPlaySegment$da18 === void 0 ? void 0 : _screenPlaySegment$da18.volume) !== null && _screenPlaySegment$da16 !== void 0 ? _screenPlaySegment$da16 : 1,
-        loop: ((_screenPlaySegment$da19 = screenPlaySegment.data) === null || _screenPlaySegment$da19 === void 0 ? void 0 : (_screenPlaySegment$da20 = _screenPlaySegment$da19.sourceAudio) === null || _screenPlaySegment$da20 === void 0 ? void 0 : _screenPlaySegment$da20.loop) || false
+        volume: (_screenPlaySegment$da18 = (_screenPlaySegment$da19 = screenPlaySegment.data) === null || _screenPlaySegment$da19 === void 0 ? void 0 : (_screenPlaySegment$da20 = _screenPlaySegment$da19.sourceAudio) === null || _screenPlaySegment$da20 === void 0 ? void 0 : _screenPlaySegment$da20.volume) !== null && _screenPlaySegment$da18 !== void 0 ? _screenPlaySegment$da18 : 1,
+        loop: ((_screenPlaySegment$da21 = screenPlaySegment.data) === null || _screenPlaySegment$da21 === void 0 ? void 0 : (_screenPlaySegment$da22 = _screenPlaySegment$da21.sourceAudio) === null || _screenPlaySegment$da22 === void 0 ? void 0 : _screenPlaySegment$da22.loop) || false
       });
     }
   }, {
     key: "toRemotionSegment",
     value: function toRemotionSegment(screenPlaySegment) {
       var _this2 = this,
-        _ref,
+        _ref2,
         _screenPlaySegment$tr;
       var layout = screenPlaySegment.layout,
         _screenPlaySegment$ef = screenPlaySegment.effects,
@@ -156,7 +158,7 @@ export var RemotionRenderer = /*#__PURE__*/function () {
           }
           return _this2.toRemotionFragment(effect, layout);
         }),
-        transitionAfter: (_ref = (_screenPlaySegment$tr = screenPlaySegment === null || screenPlaySegment === void 0 ? void 0 : screenPlaySegment.transitionAfter) !== null && _screenPlaySegment$tr !== void 0 ? _screenPlaySegment$tr : screenPlaySegment === null || screenPlaySegment === void 0 ? void 0 : screenPlaySegment.__transitionAfter) !== null && _ref !== void 0 ? _ref : true
+        transitionAfter: (_ref2 = (_screenPlaySegment$tr = screenPlaySegment === null || screenPlaySegment === void 0 ? void 0 : screenPlaySegment.transitionAfter) !== null && _screenPlaySegment$tr !== void 0 ? _screenPlaySegment$tr : screenPlaySegment === null || screenPlaySegment === void 0 ? void 0 : screenPlaySegment.__transitionAfter) !== null && _ref2 !== void 0 ? _ref2 : true
       };
     }
   }, {
@@ -168,10 +170,10 @@ export var RemotionRenderer = /*#__PURE__*/function () {
     key: "toRemotionCaptionSegment",
     value: function toRemotionCaptionSegment(screenPlaySegment, screenplayLayout) {
       var _screenplayLayout$dat,
-        _screenPlaySegment$da21,
+        _screenPlaySegment$da23,
         _this3 = this;
       var trimLeft = (screenplayLayout === null || screenplayLayout === void 0 ? void 0 : (_screenplayLayout$dat = screenplayLayout.data) === null || _screenplayLayout$dat === void 0 ? void 0 : _screenplayLayout$dat.trimLeft) || 0;
-      var segmentOffset = Number(screenPlaySegment === null || screenPlaySegment === void 0 ? void 0 : (_screenPlaySegment$da21 = screenPlaySegment.data) === null || _screenPlaySegment$da21 === void 0 ? void 0 : _screenPlaySegment$da21.offset);
+      var segmentOffset = Number(screenPlaySegment === null || screenPlaySegment === void 0 ? void 0 : (_screenPlaySegment$da23 = screenPlaySegment.data) === null || _screenPlaySegment$da23 === void 0 ? void 0 : _screenPlaySegment$da23.offset);
       var from = Number.isFinite(segmentOffset) ? this.fps * (segmentOffset + trimLeft) : 0;
       var transcripts = screenPlaySegment.data.transcript_text;
       if (!transcripts) {
@@ -263,8 +265,8 @@ export var RemotionRenderer = /*#__PURE__*/function () {
         throw new Error("Caption track not found");
       }
       var segments = screenPlayCaptionTrack.segments;
-      segments.forEach(function (segment, _ref2) {
-        _objectDestructuringEmpty(_ref2);
+      segments.forEach(function (segment, _ref3) {
+        _objectDestructuringEmpty(_ref3);
         _this6.captionsVideoTrack.push(_this6.toRemotionCaptionSegment(segment));
       });
     }

package/dist/screenplay/RemotionRenderer/components/effects/Nametag.js

@@ -1,9 +1,18 @@
 import React from "react";
-import { AbsoluteFill, Audio } from "remotion";
+import { AbsoluteFill, Audio, useVideoConfig } from "remotion";
 import { useThemedComponents } from "../../theme/hooks/useThemedComponents.js";
 export var Nametag = function Nametag(props) {
+  var _props$theme;
+  var _useVideoConfig = useVideoConfig(),
+    _useVideoConfig$props = _useVideoConfig.props.output,
+    _useVideoConfig$props2 = _useVideoConfig$props === void 0 ? {
+      theme: window.screenplayProps.output.theme
+    } : _useVideoConfig$props,
+    _useVideoConfig$props3 = _useVideoConfig$props2.theme,
+    outputTheme = _useVideoConfig$props3 === void 0 ? "default" : _useVideoConfig$props3;
+  var resolvedTheme = (_props$theme = props.theme) !== null && _props$theme !== void 0 ? _props$theme : outputTheme;
   var Nametag = useThemedComponents("Nametag", props.theme);
-  return /*#__PURE__*/React.createElement(React.Fragment, null, props.theme !== "none" && /*#__PURE__*/React.createElement(Audio, {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, resolvedTheme !== "none" && resolvedTheme !== "collabintro" && /*#__PURE__*/React.createElement(Audio, {
     src: "https://cdn.zync.ai/assets/static/blip.mp3"
   }), /*#__PURE__*/React.createElement(AbsoluteFill, null, /*#__PURE__*/React.createElement(Nametag, props)));
 };

package/dist/screenplay/RemotionRenderer/components/effects/Title.js

@@ -1,11 +1,20 @@
 import React from "react";
-import { Audio, Sequence } from "remotion";
+import { Audio, Sequence, useVideoConfig } from "remotion";
 import { useThemedComponents } from "../../theme/hooks/useThemedComponents.js";
 export var Title = function Title(props) {
+  var _props$theme;
+  var _useVideoConfig = useVideoConfig(),
+    _useVideoConfig$props = _useVideoConfig.props.output,
+    _useVideoConfig$props2 = _useVideoConfig$props === void 0 ? {
+      theme: window.screenplayProps.output.theme
+    } : _useVideoConfig$props,
+    _useVideoConfig$props3 = _useVideoConfig$props2.theme,
+    outputTheme = _useVideoConfig$props3 === void 0 ? "default" : _useVideoConfig$props3;
+  var resolvedTheme = (_props$theme = props.theme) !== null && _props$theme !== void 0 ? _props$theme : outputTheme;
   var Title = useThemedComponents("Title", props.theme);
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Sequence, {
     from: 0
-  }, props.theme !== "none" && /*#__PURE__*/React.createElement(Audio, {
+  }, resolvedTheme !== "none" && resolvedTheme !== "collabintro" && /*#__PURE__*/React.createElement(Audio, {
     src: "https://cdn.zync.ai/assets/static/ding.mp3",
     volume: 0.25
   })), /*#__PURE__*/React.createElement(Title, props));