NodeInspector.ts 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450
  1. //
  2. // Copyright (c) 2014-2015, THUNDERBEAST GAMES LLC All rights reserved
  3. // LICENSE: Atomic Game Engine Editor and Tools EULA
  4. // Please see LICENSE_ATOMIC_EDITOR_AND_TOOLS.md in repository root for
  5. // license information: https://github.com/AtomicGameEngine/AtomicGameEngine
  6. //
  7. import ScriptWidget = require("ui/ScriptWidget");
  8. import ComponentInspector = require("./ComponentInspector");
  9. import DataBinding = require("./DataBinding");
  10. import CreateComponentButton = require("./CreateComponentButton");
  11. interface ComponentState {
  12. expanded: boolean;
  13. }
  14. interface NodeState {
  15. expanded: boolean;
  16. componentStates: { [id: number]: ComponentState };
  17. }
  18. class NodeInspector extends ScriptWidget {
  19. constructor() {
  20. super();
  21. this.subscribeToEvent(this, "WidgetEvent", (ev) => this.handleWidgetEvent(ev));
  22. this.subscribeToEvent("GizmoMoved", (ev) => this.handleGizmoModed(ev));
  23. this.subscribeToEvent("Update", (ev) => this.handleUpdate(ev));
  24. }
  25. handleUpdate(ev) {
  26. // to keep from spamming UI update we have a little delta on the gizmo updates
  27. if (!this.node) {
  28. this.gizmoMoved = false;
  29. return;
  30. }
  31. if (this.gizmoMoved) {
  32. if (this.updateDelta > 1.0) {
  33. this.updateDelta = 0.0;
  34. }
  35. else {
  36. this.updateDelta -= ev.timeStep;
  37. }
  38. if (this.updateDelta <= 0) {
  39. for (var i in this.bindings) {
  40. this.bindings[i].setWidgetValueFromObject();
  41. }
  42. this.gizmoMoved = false;
  43. this.updateDelta = 0;
  44. }
  45. }
  46. }
  47. handleGizmoModed(ev) {
  48. if (!this.node) return;
  49. this.gizmoMoved = true;
  50. this.updateDelta += .3;
  51. }
  52. handleWidgetEvent(ev: Atomic.UIWidgetEvent) {
  53. var handled = false;
  54. for (var i = 0; i < this.bindings.length; i++) {
  55. if (this.bindings[i].handleWidgetEvent(ev)) {
  56. handled = true;
  57. }
  58. }
  59. // return handled
  60. return handled;
  61. }
  62. getPrefabComponent(node: Atomic.Node): Atomic.PrefabComponent {
  63. if (node.getComponent("PrefabComponent"))
  64. return <Atomic.PrefabComponent>node.getComponent("PrefabComponent");
  65. if (node.parent)
  66. return this.getPrefabComponent(node.parent);
  67. return null;
  68. }
  69. detectPrefab(node: Atomic.Node): boolean {
  70. if (node.getComponent("PrefabComponent"))
  71. return true;
  72. if (node.parent)
  73. return this.detectPrefab(node.parent);
  74. return false;
  75. }
  76. inspect(node: Atomic.Node) {
  77. this.bindings = new Array();
  78. this.node = node;
  79. node.scene.sendEvent("SceneEditSerializable", { serializable: node, operation: 0 });
  80. this.subscribeToEvent(node, "SceneEditSerializableUndoRedo", (data) => this.handleSceneEditSerializableUndoRedoEvent(data));
  81. this.isPrefab = this.detectPrefab(node);
  82. var fd = new Atomic.UIFontDescription();
  83. fd.id = "Vera";
  84. fd.size = 11;
  85. var nlp = new Atomic.UILayoutParams();
  86. nlp.width = 304;
  87. var nodeLayout = this.nodeLayout = new Atomic.UILayout();
  88. nodeLayout.spacing = 4;
  89. nodeLayout.layoutDistribution = Atomic.UI_LAYOUT_DISTRIBUTION_GRAVITY;
  90. nodeLayout.layoutPosition = Atomic.UI_LAYOUT_POSITION_LEFT_TOP;
  91. nodeLayout.layoutParams = nlp;
  92. nodeLayout.axis = Atomic.UI_AXIS_Y;
  93. // node attr layout
  94. var nodeSection = new Atomic.UISection();
  95. nodeSection.id = "node_section";
  96. nodeSection.text = "Node";
  97. nodeSection.value = 1;
  98. nodeLayout.addChild(nodeSection);
  99. var attrsVerticalLayout = new Atomic.UILayout(Atomic.UI_AXIS_Y);
  100. attrsVerticalLayout.spacing = 3;
  101. attrsVerticalLayout.layoutPosition = Atomic.UI_LAYOUT_POSITION_LEFT_TOP;
  102. attrsVerticalLayout.layoutSize = Atomic.UI_LAYOUT_SIZE_AVAILABLE;
  103. nodeSection.contentRoot.addChild(attrsVerticalLayout);
  104. var attrs = node.getAttributes();
  105. for (var i in attrs) {
  106. var attr = <Atomic.AttributeInfo>attrs[i];
  107. if (attr.mode & Atomic.AM_NOEDIT)
  108. continue;
  109. var binding = DataBinding.createBinding(node, attr);
  110. if (!binding)
  111. continue;
  112. var attrLayout = new Atomic.UILayout();
  113. attrLayout.layoutDistribution = Atomic.UI_LAYOUT_DISTRIBUTION_GRAVITY;
  114. var name = new Atomic.UITextField();
  115. name.textAlign = Atomic.UI_TEXT_ALIGN_LEFT;
  116. name.skinBg = "InspectorTextAttrName";
  117. if (attr.type == Atomic.VAR_VECTOR3 || attr.type == Atomic.VAR_COLOR ||
  118. attr.type == Atomic.VAR_QUATERNION) {
  119. attrLayout.axis = Atomic.UI_AXIS_Y;
  120. attrLayout.layoutPosition = Atomic.UI_LAYOUT_POSITION_LEFT_TOP;
  121. attrLayout.skinBg = "InspectorVectorAttrLayout";
  122. }
  123. var bname = attr.name;
  124. if (bname == "Is Enabled")
  125. bname = "Enabled";
  126. name.text = bname;
  127. name.fontDescription = fd;
  128. attrLayout.addChild(name);
  129. attrLayout.addChild(binding.widget);
  130. attrsVerticalLayout.addChild(attrLayout);
  131. this.bindings.push(binding);
  132. }
  133. // PREFAB
  134. if (this.isPrefab) {
  135. var name = new Atomic.UITextField();
  136. name.textAlign = Atomic.UI_TEXT_ALIGN_LEFT;
  137. name.skinBg = "InspectorTextAttrName";
  138. name.text = "Prefab"
  139. name.fontDescription = fd;
  140. var prefabLayout = new Atomic.UILayout();
  141. prefabLayout.layoutDistribution = Atomic.UI_LAYOUT_DISTRIBUTION_GRAVITY;
  142. var saveButton = new Atomic.UIButton();
  143. saveButton.text = "Save";
  144. saveButton.fontDescription = fd;
  145. saveButton.onClick = () => {
  146. var prefabComponent = this.getPrefabComponent(this.node);
  147. if (prefabComponent) {
  148. prefabComponent.savePrefab();
  149. this.sendEvent("EditorActiveNodeChange", { node: this.node });
  150. return true;
  151. }
  152. }
  153. var undoButton = new Atomic.UIButton();
  154. undoButton.text = "Undo";
  155. undoButton.fontDescription = fd;
  156. undoButton.onClick = () => {
  157. var prefabComponent = this.getPrefabComponent(this.node);
  158. if (prefabComponent) {
  159. prefabComponent.undoPrefab();
  160. this.sendEvent("EditorActiveNodeChange", { node: this.node });
  161. return true;
  162. }
  163. }
  164. var breakButton = new Atomic.UIButton();
  165. breakButton.text = "Break";
  166. breakButton.fontDescription = fd;
  167. breakButton.onClick = () => {
  168. var prefabComponent = this.getPrefabComponent(this.node);
  169. if (prefabComponent) {
  170. prefabComponent.breakPrefab();
  171. this.sendEvent("EditorActiveNodeChange", { node: this.node });
  172. return true;
  173. }
  174. }
  175. prefabLayout.addChild(name);
  176. prefabLayout.addChild(saveButton);
  177. prefabLayout.addChild(undoButton);
  178. prefabLayout.addChild(breakButton);
  179. attrsVerticalLayout.addChild(prefabLayout);
  180. }
  181. // COMPONENTS
  182. var components = node.getComponents();
  183. for (var i in components) {
  184. var component = components[i];
  185. //if (component.isTemporary())
  186. // continue;
  187. var ci = new ComponentInspector();
  188. ci.id = "component_section_" + component.id;
  189. ci.inspect(component);
  190. nodeLayout.addChild(ci);
  191. }
  192. this.addChild(nodeLayout);
  193. var button = new CreateComponentButton(node);
  194. nodeLayout.addChild(button);
  195. for (var i in this.bindings) {
  196. this.bindings[i].setWidgetValueFromObject();
  197. this.bindings[i].objectLocked = false;
  198. }
  199. this.loadState();
  200. }
  201. handleSceneEditSerializableUndoRedoEvent(ev) {
  202. for (var i in this.bindings) {
  203. this.bindings[i].objectLocked = true;
  204. this.bindings[i].setWidgetValueFromObject();
  205. this.bindings[i].objectLocked = false;
  206. }
  207. }
  208. saveState() {
  209. var node = this.node;
  210. if (!node.scene)
  211. return;
  212. var nodeStates = NodeInspector.nodeStates[node.scene.id];
  213. if (!nodeStates)
  214. return;
  215. var state = nodeStates[node.id];
  216. if (!state) {
  217. state = nodeStates[node.id] = { expanded: true, componentStates: {} };
  218. }
  219. var section: Atomic.UISection = <Atomic.UISection>this.nodeLayout.getWidget("node_section");
  220. state.expanded = section.value ? true : false;
  221. var components = node.getComponents();
  222. for (var i in components) {
  223. var component = components[i];
  224. var cstate = state.componentStates[component.id];
  225. if (!cstate) {
  226. cstate = state.componentStates[component.id] = { expanded: false };
  227. }
  228. section = <Atomic.UISection>this.nodeLayout.getWidget("component_section_" + component.id);
  229. if (section)
  230. cstate.expanded = section.value ? true : false;
  231. }
  232. }
  233. loadState() {
  234. var node = this.node;
  235. // lookup in node states via scene id
  236. var nodeStates = NodeInspector.nodeStates[node.scene.id];
  237. if (!nodeStates) {
  238. nodeStates = NodeInspector.nodeStates[node.scene.id] = {};
  239. }
  240. // lookup by node id
  241. var state = nodeStates[node.id];
  242. if (!state) {
  243. // we don't have a state, so save default state
  244. this.saveState();
  245. } else {
  246. var section: Atomic.UISection = <Atomic.UISection>this.nodeLayout.getWidget("node_section");
  247. section.value = state.expanded ? 1 : 0;
  248. var components = node.getComponents();
  249. for (var i in components) {
  250. var component = components[i];
  251. var cstate = state.componentStates[component.id];
  252. section = <Atomic.UISection>this.nodeLayout.getWidget("component_section_" + component.id);
  253. if (cstate && section) {
  254. section.value = cstate.expanded ? 1 : 0;
  255. }
  256. }
  257. }
  258. }
  259. isPrefab: boolean;
  260. node: Atomic.Node;
  261. nodeLayout: Atomic.UILayout;
  262. bindings: Array<DataBinding>;
  263. gizmoMoved = false;
  264. updateDelta = 0;
  265. static nodeStates: { [sceneID: number]: { [nodeId: number]: NodeState } } = {};
  266. }
  267. export = NodeInspector;