@zync/zync-screnplay-player 0.1.206 → 0.1.207

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 (5) hide show
  1. package/dist/bundle.js +1 -1
  2. package/dist/screenplay/RemotionRenderer/RemotionRenderer.js +14 -13
  3. package/dist/screenplay/RemotionRenderer/components/layouts/Handoff.js +4 -2
  4. package/dist/screenplay/RemotionRenderer/theme/themes/default/HandoffNametag.js +9 -2
  5. package/package.json +1 -1
package/dist/screenplay/RemotionRenderer/RemotionRenderer.js CHANGED
@@ -90,7 +90,7 @@ export var RemotionRenderer = /*#__PURE__*/function () {
90
90
  }, {
91
91
  key: "toRemotionFragment",
92
92
  value: function toRemotionFragment(screenPlaySegment, layout) {
93
- 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, _toFrames, _screenPlaySegment$da10, _screenPlaySegment$da11;
93
+ 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;
94
94
  var trimLeft = 0;
95
95
  if (layout) {
96
96
  trimLeft = layout.data.trimLeft || 0;
@@ -99,21 +99,22 @@ export var RemotionRenderer = /*#__PURE__*/function () {
99
99
  var inheritedProps = component === "HandoffNametag" ? {
100
100
  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,
101
101
  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,
102
- useSquareInLandscapeFirstVideo: (_screenPlaySegment$da5 = (_screenPlaySegment$da6 = screenPlaySegment.data) === null || _screenPlaySegment$da6 === void 0 ? void 0 : _screenPlaySegment$da6.useSquareInLandscapeFirstVideo) !== null && _screenPlaySegment$da5 !== void 0 ? _screenPlaySegment$da5 : layout === null || layout === void 0 ? void 0 : (_layout$data3 = layout.data) === null || _layout$data3 === void 0 ? void 0 : _layout$data3.useSquareInLandscapeFirstVideo
102
+ useSquareInLandscapeFirstVideo: (_screenPlaySegment$da5 = (_screenPlaySegment$da6 = screenPlaySegment.data) === null || _screenPlaySegment$da6 === void 0 ? void 0 : _screenPlaySegment$da6.useSquareInLandscapeFirstVideo) !== null && _screenPlaySegment$da5 !== void 0 ? _screenPlaySegment$da5 : layout === null || layout === void 0 ? void 0 : (_layout$data3 = layout.data) === null || _layout$data3 === void 0 ? void 0 : _layout$data3.useSquareInLandscapeFirstVideo,
103
+ useSquareInLandscapeSecondVideo: (_screenPlaySegment$da7 = (_screenPlaySegment$da8 = screenPlaySegment.data) === null || _screenPlaySegment$da8 === void 0 ? void 0 : _screenPlaySegment$da8.useSquareInLandscapeSecondVideo) !== null && _screenPlaySegment$da7 !== void 0 ? _screenPlaySegment$da7 : layout === null || layout === void 0 ? void 0 : (_layout$data4 = layout.data) === null || _layout$data4 === void 0 ? void 0 : _layout$data4.useSquareInLandscapeSecondVideo
103
104
  } : {
104
- useSquareInLandscape: (_screenPlaySegment$da7 = (_screenPlaySegment$da8 = screenPlaySegment.data) === null || _screenPlaySegment$da8 === void 0 ? void 0 : _screenPlaySegment$da8.useSquareInLandscape) !== null && _screenPlaySegment$da7 !== void 0 ? _screenPlaySegment$da7 : layout === null || layout === void 0 ? void 0 : (_layout$data4 = layout.data) === null || _layout$data4 === void 0 ? void 0 : _layout$data4.useSquareInLandscape
105
+ useSquareInLandscape: (_screenPlaySegment$da9 = (_screenPlaySegment$da10 = screenPlaySegment.data) === null || _screenPlaySegment$da10 === void 0 ? void 0 : _screenPlaySegment$da10.useSquareInLandscape) !== null && _screenPlaySegment$da9 !== void 0 ? _screenPlaySegment$da9 : layout === null || layout === void 0 ? void 0 : (_layout$data5 = layout.data) === null || _layout$data5 === void 0 ? void 0 : _layout$data5.useSquareInLandscape
105
106
  };
106
107
  var from = this.fps * (screenPlaySegment.data.offset - trimLeft) || 0;
107
108
  var durationInFrames = toFrames(this.fps * screenPlaySegment.data.duration);
108
109
  var to = from + durationInFrames;
109
110
  return _objectSpread(_objectSpread(_objectSpread({}, screenPlaySegment.data), inheritedProps), {}, {
110
111
  component: component,
111
- videoUrl: (_screenPlaySegment$da9 = screenPlaySegment.data.sourceVideo) === null || _screenPlaySegment$da9 === void 0 ? void 0 : _screenPlaySegment$da9.videoUrl,
112
- startVideoFrom: (_toFrames = toFrames(this.fps * ((_screenPlaySegment$da10 = screenPlaySegment.data.sourceVideo) === null || _screenPlaySegment$da10 === void 0 ? void 0 : _screenPlaySegment$da10.start), false, true)) !== null && _toFrames !== void 0 ? _toFrames : 0,
112
+ videoUrl: (_screenPlaySegment$da11 = screenPlaySegment.data.sourceVideo) === null || _screenPlaySegment$da11 === void 0 ? void 0 : _screenPlaySegment$da11.videoUrl,
113
+ 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,
113
114
  durationInFrames: durationInFrames,
114
115
  from: from,
115
116
  to: to,
116
- videoZoom: (_screenPlaySegment$da11 = screenPlaySegment.data.sourceVideo) === null || _screenPlaySegment$da11 === void 0 ? void 0 : _screenPlaySegment$da11.zoom,
117
+ videoZoom: (_screenPlaySegment$da13 = screenPlaySegment.data.sourceVideo) === null || _screenPlaySegment$da13 === void 0 ? void 0 : _screenPlaySegment$da13.zoom,
117
118
  offset: toFrames(this.fps * (screenPlaySegment.data.offset - trimLeft)) || 0,
118
119
  theme: screenPlaySegment.theme,
119
120
  themeSettings: screenPlaySegment === null || screenPlaySegment === void 0 ? void 0 : screenPlaySegment.themeSettings
@@ -122,20 +123,20 @@ export var RemotionRenderer = /*#__PURE__*/function () {
122
123
  }, {
123
124
  key: "toRemotionAudioFragment",
124
125
  value: function toRemotionAudioFragment(screenPlaySegment) {
125
- var _screenPlaySegment$da12, _toFrames2, _screenPlaySegment$da13, _screenPlaySegment$da14, _screenPlaySegment$da15, _screenPlaySegment$da16, _screenPlaySegment$da17, _screenPlaySegment$da18;
126
+ var _screenPlaySegment$da14, _toFrames2, _screenPlaySegment$da15, _screenPlaySegment$da16, _screenPlaySegment$da17, _screenPlaySegment$da18, _screenPlaySegment$da19, _screenPlaySegment$da20;
126
127
  var from = this.fps * screenPlaySegment.data.offset || 0;
127
128
  var durationInFrames = toFrames(this.fps * screenPlaySegment.data.duration) || undefined;
128
129
  var to = from + durationInFrames;
129
130
  return _objectSpread(_objectSpread({}, screenPlaySegment.data), {}, {
130
131
  component: toPascalCase(screenPlaySegment.type),
131
- src: (_screenPlaySegment$da12 = screenPlaySegment.data.sourceAudio) === null || _screenPlaySegment$da12 === void 0 ? void 0 : _screenPlaySegment$da12.url,
132
- startAudioFrom: (_toFrames2 = toFrames(this.fps * ((_screenPlaySegment$da13 = screenPlaySegment.data.sourceAudio) === null || _screenPlaySegment$da13 === void 0 ? void 0 : _screenPlaySegment$da13.start), false, true)) !== null && _toFrames2 !== void 0 ? _toFrames2 : 0,
132
+ src: (_screenPlaySegment$da14 = screenPlaySegment.data.sourceAudio) === null || _screenPlaySegment$da14 === void 0 ? void 0 : _screenPlaySegment$da14.url,
133
+ 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,
133
134
  durationInFrames: durationInFrames,
134
135
  from: from,
135
136
  to: to,
136
137
  offset: this.fps * screenPlaySegment.data.offset || 0,
137
- volume: (_screenPlaySegment$da14 = (_screenPlaySegment$da15 = screenPlaySegment.data) === null || _screenPlaySegment$da15 === void 0 ? void 0 : (_screenPlaySegment$da16 = _screenPlaySegment$da15.sourceAudio) === null || _screenPlaySegment$da16 === void 0 ? void 0 : _screenPlaySegment$da16.volume) !== null && _screenPlaySegment$da14 !== void 0 ? _screenPlaySegment$da14 : 1,
138
- loop: ((_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.loop) || false
138
+ 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,
139
+ 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
139
140
  });
140
141
  }
141
142
  }, {
@@ -167,10 +168,10 @@ export var RemotionRenderer = /*#__PURE__*/function () {
167
168
  key: "toRemotionCaptionSegment",
168
169
  value: function toRemotionCaptionSegment(screenPlaySegment, screenplayLayout) {
169
170
  var _screenplayLayout$dat,
170
- _screenPlaySegment$da19,
171
+ _screenPlaySegment$da21,
171
172
  _this3 = this;
172
173
  var trimLeft = (screenplayLayout === null || screenplayLayout === void 0 ? void 0 : (_screenplayLayout$dat = screenplayLayout.data) === null || _screenplayLayout$dat === void 0 ? void 0 : _screenplayLayout$dat.trimLeft) || 0;
173
- var segmentOffset = Number(screenPlaySegment === null || screenPlaySegment === void 0 ? void 0 : (_screenPlaySegment$da19 = screenPlaySegment.data) === null || _screenPlaySegment$da19 === void 0 ? void 0 : _screenPlaySegment$da19.offset);
174
+ var segmentOffset = Number(screenPlaySegment === null || screenPlaySegment === void 0 ? void 0 : (_screenPlaySegment$da21 = screenPlaySegment.data) === null || _screenPlaySegment$da21 === void 0 ? void 0 : _screenPlaySegment$da21.offset);
174
175
  var from = Number.isFinite(segmentOffset) ? this.fps * (segmentOffset + trimLeft) : 0;
175
176
  var transcripts = screenPlaySegment.data.transcript_text;
176
177
  if (!transcripts) {
package/dist/screenplay/RemotionRenderer/components/layouts/Handoff.js CHANGED
@@ -86,12 +86,14 @@ export var Handoff = function Handoff(_ref) {
86
86
  var secondRenderVideoWidth = shouldUseSquareInLandscapeSecondVideo ? Math.min(secondVideoWidth, squareSize) : secondVideoWidth;
87
87
  var secondRenderVideoHeight = shouldUseSquareInLandscapeSecondVideo ? Math.min(secondVideoHeight, squareSize) : secondVideoHeight;
88
88
  var secondVideoCenteredOffsetX = shouldUseSquareInLandscapeSecondVideo ? Math.max(0, (width - TOTAL_X_PADDING - secondRenderVideoWidth) / 2) : 0;
89
- var secondVideoTranslateX = useTimeInterpolate(inputRangeInSeconds, [secondVideoCenteredOffsetX, 0, 0, 0], DEFAULT_TIME_INTERPOLATE_OPTIONS);
89
+ var secondVideoTranslateX = useTimeInterpolate(inputRangeInSeconds, [secondVideoCenteredOffsetX, 0, 0, secondVideoCenteredOffsetX], DEFAULT_TIME_INTERPOLATE_OPTIONS);
90
+ var shouldUseBlackBackgroundInLandscape = shouldUseSquareInLandscapeFirstVideo || shouldUseSquareInLandscapeSecondVideo;
91
+ var handoffBackgroundColor = shouldUseBlackBackgroundInLandscape ? "#000000" : primaryColor;
90
92
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(AbsoluteFill, {
91
93
  style: {
92
94
  width: width,
93
95
  height: height,
94
- backgroundColor: primaryColor
96
+ backgroundColor: handoffBackgroundColor
95
97
  }
96
98
  }, /*#__PURE__*/React.createElement(AbsoluteFill, {
97
99
  style: {
package/dist/screenplay/RemotionRenderer/theme/themes/default/HandoffNametag.js CHANGED
@@ -165,7 +165,9 @@ export var HandoffNametag = function HandoffNametag(_ref4) {
165
165
  _ref4$handoffNametagV = _ref4.handoffNametagVariant,
166
166
  handoffNametagVariant = _ref4$handoffNametagV === void 0 ? HANDOFF_NAMETAG_VARIANTS.BOXED : _ref4$handoffNametagV,
167
167
  _ref4$useSquareInLand = _ref4.useSquareInLandscapeFirstVideo,
168
- useSquareInLandscapeFirstVideo = _ref4$useSquareInLand === void 0 ? false : _ref4$useSquareInLand;
168
+ useSquareInLandscapeFirstVideo = _ref4$useSquareInLand === void 0 ? false : _ref4$useSquareInLand,
169
+ _ref4$useSquareInLand2 = _ref4.useSquareInLandscapeSecondVideo,
170
+ useSquareInLandscapeSecondVideo = _ref4$useSquareInLand2 === void 0 ? false : _ref4$useSquareInLand2;
169
171
  var videoConfig = useVideoConfig();
170
172
  var fps = videoConfig.fps,
171
173
  width = videoConfig.width,
@@ -271,6 +273,10 @@ export var HandoffNametag = function HandoffNametag(_ref4) {
271
273
  var holdCenteredFrames = 3.2 * fps;
272
274
  var slideLeftFrames = 0.5 * fps;
273
275
  var containerLeftPosition = shouldShiftFirstLeftInLandscape ? interpolate(frame, [0, holdCenteredFrames, holdCenteredFrames + slideLeftFrames], [initialStartLeft, initialStartLeft, baseContainerLeft], DEFAULT_TIME_INTERPOLATE_OPTIONS) : baseContainerLeft;
276
+ var shouldShiftSecondLeftInLandscape = Boolean(useSquareInLandscapeSecondVideo) && outputOrientation === "landscape" && (alignment === null || alignment === void 0 ? void 0 : alignment.startsWith("second"));
277
+ var secondSlideStartFrames = 2.5 * fps;
278
+ var secondSlideDistance = -380;
279
+ var secondContainerTranslateX = shouldShiftSecondLeftInLandscape ? interpolate(frame, [0, secondSlideStartFrames, secondSlideStartFrames + slideLeftFrames], [0, 0, secondSlideDistance], DEFAULT_TIME_INTERPOLATE_OPTIONS) : 0;
274
280
  var _getTypewriterState = getTypewriterState({
275
281
  frame: frame,
276
282
  fps: fps,
@@ -314,7 +320,8 @@ export var HandoffNametag = function HandoffNametag(_ref4) {
314
320
  display: "flex",
315
321
  flexDirection: "column",
316
322
  alignItems: contentAlignItems,
317
- maxWidth: textContainerWidth
323
+ maxWidth: textContainerWidth,
324
+ transform: "translateX(".concat(secondContainerTranslateX, "px)")
318
325
  }
319
326
  }, isHighlightVariant ? /*#__PURE__*/React.createElement("div", {
320
327
  style: {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zync/zync-screnplay-player",
3
- "version": "0.1.206",
3
+ "version": "0.1.207",
4
4
  "files": [
5
5
  "dist"
6
6
  ],