@zync/zync-screnplay-player 0.1.250 → 0.1.252
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.
- package/dist/bundle.js +1 -1
- package/dist/screenplay/RemotionRenderer/RemotionRenderer.js +43 -42
- package/dist/screenplay/RemotionRenderer/assets/wordObjects/LICENSE +21 -0
- package/dist/screenplay/RemotionRenderer/assets/wordObjects/images.js +24 -0
- package/dist/screenplay/RemotionRenderer/assets/wordObjects/manifest.json +67 -0
- package/dist/screenplay/RemotionRenderer/components/effects/CaptionWordObjectOverlay.js +243 -0
- package/dist/screenplay/RemotionRenderer/components/effects/Sentence.js +10 -3
- package/dist/screenplay/RemotionRenderer/components/layouts/CreatorCollabConversationSpine.js +1 -1
- package/dist/screenplay/RemotionRenderer/components/layouts/CreatorCollabRackFocus.js +1 -1
- package/dist/screenplay/RemotionRenderer/components/layouts/MotionStillInset.js +51 -5
- package/dist/screenplay/RemotionRenderer/components/layouts/SimpleFrameSentence.js +3 -1
- package/dist/screenplay/RemotionRenderer/components/utils/FaceCenteredVideo.js +9 -0
- package/dist/screenplay/RemotionRenderer/helpers/captionWordObjectGeometry.js +139 -0
- package/dist/screenplay/RemotionRenderer/helpers/captionWordObjects.js +112 -0
- package/dist/screenplay/RemotionRenderer/helpers/headingColors.js +12 -0
- package/dist/screenplay/RemotionRenderer/helpers/normalizeDisabledTranscripts.js +3 -629
- package/dist/screenplay/RemotionRenderer/main/lib/layouts/SimpleFrameLayout.js +8 -3
- package/dist/screenplay/RemotionRenderer/theme/themes/default/CaptionPunctuated.js +29 -6
- package/dist/screenplay/RemotionRenderer/theme/themes/default/CaptionWordBoom.js +30 -7
- package/dist/screenplay/RemotionRenderer/theme/themes/default/CaptionWordBubble.js +30 -7
- package/dist/screenplay/RemotionRenderer/theme/themes/default/Sentence/AnimatedSentence.js +1 -0
- package/dist/screenplay/RemotionRenderer/theme/themes/default/Sentence.js +8 -4
- package/dist/screenplay/RemotionRenderer/theme/themes/fullcover/TextFullCover.js +10 -5
- package/dist/screenplay/RemotionRenderer/theme/themes/glassmorphism/Sentence.js +14 -4
- package/dist/screenplay/RemotionRenderer/tracks/LayoutVideoTrack.js +1 -1
- package/dist/screenplay/RemotionRenderer/tracks/Soundtrack.js +20 -3
- package/dist/timing.cjs +1050 -0
- package/package.json +8 -4
|
@@ -0,0 +1,139 @@
|
|
|
1
|
+
function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t["return"] || t["return"](); } finally { if (u) throw o; } } }; }
|
|
2
|
+
function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
|
|
3
|
+
function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
|
|
4
|
+
var intersects = function intersects(a, b) {
|
|
5
|
+
return a.left < b.right && a.right > b.left && a.top < b.bottom && a.bottom > b.top;
|
|
6
|
+
};
|
|
7
|
+
export var projectFaceRects = function projectFaceRects(_ref) {
|
|
8
|
+
var boxes = _ref.boxes,
|
|
9
|
+
projection = _ref.projection,
|
|
10
|
+
width = _ref.width,
|
|
11
|
+
height = _ref.height,
|
|
12
|
+
_ref$videoZoom = _ref.videoZoom,
|
|
13
|
+
videoZoom = _ref$videoZoom === void 0 ? 1 : _ref$videoZoom,
|
|
14
|
+
_ref$framePadding = _ref.framePadding,
|
|
15
|
+
framePadding = _ref$framePadding === void 0 ? 0 : _ref$framePadding;
|
|
16
|
+
if (!projection || !(boxes !== null && boxes !== void 0 && boxes.length) || ![projection.scale, projection.translateX, projection.translateY, projection.originX, projection.originY, videoZoom, framePadding].every(Number.isFinite) || projection.scale <= 0) return [{
|
|
17
|
+
left: 0,
|
|
18
|
+
top: 0,
|
|
19
|
+
right: width,
|
|
20
|
+
bottom: height * 2 / 3
|
|
21
|
+
}];
|
|
22
|
+
var scale = projection.scale,
|
|
23
|
+
translateX = projection.translateX,
|
|
24
|
+
translateY = projection.translateY,
|
|
25
|
+
originX = projection.originX,
|
|
26
|
+
originY = projection.originY;
|
|
27
|
+
var rects = [];
|
|
28
|
+
var _iterator = _createForOfIteratorHelper(boxes),
|
|
29
|
+
_step;
|
|
30
|
+
try {
|
|
31
|
+
for (_iterator.s(); !(_step = _iterator.n()).done;) {
|
|
32
|
+
var box = _step.value;
|
|
33
|
+
if (!Array.isArray(box) || box.length < 4 || !box.every(Number.isFinite) || box[2] <= 0 || box[3] <= 0) continue;
|
|
34
|
+
// Union across the video's full zoom ramp; metadata coordinates use the same
|
|
35
|
+
// transform origin and translation as FaceCenteredVideo.
|
|
36
|
+
for (var _i = 0, _arr = [1, Math.max(1, videoZoom)]; _i < _arr.length; _i++) {
|
|
37
|
+
var zoom = _arr[_i];
|
|
38
|
+
var x = originX + (box[0] - originX) * scale + translateX;
|
|
39
|
+
var y = originY + (box[1] - originY) * scale + translateY;
|
|
40
|
+
var padding = 24 * width / 1080 + framePadding;
|
|
41
|
+
rects.push({
|
|
42
|
+
left: width / 2 + (x - width / 2) * zoom - padding,
|
|
43
|
+
top: height / 2 + (y - height / 2) * zoom - padding,
|
|
44
|
+
right: width / 2 + (x + box[2] * scale - width / 2) * zoom + padding,
|
|
45
|
+
bottom: height / 2 + (y + box[3] * scale - height / 2) * zoom + padding
|
|
46
|
+
});
|
|
47
|
+
}
|
|
48
|
+
}
|
|
49
|
+
} catch (err) {
|
|
50
|
+
_iterator.e(err);
|
|
51
|
+
} finally {
|
|
52
|
+
_iterator.f();
|
|
53
|
+
}
|
|
54
|
+
return rects.length ? rects : [{
|
|
55
|
+
left: 0,
|
|
56
|
+
top: 0,
|
|
57
|
+
right: width,
|
|
58
|
+
bottom: height * 2 / 3
|
|
59
|
+
}];
|
|
60
|
+
};
|
|
61
|
+
export var placeCaptionWordObject = function placeCaptionWordObject(_ref2) {
|
|
62
|
+
var width = _ref2.width,
|
|
63
|
+
height = _ref2.height,
|
|
64
|
+
anchor = _ref2.anchor,
|
|
65
|
+
captionTop = _ref2.captionTop,
|
|
66
|
+
faceRects = _ref2.faceRects;
|
|
67
|
+
var scale = width / 1080;
|
|
68
|
+
var gap = 24 * scale;
|
|
69
|
+
var leftLimit = width * 0.06;
|
|
70
|
+
var rightLimit = width * 0.85;
|
|
71
|
+
var startX = (anchor.left + anchor.right) / 2;
|
|
72
|
+
var startY = (anchor.top + anchor.bottom) / 2;
|
|
73
|
+
if (![width, height, captionTop, startX, startY].every(Number.isFinite)) return null;
|
|
74
|
+
var protectedRects = faceRects || [{
|
|
75
|
+
left: 0,
|
|
76
|
+
top: 0,
|
|
77
|
+
right: width,
|
|
78
|
+
bottom: height * 2 / 3
|
|
79
|
+
}];
|
|
80
|
+
var _loop = function _loop() {
|
|
81
|
+
// Includes rotation, entry overshoot, hover and shadow.
|
|
82
|
+
var halfEnvelope = size * 0.62 + 12 * scale;
|
|
83
|
+
var x = Math.max(leftLimit + halfEnvelope, Math.min(rightLimit - halfEnvelope, startX));
|
|
84
|
+
var y = captionTop - gap - halfEnvelope;
|
|
85
|
+
var envelope = {
|
|
86
|
+
left: x - halfEnvelope,
|
|
87
|
+
top: y - halfEnvelope,
|
|
88
|
+
right: x + halfEnvelope,
|
|
89
|
+
bottom: y + halfEnvelope
|
|
90
|
+
};
|
|
91
|
+
var wordFlight = {
|
|
92
|
+
left: Math.min(anchor.left, x - size / 2),
|
|
93
|
+
right: Math.max(anchor.right, x + size / 2),
|
|
94
|
+
top: Math.min(anchor.top, y - size / 2),
|
|
95
|
+
bottom: Math.max(anchor.bottom, y + size / 2)
|
|
96
|
+
};
|
|
97
|
+
if (envelope.top < 0 || envelope.bottom > height || envelope.left < leftLimit || envelope.right > rightLimit || protectedRects.some(function (face) {
|
|
98
|
+
return intersects(envelope, face) || intersects(wordFlight, face);
|
|
99
|
+
})) return 0; // continue
|
|
100
|
+
return {
|
|
101
|
+
v: {
|
|
102
|
+
x: x,
|
|
103
|
+
y: y,
|
|
104
|
+
size: size,
|
|
105
|
+
startX: startX,
|
|
106
|
+
startY: startY,
|
|
107
|
+
envelope: envelope
|
|
108
|
+
}
|
|
109
|
+
};
|
|
110
|
+
},
|
|
111
|
+
_ret;
|
|
112
|
+
for (var size = 128 * scale; size >= 80 * scale - 0.01; size -= 8 * scale) {
|
|
113
|
+
_ret = _loop();
|
|
114
|
+
if (_ret === 0) continue;
|
|
115
|
+
if (_ret) return _ret.v;
|
|
116
|
+
}
|
|
117
|
+
return null;
|
|
118
|
+
};
|
|
119
|
+
export var getWordObjectMotion = function getWordObjectMotion(_ref3) {
|
|
120
|
+
var frame = _ref3.frame,
|
|
121
|
+
fps = _ref3.fps,
|
|
122
|
+
durationInFrames = _ref3.durationInFrames,
|
|
123
|
+
assetId = _ref3.assetId;
|
|
124
|
+
var seconds = frame / fps;
|
|
125
|
+
var rise = Math.max(0, Math.min(1, seconds / 0.35));
|
|
126
|
+
var easedRise = 1 - Math.pow(1 - rise, 3);
|
|
127
|
+
var exit = Math.max(0, Math.min(1, (durationInFrames - frame) / (0.3 * fps)));
|
|
128
|
+
var opacity = Math.min(1, Math.max(0, (seconds - 0.05) / 0.3)) * exit;
|
|
129
|
+
var hoverStrength = Math.max(0, Math.min(1, (seconds - 0.35) / 0.15));
|
|
130
|
+
return {
|
|
131
|
+
rise: easedRise,
|
|
132
|
+
wordOpacity: 1 - rise,
|
|
133
|
+
opacity: opacity,
|
|
134
|
+
scale: (0.55 + 0.45 * rise + Math.sin(Math.PI * rise) * 0.12) * (0.8 + 0.2 * exit),
|
|
135
|
+
hover: Math.sin(seconds * 3) * 6 * hoverStrength,
|
|
136
|
+
rotation: Math.sin(seconds * 2.5) * (assetId === "plane" ? 6 : assetId === "clock" ? 5 : 3) * hoverStrength,
|
|
137
|
+
glow: assetId === "light_bulb" ? (0.5 + Math.sin(seconds * 4) * 0.2) * opacity : 0
|
|
138
|
+
};
|
|
139
|
+
};
|
|
@@ -0,0 +1,112 @@
|
|
|
1
|
+
import timing from "../../../timing.cjs";
|
|
2
|
+
import { toFrames } from "../main/lib/Sequence.js";
|
|
3
|
+
export var WORD_OBJECT_ASSET_IDS = Object.freeze(["plane", "clock", "light_bulb", "money", "rocket", "target", "phone", "computer", "book", "key", "globe", "chart"]);
|
|
4
|
+
export var WORD_OBJECT_CAPTION_TYPES = Object.freeze(["caption_word_boom", "caption_punctuated", "caption_word_bubble"]);
|
|
5
|
+
export var isEnabledWordObject = function isEnabledWordObject(object) {
|
|
6
|
+
return !!object && object.disabled !== true && (object.disabled === undefined || object.disabled === false) && WORD_OBJECT_ASSET_IDS.includes(object.assetId) && object.preset === "emerge_v1" && Number.isFinite(object.duration) && object.duration >= 1.5 && object.duration <= 2.6;
|
|
7
|
+
};
|
|
8
|
+
|
|
9
|
+
// Operates on the renderer's private normalized screenplay, never on saved input.
|
|
10
|
+
export var prepareCaptionWordObjects = function prepareCaptionWordObjects(screenplay, fps) {
|
|
11
|
+
var _screenplay$tracks, _screenplay$tracks$fi;
|
|
12
|
+
var stats = {
|
|
13
|
+
selected: 0,
|
|
14
|
+
disabled: 0,
|
|
15
|
+
suppressed: 0
|
|
16
|
+
};
|
|
17
|
+
// Standalone captions have no speaker layout/segment boundary to validate.
|
|
18
|
+
// Preserve their captions and metadata, but never accept saved private approval.
|
|
19
|
+
(screenplay.tracks || []).filter(function (track) {
|
|
20
|
+
return track.type === "caption";
|
|
21
|
+
}).forEach(function (track) {
|
|
22
|
+
(track.segments || []).forEach(function (caption) {
|
|
23
|
+
var _caption$data;
|
|
24
|
+
(((_caption$data = caption.data) === null || _caption$data === void 0 ? void 0 : _caption$data.transcript_text) || []).forEach(function (transcript) {
|
|
25
|
+
(transcript.punctuations || []).forEach(function (p) {
|
|
26
|
+
delete p.__wordObjectDurationInFrames;
|
|
27
|
+
if (!p.wordObject) return;
|
|
28
|
+
var disabled = p.wordObject.disabled === true;
|
|
29
|
+
p.__wordObjectSuppressed = disabled ? "disabled" : "ineligible";
|
|
30
|
+
stats[disabled ? "disabled" : "suppressed"]++;
|
|
31
|
+
});
|
|
32
|
+
});
|
|
33
|
+
});
|
|
34
|
+
});
|
|
35
|
+
var segments = ((_screenplay$tracks = screenplay.tracks) === null || _screenplay$tracks === void 0 ? void 0 : (_screenplay$tracks$fi = _screenplay$tracks.find(function (track) {
|
|
36
|
+
return track.type === "segment";
|
|
37
|
+
})) === null || _screenplay$tracks$fi === void 0 ? void 0 : _screenplay$tracks$fi.segments) || [];
|
|
38
|
+
var candidates = [];
|
|
39
|
+
var _timing$getScreenplay = timing.getScreenplayTiming(screenplay, {
|
|
40
|
+
prepared: true
|
|
41
|
+
}),
|
|
42
|
+
sequences = _timing$getScreenplay.sequences;
|
|
43
|
+
segments.forEach(function (segment, segmentIndex) {
|
|
44
|
+
var _layout$data, _layout$data2;
|
|
45
|
+
var cursor = sequences[segmentIndex].startFrame;
|
|
46
|
+
var layout = segment.layout,
|
|
47
|
+
_segment$effects = segment.effects,
|
|
48
|
+
effects = _segment$effects === void 0 ? [] : _segment$effects;
|
|
49
|
+
if (layout !== null && layout !== void 0 && layout.removed) return;
|
|
50
|
+
var _ref = (layout === null || layout === void 0 ? void 0 : layout.data) || {},
|
|
51
|
+
_ref$duration = _ref.duration,
|
|
52
|
+
duration = _ref$duration === void 0 ? 0 : _ref$duration,
|
|
53
|
+
_ref$trimLeft = _ref.trimLeft,
|
|
54
|
+
trimLeft = _ref$trimLeft === void 0 ? 0 : _ref$trimLeft,
|
|
55
|
+
_ref$trimRight = _ref.trimRight,
|
|
56
|
+
trimRight = _ref$trimRight === void 0 ? 0 : _ref$trimRight;
|
|
57
|
+
var durationInFrames = toFrames(fps * (duration - trimLeft - trimRight));
|
|
58
|
+
var supportedLayout = ["simple_frame", "simple_frame_zoom_cut"].includes(layout === null || layout === void 0 ? void 0 : layout.type) && !(layout !== null && layout !== void 0 && (_layout$data = layout.data) !== null && _layout$data !== void 0 && _layout$data.sentenceText) && !(layout !== null && layout !== void 0 && (_layout$data2 = layout.data) !== null && _layout$data2 !== void 0 && _layout$data2.brollUrl);
|
|
59
|
+
effects.filter(function (effect) {
|
|
60
|
+
var _effect$type;
|
|
61
|
+
return (_effect$type = effect.type) === null || _effect$type === void 0 ? void 0 : _effect$type.includes("caption");
|
|
62
|
+
}).forEach(function (effect) {
|
|
63
|
+
var _effect$data;
|
|
64
|
+
(((_effect$data = effect.data) === null || _effect$data === void 0 ? void 0 : _effect$data.transcript_text) || []).forEach(function (transcript) {
|
|
65
|
+
var words = typeof transcript.text === "string" ? transcript.text.split(" ") : [];
|
|
66
|
+
(transcript.punctuations || []).forEach(function (p) {
|
|
67
|
+
var _effect$data2, _screenplay$output;
|
|
68
|
+
if (!p.wordObject) return;
|
|
69
|
+
delete p.__wordObjectSuppressed;
|
|
70
|
+
delete p.__wordObjectDurationInFrames;
|
|
71
|
+
var localStart = toFrames(fps * (p.start - trimLeft));
|
|
72
|
+
var effectFrom = Number.isFinite(Number((_effect$data2 = effect.data) === null || _effect$data2 === void 0 ? void 0 : _effect$data2.offset)) ? fps * (Number(effect.data.offset) + trimLeft) : 0;
|
|
73
|
+
var at = localStart + effectFrom;
|
|
74
|
+
var available = durationInFrames - at;
|
|
75
|
+
if (p.wordObject.disabled === true) {
|
|
76
|
+
p.__wordObjectSuppressed = "disabled";
|
|
77
|
+
stats.disabled++;
|
|
78
|
+
return;
|
|
79
|
+
}
|
|
80
|
+
if (!supportedLayout || !["portrait", "square"].includes((_screenplay$output = screenplay.output) === null || _screenplay$output === void 0 ? void 0 : _screenplay$output.orientation) || !WORD_OBJECT_CAPTION_TYPES.includes(effect.type) || transcript.disabled === true || p.__wordObjectOnsetClipped || !Number.isFinite(p.start) || !Number.isFinite(p.end) || p.end <= p.start || p.start < trimLeft || !Number.isInteger(p.index) || !words[p.index] || !isEnabledWordObject(p.wordObject) || !Number.isFinite(at) || at < 0 || available < Math.ceil(1.5 * fps)) {
|
|
81
|
+
p.__wordObjectSuppressed = "ineligible";
|
|
82
|
+
stats.suppressed++;
|
|
83
|
+
return;
|
|
84
|
+
}
|
|
85
|
+
candidates.push({
|
|
86
|
+
p: p,
|
|
87
|
+
at: cursor + at,
|
|
88
|
+
durationInFrames: Math.min(Math.round(p.wordObject.duration * fps), available)
|
|
89
|
+
});
|
|
90
|
+
});
|
|
91
|
+
});
|
|
92
|
+
});
|
|
93
|
+
});
|
|
94
|
+
candidates.sort(function (a, b) {
|
|
95
|
+
return a.at - b.at;
|
|
96
|
+
});
|
|
97
|
+
var lastStart = -Infinity;
|
|
98
|
+
candidates.forEach(function (_ref2) {
|
|
99
|
+
var p = _ref2.p,
|
|
100
|
+
at = _ref2.at,
|
|
101
|
+
durationInFrames = _ref2.durationInFrames;
|
|
102
|
+
if (at - lastStart < 15 * fps) {
|
|
103
|
+
p.__wordObjectSuppressed = "cooldown";
|
|
104
|
+
stats.suppressed++;
|
|
105
|
+
return;
|
|
106
|
+
}
|
|
107
|
+
p.__wordObjectDurationInFrames = durationInFrames;
|
|
108
|
+
stats.selected++;
|
|
109
|
+
lastStart = at;
|
|
110
|
+
});
|
|
111
|
+
return stats;
|
|
112
|
+
};
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
// Screenplay overrides are optional. Invalid values never become arbitrary CSS.
|
|
2
|
+
export var getHeadingColors = function getHeadingColors() {
|
|
3
|
+
var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
|
4
|
+
var result = {};
|
|
5
|
+
for (var _i = 0, _arr = ["headingTextColor", "headingBackgroundColor"]; _i < _arr.length; _i++) {
|
|
6
|
+
var key = _arr[_i];
|
|
7
|
+
if (typeof props[key] === "string" && /^#[a-f\d]{3}([a-f\d]{3})?$/i.test(props[key])) {
|
|
8
|
+
result[key] = props[key];
|
|
9
|
+
}
|
|
10
|
+
}
|
|
11
|
+
return result;
|
|
12
|
+
};
|