add tabs ui

src/tea/components/BoxCollider.ts

@@ -45,6 +45,7 @@ export class BoxCollider extends Collider {
 			return null;
 		}
 		var boxCollider = new BoxCollider(app);
+		boxCollider.enabled = json.enabled;
 		boxCollider.center = Tea.Vector3.fromArray(json.center);
 		boxCollider.size = Tea.Vector3.fromArray(json.size);
 		return boxCollider;

src/tea/components/Camera.ts

@@ -430,6 +430,7 @@ export class Camera extends Component {
 			return null;
 		}
 		var camera = new Camera(app);
+		camera.enabled = json.enabled;
 		camera.depth = json.depth;
 		camera.clearFlags = Tea.CameraClearFlags[json.clearFlags as string];
 		camera.fieldOfView = json.fieldOfView;

src/tea/components/Light.ts

@@ -61,6 +61,7 @@ export class Light extends Component {
 			return null;
 		}
 		var light = new Light(app);
+		light.enabled = json.enabled;
 		light.color = Tea.Color.fromArray(json.color);
 		light.intensity = json.intensity;
 		light.range = json.range;

src/tea/components/LineRenderer.ts

@@ -84,6 +84,7 @@ export class LineRenderer extends Renderer {
 			return null;
 		}
 		var lineRenderer = new LineRenderer(app);
+		lineRenderer.enabled = json.enabled;
 		return lineRenderer;
 	}
 

src/tea/components/MeshFilter.ts

@@ -31,6 +31,7 @@ export class MeshFilter extends Component {
 			return null;
 		}
 		var meshFilter = new MeshFilter(app);
+		meshFilter.enabled = json.enabled;
 		meshFilter.mesh = Tea.Mesh.fromJSON(app, json.mesh);
 		return meshFilter;
 	}

src/tea/components/MeshRenderer.ts

@@ -181,6 +181,7 @@ export class MeshRenderer extends Renderer {
 			return null;
 		}
 		var meshRenderer = new MeshRenderer(app);
+		meshRenderer.enabled = json.enabled;
 		meshRenderer.receiveShadows = json.receiveShadows;
 		meshRenderer._wireframe = json.wireframe;
 		meshRenderer.material = Tea.Material.fromJSON(app, json.material);

src/tea/components/ParticleSystem.ts

@@ -290,6 +290,7 @@ export class ParticleSystem extends Component {
 			return null;
 		}
 		var particleSystem = new ParticleSystem(app);
+		particleSystem.enabled = json.enabled;
 		return particleSystem;
 	}
 

src/tea/components/Rigidbody.ts

@@ -319,6 +319,7 @@ export class Rigidbody extends Component {
 			return null;
 		}
 		var rigidbody = new Rigidbody(app);
+		rigidbody.enabled = json.enabled;
 		return rigidbody;
 	}
 

src/tea/components/ShadowMapCamera.ts

@@ -39,6 +39,7 @@ export class ShadowMapCamera extends Camera {
 			return null;
 		}
 		var shadowMapCamera = new ShadowMapCamera(app);
+		shadowMapCamera.enabled = json.enabled;
 		return shadowMapCamera;
 	}
 }

src/tea/components/TextMesh.ts

@@ -225,6 +225,7 @@ export class TextMesh extends Component {
 			return null;
 		}
 		var textMesh = new TextMesh(app);
+		textMesh.enabled = json.enabled;
 		//textMesh.material = Tea.Material.fromJSON(json.material);
 		textMesh._characterSize = json.characterSize;
 		textMesh._lineSpacing = json.lineSpacing;

src/tea/editor/Editor.ts

@@ -30,6 +30,7 @@ import { VResizeBar } from "./basic/VResizeBar";
 import { Panel } from "./containers/Panel";
 import { HLayout } from "./containers/HLayout";
 import { VLayout } from "./containers/VLayout";
+import { Tabs, TabItem } from "./containers/Tabs";
 import { Window } from "./containers/Window";
 
 import { BoxCollider } from "./components/BoxCollider";
@@ -68,6 +69,8 @@ Vue.component("VResizeBar", VResizeBar);
 Vue.component("Panel", Panel);
 Vue.component("HLayout", HLayout);
 Vue.component("VLayout", VLayout);
+Vue.component("Tabs", Tabs);
+Vue.component("TabItem", TabItem);
 Vue.component("Window", Window);
 
 Vue.component("BoxCollider", BoxCollider);
@@ -115,15 +118,22 @@ Vue.component("TextMesh", TextMesh);
 							</VLayout>
 						</Panel>
 					</HLayout>
