@tomorrowevening/hermes 0.0.11 → 0.0.13

package/src/editor/{sceneHierarchy → sidePanel}/utils.ts

@@ -1,4 +1,4 @@
-import { CubeTexture, Material, Mesh, Object3D, RepeatWrapping, Texture } from 'three';
+import { AnimationClip, CubeTexture, Material, Mesh, Object3D, RepeatWrapping, Texture } from 'three';
 import { MinimumObject, RemoteMaterial, RemoteObject } from './types';
 
 export function determineIcon(obj: Object3D): string {
@@ -132,14 +132,23 @@ export function stripObject(obj: Object3D): RemoteObject {
     uuid: obj.uuid,
     visible: obj.visible,
     matrix: obj.matrix.elements,
+    animations: [],
     material: undefined,
     perspectiveCameraInfo: undefined,
     orthographicCameraInfo: undefined,
     lightInfo: undefined,
   };
 
-  const type = obj.type.toLowerCase();
+  // Animations
+  obj.animations.forEach((clip: AnimationClip) => {
+    stripped.animations.push({
+      name: clip.name,
+      duration: clip.duration,
+      blendMode: clip.blendMode,
+    });
+  });
 
+  const type = obj.type.toLowerCase();
   if (type.search('mesh') > -1) {
     const mesh = obj as Mesh;
     if (Array.isArray(mesh.material)) {

package/src/index.ts

@@ -17,11 +17,11 @@ export { default as RemoteController } from './core/RemoteController';
 // RemoteThree
 export { default as InfiniteGridHelper } from './editor/multiView/InfiniteGridHelper';
 export { default as UVMaterial } from './editor/multiView/UVMaterial';
-export { default as SceneHierarchy } from './editor/sceneHierarchy/SceneHierarchy';
-export { default as Accordion } from './editor/sceneHierarchy/Accordion';
-export { default as ChildObject } from './editor/sceneHierarchy/ChildObject';
-export { default as ContainerObject } from './editor/sceneHierarchy/ContainerObject';
-export { default as Inspector } from './editor/sceneHierarchy/inspector/Inspector';
-export { default as SceneInspector } from './editor/sceneHierarchy/inspector/SceneInspector';
+export { default as SidePanel } from './editor/sidePanel/SidePanel';
+export { default as Accordion } from './editor/sidePanel/Accordion';
+export { default as ChildObject } from './editor/sidePanel/ChildObject';
+export { default as ContainerObject } from './editor/sidePanel/ContainerObject';
+export { default as Inspector } from './editor/sidePanel/inspector/Inspector';
+export { default as SceneInspector } from './editor/sidePanel/inspector/SceneInspector';
 export { default as MultiView } from './editor/multiView/MultiView';
 export { default as Editor } from './editor/Editor';

package/types/core/Application.d.ts

@@ -4,7 +4,7 @@ export default class Application {
     channel?: BroadcastChannel | undefined;
     components: Map<string, any>;
     protected _mode: ApplicationMode;
-    constructor(name: string, debugEnabled: boolean, editorHashtag: string);
+    constructor(name: string, debugEnabled: boolean, editorHashtag?: string);
     addComponent(name: string, component: BaseRemote): void;
     dispose(): void;
     send(data: BroadcastData): void;

package/types/core/RemoteController.d.ts

@@ -1,2 +1,2 @@
 import Application from './Application';
-export default function RemoteController(app: Application): void;
+export default function RemoteController(app: Application, appHandlers: any[], editorHandlers: any[]): void;

package/types/core/remote/RemoteComponents.d.ts

@@ -1,5 +1,8 @@
+import Application from '../Application';
 import BaseRemote from './BaseRemote';
+import { BroadcastData } from '../types';
 export default class RemoteComponents extends BaseRemote {
     selectDropdown(dropdown: string, value: any): void;
     updateDropdown(dropdown: string, list: string[]): void;
 }
+export declare function HandleAppRemoteComponents(_: Application, msg: BroadcastData): void;

package/types/core/remote/RemoteTheatre.d.ts

@@ -1,6 +1,7 @@
 import type { IProject, IProjectConfig, ISheet, ISheetObject } from '@theatre/core';
 import Application from '../Application';
 import BaseRemote from './BaseRemote';
+import { BroadcastData } from '../types';
 import type { DataUpdateCallback, VoidCallback } from '../types';
 export default class RemoteTheatre extends BaseRemote {
     project: IProject | undefined;
@@ -14,3 +15,5 @@ export default class RemoteTheatre extends BaseRemote {
     sheetObject(sheetName: string, key: string, props: any, onUpdate?: DataUpdateCallback): ISheetObject | undefined;
     unsubscribe(sheet: ISheetObject): undefined;
 }
+export declare function HandleAppRemoteTheatre(app: Application, msg: BroadcastData): void;
+export declare function HandleEditorRemoteTheatre(app: Application): void;

package/types/core/remote/RemoteThree.d.ts

@@ -1,5 +1,7 @@
-import { Scene } from 'three';
+import { Camera, Scene } from 'three';
 import BaseRemote from './BaseRemote';
+import Application from '../Application';
+import { BroadcastData } from '../types';
 export default class RemoteThree extends BaseRemote {
     scene?: Scene;
     getObject(uuid: string): void;
@@ -8,4 +10,8 @@ export default class RemoteThree extends BaseRemote {
     updateObject(uuid: string, key: string, value: any): void;
     createTexture(uuid: string, key: string, value: any): void;
     setScene(value: Scene): void;
+    addCamera(camera: Camera): void;
+    removeCamera(camera: Camera): void;
 }
+export declare function HandleAppRemoteThree(_: Application, msg: BroadcastData): void;
+export declare function HandleEditorRemoteThree(_: Application, msg: BroadcastData): void;

package/types/core/remote/RemoteTweakpane.d.ts

@@ -1,6 +1,7 @@
 import { Pane } from 'tweakpane';
 import Application from '../Application';
 import BaseRemote from './BaseRemote';
+import { BroadcastData } from '../types';
 import type { DataUpdateCallback, VoidCallback } from '../types';
 export default class RemoteTweakpane extends BaseRemote {
     bindCBs: Map<string, DataUpdateCallback>;
@@ -21,3 +22,4 @@ export default class RemoteTweakpane extends BaseRemote {
     createInspector(): void;
     clearInspector(): void;
 }
+export declare function HandleAppRemoteTweakpane(app: Application, msg: BroadcastData): void;

package/types/core/types.d.ts

@@ -6,7 +6,7 @@ export interface BroadcastData {
 export type ApplicationMode = 'app' | 'editor';
 export type VoidCallback = () => void;
 export type DataUpdateCallback = (data: any) => void;
-export type EditorEvent = 'custom' | 'setSheet' | 'setSheetObject' | 'updateSheetObject' | 'updateTimeline' | 'getObject' | 'setObject' | 'updateObject' | 'setScene' | 'createTexture' | 'requestMethod' | 'addFolder' | 'bindObject' | 'updateBind' | 'addButton' | 'clickButton' | 'selectComponent' | 'draggableListUpdate';
+export type EditorEvent = 'custom' | 'setSheet' | 'setSheetObject' | 'updateSheetObject' | 'updateTimeline' | 'getObject' | 'setObject' | 'updateObject' | 'setScene' | 'createTexture' | 'requestMethod' | 'addCamera' | 'removeCamera' | 'addFolder' | 'bindObject' | 'updateBind' | 'addButton' | 'clickButton' | 'selectComponent' | 'draggableListUpdate';
 export type VoidFunc = () => void;
 export type BroadcastCallback = (data: BroadcastData) => void;
 export type TheatreUpdateCallback = (data: any) => void;

package/types/editor/global.d.ts

@@ -10,4 +10,6 @@ export declare const ToolEvents: {
     UPDATE_OBJECT: string;
     CREATE_TEXTURE: string;
     REQUEST_METHOD: string;
+    ADD_CAMERA: string;
+    REMOVE_CAMERA: string;
 };

package/types/editor/multiView/CameraWindow.d.ts

@@ -2,6 +2,8 @@
 import { Camera } from 'three';
 interface DropdownProps {
     index: number;
+    open: boolean;
+    onToggle: (value: boolean) => void;
     onSelect: (value: string) => void;
     options: string[];
     up?: boolean;

package/types/editor/multiView/MultiView.d.ts

@@ -1,9 +1,13 @@
+import { Scene } from 'three';
 import { MultiViewMode } from './MultiViewData';
 import './MultiView.scss';
 import RemoteThree from '@/core/remote/RemoteThree';
 interface MultiViewProps {
     three: RemoteThree;
     mode?: MultiViewMode;
+    scenes: Map<string, any>;
+    onSceneSet?: (scene: Scene) => void;
+    onSceneUpdate?: (scene: Scene) => void;
 }
 export default function MultiView(props: MultiViewProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/types/editor/sidePanel/SidePanel.d.ts

@@ -0,0 +1,11 @@
+import { Component, ReactNode } from 'react';
+import '../scss/_sidePanel.scss';
+import { SidePanelState } from './types';
+export default class SidePanel extends Component<SidePanelState> {
+    private three;
+    constructor(props: SidePanelState);
+    componentWillUnmount(): void;
+    render(): ReactNode;
+    private setScene;
+    get componentState(): SidePanelState;
+}

package/types/editor/sidePanel/inspector/utils/InspectAnimation.d.ts

@@ -0,0 +1,3 @@
+import RemoteThree from "@/core/remote/RemoteThree";
+import { RemoteObject } from '../../types';
+export default function InspectAnimation(obj: RemoteObject, three: RemoteThree): import("react/jsx-runtime").JSX.Element;

package/types/editor/{sceneHierarchy → sidePanel}/types.d.ts

@@ -8,7 +8,7 @@ export interface ChildObjectProps extends CoreComponentProps {
     child: Object3D;
     three: RemoteThree;
 }
-export interface SceneHierarchyState {
+export interface SidePanelState {
     scene?: Object3D;
     three: RemoteThree;
 }
@@ -58,6 +58,11 @@ export interface RemoteMaterial {
     sheenColor?: Color;
     specularColor?: Color;
 }
+export interface AnimationClipInfo {
+    name: string;
+    duration: number;
+    blendMode: number;
+}
 export interface PerspectiveCameraInfo {
     fov: number;
     zoom: number;
@@ -92,6 +97,7 @@ export interface RemoteObject {
     type: string;
     visible: boolean;
     matrix: number[];
+    animations: AnimationClipInfo[];
     material?: RemoteMaterial | RemoteMaterial[];
     perspectiveCameraInfo?: PerspectiveCameraInfo;
     orthographicCameraInfo?: OrthographicCameraInfo;

package/types/index.d.ts

@@ -14,11 +14,11 @@ export { default as Dropdown } from './editor/components/Dropdown';
 export { default as RemoteController } from './core/RemoteController';
 export { default as InfiniteGridHelper } from './editor/multiView/InfiniteGridHelper';
 export { default as UVMaterial } from './editor/multiView/UVMaterial';
-export { default as SceneHierarchy } from './editor/sceneHierarchy/SceneHierarchy';
-export { default as Accordion } from './editor/sceneHierarchy/Accordion';
-export { default as ChildObject } from './editor/sceneHierarchy/ChildObject';
-export { default as ContainerObject } from './editor/sceneHierarchy/ContainerObject';
-export { default as Inspector } from './editor/sceneHierarchy/inspector/Inspector';
-export { default as SceneInspector } from './editor/sceneHierarchy/inspector/SceneInspector';
+export { default as SidePanel } from './editor/sidePanel/SidePanel';
+export { default as Accordion } from './editor/sidePanel/Accordion';
+export { default as ChildObject } from './editor/sidePanel/ChildObject';
+export { default as ContainerObject } from './editor/sidePanel/ContainerObject';
+export { default as Inspector } from './editor/sidePanel/inspector/Inspector';
+export { default as SceneInspector } from './editor/sidePanel/inspector/SceneInspector';
 export { default as MultiView } from './editor/multiView/MultiView';
 export { default as Editor } from './editor/Editor';

package/src/editor/sceneHierarchy/inspector/Inspector.tsx

@@ -1,97 +0,0 @@
-import { useEffect, useState } from "react";
-import { CoreComponentProps, RemoteObject } from "../types";
-import { ToolEvents, debugDispatcher } from "../../global";
-import './inspector.scss';
-import InspectorField from './InspectorField';
-// Utils
-import { InspectCamera } from "./utils/InspectCamera";
-import { InspectMaterial } from "./utils/InspectMaterial";
-import { InspectTransform } from "./utils/InspectTransform";
-import { InspectLight } from "./utils/InspectLight";
-import { setItemProps } from "../utils";
-
-export default function Inspector(props: CoreComponentProps) {
-  const [lastRefresh, setLastRefresh] = useState(-1);
-  const [currentObject, setCurrentObject] = useState<RemoteObject>({
-    name: '',
-    uuid: '',
-    type: '',
-    visible: false,
-    matrix: [1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1],
-    material: undefined,
-    perspectiveCameraInfo: undefined,
-    orthographicCameraInfo: undefined,
-    lightInfo: undefined,
-  });
-
-  useEffect(() => {
-    function onSelectItem(evt: any) {
-      const obj = evt.value as RemoteObject;
-      setCurrentObject(obj);
-      setLastRefresh(Date.now());
-    }
-
-    debugDispatcher.addEventListener(ToolEvents.SET_OBJECT, onSelectItem);
-    return () => {
-      debugDispatcher.removeEventListener(ToolEvents.SET_OBJECT, onSelectItem);
-    };
-  }, []);
-
-  const objType = currentObject.type.toLowerCase();
-
-  return (
-    <div id="Inspector" className={props.class} key={lastRefresh}>
-      {currentObject.uuid.length > 0 && (
-        <>
-          {/* Core */}
-          <>
-            <InspectorField
-              type="string"
-              title="Name"
-              prop="name"
-              value={currentObject.name}
-              disabled={true}
-            />
-            <InspectorField
-              type="string"
-              title="Type"
-              prop="type"
-              value={currentObject.type}
-              disabled={true}
-            />
-            <InspectorField
-              type="string"
-              title="UUID"
-              prop="uuid"
-              value={currentObject.uuid}
-              disabled={true}
-            />
-            <InspectorField
-              type="boolean"
-              title="Visible"
-              prop="visible"
-              value={currentObject.visible}
-              onChange={(key: string, value: any) => {
-                props.three.updateObject(currentObject.uuid, key, value);
-                const child = props.three.scene?.getObjectByProperty('uuid', currentObject.uuid);
-                if (child !== undefined) setItemProps(child, key, value);
-              }}
-            />
-          </>
-
-          {/* Data */}
-          <>
-            {/* Transform */}
-            {InspectTransform(currentObject, props.three)}
-            {/* Cameras */}
-            {objType.search('camera') > -1 ? InspectCamera(currentObject, props.three) : null}
-            {/* Lights */}
-            {objType.search('light') > -1 ? InspectLight(currentObject, props.three) : null}
-            {/* Material */}
-            {objType.search('mesh') > -1 ? InspectMaterial(currentObject, props.three) : null}
-          </>
-        </>
-      )}
-    </div>
-  );
-}

package/types/editor/sceneHierarchy/SceneHierarchy.d.ts

@@ -1,11 +0,0 @@
-import { Component, ReactNode } from 'react';
-import '../scss/_sceneHierarchy.scss';
-import { SceneHierarchyState } from './types';
-export default class SceneHierarchy extends Component<SceneHierarchyState> {
-    private three;
-    constructor(props: SceneHierarchyState);
-    componentWillUnmount(): void;
-    render(): ReactNode;
-    private setScene;
-    get componentState(): SceneHierarchyState;
-}