Merge pull request #14 from MetacityTools/dev

Releasing 0.3.0

Author: vojtatom

README.md

@@ -31,16 +31,23 @@ The project is in active development. The roadmap is as follows:
 -   [ ] Hide and show models
 -   [ ] Viewer - Details TBA
 
-### v0.3.1
+### v0.3.1 - 👨‍💻 In progress
 
+-   [ ] Projecting models onto models (2D onto 3D) - ✨WIP https://github.com/vojtatom/geometry
+-   [ ] Styling???
 -   [ ] Loading points and lines from SHP
 -   [ ] Extract Utils to separate SDK form metacity editors
 
-### v0.3.2 - 👨‍💻 In progress
+### v0.3.0 - ✅ Released
 
--   [ ] Projecting models onto models (2D onto 3D) - ✨WIP https://github.com/vojtatom/geometry
--   [ ] Project export
--   [ ] Styling???
+-   [x] Remove the conversion process and support switching between transform and table mode
+    -   [x] add create/remove modifiers for hierarchy
+    -   [x] move hierarchy to Editor Context
+-   [x] Project export and import
+    -   [x] Hierarchy - matadata convert
+    -   [x] Join Models, serialize
+    -   [x] Export
+    -   [x] Import
 
 ### v0.2.1 - ✅ Released
 

package.json

