From e1e91089ca1b509e4d7311a9717e68a01be3bf09 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Simon=20L=C3=BCbe=C3=9F?= Date: Sun, 17 Nov 2024 19:57:31 +0100 Subject: [PATCH] Filter entities --- .../src/Windows/EntityHierarchyWindow.tsx | 158 ++++++++++++------ .../src/Ultralight/UltralightWindow.bf | 16 -- 2 files changed, 103 insertions(+), 71 deletions(-) diff --git a/GlitchyEditor/EditorUI/src/Windows/EntityHierarchyWindow.tsx b/GlitchyEditor/EditorUI/src/Windows/EntityHierarchyWindow.tsx index 21af3c6..ddf839b 100644 --- a/GlitchyEditor/EditorUI/src/Windows/EntityHierarchyWindow.tsx +++ b/GlitchyEditor/EditorUI/src/Windows/EntityHierarchyWindow.tsx @@ -2,7 +2,7 @@ import {MenuBar, MenuItem} from "../Components/Menu.tsx"; import "./EntityHierarchyWindow.css"; -import {MouseEvent, MouseEventHandler, ReactElement, useEffect} from "react"; +import {MouseEvent, MouseEventHandler, ReactElement, useEffect, useState} from "react"; import IconVisible from "../assets/Icons/AntDesign/eye-visible.svg"; import IconInvisible from "../assets/Icons/AntDesign/eye-invisible.svg"; @@ -12,23 +12,35 @@ import {EngineGlue} from "../EngineGlue"; import {enableMapSet} from "immer" import {Entity, EntityId} from "../Entity.ts"; +import * as sea from "node:sea"; enableMapSet() type EntityMap = { selectedIds: Set; - [id: EntityId]: Entity; + entities: Map; + //[id: EntityId]: Entity; }; const entityHierarchy: EntityMap = { selectedIds: new Set(), - // 0 is hardcoded to be the root. The editor must provide this "pseudo"-entity. - 0: new Entity("Root", 0, []) + entities: new Map([ + [0, new Entity("Root", 0, [1, 2])], + [1, new Entity("Entity 1", 1, [])], + [2, new Entity("Entity 2", 2, [3])], + [3, new Entity("Entity 3 in 2", 3, [])] + ]) + // // 0 is hardcoded to be the root. The editor must provide this "pseudo"-entity. + // 0: new Entity("Root", 0, [1, 2]), + // 1: new Entity("Entity 1", 1, []), + // 2: new Entity("Entity 2", 2, [3]), + // 3: new Entity("Entity 3 in 2", 3, []) }; export default function EntityHierarchyWindow(props: IDockviewPanelProps) { const [entities, updateEntities] = useImmer(entityHierarchy); + const [filterText, setFilterText] = useState(""); useEffect(() => { EngineGlue.onUpdateEntities = (entities: Entity[]) => { @@ -42,12 +54,14 @@ export default function EntityHierarchyWindow(props: IDockviewPanelProps) if (entity.name === "undefined") { - delete draft[entity.id]; + draft.entities.delete(entity.id); + //delete draft[entity.id]; draft.selectedIds.delete(entity.id); } else { - draft[entity.id] = entity; + draft.entities.set(entity.id, entity); + //draft[entity.id] = entity; } } } @@ -67,43 +81,15 @@ export default function EntityHierarchyWindow(props: IDockviewPanelProps) return ( <> - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + ); } -function EntityTreeItem({item, allEntities, updateEntities}: { +function EntityTreeItem({item, allEntities, updateEntities, showAsTree}: { item: Entity, - allEntities: EntityMap, updateEntities: Updater}) : ReactElement + allEntities: EntityMap, updateEntities: Updater, showAsTree: boolean}) : ReactElement { //const [isOpen, setOpen] = useState(false); @@ -148,16 +134,16 @@ function EntityTreeItem({item, allEntities, updateEntities}: { { - item.children.length > 0 && + showAsTree && item.children.length > 0 &&
    { item.children.map((childId) => { - const entity: Entity = allEntities[childId]; + const entity = allEntities.entities.get(childId); if (entity === undefined) return; - return ; + return ; }) }
@@ -170,7 +156,12 @@ function VisibilityToggle({item, onClick, updateEntities} : {item: Entity, onCli function clickHandler(event: MouseEvent) { updateEntities(draft => { - draft[item.id].visible = !item.visible; + const entity = draft.entities.get(item.id) + + if (entity !== undefined) + { + entity.visible = !item.visible; + } }); console.log("Clickidy" + item.visible); @@ -187,20 +178,77 @@ function VisibilityToggle({item, onClick, updateEntities} : {item: Entity, onCli ); } -function EntityTree({items, updateItems}: { items: EntityMap, updateItems: Updater }) +function EntityTree({items, updateItems, entityFilter}: { items: EntityMap, updateItems: Updater, entityFilter: string }) { - return ( -
    - { - items[0].children.map((childId) => { - const entity: Entity = items[childId]; + const rootEntity = items.entities.get(0); - if (entity === undefined) - return; + if (entityFilter.length == 0) + { + return ( +
      + { + rootEntity && rootEntity.children.map((childId) => { + const entity = items.entities.get(childId); - return ; - }) - } -
    - ); + if (entity === undefined) + return; + + return ; + }) + } +
+ ); + } + else + { + return ( +
    + { + Array.from(items.entities).filter(([, entity]) => { + return entity.name.indexOf(entityFilter) != -1 + }).map(([, entity]) => { + return ; + }) + } +
+ ); + } +} + +function EntityMenuBar({searchString, onFilterTextChanged}: { + searchString: string, + onFilterTextChanged: (s: string) => void +}) +{ + return + + + + + + + + + + + + + + + + + + + + + + + + + + + onFilterTextChanged(e.target.value)}/> + ; } diff --git a/GlitchyEditor/src/Ultralight/UltralightWindow.bf b/GlitchyEditor/src/Ultralight/UltralightWindow.bf index ef2b897..1225ddd 100644 --- a/GlitchyEditor/src/Ultralight/UltralightWindow.bf +++ b/GlitchyEditor/src/Ultralight/UltralightWindow.bf @@ -118,22 +118,6 @@ abstract class UltralightWindow { CopyToImmediateTexture(); CopyToBackBuffer(); - - if (Input.IsKeyPressing(Key.A)) - { - ULString str = ulCreateString("window.updateEntities([])"); - ULString exception = null; - ulViewEvaluateScript(_view, str, &exception); - - if (exception != null && ulStringGetLength(exception) != 0) - { - StringView ex = StringView(ulStringGetData(exception), ulStringGetLength(exception)); - - Log.EngineLogger.Error($"Failed to evaluate script: {ex}"); - } - - ulDestroyString(str); - } } private void CreateTexture()