actionsbuilder.parameters.js 25 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440
  1. var ActionsBuilder;
  2. (function (ActionsBuilder) {
  3. var Parameters = (function () {
  4. function Parameters(viewer) {
  5. var _this = this;
  6. this._action = null;
  7. this.parametersContainer = document.getElementById("ParametersElementID");
  8. this.parametersHelpElement = document.getElementById("ParametersHelpElementID");
  9. this._viewer = viewer;
  10. window.addEventListener("resize", function (event) {
  11. _this.onResize(event);
  12. });
  13. }
  14. Parameters.prototype.clearParameters = function () {
  15. if (this.parametersContainer.children === null) {
  16. return;
  17. }
  18. while (this.parametersContainer.children.length > 0) {
  19. this.parametersContainer.removeChild(this.parametersContainer.firstChild);
  20. }
  21. };
  22. Parameters.prototype.createParameters = function (action) {
  23. this._action = action;
  24. this.clearParameters();
  25. if (action === null) {
  26. return;
  27. }
  28. this._createHelpSection(action);
  29. this._createNodeSection(action);
  30. var properties = action.properties;
  31. var propertiesResults = action.propertiesResults;
  32. var targetParameterSelect = null;
  33. var targetParameterNameSelect = null;
  34. var propertyPathSelect = null;
  35. var propertyPathOptionalSelect = null;
  36. var booleanSelect = null;
  37. var propertyInput = null;
  38. var propertyPathIndice = -1;
  39. if (properties.length === 0) {
  40. return;
  41. }
  42. for (var i = 0; i < properties.length; i++) {
  43. var separator = document.createElement("hr");
  44. separator.noShade = true;
  45. separator.className = "ParametersElementSeparatorClass";
  46. this.parametersContainer.appendChild(separator);
  47. var parameterName = document.createElement("a");
  48. parameterName.text = properties[i].text;
  49. parameterName.className = "ParametersElementTitleClass";
  50. this.parametersContainer.appendChild(parameterName);
  51. if (properties[i].text === "parameter" || properties[i].text === "target" || properties[i].text === "parent") {
  52. targetParameterSelect = document.createElement("select");
  53. targetParameterSelect.className = "ParametersElementSelectClass";
  54. this.parametersContainer.appendChild(targetParameterSelect);
  55. targetParameterNameSelect = document.createElement("select");
  56. targetParameterNameSelect.className = "ParametersElementSelectClass";
  57. this.parametersContainer.appendChild(targetParameterNameSelect);
  58. (this._parameterTargetChanged(targetParameterSelect, targetParameterNameSelect, propertyPathSelect, propertyPathOptionalSelect, i))(null);
  59. targetParameterSelect.value = propertiesResults[i].targetType;
  60. targetParameterNameSelect.value = propertiesResults[i].value;
  61. targetParameterSelect.onchange = this._parameterTargetChanged(targetParameterSelect, targetParameterNameSelect, propertyPathSelect, propertyPathOptionalSelect, i);
  62. targetParameterNameSelect.onchange = this._parameterTargetNameChanged(targetParameterSelect, targetParameterNameSelect, i);
  63. }
  64. else if (properties[i].text === "propertyPath") {
  65. propertyPathIndice = i;
  66. propertyPathSelect = document.createElement("select");
  67. propertyPathSelect.className = "ParametersElementSelectClass";
  68. this.parametersContainer.appendChild(propertyPathSelect);
  69. propertyPathOptionalSelect = document.createElement("select");
  70. propertyPathOptionalSelect.className = "ParametersElementSelectClass";
  71. this.parametersContainer.appendChild(propertyPathOptionalSelect);
  72. (this._propertyPathSelectChanged(targetParameterSelect, propertyPathSelect, propertyPathOptionalSelect, null, null, i))(null);
  73. var property = this._action.propertiesResults[i].value.split(".");
  74. if (property.length > 0) {
  75. if (property.length === 1) {
  76. propertyPathSelect.value = property[0];
  77. }
  78. else {
  79. var completePropertyPath = "";
  80. for (var j = 0; j < property.length - 1; j++) {
  81. completePropertyPath += property[j];
  82. completePropertyPath += (j === property.length - 2) ? "" : ".";
  83. }
  84. propertyPathSelect.value = completePropertyPath;
  85. this._viewer.utils.setElementVisible(propertyPathOptionalSelect, true);
  86. }
  87. this._fillAdditionalPropertyPath(targetParameterSelect, propertyPathSelect, propertyPathOptionalSelect);
  88. propertyPathOptionalSelect.value = property[property.length - 1];
  89. if (propertyPathOptionalSelect.options.length === 0 || propertyPathOptionalSelect.options[0].text === "") {
  90. this._viewer.utils.setElementVisible(propertyPathOptionalSelect, false);
  91. }
  92. }
  93. targetParameterSelect.onchange = this._parameterTargetChanged(targetParameterSelect, targetParameterNameSelect, propertyPathSelect, propertyPathOptionalSelect, i - 1);
  94. propertyPathSelect.onchange = this._propertyPathSelectChanged(targetParameterSelect, propertyPathSelect, propertyPathOptionalSelect, null, null, i);
  95. propertyPathOptionalSelect.onchange = this._additionalPropertyPathSelectChanged(propertyPathSelect, propertyPathOptionalSelect, i);
  96. }
  97. else if (properties[i].text === "operator") {
  98. var conditionOperatorSelect = document.createElement("select");
  99. conditionOperatorSelect.className = "ParametersElementSelectClass";
  100. this.parametersContainer.appendChild(conditionOperatorSelect);
  101. (this._conditionOperatorSelectChanged(conditionOperatorSelect, i))(null);
  102. conditionOperatorSelect.value = propertiesResults[i].value;
  103. conditionOperatorSelect.onchange = this._conditionOperatorSelectChanged(conditionOperatorSelect, i);
  104. }
  105. else if (properties[i].text === "sound") {
  106. var soundSelect = document.createElement("select");
  107. soundSelect.className = "ParametersElementSelectClass";
  108. this.parametersContainer.appendChild(soundSelect);
  109. (this._soundSelectChanged(soundSelect, i))(null);
  110. soundSelect.value = propertiesResults[i].value;
  111. soundSelect.onchange = this._soundSelectChanged(soundSelect, i);
  112. }
  113. else {
  114. var isBoolean = propertiesResults[i].value === "true" || propertiesResults[i].value === "false";
  115. var object = this._getObjectFromType(targetParameterSelect.value);
  116. if (object !== null) {
  117. var property = this._action.propertiesResults[i - 1].value.split(".");
  118. for (var j = 0; j < property.length && object !== undefined; j++) {
  119. object = object[property[j]];
  120. if (j === property.length - 1) {
  121. isBoolean = isBoolean || typeof object === "boolean";
  122. }
  123. }
  124. }
  125. booleanSelect = document.createElement("select");
  126. booleanSelect.className = "ParametersElementSelectClass";
  127. this.parametersContainer.appendChild(booleanSelect);
  128. (this._booleanSelectChanged(booleanSelect, i))(null);
  129. booleanSelect.value = propertiesResults[i].value;
  130. booleanSelect.onchange = this._booleanSelectChanged(booleanSelect, i);
  131. propertyInput = document.createElement("input");
  132. propertyInput.value = propertiesResults[i].value;
  133. propertyInput.className = "ParametersElementInputClass";
  134. this.parametersContainer.appendChild(propertyInput);
  135. propertyInput.onkeyup = this._propertyInputChanged(propertyInput, i);
  136. if (propertyPathIndice !== -1 && properties[i].text === "value") {
  137. propertyPathSelect.onchange = this._propertyPathSelectChanged(targetParameterSelect, propertyPathSelect, propertyPathOptionalSelect, booleanSelect, propertyInput, propertyPathIndice);
  138. }
  139. if (isBoolean) {
  140. this._viewer.utils.setElementVisible(booleanSelect, true);
  141. this._viewer.utils.setElementVisible(propertyInput, false);
  142. }
  143. else {
  144. this._viewer.utils.setElementVisible(booleanSelect, false);
  145. this._viewer.utils.setElementVisible(propertyInput, true);
  146. }
  147. }
  148. }
  149. };
  150. Parameters.prototype.onResize = function (event) {
  151. var tools = document.getElementById("ToolsButtonsID");
  152. this.parametersContainer.style.height = window.innerHeight - tools.getBoundingClientRect().height - 25 - 200 + "px";
  153. this.parametersHelpElement.style.height = 200 + "px";
  154. };
  155. Parameters.prototype._booleanSelectChanged = function (booleanSelect, indice) {
  156. var _this = this;
  157. return function (ev) {
  158. if (booleanSelect.options.length === 0) {
  159. var values = ["true", "false"];
  160. for (var i = 0; i < values.length; i++) {
  161. var option = document.createElement("option");
  162. option.value = option.text = values[i];
  163. booleanSelect.options.add(option);
  164. }
  165. }
  166. else {
  167. _this._action.propertiesResults[indice].value = booleanSelect.value;
  168. }
  169. };
  170. };
  171. Parameters.prototype._soundSelectChanged = function (soundSelect, indice) {
  172. var _this = this;
  173. return function (ev) {
  174. if (soundSelect.options.length === 0) {
  175. for (var i = 0; i < ActionsBuilder.SceneElements.SOUNDS.length; i++) {
  176. var option = document.createElement("option");
  177. option.value = option.text = ActionsBuilder.SceneElements.SOUNDS[i];
  178. soundSelect.options.add(option);
  179. }
  180. _this._sortList(soundSelect);
  181. }
  182. else {
  183. _this._action.propertiesResults[indice].value = soundSelect.value;
  184. }
  185. };
  186. };
  187. Parameters.prototype._conditionOperatorSelectChanged = function (conditionOperatorSelect, indice) {
  188. var _this = this;
  189. return function (ev) {
  190. if (conditionOperatorSelect.options.length === 0) {
  191. for (var i = 0; i < ActionsBuilder.SceneElements.OPERATORS.length; i++) {
  192. var option = document.createElement("option");
  193. option.value = option.text = ActionsBuilder.SceneElements.OPERATORS[i];
  194. conditionOperatorSelect.options.add(option);
  195. }
  196. }
  197. else {
  198. _this._action.propertiesResults[indice].value = conditionOperatorSelect.value;
  199. }
  200. };
  201. };
  202. Parameters.prototype._propertyInputChanged = function (propertyInput, indice) {
  203. var _this = this;
  204. return function (ev) {
  205. _this._action.propertiesResults[indice].value = propertyInput.value;
  206. };
  207. };
  208. Parameters.prototype._propertyPathSelectChanged = function (targetParameterSelect, propertyPathSelect, additionalPropertyPathSelect, booleanSelect, propertyInput, indice) {
  209. var _this = this;
  210. return function (event) {
  211. if (propertyPathSelect.options.length === 0) {
  212. var properties = _this._getPropertiesFromType(targetParameterSelect.value);
  213. if (properties !== null) {
  214. for (var i = 0; i < properties.length; i++) {
  215. var option = document.createElement("option");
  216. option.value = option.text = properties[i];
  217. propertyPathSelect.options.add(option);
  218. }
  219. }
  220. }
  221. else {
  222. _this._action.propertiesResults[indice].value = propertyPathSelect.value;
  223. if (booleanSelect !== null && propertyInput !== null) {
  224. var object = _this._getObjectFromType(targetParameterSelect.value);
  225. var isBoolean = false;
  226. if (object !== null) {
  227. var property = _this._action.propertiesResults[indice].value.split(".");
  228. for (var j = 0; j < property.length; j++) {
  229. object = object[property[j]];
  230. if (j === property.length - 1) {
  231. isBoolean = isBoolean || typeof object === "boolean";
  232. }
  233. }
  234. }
  235. if (isBoolean) {
  236. _this._viewer.utils.setElementVisible(booleanSelect, true);
  237. _this._viewer.utils.setElementVisible(propertyInput, false);
  238. }
  239. else {
  240. _this._viewer.utils.setElementVisible(booleanSelect, false);
  241. _this._viewer.utils.setElementVisible(propertyInput, true);
  242. }
  243. }
  244. }
  245. _this._fillAdditionalPropertyPath(targetParameterSelect, propertyPathSelect, additionalPropertyPathSelect);
  246. _this._sortList(propertyPathSelect);
  247. };
  248. };
  249. Parameters.prototype._fillAdditionalPropertyPath = function (targetParameterSelect, propertyPathSelect, additionalPropertyPathSelect) {
  250. additionalPropertyPathSelect.options.length = 0;
  251. var object = this._getObjectFromType(targetParameterSelect.value);
  252. if (object !== null) {
  253. var propertyPath = propertyPathSelect.value.split(".");
  254. for (var i = 0; i < propertyPath.length; i++) {
  255. object = object[propertyPath[i]];
  256. }
  257. }
  258. if (object === null || object === undefined || (typeof (object)).toLowerCase() === "string") {
  259. this._viewer.utils.setElementVisible(additionalPropertyPathSelect, false);
  260. return;
  261. }
  262. var emptyOption = document.createElement("option");
  263. emptyOption.value = emptyOption.text = "";
  264. additionalPropertyPathSelect.add(emptyOption);
  265. for (var thing in object) {
  266. var type = ActionsBuilder.SceneElements.GetInstanceOf(object[thing]);
  267. var index = ActionsBuilder.SceneElements.TYPES.indexOf(type);
  268. if (index !== -1) {
  269. var option = document.createElement("option");
  270. option.value = option.text = thing;
  271. additionalPropertyPathSelect.options.add(option);
  272. emptyOption.text += thing + ", ";
  273. }
  274. }
  275. if (additionalPropertyPathSelect.options.length === 0 || additionalPropertyPathSelect.options[0].text === "") {
  276. this._viewer.utils.setElementVisible(additionalPropertyPathSelect, false);
  277. }
  278. else {
  279. this._viewer.utils.setElementVisible(additionalPropertyPathSelect, true);
  280. }
  281. };
  282. Parameters.prototype._additionalPropertyPathSelectChanged = function (propertyPathSelect, additionalPropertyPathSelect, indice) {
  283. var _this = this;
  284. return function (event) {
  285. var property = propertyPathSelect.value;
  286. var additionalProperty = additionalPropertyPathSelect.value;
  287. if (additionalProperty !== "") {
  288. property += ".";
  289. property += additionalPropertyPathSelect.value;
  290. }
  291. _this._action.propertiesResults[indice].value = property;
  292. };
  293. };
  294. Parameters.prototype._parameterTargetChanged = function (targetParameterSelect, targetParameterNameSelect, propertyPathSelect, additionalPropertyPathSelect, indice) {
  295. var _this = this;
  296. return function (event) {
  297. if (targetParameterSelect.options.length === 0) {
  298. var options = [
  299. { text: "Mesh", targetType: "MeshProperties" },
  300. { text: "Light", targetType: "LightProperties" },
  301. { text: "Camera", targetType: "CameraProperties" },
  302. { text: "Scene", targetType: "SceneProperties" }
  303. ];
  304. targetParameterSelect.options.length = 0;
  305. for (var i = 0; i < options.length; i++) {
  306. var option = document.createElement("option");
  307. option.text = options[i].text;
  308. option.value = options[i].targetType;
  309. targetParameterSelect.options.add(option);
  310. }
  311. targetParameterSelect.value = _this._action.propertiesResults[indice].targetType;
  312. }
  313. else {
  314. _this._action.propertiesResults[indice].targetType = targetParameterSelect.value;
  315. var names = _this._getListFromType(targetParameterSelect.value);
  316. if (names !== null && names.length > 0) {
  317. _this._action.propertiesResults[indice].value = names[0];
  318. }
  319. else {
  320. _this._action.propertiesResults[indice].value = "";
  321. }
  322. if (propertyPathSelect !== null) {
  323. _this._action.propertiesResults[indice + 1].value = "";
  324. }
  325. }
  326. var targetParameterProperties = _this._getTargetFromType(targetParameterSelect.value);
  327. targetParameterNameSelect.options.length = 0;
  328. if (targetParameterProperties !== null) {
  329. for (var i = 0; i < targetParameterProperties.length; i++) {
  330. var option = document.createElement("option");
  331. option.text = option.value = targetParameterProperties[i];
  332. targetParameterNameSelect.options.add(option);
  333. }
  334. }
  335. targetParameterNameSelect.value = _this._action.propertiesResults[indice].value;
  336. if (propertyPathSelect !== null) {
  337. propertyPathSelect.options.length = 0;
  338. additionalPropertyPathSelect.options.length = 0;
  339. _this._propertyPathSelectChanged(targetParameterSelect, propertyPathSelect, additionalPropertyPathSelect, null, null, indice + 1)(null);
  340. }
  341. _this._sortList(targetParameterNameSelect);
  342. _this._sortList(targetParameterSelect);
  343. };
  344. };
  345. Parameters.prototype._parameterTargetNameChanged = function (targetParameterSelect, targetParameterNameSelect, indice) {
  346. var _this = this;
  347. return function (event) {
  348. _this._action.propertiesResults[indice].value = targetParameterNameSelect.value;
  349. };
  350. };
  351. Parameters.prototype._getTargetFromType = function (type) {
  352. if (type === "MeshProperties" || type === "Mesh") {
  353. return ActionsBuilder.SceneElements.MESHES;
  354. }
  355. if (type === "LightProperties" || type === "Light") {
  356. return ActionsBuilder.SceneElements.LIGHTS;
  357. }
  358. if (type === "CameraProperties" || type === "Camera") {
  359. return ActionsBuilder.SceneElements.CAMERAS;
  360. }
  361. return null;
  362. };
  363. Parameters.prototype._getPropertiesFromType = function (type) {
  364. if (type === "MeshProperties" || type === "Mesh") {
  365. return ActionsBuilder.SceneElements.MESH_PROPERTIES;
  366. }
  367. if (type === "LightProperties" || type === "Light") {
  368. return ActionsBuilder.SceneElements.LIGHT_PROPERTIES;
  369. }
  370. if (type === "CameraProperties" || type === "Camera") {
  371. return ActionsBuilder.SceneElements.CAMERA_PROPERTIES;
  372. }
  373. if (type === "SceneProperties" || type === "Scene") {
  374. return ActionsBuilder.SceneElements.SCENE_PROPERTIES;
  375. }
  376. return null;
  377. };
  378. Parameters.prototype._getListFromType = function (type) {
  379. if (type === "MeshProperties" || type === "Mesh") {
  380. return ActionsBuilder.SceneElements.MESHES;
  381. }
  382. if (type === "LightProperties" || type === "Light") {
  383. return ActionsBuilder.SceneElements.LIGHTS;
  384. }
  385. if (type === "CameraProperties" || type === "Camera") {
  386. return ActionsBuilder.SceneElements.CAMERAS;
  387. }
  388. return null;
  389. };
  390. Parameters.prototype._getObjectFromType = function (type) {
  391. if (type === "MeshProperties" || type === "Mesh") {
  392. this._currentObject = ActionsBuilder.SceneElements.MESH;
  393. return ActionsBuilder.SceneElements.MESH;
  394. }
  395. if (type === "LightProperties" || type === "Light") {
  396. this._currentObject = ActionsBuilder.SceneElements.LIGHT;
  397. return ActionsBuilder.SceneElements.LIGHT;
  398. }
  399. if (type === "CameraProperties" || type === "Camera") {
  400. this._currentObject = ActionsBuilder.SceneElements.CAMERA;
  401. return ActionsBuilder.SceneElements.CAMERA;
  402. }
  403. if (type === "SceneProperties" || type === "Scene") {
  404. this._currentObject = ActionsBuilder.SceneElements.SCENE;
  405. return ActionsBuilder.SceneElements.SCENE;
  406. }
  407. return null;
  408. };
  409. Parameters.prototype._createNodeSection = function (action) {
  410. var element = document.createElement("div");
  411. element.style.background = this._viewer.getSelectedNodeColor(action.type, action.node.detached);
  412. element.className = "ParametersElementNodeClass";
  413. var text = document.createElement("a");
  414. text.text = action.name;
  415. text.className = "ParametersElementNodeTextClass";
  416. element.appendChild(text);
  417. this.parametersContainer.appendChild(element);
  418. };
  419. Parameters.prototype._createHelpSection = function (action) {
  420. var element = ActionsBuilder.Elements.GetElementFromName(action.name);
  421. if (element !== null) {
  422. this.parametersHelpElement.textContent = element.description;
  423. }
  424. };
  425. Parameters.prototype._sortList = function (element) {
  426. var options = [];
  427. for (var i = element.options.length - 1; i >= 0; i--) {
  428. options.push(element.removeChild(element.options[i]));
  429. }
  430. options.sort(function (a, b) {
  431. return a.innerHTML.localeCompare(b.innerHTML);
  432. });
  433. for (var i = 0; i < options.length; i++) {
  434. element.options.add(options[i]);
  435. }
  436. };
  437. return Parameters;
  438. })();
  439. ActionsBuilder.Parameters = Parameters;
  440. })(ActionsBuilder || (ActionsBuilder = {}));