@@ -1,7 +1,7 @@
 {
     "name": "metacity-studio",
     "private": true,
-    "version": "0.2.1",
+    "version": "0.3.0",
     "type": "module",
     "scripts": {
         "dev": "vite",

studio/src/bananagl/models/model.ts

@@ -17,19 +17,15 @@ export class Model extends Renderable {
         return this._shader;
     }
 
-    set shader(shader: Shader) {
-        this._shader = shader;
+    get data() {
+        return this.data_;
     }
 
     set data(data: { [name: string]: any }) {
-        for (const name in data) {
-            const value = data[name];
-            if (value === this.data_[name]) continue;
-            this.data_[name] = value;
-        }
+        this.data_ = data;
     }
 
-    get data() {
-        return this.data_;
+    set shader(shader: Shader) {
+        this._shader = shader;
     }
 }

studio/src/bananagl/models/selectable.ts

@@ -1,4 +1,4 @@
 export interface Selectable {
-    select(submodelIDs: number[]): void;
-    deselect(submodelIDs: number[]): void;
+    select(submodelIDs: Set<number>): void;
+    deselect(submodelIDs: Set<number>): void;
 }

studio/src/bananagl/picking/picker.ts

@@ -46,6 +46,7 @@ export class Picker {
 
     traceRect(rect: RectSelector) {
         const objects = this.scene.objects;
+        const selection: { object: Pickable; primitiveIndices: number[] }[] = [];
 
         for (let objectIndex = 0; objectIndex < objects.length; objectIndex++) {
             const object = objects[objectIndex];
@@ -60,14 +61,15 @@ export class Picker {
 
             const hits = bvh.traceRect(rect);
             if (hits.length > 0)
-                return {
+                selection.push({
                     object: object as Pickable,
                     primitiveIndices: hits,
-                };
+                });
 
             rect.untransform();
         }
-        return null;
+
+        return selection;
     }
 
     private traceObject(ray: Ray, object: Pickable) {

studio/src/components/Editor/Canvas/CanvasView.tsx

@@ -5,6 +5,8 @@ import { useRenderer, useScene } from '@utils/utils';
 
 import * as GL from '@bananagl/bananagl';
 
+import { Button } from '@elements/Button';
+
 import { Controls } from './Controls';
 import { Help } from './Help';
 import { Settings } from './Settings';

studio/src/components/Editor/Canvas/Controls.tsx

@@ -1,15 +1,21 @@
 import { DirectionControls } from './ControlsDirection';
+import { ModeControls } from './ControlsMode';
 import { ProjectionControls } from './ControlsProjection';
 import { SelectionControls } from './ControlsSelect';
 import { ShaderControls } from './ControlsShader';
 
 export function Controls() {
     return (
-        <div className="absolute m-4 space-x-2 left-0 top-0 z-40 flex flex-row">
-            <ProjectionControls />
-            <DirectionControls />
-            <ShaderControls />
-            <SelectionControls />
-        </div>
+        <>
+            <div className="absolute m-4 space-x-2 left-0 top-0 z-0 flex flex-row">
+                <ProjectionControls />
+                <DirectionControls />
+                <ShaderControls />
+                <SelectionControls />
+            </div>
+            <div className="absolute mt-4 space-x-2 right-0 top-0 z-0 flex flex-row">
+                <ModeControls />
+            </div>
+        </>
     );
 }

studio/src/components/Editor/Canvas/ControlsMode.tsx

@@ -0,0 +1,37 @@
+import React from 'react';
+import { VscJson, VscMove } from 'react-icons/vsc';
+
+import * as GL from '@bananagl/bananagl';
+
+import { EditingMode, useEditingMode } from '@editor/Context/EditorContext';
+
+import { MenuButton, MenuGroup } from '@elements/MenuButton';
+
+export function ModeControls() {
+    const [mode, setMode] = useEditingMode();
+
+    const [projection, setProjection] = React.useState<GL.ProjectionType>(
+        GL.ProjectionType.ORTHOGRAPHIC
+    );
+
+    return (
+        <MenuGroup column>
+            <MenuButton
+                onClick={() => setMode(EditingMode.Transform)}
+                tipTitle="Transfomr Editing Mode"
+                active={mode === EditingMode.Transform}
+                column
+            >
+                <VscMove className="text-2xl" />
+            </MenuButton>
+            <MenuButton
+                onClick={() => setMode(EditingMode.Table)}
+                tipTitle="Metadata Editing Mode"
+                active={mode === EditingMode.Table}
+                column
+            >
+                <VscJson className="text-2xl" />
+            </MenuButton>
+        </MenuGroup>
+    );
+}

studio/src/components/Editor/Canvas/ControlsSelect.tsx

@@ -9,7 +9,7 @@ export function SelectionControls() {
     const [select] = useSelection();
 
     const deselect = () => {
-        select(null);
+        select(new Map());
     };
 
     return (

studio/src/components/Editor/Context/EditorContext.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-export enum EditingStage {
+export enum EditingMode {
     Transform,
     Table,
 }
@@ -10,14 +10,14 @@ interface EditorContextProps {
     setProcessing: React.Dispatch<React.SetStateAction<boolean>>;
     loadingStatus: string;
     setLoadingStatus: React.Dispatch<React.SetStateAction<string>>;
-    editingStage: EditingStage;
-    setEditingStage: React.Dispatch<React.SetStateAction<EditingStage>>;
+    editingMode: EditingMode;
+    setEditingMode: React.Dispatch<React.SetStateAction<EditingMode>>;
 }
 
 const context = React.createContext<EditorContextProps>({} as EditorContextProps);
 
 export function EditorContext(props: { children: React.ReactNode }) {
-    const [editingStage, setEditingStage] = React.useState<EditingStage>(EditingStage.Transform);
+    const [editingMode, setEditingMode] = React.useState<EditingMode>(EditingMode.Transform);
     const [loadingStatus, setLoadingStatus] = React.useState<string>('');
     const [processing, setProcessing] = React.useState(false);
 
@@ -28,8 +28,8 @@ export function EditorContext(props: { children: React.ReactNode }) {
                 setProcessing,
                 loadingStatus,
                 setLoadingStatus,
-                editingStage,
-                setEditingStage,
+                editingMode,
+                setEditingMode,
             }}
         >
             {props.children}
@@ -51,10 +51,7 @@ export function useLoadingStatus(): [string, React.Dispatch<React.SetStateAction
     return [loadingStatus, setLoadingStatus];
 }
 
-export function useEditingStage(): [
-    EditingStage,
-    React.Dispatch<React.SetStateAction<EditingStage>>
-] {
-    const { editingStage, setEditingStage } = useEditorContext();
-    return [editingStage, setEditingStage];
+export function useEditingMode(): [EditingMode, React.Dispatch<React.SetStateAction<EditingMode>>] {
+    const { editingMode, setEditingMode } = useEditorContext();
+    return [editingMode, setEditingMode];
 }