-					<HLayout class="BottomLayout">
-						<Panel class="BottomPanel">
-							<TreeView ref="project" tabindex="1"></TreeView>
-						</Panel>
-						<Panel class="FileList">
-							<TreeView ref="fileList" tabindex="2"></TreeView>
-						</Panel>
+					<Tabs class="Bottom">
+						<TabItem name="Project">
+							<HLayout class="BottomLayout">
+								<Panel class="BottomPanel">
+									<TreeView ref="project" tabindex="1"></TreeView>
+								</Panel>
+								<Panel class="FileList">
+									<TreeView ref="fileList" tabindex="2"></TreeView>
+								</Panel>
+							</HLayout>
+						</TabItem>
+						<TabItem>
+							test
+						</TabItem>
 						<VResizeBar ref="projectResize" :isTop="true"></VResizeBar>
-					</HLayout>
+					</Tabs>
 				</VLayout>
 				<Panel ref="right" class="RightPanel">
 					<InspectorView ref="inspector"></InspectorView>

src/tea/editor/EditorBehavior.ts

@@ -157,21 +157,24 @@ export class EditorBehavior {
 		var inspectorView = this.editor.inspectorView;
 
 		inspectorView._commands = this.commands;
-		inspectorView.$on("update", (key: string, value: any) => {
-			if (hierarchyView.getSelectedItem() == null) {
-				return;
-			}
-			var object3d = this.hierarchyViewCommand.getSelectedObject();
-			if (object3d == null) {
-				return;
-			}
-			switch (key) {
-				case "name":
-					hierarchyView.getSelectedItem().model.text = value;
-					break;
-				case "rotation":
-					this.objectInspectorCommand.snoozeUpdateTimer(1000);
-					break;
+		inspectorView.$on("update", (type: string, key: string, value: any) => {
+			if (type === "ObjectInspector") {
+				if (hierarchyView.getSelectedItem() == null) {
+					return;
+				}
+				var object3d = this.hierarchyViewCommand.getSelectedObject();
+				if (object3d == null) {
+					return;
+				}
+				this.editorCommand.isChanged = true;
+				switch (key) {
+					case "name":
+						hierarchyView.getSelectedItem().model.text = value;
+						break;
+					case "rotation":
+						this.objectInspectorCommand.snoozeUpdateTimer(1000);
+						break;
+				}
 			}
 		});
 		inspectorView.$on("change", (type: any, property: string, value: any) => {
@@ -273,12 +276,9 @@ export class EditorBehavior {
 	}
 
 	setScene(scene: Tea.Scene) {
-		var onResize = () => {
-			this.updateScreenSize();
-		};
 		var renderer = scene.app.renderer;
-		renderer.removeListener("resize", onResize);
-		renderer.on("resize", onResize);
+		renderer.off("resize", this.updateScreenSize);
+		renderer.on("resize", this.updateScreenSize);
 		renderer.once("update", () => {
 			this.hierarchyViewCommand.update(true);
 		});
@@ -291,7 +291,7 @@ export class EditorBehavior {
 		this.objectInspectorCommand.scene = scene;
 	}
 
-	updateScreenSize(): void {
+	updateScreenSize = (): void => {
 		var app = this.scene.app;
 		var aspect = this.editor.$refs.aspect as SelectAspect;
 		var canvas = this.editor.$refs.canvas as HTMLCanvasElement;

src/tea/editor/ObjectInspector.ts

@@ -2,7 +2,6 @@ import Vue from "vue";
 import Component from "vue-class-component";
 import * as Tea from "../Tea";
 import { ComponentPanel } from "./components/ComponentPanel";
-import { UICommands } from "./commands/UICommands";
 
 @Component({
 	template: `
@@ -38,6 +37,7 @@ import { UICommands } from "./commands/UICommands";
 				v-for="(item, index) in components"
 				:type="item"
 				:key="index"
+				@update="onUpdateComponent"
 				@change="onChangeComponent"
 				@config="onComponentMenu">
 			</ComponentPanel>
@@ -64,7 +64,6 @@ import { UICommands } from "./commands/UICommands";
 	}
 })
 export class ObjectInspector extends Vue {
-	_commands: UICommands;
 	_object3d: Tea.Object3D;
 	name: string;
 	isActive: boolean;
@@ -160,6 +159,7 @@ export class ObjectInspector extends Vue {
 				if (this._object3d != null) {
 					this._object3d.isActive = bValue;
 				}
+				this.$emit("update", "ObjectInspector", "isActive", bValue);
 				break;
 			case "name":
 				var sValue = value as string;
@@ -178,7 +178,7 @@ export class ObjectInspector extends Vue {
 				if (this._object3d != null) {
 					this._object3d.name = sValue;
 				}
-				this.$emit("update", "name", sValue);
+				this.$emit("update", "ObjectInspector", "name", sValue);
 				break;
 		}
 	}
@@ -191,6 +191,7 @@ export class ObjectInspector extends Vue {
 		if (this._object3d != null) {
 			this._object3d.localPosition.set(x, y, z);
 		}
+		this.$emit("update", "ObjectInspector", "position", position);
 	}
 
 	protected onUpdateRotation(x: number, y: number, z: number): void {
@@ -201,7 +202,7 @@ export class ObjectInspector extends Vue {
 		if (this._object3d != null) {
 			this._object3d.localRotation.setEuler(x, y, z);
 		}
-		this.$emit("update", "rotation");
+		this.$emit("update", "ObjectInspector", "rotation", rotation);
 	}
 
 	protected onUpdateScale(x: number, y: number, z: number): void {
@@ -212,6 +213,7 @@ export class ObjectInspector extends Vue {
 		if (this._object3d != null) {
 			this._object3d.localScale.set(x, y, z);
 		}
+		this.$emit("update", "ObjectInspector", "rotation", scale);
 	}
 
 	protected onChangePosition(x: number, y: number, z: number): void {
@@ -241,6 +243,10 @@ export class ObjectInspector extends Vue {
 		});
 	}
 
+	protected onUpdateComponent(property: string, value: any): void {
+		this.$emit("update", "ObjectInspector", property, value);
+	}
+
 	protected onChangeComponent(type: any, property: string, value: any): void {
 		this.$emit("change", type, property, value);
 	}

src/tea/editor/commands/EditorCommand.ts

@@ -16,18 +16,29 @@ export class EditorCommand {
 	inspectorView: InspectorView;
 
 	filename: string;
-	isChanged: boolean;
-
+	protected _isChanged: boolean;
 	protected eventHandler: EventDispatcher;
 
 	constructor() {
 		this.filename = null;
-		this.isChanged = false;
+		this._isChanged = false;
 		this.eventHandler = new EventDispatcher();
+		this.updateWindowTitle();
+	}
+
+	get isChanged(): boolean {
+		return this._isChanged;
+	}
+	set isChanged(value: boolean) {
+		if (this._isChanged === value) {
+			return;
+		}
+		this._isChanged = value;
+		this.updateWindowTitle();
 	}
 
-	newScene(): void {
-		if (this.isChanged) {
+	newScene(force: boolean = false): void {
+		if (force === false && this._isChanged) {
 			this.showConfirmSaveDialog((response: string) => {
 				switch (response) {
 					case "Save":
@@ -39,8 +50,7 @@ export class EditorCommand {
 						this.saveScene();
 						break;
 					case "Don't Save":
-						this.isChanged = false;
-						this.newScene();
+						this.newScene(true);
 						break;
 				}
 			});
@@ -59,9 +69,9 @@ export class EditorCommand {
 		this.editor.setScene(scene);
 	}
 
-	openScene(): void {
+	openScene(force: boolean = false): void {
 		console.log("openScene");
-		if (this.isChanged) {
+		if (force === false && this._isChanged) {
 			this.showConfirmSaveDialog((response: string) => {
 				switch (response) {
 					case "Save":
@@ -73,8 +83,7 @@ export class EditorCommand {
 						this.saveScene();
 						break;
 					case "Don't Save":
-						this.isChanged = false;
-						this.openScene();
+						this.openScene(true);
 						break;
 				}
 			});
@@ -96,7 +105,7 @@ export class EditorCommand {
 
 	saveScene(): void {
 		console.log("saveScene");
-		if (this.isChanged === false) {
+		if (this._isChanged === false) {
 			this.eventHandler.emit("save", null);
 			return;
 		}
@@ -143,6 +152,26 @@ export class EditorCommand {
 		);
 	}
 
+	protected updateWindowTitle(): void {
+		if (remote == null || remote.getCurrentWindow == null) {
+			return;
+		}
+		var window = remote.getCurrentWindow();
+		var title = window.getTitle();
+		var suffix = title.substr(-2);
+		if (this._isChanged) {
+			if (suffix !== " *") {
+				title += " *";
+				window.setTitle(title);
+			}
+		} else {
+			if (suffix === " *") {
+				title = title.substr(0, title.length - 2);
+				window.setTitle(title);
+			}
+		}
+	}
+
 	protected save(): void {
 		var filename = this.filename;
 		var json = this.scene.toJSON();

src/tea/editor/commands/UICommands.ts

@@ -152,15 +152,15 @@ export class UICommands {
 				}
 				inspectorView.hide();
 				//setTimeout(() => {
-					var commands = this;
+					//var commands = this;
 					inspectorView.component = ObjectInspector.extend({
 						created: function () {
 							//(this as any)._object3d = object3d;
 							var self = this as ObjectInspector;
-							self._commands = commands;
+							//self._commands = commands;
 							self.setObject3D(object3d);
 							object3d = undefined;
-							commands = undefined;
+							//commands = undefined;
 						}
 					});
 					//inspectorView.setObject3D(object3d);