feat: add support of "repeatCount" in animation groups in cinematic editor

Author: julien-moreau

editor/src/editor/layout/cinematic/inspector/animation-group.tsx

@@ -69,6 +69,18 @@ export function CinematicEditorAnimationGroupKeyInspector(props: ICinematicEdito
 					props.cinematicEditor.updateTracksAtCurrentTime();
 				}}
 			/>
+
+			<EditorInspectorNumberField
+				object={props.cinematicKey}
+				property="repeatCount"
+				label="Repeat Count"
+				step={1}
+				min={0}
+				onChange={() => {
+					props.cinematicEditor.inspector.forceUpdate();
+					props.cinematicEditor.updateTracksAtCurrentTime();
+				}}
+			/>
 		</EditorInspectorSectionField>
 	);
 }

editor/src/editor/layout/cinematic/timelines/keys/animation-group.tsx

@@ -11,7 +11,12 @@ export interface ICinematicEditorAnimationGroupKeyProps {
 
 export function CinematicEditorAnimationGroupKey(props: ICinematicEditorAnimationGroupKeyProps) {
 	function getAnimationGroupFramesCount() {
-		return props.cinematicKey.endFrame - props.cinematicKey.startFrame;
+		let framesCount = props.cinematicKey.endFrame - props.cinematicKey.startFrame;
+		if (props.cinematicKey.repeatCount) {
+			framesCount += framesCount * props.cinematicKey.repeatCount;
+		}
+
+		return framesCount;
 	}
 
 	return (

editor/src/editor/layout/cinematic/tools/sync.ts

@@ -14,7 +14,12 @@ export function syncAnimationGroupsToFrame(frame: number, cinematic: ICinematic,
 		}
 
 		track.animationGroups?.forEach((configuration) => {
-			const endFrame = configuration.frame + (configuration.endFrame - configuration.startFrame) / configuration.speed;
+			let framesCount = configuration.endFrame - configuration.startFrame;
+			if (configuration.repeatCount) {
+				framesCount += framesCount * configuration.repeatCount;
+			}
+
+			const endFrame = configuration.frame + framesCount / configuration.speed;
 			if (configuration.frame > frame || endFrame < frame) {
 				return;
 			}

editor/src/editor/layout/inspector/material/pbr.tsx

@@ -256,6 +256,7 @@ export class EditorPBRMaterialInspector extends Component<IEditorPBRMaterialInsp
 					<EditorInspectorNumberField label="Z Offset" object={this.props.material} property="zOffset" />
 					<EditorInspectorNumberField label="Z Offset Units" object={this.props.material} property="zOffsetUnits" />
 					<EditorInspectorSwitchField label="Fog Enabled" object={this.props.material} property="fogEnabled" />
+					<EditorInspectorSwitchField label="Use Logarithmic Depth" object={this.props.material} property="useLogarithmicDepth" />
 				</EditorInspectorSectionField>
 			</>
 		);

tools/src/cinematic/generate.ts

@@ -71,12 +71,24 @@ export function generateCinematicAnimationGroup(cinematic: ICinematic, scene: Sc
 			track.animationGroups.forEach((configuration) => {
 				animationGroupsAnimation.addEvent(
 					new AnimationEvent(configuration.frame, () => {
-						effectiveAnimationGroup.from = configuration.startFrame;
+						const repeatCount = configuration.repeatCount ?? 0;
+
 						effectiveAnimationGroup.to = configuration.endFrame;
 						effectiveAnimationGroup.speedRatio = configuration.speed;
 						effectiveAnimationGroup.stop();
+						effectiveAnimationGroup.play(repeatCount > 0);
 						effectiveAnimationGroup.goToFrame(configuration.startFrame);
-						effectiveAnimationGroup.play(false);
+
+						if (repeatCount) {
+							let currentRepeatCount = 0;
+							effectiveAnimationGroup.onAnimationGroupLoopObservable.add(() => {
+								++currentRepeatCount;
+
+								if (currentRepeatCount > repeatCount) {
+									effectiveAnimationGroup.stop();
+								}
+							});
+						}
 					})
 				);
 			});

tools/src/cinematic/typings.ts

@@ -34,6 +34,8 @@ export interface ICinematicAnimationGroup {
 	speed: number;
 	startFrame: number;
 	endFrame: number;
+
+	repeatCount?: number;
 }
 
 export interface ICinematicKey extends IAnimationKey {