From c4a3dc7a833affddca814ea046283d3bbb63dbf7 Mon Sep 17 00:00:00 2001 From: Michael Chung <6252325+ArEnSc@users.noreply.github.com> Date: Sat, 30 Mar 2024 16:14:34 -0400 Subject: [PATCH 1/3] Timeline moves. need to test the clip information. --- .../comps/Timeline/utils/useQueueHandler.ts | 1 + app/pages/PageEnigma/js/editor.ts | 5 +- app/pages/PageEnigma/js/timeline.ts | 47 +++++++++++++++++++ 3 files changed, 52 insertions(+), 1 deletion(-) diff --git a/app/pages/PageEnigma/comps/Timeline/utils/useQueueHandler.ts b/app/pages/PageEnigma/comps/Timeline/utils/useQueueHandler.ts index 3359ce8931..02e96793ca 100644 --- a/app/pages/PageEnigma/comps/Timeline/utils/useQueueHandler.ts +++ b/app/pages/PageEnigma/comps/Timeline/utils/useQueueHandler.ts @@ -19,6 +19,7 @@ interface Arguments { export function useQueueHandler() { useSignals(); const handleActions = useCallback(({ action, data }: Arguments) => { + console.log(`FROM ENGINE:${action} ${data}`) switch (action) { case fromEngineActions.UPDATE_TIME: currentTime.value = (data as UpdateTime).currentTime; diff --git a/app/pages/PageEnigma/js/editor.ts b/app/pages/PageEnigma/js/editor.ts index b9508e2412..55df4eb936 100644 --- a/app/pages/PageEnigma/js/editor.ts +++ b/app/pages/PageEnigma/js/editor.ts @@ -206,7 +206,6 @@ class Editor { // }); - if (this.can_initialize == false) { console.log("Editor Already Initialized"); return; @@ -331,6 +330,10 @@ class Editor { console.log(result); } + public async testTestTimelineEvents() { + Que + } + public async testStylizeRequest() { const result = await this.api_manager.stylizeVideo( "mu_6wy1570a0c3c0tpkkncf4tsvb5234", diff --git a/app/pages/PageEnigma/js/timeline.ts b/app/pages/PageEnigma/js/timeline.ts index 6873675c84..44cf7cdc5a 100644 --- a/app/pages/PageEnigma/js/timeline.ts +++ b/app/pages/PageEnigma/js/timeline.ts @@ -7,6 +7,12 @@ import TransformEngine from "./transform_engine"; import LipSyncEngine from "./lip_sync_engine"; import AnimationEngine from "./animation_engine"; +import Queue from "~/pages/PageEnigma/Queue/Queue"; +import { QueueNames } from "../Queue/QueueNames"; +import { toEngineActions } from "../Queue/toEngineActions"; +import { Action } from "@remix-run/router"; +import { fromEngineActions } from "../Queue/fromEngineActions"; +import { currentTime } from "../store"; // Every object uuid / entity has a track. export class TimelineCurrentState { is_editable: boolean @@ -45,6 +51,8 @@ export class TimeLine { lipSync_engine: LipSyncEngine scene: Scene + + current_time:number // ensure that the elements are loaded first. constructor(audio_engine: AudioEngine, transform_engine: TransformEngine, @@ -65,6 +73,45 @@ export class TimeLine { this.animation_engine = animation_engine this.scene = scene; + + Queue.subscribe(QueueNames.TO_ENGINE, this.handleTimelineActions); + + this.current_time = 0 + + // TODO: How to move the timeline should put in update. + // setInterval(()=> { + // this.current_time +=1 + // this.pushEvent(fromEngineActions.UPDATE_TIME, { currentTime: this.current_time }) + // },50) + } + + public async pushEvent(action:fromEngineActions, data:any) { + this.current_time += 1 + Queue.publish({ + queueName: QueueNames.FROM_ENGINE, + action: fromEngineActions.UPDATE_TIME, + data: data , + }); + } + + public async handleTimelineActions(data:any) { + const action = data["action"] + switch (action) { + case toEngineActions.ADD_CLIP: + break + case toEngineActions.DELETE_CLIP: + break + case toEngineActions.UPDATE_CLIP: + break + case toEngineActions.PLAY_CLIP: + break + case toEngineActions.UPDATE_TIME: + break + case toEngineActions.MUTE: + default: + console.log("Action Not Wired") + } + console.log(data) } public async addPlayableClip(clip: ClipUI): Promise { From 8cfc3f278ee99e3e90090d0500c714a5f08094ce Mon Sep 17 00:00:00 2001 From: Michael Chung <6252325+ArEnSc@users.noreply.github.com> Date: Sat, 30 Mar 2024 17:26:22 -0400 Subject: [PATCH 2/3] Ok timeline primitives connected. --- app/pages/PageEnigma/js/timeline.ts | 52 +++++++++++++++++------------ 1 file changed, 31 insertions(+), 21 deletions(-) diff --git a/app/pages/PageEnigma/js/timeline.ts b/app/pages/PageEnigma/js/timeline.ts index 44cf7cdc5a..bb131d8369 100644 --- a/app/pages/PageEnigma/js/timeline.ts +++ b/app/pages/PageEnigma/js/timeline.ts @@ -74,10 +74,10 @@ export class TimeLine { this.scene = scene; + Queue.subscribe(QueueNames.TO_ENGINE, this.handleTimelineActions); this.current_time = 0 - // TODO: How to move the timeline should put in update. // setInterval(()=> { // this.current_time +=1 @@ -90,7 +90,7 @@ export class TimeLine { Queue.publish({ queueName: QueueNames.FROM_ENGINE, action: fromEngineActions.UPDATE_TIME, - data: data , + data: data, }); } @@ -98,19 +98,43 @@ export class TimeLine { const action = data["action"] switch (action) { case toEngineActions.ADD_CLIP: + await this.addClip(data) break case toEngineActions.DELETE_CLIP: + await this.deleteClip(data) break case toEngineActions.UPDATE_CLIP: - break - case toEngineActions.PLAY_CLIP: + await this.updateClip(data) break case toEngineActions.UPDATE_TIME: + await this.scrubberUpdate(data) break case toEngineActions.MUTE: + await this.mute(data) + break default: console.log("Action Not Wired") } + + } + + public async addClip(data:any) { + // map to clip ui + console.log(data) + } + public async updateClip(data:any) { + // only length and offset changes here. + console.log(data) + } + public async deleteClip(data:any) { + console.log(data) + } + + public async scrubberUpdate(data:any) { + console.log(data) + } + + public async mute(data:any) { console.log(data) } @@ -122,33 +146,19 @@ export class TimeLine { // Then the clip will be loaded by the engines, if they come from outside of the loaded scene. public async createClipOffset(media_id: string, object_uuid:string, type: string): Promise { // use engine to load based off media id and type animation | transform | - } // this will update the state of the clips based off uuid easing? - public async updateClip(clip_uuid: string, updates: AnyJson): Promise { + public async updatePlayableClip(clip_uuid: string, updates: AnyJson): Promise { } - public async deleteClip(clip_uuid: string): Promise { - - } - - // Events that will trigger from react - public async clipDidEnterDropZone() { - - } - - public async clipDidExitDropZone() { - - } - - // timeline controls this. - public async scrubberDidStart(offset_frame: number) { + public async deletePlayableClip(clip_uuid: string): Promise { } public async scrub(offset_frame: number): Promise { + if (this.is_playing) { return } // only stream through to the position and rotation keyframes // debounce not really } From 1e1ec7199c0b675c0765a668c5348e87ab017a53 Mon Sep 17 00:00:00 2001 From: Michael Chung <6252325+ArEnSc@users.noreply.github.com> Date: Sat, 30 Mar 2024 17:39:18 -0400 Subject: [PATCH 3/3] timeline hooked up --- app/pages/PageEnigma/js/timeline.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/pages/PageEnigma/js/timeline.ts b/app/pages/PageEnigma/js/timeline.ts index bb131d8369..d2866cdfd1 100644 --- a/app/pages/PageEnigma/js/timeline.ts +++ b/app/pages/PageEnigma/js/timeline.ts @@ -154,7 +154,7 @@ export class TimeLine { } public async deletePlayableClip(clip_uuid: string): Promise { - + } public async scrub(offset_frame: number): Promise {