Schluffe/nage
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Meh WIP 2

Browse Source
This commit is contained in:
kolaflash
2025-12-30 00:49:51 +01:00
parent 398f88ff94
commit 162a981677
1 changed files with 37 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files
dev/main.tsx
+37 -29
View File
@@ -4,7 +4,6 @@ import { render } from "solid-js/web";
import { InputField } from "#/dev/controls/InputField.tsx"; import { InputField } from "#/dev/controls/InputField.tsx";
import { RangeSlider } from "#/dev/controls/RangeSlider.tsx"; import { RangeSlider } from "#/dev/controls/RangeSlider.tsx";
import { type BrowserFolder, FileBrowser } from "#/dev/FileBrowser.tsx"; import { type BrowserFolder, FileBrowser } from "#/dev/FileBrowser.tsx";
import type { ListItem } from "#/dev/ItemList.tsx";
import { import {
ArrowAutofitHeightIcon, ArrowAutofitHeightIcon,
ArrowAutofitWidthIcon, ArrowAutofitWidthIcon,
@@ -14,6 +13,7 @@ import {
import type { Entity } from "#/engine/Entity"; import type { Entity } from "#/engine/Entity";
import { currentScene, loadScene, type SceneData } from "#/engine/Scene.ts"; import { currentScene, loadScene, type SceneData } from "#/engine/Scene.ts";
import { setScale, viewport } from "#/engine/Viewport.ts"; import { setScale, viewport } from "#/engine/Viewport.ts";
import type { ListItem } from "./ItemList";
import { RemoteItemList } from "./RemoteItemList"; import { RemoteItemList } from "./RemoteItemList";
async function fetchBrowserData(dir: string): Promise<BrowserFolder> { async function fetchBrowserData(dir: string): Promise<BrowserFolder> {
@@ -29,13 +29,13 @@ async function fetchBrowserData(dir: string): Promise<BrowserFolder> {
return new Map([[dir, scenes]]); return new Map([[dir, scenes]]);
} }
function mapSceneEntities(sceneData: SceneData): BrowserFolder { function mapSceneEntitiesOld(sceneData: SceneData): BrowserFolder {
const sets: Record<string, number> = {}; const sets: Record<string, number> = {};
const entites = sceneData.entities.reduce((root, entiry) => { const entites = sceneData.entities.reduce((root, entity) => {
sets[entiry.name] = sets[entity.name] =
sets[entiry.name] === undefined ? 0 : sets[entiry.name] + 1; sets[entity.name] === undefined ? 0 : sets[entity.name] + 1;
root.set(`${entiry.name}:${sets[entiry.name]}`, { root.set(`${entity.name}:${sets[entity.name]}`, {
path: `${entiry.name}:${sets[entiry.name]}`, path: `${entity.name}:${sets[entity.name]}`,
isActive: false, isActive: false,
}); });
return root; return root;
@@ -46,6 +46,19 @@ function mapSceneEntities(sceneData: SceneData): BrowserFolder {
const scenesRaw = await fetchBrowserData("scenes"); const scenesRaw = await fetchBrowserData("scenes");
function mapSceneEntities(sceneData: SceneData): Array<ListItem> {
const sets: Record<string, number> = {};
return sceneData.entities.map((entity, index) => {
sets[entity.name] =
sets[entity.name] === undefined ? 0 : sets[entity.name] + 1;
return {
label: entity.name,
isActive: false,
index,
};
});
}
function adjustGameContainer(gameContainer: HTMLElement, width: number): void { function adjustGameContainer(gameContainer: HTMLElement, width: number): void {
gameContainer.style = `position: relative; top: 0; left: ${width}px; width: ${document.body.offsetWidth - width}px;`; gameContainer.style = `position: relative; top: 0; left: ${width}px; width: ${document.body.offsetWidth - width}px;`;
} }
@@ -101,13 +114,22 @@ const DevTools: Component<{ gameContainer: HTMLElement }> = ({
}; };
let activeEntity = null; let activeEntity = null;
const setActiveEntity = (path: string): void => { const setActiveEntity = (entityItem: ListItem & { index: number }): void => {
const [id, index] = path.split(":"); const instances = currentScene.entityInstanceMap.get(
const instances = currentScene.entityInstanceMap.get(id)!.instances; entityItem.label,
activeEntity = instances[parseInt(index)] as Entity<unknown>; )!.instances;
setEntities(mapActive("entities", path, entities)); console.log(entityItem);
activeEntity = instances[entityItem.index] as Entity<unknown>;
// setEntities(mapActive("entities", path, entities));
console.log(activeEntity); console.log(activeEntity);
}; };
// const setActiveEntity = (path: string): void => {
// const [id, index] = path.split(":");
// const instances = currentScene.entityInstanceMap.get(id)!.instances;
// activeEntity = instances[parseInt(index)] as Entity<unknown>;
// setEntities(mapActive("entities", path, entities));
// console.log(activeEntity);
// };
const [scenes, setScenes] = createSignal(scenesRaw); const [scenes, setScenes] = createSignal(scenesRaw);
@@ -170,25 +192,11 @@ const DevTools: Component<{ gameContainer: HTMLElement }> = ({
</div> </div>
<FileBrowser root={scenes} handler={setCurrentScene} /> <FileBrowser root={scenes} handler={setCurrentScene} />
<FileBrowser root={entities} handler={setActiveEntity} />
<RemoteItemList <RemoteItemList
name={"Sample list"} name={"Entities"}
handler={console.log} handler={setActiveEntity}
fetch={async () => [ fetch={async () => entities()}
{
label: "foo",
isActive: false,
},
{
label: "bar",
isActive: false,
},
{
label: "lol",
isActive: true,
},
]}
/> />
</div> </div>
<div class="tool-bar-resize" onMouseDown={startResizing}></div> <div class="tool-bar-resize" onMouseDown={startResizing}></div>