From d855b9487e90ca20b050829ad72bf4b733cd63ab Mon Sep 17 00:00:00 2001
From: Michael Chung <6252325+ArEnSc@users.noreply.github.com>
Date: Sat, 30 Mar 2024 22:29:15 -0400
Subject: [PATCH] Sending messages to the timeline queue.

---
 app/pages/PageEnigma/Queue/Queue.ts           | 18 +++++----
 app/pages/PageEnigma/Queue/QueueNames.ts      |  1 +
 .../PageEnigma/Queue/toTimelineActions.ts     |  4 ++
 .../ControlPanelSceneObject.tsx               | 39 ++++++++++++++++---
 .../ControlsTopButtons/ControlsTopButtons.tsx |  2 +-
 app/pages/PageEnigma/datastructures/common.ts |  2 +-
 app/pages/PageEnigma/js/timeline.ts           |  2 +-
 .../reducers/appUiReducer/values.tsx          |  2 +-
 8 files changed, 53 insertions(+), 17 deletions(-)
 create mode 100644 app/pages/PageEnigma/Queue/toTimelineActions.ts

diff --git a/app/pages/PageEnigma/Queue/Queue.ts b/app/pages/PageEnigma/Queue/Queue.ts
index 1bf90a922b..7fba3bb6a7 100644
--- a/app/pages/PageEnigma/Queue/Queue.ts
+++ b/app/pages/PageEnigma/Queue/Queue.ts
@@ -1,20 +1,22 @@
 import { fromEngineActions } from "~/pages/PageEnigma/Queue/fromEngineActions";
 import { toEngineActions } from "~/pages/PageEnigma/Queue/toEngineActions";
 import { QueueClip } from "~/pages/PageEnigma/models/track";
+import { XYZ } from "../datastructures/common";
+import { toTimelineActions } from "./toTimelineActions";
 
 class Queue {
   private _queue: Record<
     string,
     {
-      action: fromEngineActions | toEngineActions;
-      data: QueueClip | { currentTime: number };
+      action: fromEngineActions | toEngineActions | toTimelineActions;
+      data: QueueClip | { currentTime: number } | { position: XYZ, rotation: XYZ, scale: XYZ };
     }[]
   > = {};
   private _subscribers: Record<
     string,
     (entry: {
-      action: fromEngineActions | toEngineActions;
-      data: QueueClip | { currentTime: number };
+      action: fromEngineActions | toEngineActions | toTimelineActions;
+      data: QueueClip | { currentTime: number } | { position: XYZ, rotation: XYZ, scale: XYZ };
     }) => void
   > = {};
 
@@ -24,8 +26,8 @@ class Queue {
     data,
   }: {
     queueName: string;
-    action: fromEngineActions | toEngineActions;
-    data: QueueClip | { currentTime: number };
+    action: fromEngineActions | toEngineActions | toTimelineActions ;
+    data: QueueClip | { currentTime: number } | { position: XYZ, rotation: XYZ, scale: XYZ };
   }) {
     if (!this._queue[queueName]) {
       this._queue[queueName] = [];
@@ -41,8 +43,8 @@ class Queue {
   public subscribe(
     queueName: string,
     onMessage: (entry: {
-      action: fromEngineActions | toEngineActions;
-      data: QueueClip | { currentTime: number };
+      action: fromEngineActions | toEngineActions | toTimelineActions;
+      data: QueueClip | { currentTime: number } | { position: XYZ, rotation: XYZ, scale: XYZ };
     }) => void,
   ) {
     this._subscribers[queueName] = onMessage;
diff --git a/app/pages/PageEnigma/Queue/QueueNames.ts b/app/pages/PageEnigma/Queue/QueueNames.ts
index 298470a98b..9a046d7c85 100644
--- a/app/pages/PageEnigma/Queue/QueueNames.ts
+++ b/app/pages/PageEnigma/Queue/QueueNames.ts
@@ -1,4 +1,5 @@
 export enum QueueNames {
   FROM_ENGINE = "FROM_ENGINE",
   TO_ENGINE = "TO_ENGINE",
+  TO_TIMELINE = "TO_TIMELINE"
 }
diff --git a/app/pages/PageEnigma/Queue/toTimelineActions.ts b/app/pages/PageEnigma/Queue/toTimelineActions.ts
new file mode 100644
index 0000000000..79eb737d07
--- /dev/null
+++ b/app/pages/PageEnigma/Queue/toTimelineActions.ts
@@ -0,0 +1,4 @@
+export enum toTimelineActions {
+    ADD_KEYFRAME = "add_keyframe"
+}
+  
\ No newline at end of file
diff --git a/app/pages/PageEnigma/comps/ControlPanelSceneObject/ControlPanelSceneObject.tsx b/app/pages/PageEnigma/comps/ControlPanelSceneObject/ControlPanelSceneObject.tsx
index 2ad5dfc900..f8125e81bd 100644
--- a/app/pages/PageEnigma/comps/ControlPanelSceneObject/ControlPanelSceneObject.tsx
+++ b/app/pages/PageEnigma/comps/ControlPanelSceneObject/ControlPanelSceneObject.tsx
@@ -13,12 +13,15 @@ import { Button, H4, H5, H6, InputVector } from "~/components";
 import { XYZ } from "../../datastructures/common";
 import { ACTION_TYPES } from "../../reducers/appUiReducer/types";
 
+import { QueueNames } from "../../Queue/QueueNames";
+import Queue from "~/pages/PageEnigma/Queue/Queue";
+import { toTimelineActions } from "../../Queue/toTimelineActions";
 export const ControlPanelSceneObject = () => {
   const [appUiState, dispatchAppUiState] = useContext(AppUiContext);
 
   const position = appUiState?.currentSceneObject.objectVectors.position;
   const rotation = appUiState?.currentSceneObject.objectVectors.rotation;
-  const scalar = appUiState?.currentSceneObject.objectVectors.scalar;
+  const scalar = appUiState?.currentSceneObject.objectVectors.scale;
 
   const handlePositionChange = (xyz: XYZ) => {
     if (appUiState)
@@ -29,7 +32,7 @@ export const ControlPanelSceneObject = () => {
             objectVectors: {
               position: { ...xyz },
               rotation: appUiState.currentSceneObject.objectVectors.rotation,
-              scalar: appUiState.currentSceneObject.objectVectors.scalar,
+              scale: appUiState.currentSceneObject.objectVectors.scale,
             },
           },
         },
@@ -44,7 +47,7 @@ export const ControlPanelSceneObject = () => {
             objectVectors: {
               position: appUiState.currentSceneObject.objectVectors.position,
               rotation: { ...xyz },
-              scalar: appUiState.currentSceneObject.objectVectors.scalar,
+              scale: appUiState.currentSceneObject.objectVectors.scale,
             },
           },
         },
@@ -59,13 +62,37 @@ export const ControlPanelSceneObject = () => {
             objectVectors: {
               position: appUiState.currentSceneObject.objectVectors.position,
               rotation: appUiState.currentSceneObject.objectVectors.rotation,
-              scalar: { ...xyz },
+              scale: { ...xyz },
             },
           },
         },
       });
   };
 
