@zync/zync-screnplay-player 0.1.235 → 0.1.236

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 (4) hide show
  1. package/dist/bundle.js +1 -1
  2. package/dist/screenplay/RemotionRenderer/components/layouts/BrollInset.js +7 -7
  3. package/dist/screenplay/RemotionRenderer/components/layouts/MotionStillInset.js +7 -7
  4. package/package.json +1 -1
package/dist/screenplay/RemotionRenderer/components/layouts/BrollInset.js CHANGED
@@ -1,6 +1,7 @@
1
1
  import React from "react";
2
2
  import { AbsoluteFill, Audio, Easing, interpolate, OffthreadVideo, useCurrentFrame, useVideoConfig, Video } from "remotion";
3
3
  import { useOrientationBased } from "../../hooks/useOrientationBased.js";
4
+ import { useTheme } from "../../theme/hooks/useTheme.js";
4
5
  import FaceCenteredVideo from "../utils/FaceCenteredVideo";
5
6
  var ANIMATION_SECONDS = 1.2;
6
7
  var INSET_ASPECT_RATIO = 9 / 16;
@@ -74,7 +75,6 @@ var BrollInsetContent = function BrollInsetContent(_ref3) {
74
75
  frameColor = _ref3.frameColor,
75
76
  height = _ref3.height,
76
77
  noBackgroundVideoEffects = _ref3.noBackgroundVideoEffects,
77
- noBackgroundVideoUrl = _ref3.noBackgroundVideoUrl,
78
78
  outputOrientation = _ref3.outputOrientation,
79
79
  sourceVideoOrientation = _ref3.sourceVideoOrientation,
80
80
  startVideoFrom = _ref3.startVideoFrom,
@@ -89,8 +89,8 @@ var BrollInsetContent = function BrollInsetContent(_ref3) {
89
89
  extrapolateLeft: "clamp",
90
90
  extrapolateRight: "clamp"
91
91
  });
