renaming object tree objects

src/editor-view/object-tree/inspector/object-tree-inspector.ts

@@ -1,9 +1,9 @@
 import { Editor } from 'core/editor';
 import { DataOrigin } from 'data/editor-data';
 import { Inspector } from 'editor-view/inspector/inspector';
-import { ObjectMapItemModel, ObjectTreeModel } from '../model/object-tree-model';
+import { ObjectTreeNodeModel, ObjectTreeModel } from '../model/object-tree-model';
 import { SearchField } from '../search-field/search-field';
-import { TreeNode } from '../tree-node/tree-node';
+import { ObjectTreeNode } from '../tree-node/tree-object-node';
 import './object-tree-inspector.scss';
 
 export class ObjectTreeInspector extends Inspector {
@@ -32,7 +32,7 @@ export class ObjectTreeInspector extends Inspector {
 		const m = model.getById(obj.__instanceId);
 		if (!m) throw new Error(`Model not found for ${obj.__instanceId}`);
 
-		const node = parent.appendChild(document.createElement(TreeNode.tagName)) as TreeNode;
+		const node = parent.appendChild(document.createElement(ObjectTreeNode.tagName)) as ObjectTreeNode;
 		node.classList.add(`level-${m.level}`);
 		node.onNodeSelect = this.onNodeSelected.bind(this);
 		node.onCollapseStateChanged = this.onNodeCollapseStateChanged.bind(this);
@@ -59,19 +59,19 @@ export class ObjectTreeInspector extends Inspector {
 		}
 	}
 
-	private onNodeSelected(node: TreeNode) {
+	private onNodeSelected(node: ObjectTreeNode) {
 		if (node?.model === this._lastSelectedModel) return;
 		if (this._lastSelectedModel) this._lastSelectedModel.node.clearSelection();
 		this._lastSelectedModel = node.model;
 		Editor.data.selectObject(node.model.obj, DataOrigin.INSPECTOR);
 	}
 
-	private onNodeCollapseStateChanged(node: TreeNode, collapsed: boolean, all: boolean) {
+	private onNodeCollapseStateChanged(node: ObjectTreeNode, collapsed: boolean, all: boolean) {
 		const m = node.model;
 		this.changeCollapseState(m, collapsed, all);
 	}
 
-	private changeCollapseState(model: ObjectMapItemModel, collapsed: boolean, all: boolean) {
+	private changeCollapseState(model: ObjectTreeNodeModel, collapsed: boolean, all: boolean) {
 		model.collapsed = collapsed;
 		if (!(all && model.obj.children?.length)) return;
 		model.obj.children.forEach(child => {
@@ -83,7 +83,7 @@ export class ObjectTreeInspector extends Inspector {
 		});
 	}
 
-	private _lastSelectedModel: ObjectMapItemModel;
+	private _lastSelectedModel: ObjectTreeNodeModel;
 
 	public selectObject(obj: PIXI.DisplayObject, from: DataOrigin) {
 		this._lastSelectedModel?.node.clearSelection();
@@ -94,7 +94,7 @@ export class ObjectTreeInspector extends Inspector {
 		this.expandParents(this._lastSelectedModel.parent);
 	}
 
-	private expandParents(model: ObjectMapItemModel) {
+	private expandParents(model: ObjectTreeNodeModel) {
 		if (model.collapsed && !model.isLeaf) {
 			model.collapsed = false;
 			model.node.expand();

src/editor-view/object-tree/model/object-tree-model.ts

@@ -1,20 +1,20 @@
 import { Editor } from 'core/editor';
 import { PhaserObjectType } from 'data/phaser-meta';
 import { IdUtil } from 'util/id.util';
-import { TreeNode } from '../tree-node/tree-node';
+import { ObjectTreeNode } from '../tree-node/tree-object-node';
 
-export interface ObjectMapItemModel {
+export interface ObjectTreeNodeModel {
 	obj: PIXI.DisplayObject;
 	type: PhaserObjectType;
 	level: number;
 	collapsed: boolean;
 	isLeaf: boolean;
-	node?: TreeNode;
-	parent: ObjectMapItemModel;
+	node?: ObjectTreeNode;
+	parent: ObjectTreeNodeModel;
 }
 
 export class ObjectTreeModel {
-	private objectMap: Record<number, ObjectMapItemModel>;
+	private objectMap: Record<number, ObjectTreeNodeModel>;
 
 	public getById(instanceId: number) { return this.objectMap[instanceId]; }
 
@@ -23,7 +23,7 @@ export class ObjectTreeModel {
 		this.createNode(root, this.objectMap, null, 0);
 	}
 
-	private createNode(child: PIXI.DisplayObject, map: Record<number, ObjectMapItemModel>, parent: ObjectMapItemModel, level: number) {
+	private createNode(child: PIXI.DisplayObject, map: Record<number, ObjectTreeNodeModel>, parent: ObjectTreeNodeModel, level: number) {
 		if (!child.__instanceId) child.__instanceId = IdUtil.genIntId();
 		const type = Editor.meta.getType(child);
 		child.__type = type.name;
@@ -47,7 +47,7 @@ export class ObjectTreeModel {
 		const objects = this.objectMap;
 		filter = filter ? filter.toLowerCase() : '';
 		Object.keys(objects).forEach(k => {
-			const o = objects[k] as ObjectMapItemModel;
+			const o = objects[k] as ObjectTreeNodeModel;
 			if (!o.node) return;
 			if (o.node.title.toLowerCase().indexOf(filter) >= 0)
 				o.node.classList.remove('invisible');

src/editor-view/object-tree/tree-node/tree-node.scss → src/editor-view/object-tree/tree-node/object-tree-node.scss

@@ -1,6 +1,6 @@
 @import 'colors';
 
-phred-tree-node {
+phred-object-tree-node {
 	display: inline-block;
 	cursor: pointer;
 	flex: 1;

src/editor-view/object-tree/tree-node/tree-node.ts → src/editor-view/object-tree/tree-node/tree-object-node.ts

@@ -1,18 +1,18 @@
 import { PhaserObjectType } from 'data/phaser-meta';
-import { ObjectMapItemModel } from '../model/object-tree-model';
-import './tree-node.scss';
+import { ObjectTreeNodeModel } from '../model/object-tree-model';
+import './object-tree-node.scss';
 
 const SELECTED_CLASS = 'selected';
 const COLLAPSED_CLASS = 'collapsed';
 
-export class TreeNode extends HTMLElement {
-	public static readonly tagName: string = 'phred-tree-node';
+export class ObjectTreeNode extends HTMLElement {
+	public static readonly tagName: string = 'phred-object-tree-node';
 
-	public model: ObjectMapItemModel;
+	public model: ObjectTreeNodeModel;
 	private label: HTMLElement;
 	private collapseIcon: HTMLElement;
-	public onNodeSelect: (node: TreeNode) => void;
-	public onCollapseStateChanged: (node: TreeNode, collapsed: boolean, all: boolean) => void;
+	public onNodeSelect: (node: ObjectTreeNode) => void;
+	public onCollapseStateChanged: (node: ObjectTreeNode, collapsed: boolean, all: boolean) => void;
 
 	public updateTitle(type: PhaserObjectType, value: string) {
 		this.label.textContent = value?.length > 0 ? value : type.name;
@@ -25,7 +25,7 @@ export class TreeNode extends HTMLElement {
 		else this.classList.add('object-invisible');
 	}
 
-	public setContent(model: ObjectMapItemModel) {
+	public setContent(model: ObjectTreeNodeModel) {
 		this.model = model;
 		const head = this.appendChild(document.createElement('div'));
 		head.classList.add('node-head');
@@ -82,4 +82,4 @@ export class TreeNode extends HTMLElement {
 	}
 }
 
-customElements.define(TreeNode.tagName, TreeNode);
+customElements.define(ObjectTreeNode.tagName, ObjectTreeNode);