+  const handleOnAddKeyFrame = () => {
+    if (appUiState) {
+        console.log(`${appUiState.currentSceneObject.objectVectors.position.x}`)
+        console.log(`${appUiState.currentSceneObject.objectVectors.position.y}`)
+        console.log(`${appUiState.currentSceneObject.objectVectors.position.z}`)
+
+        console.log(`${appUiState.currentSceneObject.objectVectors.rotation.x}`)
+        console.log(`${appUiState.currentSceneObject.objectVectors.rotation.y}`)
+        console.log(`${appUiState.currentSceneObject.objectVectors.rotation.z}`)
+
+        console.log(`${appUiState.currentSceneObject.objectVectors.scale.x}`)
+        console.log(`${appUiState.currentSceneObject.objectVectors.scale.y}`)
+        console.log(`${appUiState.currentSceneObject.objectVectors.scale.z}`)
+
+        Queue.publish({queueName:QueueNames.TO_TIMELINE, action: toTimelineActions.ADD_KEYFRAME, 
+          data: {  
+            position: appUiState.currentSceneObject.objectVectors.position,
+            rotation: appUiState.currentSceneObject.objectVectors.rotation,
+            scale:appUiState.currentSceneObject.objectVectors.scale
+          }
+        })
+    }
+  }
+
   return (
     <Transition
       show={appUiState?.currentSceneObject.isShowing}
@@ -121,7 +148,9 @@ export const ControlPanelSceneObject = () => {
 
       <span className="h-2" />
       <div className="flex gap-2">
-        <Button variant="secondary" className="grow">
+        <Button variant="secondary" 
+        className="grow"
+        onClick={handleOnAddKeyFrame}>
           Add Keyframe (K)
         </Button>
         <Button variant="secondary" icon={faTrash} />
diff --git a/app/pages/PageEnigma/comps/ControlsTopButtons/ControlsTopButtons.tsx b/app/pages/PageEnigma/comps/ControlsTopButtons/ControlsTopButtons.tsx
index 03932ceb60..5bc2a60557 100644
--- a/app/pages/PageEnigma/comps/ControlsTopButtons/ControlsTopButtons.tsx
+++ b/app/pages/PageEnigma/comps/ControlsTopButtons/ControlsTopButtons.tsx
@@ -77,7 +77,7 @@ export const ControlsTopButtons = () => {
             objectVectors: {
               position: {x:1,y:2,z:3},
               rotation: {x:4,y:5,z:6},
-              scalar: {x:7,y:8,z:9},
+              scale: {x:7,y:8,z:9},
             }
           }
         }
diff --git a/app/pages/PageEnigma/datastructures/common.ts b/app/pages/PageEnigma/datastructures/common.ts
index 5d6c4d1889..7b40b76d9b 100644
--- a/app/pages/PageEnigma/datastructures/common.ts
+++ b/app/pages/PageEnigma/datastructures/common.ts
@@ -7,5 +7,5 @@ export type XYZ = {
 export type Simple3DVector = {
   position: XYZ;
   rotation: XYZ;
-  scalar: XYZ;
+  scale: XYZ;
 }
\ No newline at end of file
diff --git a/app/pages/PageEnigma/js/timeline.ts b/app/pages/PageEnigma/js/timeline.ts
index 90cf552201..09b7165cf4 100644
--- a/app/pages/PageEnigma/js/timeline.ts
+++ b/app/pages/PageEnigma/js/timeline.ts
@@ -164,7 +164,7 @@ export class TimeLine {
     }
 
     public async scrubberDidStop(offset_frame: number) {
-
+        
     }
     // public streaming events into the timeline from
     public async setScrubberPosition(offset: number) {
diff --git a/app/pages/PageEnigma/reducers/appUiReducer/values.tsx b/app/pages/PageEnigma/reducers/appUiReducer/values.tsx
index e69a9a313a..e5a5ca5d74 100644
--- a/app/pages/PageEnigma/reducers/appUiReducer/values.tsx
+++ b/app/pages/PageEnigma/reducers/appUiReducer/values.tsx
@@ -17,7 +17,7 @@ export const initialStateValues : State = {
     objectVectors:{
       position:{x:0,y:0,z:0},
       rotation:{x:0,y:0,z:0},
-      scalar:{x:0,y:0,z:0},
+      scale:{x:0,y:0,z:0},
     }
   }
 }
\ No newline at end of file