92
- var sourceSrc = noBackgroundVideoUrl || videoUrl;
93
- var sourceTransparent = Boolean(noBackgroundVideoUrl);
92
+ var _useTheme = useTheme(),
93
+ accentColor = _useTheme.accentColor;
94
94
  var inset = getInsetMetrics({
95
95
  width: width,
96
96
  height: height,
@@ -123,11 +123,13 @@ var BrollInsetContent = function BrollInsetContent(_ref3) {
123
123
  }) : null, /*#__PURE__*/React.createElement("div", {
124
124
  style: {
125
125
  borderRadius: sourceBorderRadius,
126
+ border: accentColor ? "4px solid ".concat(accentColor) : undefined,
126
127
  boxShadow: progress > 0 ? "0 ".concat(16 * progress, "px ").concat(44 * progress, "px rgba(0, 0, 0, ").concat(0.34 * progress, ")") : undefined,
127
128
  height: sourceHeight,
128
129
  left: sourceLeft,
129
130
  overflow: "hidden",
130
131
  position: "absolute",
132
+ boxSizing: "border-box",
131
133
  top: sourceTop,
132
134
  width: sourceWidth,
133
135
  zIndex: 2
@@ -137,9 +139,9 @@ var BrollInsetContent = function BrollInsetContent(_ref3) {
137
139
  height: sourceHeight,
138
140
  noBackgroundVideoEffects: noBackgroundVideoEffects,
139
141
  sourceVideoOrientation: sourceVideoOrientation,
140
- src: sourceSrc,
142
+ src: videoUrl,
141
143
  startVideoFrom: startVideoFrom,
142
- transparent: sourceTransparent,
144
+ transparent: false,
143
145
  width: sourceWidth
144
146
  })), /*#__PURE__*/React.createElement(AbsoluteFill, {
145
147
  style: {
@@ -156,7 +158,6 @@ export var BrollInset = function BrollInset(_ref4) {
156
158
  faceMetadata = _ref4.faceMetadata,
157
159
  frameColor = _ref4.frameColor,
158
160
  noBackgroundVideoEffects = _ref4.noBackgroundVideoEffects,
159
- noBackgroundVideoUrl = _ref4.noBackgroundVideoUrl,
160
161
  sourceVideoOrientation = _ref4.sourceVideoOrientation,
161
162
  startVideoFrom = _ref4.startVideoFrom,
162
163
  _ref4$useSquareInLand = _ref4.useSquareInLandscape,
@@ -193,7 +194,6 @@ export var BrollInset = function BrollInset(_ref4) {
193
194
  frameColor: frameColor,
194
195
  height: height,
195
196
  noBackgroundVideoEffects: noBackgroundVideoEffects,
196
- noBackgroundVideoUrl: noBackgroundVideoUrl,
197
197
  outputOrientation: activeOrientation,
198
198
  sourceVideoOrientation: sourceVideoOrientation,
199
199
  startVideoFrom: startVideoFrom,
package/dist/screenplay/RemotionRenderer/components/layouts/MotionStillInset.js CHANGED
@@ -1,6 +1,7 @@
1
1
  import React from "react";
2
2
  import { AbsoluteFill, Audio, Easing, Img, interpolate, OffthreadVideo, useCurrentFrame, useVideoConfig } from "remotion";
3
3
  import { useOrientationBased } from "../../hooks/useOrientationBased.js";
4
+ import { useTheme } from "../../theme/hooks/useTheme.js";
4
5
  import FaceCenteredVideo from "../utils/FaceCenteredVideo";
5
6
  var ANIMATION_SECONDS = 1.2;
6
7
  var INSET_ASPECT_RATIO = 9 / 16;
@@ -75,7 +76,6 @@ var MotionStillInsetContent = function MotionStillInsetContent(_ref3) {
75
76
  height = _ref3.height,
76
77
  imageUrl = _ref3.imageUrl,
77
78
  noBackgroundVideoEffects = _ref3.noBackgroundVideoEffects,
78
- noBackgroundVideoUrl = _ref3.noBackgroundVideoUrl,
79
79
  outputOrientation = _ref3.outputOrientation,
80
80
  sourceVideoOrientation = _ref3.sourceVideoOrientation,
81
81
  startVideoFrom = _ref3.startVideoFrom,
@@ -90,8 +90,8 @@ var MotionStillInsetContent = function MotionStillInsetContent(_ref3) {
90
90
  extrapolateLeft: "clamp",
91
91
  extrapolateRight: "clamp"
92
92
  });
93
- var sourceSrc = noBackgroundVideoUrl || videoUrl;
94
- var sourceTransparent = Boolean(noBackgroundVideoUrl);
93
+ var _useTheme = useTheme(),
94
+ accentColor = _useTheme.accentColor;
95
95
  var inset = getInsetMetrics({
96
96
  width: width,
97
97
  height: height,
@@ -132,11 +132,13 @@ var MotionStillInsetContent = function MotionStillInsetContent(_ref3) {
132
132
  }) : null, /*#__PURE__*/React.createElement("div", {
133
133
  style: {
134
134
  borderRadius: sourceBorderRadius,
135
+ border: accentColor ? "4px solid ".concat(accentColor) : undefined,
135
136
  boxShadow: progress > 0 ? "0 ".concat(16 * progress, "px ").concat(44 * progress, "px rgba(0, 0, 0, ").concat(0.34 * progress, ")") : undefined,
136
137
  height: sourceHeight,
137
138
  left: sourceLeft,
138
139
  overflow: "hidden",
139
140
  position: "absolute",
141
+ boxSizing: "border-box",
140
142
  top: sourceTop,
141
143
  width: sourceWidth,
142
144
  zIndex: 2
@@ -146,9 +148,9 @@ var MotionStillInsetContent = function MotionStillInsetContent(_ref3) {
146
148
  height: sourceHeight,
147
149
  noBackgroundVideoEffects: noBackgroundVideoEffects,
148
150
  sourceVideoOrientation: sourceVideoOrientation,
149
- src: sourceSrc,
151
+ src: videoUrl,
150
152
  startVideoFrom: startVideoFrom,
151
- transparent: sourceTransparent,
153
+ transparent: false,
152
154
  width: sourceWidth
153
155
  })), /*#__PURE__*/React.createElement(AbsoluteFill, {
154
156
  style: {
@@ -166,7 +168,6 @@ export var MotionStillInset = function MotionStillInset(_ref4) {
166
168
  frameColor = _ref4.frameColor,
167
169
  imageUrl = _ref4.imageUrl,
168
170
  noBackgroundVideoEffects = _ref4.noBackgroundVideoEffects,
169
- noBackgroundVideoUrl = _ref4.noBackgroundVideoUrl,
170
171
  sourceVideoOrientation = _ref4.sourceVideoOrientation,
171
172
  startVideoFrom = _ref4.startVideoFrom,
172
173
  _ref4$useSquareInLand = _ref4.useSquareInLandscape,
@@ -204,7 +205,6 @@ export var MotionStillInset = function MotionStillInset(_ref4) {
204
205
  height: height,
205
206
  imageUrl: imageUrl,
206
207
  noBackgroundVideoEffects: noBackgroundVideoEffects,
207
- noBackgroundVideoUrl: noBackgroundVideoUrl,
208
208
  outputOrientation: activeOrientation,
209
209
  sourceVideoOrientation: sourceVideoOrientation,
210
210
  startVideoFrom: startVideoFrom,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zync/zync-screnplay-player",
3
- "version": "0.1.235",
3
+ "version": "0.1.236",
4
4
  "files": [
5
5
  "dist"
6
6
  ],