storytold/storyteller-bevy
2
0
Fork 0
mirror of https://github.com/storytold/storyteller-bevy.git synced 2026-10-17 00:13:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

Timeline Saving/Loading, Cameras, and Headless Playback (#98)

Browse Source
This commit is contained in:
Lee-Orr
2024-03-21 20:35:25 -04:00
committed by GitHub
parent 7f12634780
commit 67a12e42e2
11 changed files with 748 additions and 81 deletions
Download Patch File Download Diff File Expand all files Collapse all files
studio-frontend/src/app/anim-editor.element.ts
+8 -5
View File
@@ -47,9 +47,9 @@ implements TreeSelectionProvider {
@state() playHead = 0;
@state() playing = false;
@state() tracks : Record<string, {name?: string, target_type: studio.SceneElement }> = {};
@state() tracks : Record<string, {name?: string, target_type: studio.SceneElement, animation_target: studio.AnimationTarget }> = {};
@state() track_ordered : string[] = [];
@state() track_ordered : [string, studio.AnimationTarget][] = [];
@state() keyframes : Record<string, Keyframe> = {};
@@ -112,7 +112,7 @@ implements TreeSelectionProvider {
delete tracks[track_entity];
}
this.track_ordered = Object.keys(tracks);
this.track_ordered = Object.keys(tracks).map(entity => [entity,tracks[entity].animation_target]);
if (typeof this.selectedTrack === "object") {
if (!isOutsideEntity(this.selectedTrack) && !(this.selectedTrack.track in tracks)) {
@@ -262,9 +262,11 @@ implements TreeSelectionProvider {
protected override render(): TemplateResult {
const track_order_hashed : Record<string, number> = {};
const track_animation_target_order_hashed : Record<studio.AnimationTarget, number> = {};
for (const [index, track] of this.track_ordered.entries()) {
for (const [index, [track, target]] of this.track_ordered.entries()) {
track_order_hashed[track] = index;
track_animation_target_order_hashed[target] = index;
}
const selected = !isOutsideEntity(this.selectedTrack) && this.selectedTrack?.track || false;
@@ -282,7 +284,7 @@ implements TreeSelectionProvider {
'--clip-start': `${clip_start * 100}%`
};
const tracklist = this.track_ordered.map((entity) => {
const tracklist = this.track_ordered.map(([entity,]) => {
let track = this.tracks[entity];
let name = track.name ?? track.target_type;
let icon = this.sceneData?.entityMap.get(entity)?.icon ?? "minus";
@@ -381,6 +383,7 @@ implements TreeSelectionProvider {
.playHead=${bind(this, "playHead")}
.keyframes=${bind(this, "keyframes")}
.track_ordered=${track_order_hashed}
.track_animation_target_ordered=${track_animation_target_order_hashed}
></sts-anim-timeline>
`
};
studio-frontend/src/app/anim-timeline.element.ts
+3 -2
View File
@@ -69,7 +69,8 @@ export class AnimTimelineElement extends LitElement {
@property({ type: Number }) playHead = 0;
/** Keyframe positions (in seconds) */
@property({ attribute: false }) keyframes: Record<string, studio.Keyframe> = {};
@property({ attribute: false }) track_ordered: Record<string, number> = {}
@property({ attribute: false }) track_ordered: Record<string, number> = {};
@property({ attribute: false }) track_animation_target_ordered: Record<string, number> = {};
@state() _selectedKeyframe: string | null = null;
@@ -344,7 +345,7 @@ export class AnimTimelineElement extends LitElement {
Object.entries(this.keyframes),
([id]) => id,
([id, keyframe]) => {
let row = this.track_ordered[keyframe.target];
let row = this.track_animation_target_ordered[keyframe.target];
return html`
<div id=${id}
class=${classMap({