DataBinding.ts 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493
  1. import InspectorUtils = require("./InspectorUtils");
  2. import EditorUI = require("ui/EditorUI");
  3. class DataBinding {
  4. constructor(object: Atomic.Serializable, attrInfo: Atomic.AttributeInfo, widget: Atomic.UIWidget) {
  5. this.object = object;
  6. this.attrInfo = attrInfo;
  7. this.widget = widget;
  8. }
  9. static createBinding(object: Atomic.Serializable, attrInfo: Atomic.AttributeInfo): DataBinding {
  10. var widget: Atomic.UIWidget = null;
  11. var fd = new Atomic.UIFontDescription();
  12. fd.id = "Vera";
  13. fd.size = 11;
  14. var enumSource = null;
  15. if (attrInfo.type == Atomic.VAR_BOOL) {
  16. var box = new Atomic.UICheckBox();
  17. box.skinBg = "TBGreyCheckBox";
  18. widget = box;
  19. }
  20. else if (attrInfo.type == Atomic.VAR_INT) {
  21. if (attrInfo.enumNames.length) {
  22. enumSource = new Atomic.UISelectItemSource();
  23. for (var i in attrInfo.enumNames) {
  24. enumSource.addItem(new Atomic.UISelectItem(attrInfo.enumNames[i], (Number(i) + 1).toString()));
  25. }
  26. var button = new Atomic.UIButton();
  27. button.fontDescription = fd;
  28. button.text = "Enum Value!";
  29. var lp = new Atomic.UILayoutParams();
  30. lp.width = 140;
  31. button.layoutParams = lp;
  32. widget = button;
  33. } else {
  34. var field = new Atomic.UIEditField();
  35. field.textAlign = Atomic.UI_TEXT_ALIGN_CENTER;
  36. field.fontDescription = fd;
  37. field.skinBg = "TBAttrEditorField";
  38. var lp = new Atomic.UILayoutParams();
  39. lp.width = 140;
  40. field.layoutParams = lp;
  41. widget = field;
  42. }
  43. } else if (attrInfo.type == Atomic.VAR_FLOAT) {
  44. var field = new Atomic.UIEditField();
  45. field.textAlign = Atomic.UI_TEXT_ALIGN_CENTER;
  46. field.fontDescription = fd;
  47. field.skinBg = "TBAttrEditorField";
  48. var lp = new Atomic.UILayoutParams();
  49. lp.width = 140;
  50. field.layoutParams = lp;
  51. widget = field;
  52. }
  53. else if (attrInfo.type == Atomic.VAR_STRING) {
  54. var field = new Atomic.UIEditField();
  55. field.textAlign = Atomic.UI_TEXT_ALIGN_LEFT;
  56. field.skinBg = "TBAttrEditorField";;
  57. field.fontDescription = fd;
  58. var lp = new Atomic.UILayoutParams();
  59. lp.width = 140;
  60. field.layoutParams = lp;
  61. widget = field;
  62. }
  63. else if (attrInfo.type == Atomic.VAR_VECTOR3 || attrInfo.type == Atomic.VAR_QUATERNION) {
  64. var layout = new Atomic.UILayout();
  65. widget = layout;
  66. layout.spacing = 0;
  67. var lp = new Atomic.UILayoutParams();
  68. lp.width = 100;
  69. for (var i: any = 0; i < 3; i++) {
  70. var select = new Atomic.UIInlineSelect();
  71. select.id = String(i + 1);
  72. select.fontDescription = fd;
  73. select.skinBg = "InspectorVectorAttrName";
  74. select.setLimits(-10000000, 10000000);
  75. var editlp = new Atomic.UILayoutParams();
  76. editlp.minWidth = 60;
  77. select.editFieldLayoutParams = editlp;
  78. select.layoutParams = lp;
  79. layout.addChild(select);
  80. }
  81. } else if (attrInfo.type == Atomic.VAR_COLOR) {
  82. var layout = new Atomic.UILayout();
  83. widget = layout;
  84. layout.spacing = 0;
  85. var lp = new Atomic.UILayoutParams();
  86. lp.width = 70;
  87. for (var i: any = 0; i < 4; i++) {
  88. var select = new Atomic.UIInlineSelect();
  89. select.id = String(i + 1);
  90. select.fontDescription = fd;
  91. select.setLimits(-10000000, 10000000);
  92. select.layoutParams = lp;
  93. layout.addChild(select);
  94. }
  95. } else if (attrInfo.type == Atomic.VAR_VECTOR2) {
  96. var layout = new Atomic.UILayout();
  97. widget = layout;
  98. layout.spacing = 0;
  99. var lp = new Atomic.UILayoutParams();
  100. lp.width = 100;
  101. for (var i: any = 0; i < 2; i++) {
  102. var select = new Atomic.UIInlineSelect();
  103. select.id = String(i + 1);
  104. select.fontDescription = fd;
  105. select.skinBg = "InspectorVectorAttrName";
  106. select.setLimits(-10000000, 10000000);
  107. var editlp = new Atomic.UILayoutParams();
  108. editlp.minWidth = 60;
  109. select.editFieldLayoutParams = editlp;
  110. select.layoutParams = lp;
  111. layout.addChild(select);
  112. }
  113. } else if (attrInfo.type == Atomic.VAR_RESOURCEREF && attrInfo.resourceTypeName) {
  114. var importerName = ToolCore.assetDatabase.getResourceImporterName(attrInfo.resourceTypeName);
  115. if (importerName) {
  116. var parent = new Atomic.UILayout();
  117. var o = InspectorUtils.createAttrEditFieldWithSelectButton("", parent);
  118. parent.layoutSize = Atomic.UI_LAYOUT_SIZE_AVAILABLE;
  119. parent.gravity = Atomic.UI_GRAVITY_LEFT_RIGHT;
  120. parent.layoutDistribution = Atomic.UI_LAYOUT_DISTRIBUTION_GRAVITY;
  121. var lp = new Atomic.UILayoutParams();
  122. lp.width = 140;
  123. o.editField.layoutParams = lp;
  124. o.editField.readOnly = true;
  125. // stuff editfield in so can be reference
  126. parent["editField"] = o.editField;
  127. var selectButton = o.selectButton;
  128. selectButton.onClick = () => {
  129. EditorUI.getModelOps().showResourceSelection("Select " + attrInfo.resourceTypeName + " Resource", importerName, function(asset: ToolCore.Asset) {
  130. var resource = asset.getResource(attrInfo.resourceTypeName);
  131. object.setAttribute(attrInfo.name, resource);
  132. if (resource) {
  133. // use the asset name instead of the cache name
  134. if (asset.importer.requiresCacheFile())
  135. o.editField.text = asset.name;
  136. else
  137. o.editField.text = resource.name;
  138. }
  139. else
  140. o.editField.text = "";
  141. });
  142. }
  143. // handle dropping of component on field
  144. o.editField.subscribeToEvent(o.editField, "DragEnded", (ev: Atomic.DragEndedEvent) => {
  145. if (ev.target == o.editField) {
  146. var dragObject = ev.dragObject;
  147. var importer;
  148. if (dragObject.object && dragObject.object.typeName == "Asset") {
  149. var asset = <ToolCore.Asset> dragObject.object;
  150. if (asset.importerTypeName == importerName) {
  151. importer = asset.importer;
  152. }
  153. }
  154. if (importer) {
  155. var resource = asset.getResource(attrInfo.resourceTypeName);
  156. object.setAttribute(attrInfo.name, resource);
  157. if (resource) {
  158. // use the asset name instead of the cache name
  159. if (asset.importer.requiresCacheFile())
  160. o.editField.text = asset.name;
  161. else
  162. o.editField.text = resource.name;
  163. }
  164. else
  165. o.editField.text = "";
  166. }
  167. }
  168. });
  169. widget = parent;
  170. }
  171. }
  172. if (widget) {
  173. var binding = new DataBinding(object, attrInfo, widget);
  174. binding.enumSource = enumSource;
  175. return binding;
  176. }
  177. return null;
  178. }
  179. setWidgetValueFromObject() {
  180. if (this.widgetLocked)
  181. return;
  182. this.widgetLocked = true;
  183. var attrInfo = this.attrInfo;
  184. var object = this.object;
  185. var widget = this.widget;
  186. if (attrInfo.type == Atomic.VAR_BOOL) {
  187. var value = object.getAttribute(attrInfo.name);
  188. widget.value = (value ? 1 : 0);
  189. }
  190. else if (attrInfo.type == Atomic.VAR_VECTOR3) {
  191. var value = object.getAttribute(attrInfo.name);
  192. for (var i = 0; i < 3; i++) {
  193. var select = widget.getWidget((i + 1).toString());
  194. if (select)
  195. select.value = value[i];
  196. }
  197. }
  198. else if (attrInfo.type == Atomic.VAR_VECTOR2) {
  199. var value = object.getAttribute(attrInfo.name);
  200. for (var i = 0; i < 2; i++) {
  201. var select = widget.getWidget((i + 1).toString());
  202. if (select)
  203. select.value = value[i];
  204. }
  205. }
  206. else if (attrInfo.type == Atomic.VAR_QUATERNION) {
  207. var value = object.getAttribute(attrInfo.name);
  208. for (var i = 0; i < 3; i++) {
  209. var select = widget.getWidget((i + 1).toString());
  210. if (select)
  211. select.value = value[i];
  212. }
  213. }
  214. else if (attrInfo.type == Atomic.VAR_STRING) {
  215. var value = object.getAttribute(attrInfo.name);
  216. widget.text = value;
  217. }
  218. else if (attrInfo.type == Atomic.VAR_FLOAT) {
  219. var value = object.getAttribute(attrInfo.name);
  220. widget.text = parseFloat(value.toFixed(5)).toString();
  221. }
  222. else if (attrInfo.type == Atomic.VAR_INT) {
  223. var value = object.getAttribute(attrInfo.name);
  224. if (attrInfo.enumNames.length) {
  225. widget.text = attrInfo.enumNames[value];
  226. }
  227. else {
  228. widget.text = value.toString();
  229. }
  230. }
  231. else if (attrInfo.type == Atomic.VAR_COLOR) {
  232. var value = object.getAttribute(attrInfo.name);
  233. for (var i = 0; i < 4; i++) {
  234. var select = widget.getWidget((i + 1).toString());
  235. if (select)
  236. select.value = value[i];
  237. }
  238. } else if (attrInfo.type == Atomic.VAR_RESOURCEREF && attrInfo.resourceTypeName) {
  239. // for cached resources, use the asset name, otherwise use the resource path name
  240. var resource = <Atomic.Resource> object.getAttribute(attrInfo.name);
  241. var text = "";
  242. if (resource) {
  243. text = resource.name;
  244. var asset = ToolCore.assetDatabase.getAssetByCachePath(resource.name);
  245. if (asset)
  246. text = asset.name;
  247. }
  248. widget["editField"].text = text;
  249. }
  250. this.widgetLocked = false;
  251. }
  252. setObjectValueFromWidget(srcWidget: Atomic.UIWidget) {
  253. if (this.objectLocked)
  254. return;
  255. this.objectLocked = true;
  256. var widget = this.widget;
  257. var object = this.object;
  258. var attrInfo = this.attrInfo;
  259. var type = attrInfo.type;
  260. if (type == Atomic.VAR_BOOL) {
  261. object.setAttribute(attrInfo.name, widget.value ? true : false);
  262. } else if (type == Atomic.VAR_INT) {
  263. object.setAttribute(attrInfo.name, Number(widget.text));
  264. }
  265. else if (type == Atomic.VAR_FLOAT) {
  266. object.setAttribute(attrInfo.name, Number(widget.text));
  267. }
  268. else if (type == Atomic.VAR_STRING) {
  269. object.setAttribute(attrInfo.name, widget.text);
  270. } else if (type == Atomic.VAR_VECTOR3 && srcWidget) {
  271. var value = object.getAttribute(attrInfo.name);
  272. if (srcWidget.id == "1")
  273. value[0] = srcWidget.value;
  274. else if (srcWidget.id == "2")
  275. value[1] = srcWidget.value;
  276. else if (srcWidget.id == "3")
  277. value[2] = srcWidget.value;
  278. object.setAttribute(attrInfo.name, value);
  279. } else if (type == Atomic.VAR_VECTOR2 && srcWidget) {
  280. var value = object.getAttribute(attrInfo.name);
  281. if (srcWidget.id == "1")
  282. value[0] = srcWidget.value;
  283. else if (srcWidget.id == "2")
  284. value[1] = srcWidget.value;
  285. object.setAttribute(attrInfo.name, value);
  286. }
  287. else if (type == Atomic.VAR_QUATERNION && srcWidget) {
  288. var value = object.getAttribute(attrInfo.name);
  289. if (srcWidget.id == "1")
  290. value[0] = srcWidget.value;
  291. else if (srcWidget.id == "2")
  292. value[1] = srcWidget.value;
  293. else if (srcWidget.id == "3")
  294. value[2] = srcWidget.value;
  295. object.setAttribute(attrInfo.name, value);
  296. } else if (type == Atomic.VAR_COLOR && srcWidget) {
  297. var value = object.getAttribute(attrInfo.name);
  298. if (srcWidget.id == "1")
  299. value[0] = srcWidget.value;
  300. else if (srcWidget.id == "2")
  301. value[1] = srcWidget.value;
  302. else if (srcWidget.id == "3")
  303. value[2] = srcWidget.value;
  304. else if (srcWidget.id == "4")
  305. value[3] = srcWidget.value;
  306. object.setAttribute(attrInfo.name, value);
  307. }
  308. this.objectLocked = false;
  309. }
  310. handleWidgetEvent(ev: Atomic.UIWidgetEvent): boolean {
  311. if (this.objectLocked)
  312. return false;
  313. if (ev.type == Atomic.UI_EVENT_TYPE_CLICK) {
  314. var id = this.attrInfo.name + " enum popup";
  315. if (ev.target.id == id) {
  316. this.object.setAttribute(this.attrInfo.name, Number(ev.refid) - 1);
  317. this.setWidgetValueFromObject();
  318. }
  319. else if (this.widget == ev.target && this.attrInfo.enumNames.length) {
  320. if (this.enumSource) {
  321. var menu = new Atomic.UIMenuWindow(ev.target, id);
  322. menu.show(this.enumSource);
  323. }
  324. return true;
  325. }
  326. }
  327. if (ev.type == Atomic.UI_EVENT_TYPE_CHANGED) {
  328. if (this.widget == ev.target || this.widget.isAncestorOf(ev.target)) {
  329. this.setObjectValueFromWidget(ev.target);
  330. return true;
  331. }
  332. }
  333. return false;
  334. }
  335. object: Atomic.Serializable;
  336. objectLocked: boolean = true;
  337. widgetLocked: boolean = false;
  338. attrInfo: Atomic.AttributeInfo;
  339. widget: Atomic.UIWidget;
  340. enumSource: Atomic.UISelectItemSource;
  341. }
  342. export = DataBinding;