Property.js 33 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910
  1. MWF.require("MWF.widget.Common", null, false);
  2. MWF.require("MWF.widget.JsonTemplate", null, false);
  3. MWF.xApplication.process.FormDesigner.Property = MWF.FCProperty = new Class({
  4. Extends: MWF.widget.Common,
  5. Implements: [Options, Events],
  6. options: {
  7. "style": "default",
  8. "path": "/x_component_process_FormDesigner/property/property.html"
  9. },
  10. initialize: function(module, propertyNode, designer, options){
  11. this.setOptions(options);
  12. this.module = module;
  13. this.form = module.form;
  14. this.data = module.json;
  15. this.htmlPath = this.options.path;
  16. this.designer = designer;
  17. this.maplists = {};
  18. this.propertyNode = propertyNode;
  19. },
  20. load: function(){
  21. if (this.fireEvent("queryLoad")){
  22. MWF.getRequestText(this.htmlPath, function(responseText, responseXML){
  23. this.htmlString = responseText;
  24. this.fireEvent("postLoad");
  25. }.bind(this));
  26. }
  27. this.propertyNode.addEvent("keydown", function(e){e.stopPropagation();});
  28. },
  29. editProperty: function(td){
  30. },
  31. getHtmlString: function(callback){
  32. if (!this.htmlString){
  33. MWF.getRequestText(this.htmlPath, function(responseText, responseXML){
  34. this.htmlString = responseText;
  35. if (callback) callback();
  36. }.bind(this));
  37. }else{
  38. if (callback) callback();
  39. }
  40. },
  41. show: function(){
  42. if (!this.propertyContent){
  43. this.getHtmlString(function(){
  44. if (this.htmlString){
  45. this.JsonTemplate = new MWF.widget.JsonTemplate(this.data, this.htmlString);
  46. this.propertyContent = new Element("div", {"styles": {"overflow": "hidden"}}).inject(this.propertyNode);
  47. this.propertyContent.set("html", this.JsonTemplate.load());
  48. this.setEditNodeEvent();
  49. this.setEditNodeStyles(this.propertyContent);
  50. this.loadPropertyTab();
  51. this.loadMaplist();
  52. this.loadStylesList();
  53. this.loadDivTemplateType();
  54. this.loadPersonInput();
  55. this.loadFormFieldInput();
  56. this.loadScriptArea();
  57. this.loadHtmlEditorArea();
  58. this.loadTreeData();
  59. this.loadArrayList();
  60. this.loadEventsEditor();
  61. this.loadActionArea();
  62. this.loadHTMLArea();
  63. this.loadJSONArea();
  64. this.loadFormSelect();
  65. this.loadViewSelect();
  66. this.loadValidation();
  67. this.loadIconSelect();
  68. // this.loadScriptInput();
  69. //MWF.process.widget.EventsEditor
  70. }
  71. }.bind(this));
  72. }else{
  73. this.propertyContent.setStyle("display", "block");
  74. }
  75. (new Fx.Scroll(layout.desktop.node)).toTop();
  76. },
  77. hide: function(){
  78. //this.JsonTemplate = null;
  79. //this.propertyNode.set("html", "");
  80. if (this.propertyContent) this.propertyContent.setStyle("display", "none");
  81. },
  82. loadTreeData: function(){
  83. var arrays = this.propertyContent.getElements(".MWFTreeData");
  84. arrays.each(function(node){
  85. var title = node.get("title");
  86. var name = node.get("name");
  87. var json = this.data[name];
  88. if (!json) json = [];
  89. MWF.require("MWF.widget.TreeEditor", function(){
  90. var treeEditor = new MWF.widget.TreeEditor(node, {
  91. "title": title,
  92. "maxObj": this.propertyNode.parentElement.parentElement.parentElement,
  93. "onChange": function(){
  94. this.data[name] = treeEditor.toJson();
  95. this.module.json[name] = this.data[name];
  96. this.module._refreshTree();
  97. }.bind(this)
  98. });
  99. treeEditor.load(json);
  100. }.bind(this));
  101. node.addEvent("keydown", function(e){e.stopPropagation();});
  102. }.bind(this));
  103. },
  104. loadJSONArea: function(){
  105. var jsonNode = this.propertyContent.getElement(".MWFJSONArea");
  106. if (jsonNode){
  107. this.propertyTab.pages.each(function(page){
  108. if (page.contentNode == jsonNode.parentElement){
  109. page.setOptions({
  110. "onShow": function(){
  111. jsonNode.empty();
  112. MWF.require("MWF.widget.JsonParse", function(){
  113. this.json = new MWF.widget.JsonParse(this.module.json, jsonNode, null);
  114. this.json.load();
  115. }.bind(this));
  116. }.bind(this)
  117. });
  118. }
  119. }.bind(this));
  120. }
  121. },
  122. loadHTMLArea: function(){
  123. var htmlNode = this.propertyContent.getElement(".MWFHTMLArea");
  124. if (htmlNode){
  125. var copy = this.module.node.clone(true, true);
  126. copy.clearStyles(true);
  127. htmlNode.set("text", copy.outerHTML);
  128. copy.destroy();
  129. this.propertyTab.pages.each(function(page){
  130. if (page.contentNode == htmlNode.parentElement){
  131. page.setOptions({
  132. "onShow": function(){
  133. var copy = this.module.node.clone(true, true);
  134. copy.clearStyles(true);
  135. htmlNode.set("text", copy.outerHTML);
  136. copy.destroy();
  137. }.bind(this)
  138. });
  139. }
  140. }.bind(this));
  141. }
  142. },
  143. loadFormSelect: function(){
  144. var formNodes = this.propertyContent.getElements(".MWFFormSelect");
  145. if (formNodes.length){
  146. this.getFormList(function(){
  147. formNodes.each(function(node){
  148. var select = new Element("select").inject(node);
  149. select.addEvent("change", function(e){
  150. this.setValue(e.target.getParent("div").get("name"), e.target.options[e.target.selectedIndex].value);
  151. }.bind(this));
  152. this.setFormSelectOptions(node, select);
  153. var refreshNode = new Element("div", {"styles": this.form.css.propertyRefreshFormNode}).inject(node);
  154. refreshNode.addEvent("click", function(e){
  155. this.getFormList(function(){
  156. this.setFormSelectOptions(node, select);
  157. }.bind(this), true);
  158. }.bind(this));
  159. //select.addEvent("click", function(e){
  160. // this.setFormSelectOptions(node, select);
  161. //}.bind(this));
  162. }.bind(this));
  163. }.bind(this));
  164. }
  165. },
  166. setFormSelectOptions: function(node, select){
  167. var name = node.get("name");
  168. select.empty();
  169. var option = new Element("option", {"text": "none"}).inject(select);
  170. this.forms.each(function(form){
  171. var option = new Element("option", {
  172. "text": form.name,
  173. "value": form.id,
  174. "selected": (this.data[name]==form.id)
  175. }).inject(select);
  176. }.bind(this));
  177. },
  178. getFormList: function(callback, refresh){
  179. if (!this.forms || refresh){
  180. this.form.designer.actions.listForm(this.form.designer.application.id, function(json){
  181. this.forms = json.data;
  182. if (callback) callback();
  183. }.bind(this));
  184. }else{
  185. if (callback) callback();
  186. }
  187. },
  188. // clearStyles: function(node){
  189. // node.removeProperty("style");
  190. // var subNode = node.getFirst();
  191. // while (subNode){
  192. // this.clearStyles(subNode);
  193. // subNode = subNode.getNext();
  194. // }
  195. // },
  196. loadViewSelect: function(){
  197. var viewNodes = this.propertyContent.getElements(".MWFViewSelect");
  198. if (viewNodes.length){
  199. this.getViewList(function(){
  200. viewNodes.each(function(node){
  201. var select = new Element("select").inject(node);
  202. select.addEvent("change", function(e){
  203. var viewId = e.target.options[e.target.selectedIndex].value;
  204. var viewName = e.target.options[e.target.selectedIndex].get("text");
  205. this.setValue(e.target.getParent("div").get("name"), viewId);
  206. this.setValue(e.target.getParent("div").get("name")+"Name", viewName);
  207. }.bind(this));
  208. this.setViewSelectOptions(node, select);
  209. var refreshNode = new Element("div", {"styles": this.form.css.propertyRefreshFormNode}).inject(node);
  210. refreshNode.addEvent("click", function(e){
  211. this.getViewList(function(){
  212. this.setViewSelectOptions(node, select);
  213. }.bind(this), true);
  214. }.bind(this));
  215. //select.addEvent("click", function(e){
  216. // this.setFormSelectOptions(node, select);
  217. //}.bind(this));
  218. }.bind(this));
  219. }.bind(this));
  220. }
  221. },
  222. setViewSelectOptions: function(node, select){
  223. var name = node.get("name");
  224. select.empty();
  225. var option = new Element("option", {"text": "none"}).inject(select);
  226. this.views.each(function(view){
  227. var option = new Element("option", {
  228. "text": view.name,
  229. "value": view.id,
  230. "selected": (this.data[name]==view.id)
  231. }).inject(select);
  232. }.bind(this));
  233. },
  234. getViewList: function(callback, refresh){
  235. if (!this.views || refresh){
  236. this.form.designer.actions.listView(this.form.designer.application.id, function(json){
  237. this.views = json.data;
  238. if (callback) callback();
  239. }.bind(this));
  240. }else{
  241. if (callback) callback();
  242. }
  243. },
  244. loadValidation: function(){
  245. var nodes = this.propertyContent.getElements(".MWFValidation");
  246. if (nodes.length){
  247. nodes.each(function(node){
  248. var name = node.get("name");
  249. MWF.xDesktop.requireApp("process.FormDesigner", "widget.ValidationEditor", function(){
  250. var validationEditor = new MWF.xApplication.process.FormDesigner.widget.ValidationEditor(node, this.designer, {
  251. "onChange": function(){
  252. var data = validationEditor.getValidationData();
  253. this.data[name] = data;
  254. }.bind(this)
  255. });
  256. validationEditor.load(this.data[name])
  257. }.bind(this));
  258. //new MWF.xApplication.process.FormDesigner.widget.ValidationEditor(node, this.designer);
  259. }.bind(this));
  260. }
  261. },
  262. loadIconSelect: function(){
  263. var nodes = this.propertyContent.getElements(".MWFIcon");
  264. if (nodes.length){
  265. nodes.each(function(node){
  266. var id = node.get("name");
  267. var icon = this.data[id];
  268. var iconNode = new Element("div", {"styles": this.form.css.processIconNode}).inject(node);
  269. if (icon) iconNode.setStyles({"background": "url("+icon+") center center no-repeat"});
  270. var selectNode = new Element("div", {"styles": this.form.css.processIconSelectNode, "text": this.form.designer.lp.selectIcon}).inject(node);
  271. selectNode.addEvent("click", function(){
  272. this.selectIcon(node);
  273. }.bind(this));
  274. }.bind(this));
  275. }
  276. },
  277. selectIcon: function(node){
  278. if (!node.iconMenu){
  279. var iconSelectMenu = new MWF.widget.Menu(node, {"event": "click", "style": "processIcon"});
  280. iconSelectMenu.load();
  281. node.iconMenu = iconSelectMenu;
  282. var _self = this;
  283. for (var i=0; i<=48; i++){
  284. var icon = "/x_component_process_ProcessManager/$Explorer/default/processIcon/process_icon_"+i+".png";
  285. var item = iconSelectMenu.addMenuItem("", "click", function(){
  286. var id = node.get("name");
  287. var src = this.item.getElement("img").get("src");
  288. _self.data[id] = src;
  289. node.getFirst("div").setStyle("background-image", "url("+src+")");
  290. }, icon);
  291. item.iconName = icon;
  292. }
  293. }
  294. },
  295. loadEventsEditor: function(){
  296. var events = this.propertyContent.getElement(".MWFEventsArea");
  297. if (events){
  298. var name = events.get("name");
  299. var eventsObj = this.data[name];
  300. MWF.xDesktop.requireApp("process.FormDesigner", "widget.EventsEditor", function(){
  301. var eventsEditor = new MWF.xApplication.process.FormDesigner.widget.EventsEditor(events, this.designer, {
  302. //"maxObj": this.propertyNode.parentElement.parentElement.parentElement,
  303. "maxObj": this.designer.formContentNode
  304. });
  305. eventsEditor.load(eventsObj);
  306. }.bind(this));
  307. }
  308. },
  309. loadArrayList: function(){
  310. var arrays = this.propertyContent.getElements(".MWFArraylist");
  311. arrays.each(function(node){
  312. var title = node.get("title");
  313. var name = node.get("name");
  314. var arr = this.data[name];
  315. if (!arr) arr = [];
  316. MWF.require("MWF.widget.Arraylist", function(){
  317. var arraylist = new MWF.widget.Arraylist(node, {
  318. "title": title,
  319. "onChange": function(){
  320. this.data[name] = arraylist.toArray();
  321. }.bind(this)
  322. });
  323. arraylist.load(arr);
  324. }.bind(this));
  325. node.addEvent("keydown", function(e){e.stopPropagation();});
  326. }.bind(this));
  327. },
  328. loadHtmlEditorArea: function(){
  329. var htmlAreas = this.propertyContent.getElements(".MWFHtmlEditorArea");
  330. htmlAreas.each(function(node){
  331. var title = node.get("title");
  332. var name = node.get("name");
  333. var scriptContent = this.data[name];
  334. MWF.require("MWF.widget.HtmlEditorArea", function(){
  335. var htmlArea = new MWF.widget.HtmlEditorArea(node, {
  336. "title": title,
  337. //"maxObj": this.propertyNode.parentElement.parentElement.parentElement,
  338. "maxObj": this.designer.formContentNode,
  339. "onChange": function(){
  340. this.data[name] = htmlArea.getValue();
  341. this.changeData(name);
  342. }.bind(this),
  343. "onSave": function(){
  344. this.designer.saveForm();
  345. }.bind(this)
  346. });
  347. htmlArea.load({"code": scriptContent});
  348. }.bind(this));
  349. }.bind(this));
  350. },
  351. loadStylesList: function(){
  352. var styleSelNodes = this.propertyContent.getElements(".MWFFormStyle");
  353. styleSelNodes.each(function(node){
  354. if (this.module.form.stylesList){
  355. if (!this.data.formStyleType) this.data.formStyleType = "default";
  356. Object.each(this.module.form.stylesList, function(s, key){
  357. new Element("option", {
  358. "text": s.name,
  359. "value": key,
  360. "selected": ((!this.data.formStyleType && key=="default") || (this.data.formStyleType==key))
  361. }).inject(node)
  362. }.bind(this));
  363. }else{
  364. node.getParent("tr").setStyle("display", "none");
  365. }
  366. }.bind(this));
  367. },
  368. loadDivTemplateType: function(){
  369. var nodes = this.propertyContent.getElements(".MWFDivTemplate");
  370. if (nodes.length){
  371. var keys = [];
  372. if (this.module.form.stylesList) {
  373. if (this.module.form.stylesList[this.module.form.json.formStyleType]){
  374. var styles = this.module.form.stylesList[this.module.form.json.formStyleType][this.module.moduleName];
  375. if (styles) {
  376. Object.each(styles, function (v, k) {
  377. keys.push(k);
  378. }.bind(this));
  379. }
  380. }
  381. }
  382. nodes.each(function(node){
  383. node.empty();
  384. new Element("option", {
  385. "text": "default",
  386. "value": "default",
  387. "selected": (!this.data.templateType || this.data.templateType=="default")
  388. }).inject(node);
  389. if (keys.length){
  390. keys.each(function(k){
  391. new Element("option", {
  392. "text": styles[k].name,
  393. "value": k,
  394. "selected": (this.data.templateType==k)
  395. }).inject(node)
  396. }.bind(this));
  397. }else{
  398. node.getParent("tr").setStyle("display", "none");
  399. }
  400. }.bind(this));
  401. }
  402. },
  403. loadPersonInput: function(){
  404. var personIdentityNodes = this.propertyContent.getElements(".MWFPersonIdentity");
  405. var personDepartmentNodes = this.propertyContent.getElements(".MWFPersonDepartment");
  406. var personCompanyNodes = this.propertyContent.getElements(".MWFPersonCompany");
  407. var dutyNodes = this.propertyContent.getElements(".MWFDutySelector");
  408. MWF.xDesktop.requireApp("process.ProcessDesigner", "widget.PersonSelector", function(){
  409. personIdentityNodes.each(function(node){
  410. new MWF.xApplication.process.ProcessDesigner.widget.PersonSelector(node, this.form.designer, {
  411. "type": "identity",
  412. "names": this.data[node.get("name")],
  413. "onChange": function(ids){this.savePersonItem(node, ids);}.bind(this)
  414. });
  415. }.bind(this));
  416. personDepartmentNodes.each(function(node){
  417. new MWF.xApplication.process.ProcessDesigner.widget.PersonSelector(node, this.form.designer, {
  418. "type": "department",
  419. "names": this.data[node.get("name")],
  420. "onChange": function(ids){this.savePersonItem(node, ids);}.bind(this)
  421. });
  422. }.bind(this));
  423. personCompanyNodes.each(function(node){
  424. new MWF.xApplication.process.ProcessDesigner.widget.PersonSelector(node, this.form.designer, {
  425. "type": "company",
  426. "names": this.data[node.get("name")],
  427. "onChange": function(ids){this.savePersonItem(node, ids);}.bind(this)
  428. });
  429. }.bind(this));
  430. dutyNodes.each(function(node){
  431. new MWF.xApplication.process.ProcessDesigner.widget.PersonSelector(node, this.form.designer, {
  432. "type": "duty",
  433. "names": this.data[node.get("name")],
  434. "onChange": function(ids){this.addDutyItem(node, ids);}.bind(this),
  435. "onRemoveDuty": function(item){this.removeDutyItem(node, item);}.bind(this)
  436. });
  437. }.bind(this));
  438. }.bind(this));
  439. },
  440. removeDutyItem: function(node, item){
  441. if (item.data.id){
  442. var values = this.data[node.get("name")] || [];
  443. var value = values.filter(function(v){
  444. return v.id == item.data.id;
  445. });
  446. value.each(function(v) {
  447. values = values.erase(v);
  448. });
  449. this.data[node.get("name")] = values;
  450. }
  451. item.node.destroy();
  452. MWF.release(item);
  453. delete item;
  454. },
  455. addDutyItem: function(node, ids){
  456. var value = this.data[node.get("name")] || "";
  457. if (!value) value = "[]";
  458. var values = JSON.decode(value);
  459. ids.each(function(id){
  460. if (id.data.id){
  461. for (var i=0; i<values.length; i++){
  462. if (values[i].id==id.data.id){
  463. values[i].name = id.data.name;
  464. values[i].code = id.data.code;
  465. break;
  466. }
  467. }
  468. }else{
  469. id.data.id = new MWF.widget.UUID().toString();
  470. values.push({"name": id.data.name, "id": id.data.id, "code": id.data.code});
  471. }
  472. }.bind(this));
  473. this.data[node.get("name")] = JSON.encode(values);
  474. },
  475. loadFormFieldInput: function(){
  476. var fieldNodes = this.propertyContent.getElements(".MWFFormFieldPerson");
  477. MWF.xDesktop.requireApp("process.ViewDesigner", "widget.PersonSelector", function(){
  478. fieldNodes.each(function(node){
  479. new MWF.xApplication.process.ViewDesigner.widget.PersonSelector(node, this.form.designer, {
  480. "type": "formField",
  481. "application": this.form.json.application,
  482. "fieldType": "person",
  483. "names": this.data[node.get("name")],
  484. "onChange": function(ids){this.savePersonItem(node, ids);}.bind(this)
  485. });
  486. }.bind(this));
  487. }.bind(this));
  488. },
  489. savePersonItem: function(node, ids){
  490. var values = [];
  491. ids.each(function(id){
  492. values.push(id.data.name);
  493. }.bind(this));
  494. this.data[node.get("name")] = values;
  495. },
  496. loadScriptArea: function(){
  497. var scriptAreas = this.propertyContent.getElements(".MWFScriptArea");
  498. var formulaAreas = this.propertyContent.getElements(".MWFFormulaArea");
  499. this.loadScriptEditor(scriptAreas);
  500. this.loadScriptEditor(formulaAreas, "formula");
  501. },
  502. loadScriptEditor: function(scriptAreas, style){
  503. scriptAreas.each(function(node){
  504. var title = node.get("title");
  505. var name = node.get("name");
  506. var scriptContent = this.data[name];
  507. MWF.require("MWF.widget.ScriptArea", function(){
  508. var scriptArea = new MWF.widget.ScriptArea(node, {
  509. "title": title,
  510. //"maxObj": this.propertyNode.parentElement.parentElement.parentElement,
  511. "maxObj": this.designer.formContentNode,
  512. "onChange": function(){
  513. this.data[name] = scriptArea.toJson();
  514. }.bind(this),
  515. "onSave": function(){
  516. this.designer.saveForm();
  517. }.bind(this),
  518. "style": style || "default"
  519. });
  520. scriptArea.load(scriptContent);
  521. }.bind(this));
  522. }.bind(this));
  523. },
  524. loadActionArea: function(){
  525. var actionAreas = this.propertyContent.getElements(".MWFActionArea");
  526. actionAreas.each(function(node){
  527. var name = node.get("name");
  528. var actionContent = this.data[name];
  529. MWF.xDesktop.requireApp("process.FormDesigner", "widget.ActionsEditor", function(){
  530. var actionEditor = new MWF.xApplication.process.FormDesigner.widget.ActionsEditor(node, this.designer, {
  531. "maxObj": this.propertyNode.parentElement.parentElement.parentElement,
  532. "onChange": function(){
  533. this.data[name] = actionEditor.data;
  534. }.bind(this)
  535. });
  536. actionEditor.load(actionContent);
  537. }.bind(this));
  538. }.bind(this));
  539. },
  540. loadMaplist: function(){
  541. var maplists = this.propertyContent.getElements(".MWFMaplist");
  542. maplists.each(function(node){
  543. var title = node.get("title");
  544. var name = node.get("name");
  545. var collapse = node.get("collapse");
  546. var mapObj = this.data[name];
  547. if (!mapObj) mapObj = {};
  548. MWF.require("MWF.widget.Maplist", function(){
  549. var maplist = new MWF.widget.Maplist(node, {
  550. "title": title,
  551. "collapse": (collapse) ? true : false,
  552. "onChange": function(){
  553. //this.data[name] = maplist.toJson();
  554. //
  555. this.changeJsonDate(name, maplist.toJson());
  556. this.changeStyle(name);
  557. this.changeData(name);
  558. }.bind(this)
  559. });
  560. maplist.load(mapObj);
  561. this.maplists[name] = maplist;
  562. }.bind(this));
  563. }.bind(this));
  564. },
  565. loadPropertyTab: function(){
  566. var tabNodes = this.propertyContent.getElements(".MWFTab");
  567. if (tabNodes.length){
  568. var tmpNode = this.propertyContent.getFirst();
  569. var tabAreaNode = new Element("div", {
  570. "styles": this.form.css.propertyTabNode
  571. }).inject(tmpNode, "before");
  572. MWF.require("MWF.widget.Tab", function(){
  573. var tab = new MWF.widget.Tab(tabAreaNode, {"style": "formPropertyList"});
  574. tab.load();
  575. var tabPages = [];
  576. tabNodes.each(function(node){
  577. var page = tab.addTab(node, node.get("title"), false);
  578. tabPages.push(page);
  579. this.setScrollBar(page.contentNodeArea, "small", null, null);
  580. }.bind(this));
  581. tabPages[0].showTab();
  582. this.propertyTab = tab;
  583. this.designer.resizeNode();
  584. }.bind(this), false);
  585. }
  586. },
  587. setEditNodeEvent: function(){
  588. var property = this;
  589. // var inputs = this.process.propertyListNode.getElements(".editTableInput");
  590. var inputs = this.propertyContent.getElements("input");
  591. inputs.each(function(input){
  592. var jsondata = input.get("name");
  593. if (this.module){
  594. var id = this.module.json.id;
  595. input.set("name", id+jsondata);
  596. }
  597. if (jsondata){
  598. var inputType = input.get("type").toLowerCase();
  599. switch (inputType){
  600. case "radio":
  601. input.addEvent("change", function(e){
  602. property.setRadioValue(jsondata, this);
  603. });
  604. input.addEvent("blur", function(e){
  605. property.setRadioValue(jsondata, this);
  606. });
  607. input.addEvent("keydown", function(e){
  608. e.stopPropagation();
  609. });
  610. property.setRadioValue(jsondata, input);
  611. break;
  612. case "checkbox":
  613. input.addEvent("change", function(e){
  614. property.setCheckboxValue(jsondata, this);
  615. });
  616. input.addEvent("click", function(e){
  617. property.setCheckboxValue(jsondata, this);
  618. });
  619. input.addEvent("keydown", function(e){
  620. e.stopPropagation();
  621. });
  622. break;
  623. default:
  624. input.addEvent("change", function(e){
  625. property.setValue(jsondata, this.value, this);
  626. });
  627. input.addEvent("blur", function(e){
  628. property.setValue(jsondata, this.value, this);
  629. });
  630. input.addEvent("keydown", function(e){
  631. if (e.code==13){
  632. property.setValue(jsondata, this.value, this);
  633. }
  634. e.stopPropagation();
  635. });
  636. }
  637. }
  638. }.bind(this));
  639. var selects = this.propertyContent.getElements("select");
  640. selects.each(function(select){
  641. var jsondata = select.get("name");
  642. if (jsondata){
  643. select.addEvent("change", function(e){
  644. property.setSelectValue(jsondata, this);
  645. });
  646. }
  647. });
  648. var textareas = this.propertyContent.getElements("textarea");
  649. textareas.each(function(input){
  650. var jsondata = input.get("name");
  651. if (jsondata){
  652. input.addEvent("change", function(e){
  653. property.setValue(jsondata, this.value);
  654. });
  655. input.addEvent("blur", function(e){
  656. property.setValue(jsondata, this.value);
  657. });
  658. input.addEvent("keydown", function(e){
  659. e.stopPropagation();
  660. });
  661. }
  662. }.bind(this));
  663. },
  664. changeStyle: function(name){
  665. this.module.setPropertiesOrStyles(name);
  666. },
  667. changeData: function(name, input, oldValue){
  668. this.module._setEditStyle(name, input, oldValue);
  669. },
  670. changeJsonDate: function(key, value){
  671. this.data[key] = value;
  672. },
  673. setRadioValue: function(name, input){
  674. if (input.checked){
  675. var value = input.value;
  676. if (value=="false") value = false;
  677. if (value=="true") value = true;
  678. var oldValue = this.data[name];
  679. this.changeJsonDate(name, value);
  680. this.changeData(name, input, oldValue);
  681. }
  682. },
  683. setCheckboxValue: function(name, input){
  684. var checkboxList = $$("input:[name='"+name+"']");
  685. var values = [];
  686. checkboxList.each(function(checkbox){
  687. if (checkbox.get("checked")){
  688. values.push(checkbox.value);
  689. }
  690. });
  691. var oldValue = this.data[name];
  692. //this.data[name] = values;
  693. this.changeJsonDate(name, values);
  694. this.changeData(name, input, oldValue);
  695. },
  696. setSelectValue: function(name, select){
  697. var idx = select.selectedIndex;
  698. var options = select.getElements("option");
  699. var value = "";
  700. if (options[idx]){
  701. value = options[idx].get("value");
  702. }
  703. var oldValue = this.data[name];
  704. //this.data[name] = value;
  705. this.changeJsonDate(name, value);
  706. this.changeData(name, select, oldValue);
  707. },
  708. setValue: function(name, value, obj){
  709. debugger;
  710. if (name=="id"){
  711. if (value!=this.module.json.id){
  712. if (!value){
  713. this.designer.notice(MWF.APPFD.LP.notNullId, "error", this.module.form.designer.propertyContentArea, {x:"right", y:"bottom"});
  714. obj.focus();
  715. return false;
  716. }else if (this.module.form.json.moduleList[value]){
  717. this.designer.notice("error", MWF.APPFD.LP.repetitionsId, this.module.form.designer.propertyContentArea, {x:"right", y:"bottom"});
  718. obj.focus();
  719. return false;
  720. }else{
  721. var json = this.module.form.json.moduleList[this.module.json.id];
  722. this.module.form.json.moduleList[value]=json;
  723. delete this.module.form.json.moduleList[this.module.json.id];
  724. }
  725. }
  726. }
  727. var oldValue = this.data[name];
  728. //this.data[name] = value;
  729. this.changeJsonDate(name, value);
  730. this.changeData(name, obj, oldValue);
  731. },
  732. setEditNodeStyles: function(node){
  733. var nodes = node.getChildren();
  734. if (nodes.length){
  735. nodes.each(function(el){
  736. var cName = el.get("class");
  737. if (cName){
  738. if (this.form.css[cName]) el.setStyles(this.form.css[cName]);
  739. }
  740. this.setEditNodeStyles(el);
  741. }.bind(this));
  742. }
  743. },
  744. loadScriptInput: function(){
  745. var scriptNodes = this.propertyContent.getElements(".MWFScript");
  746. scriptNodes.each(function(node){
  747. MWF.require("MWF.widget.ScriptEditor", function(){
  748. var script = new MWF.widget.ScriptEditor(node, {
  749. "onPostSave": function(script){
  750. this.saveScriptItem(node, script);
  751. }.bind(this),
  752. "onQueryDelete": function(script){
  753. this.deleteScriptItem(node, script);
  754. }.bind(this)
  755. });
  756. this.setScriptItems(script, node);
  757. }.bind(this));
  758. }.bind(this));
  759. },
  760. deleteScriptItem: function(node, script){
  761. var jsondata = node.get("name");
  762. this.data[jsondata].erase(script.data.id);
  763. this.process.scripts[script.data.id] = null;
  764. delete this.process.scripts[script.data.id];
  765. this.process.process.scriptList.erase(script.data);
  766. },
  767. saveScriptItem: function(node, script){
  768. var jsondata = node.get("name");
  769. var scriptList = this.data[jsondata];
  770. var data = script.data;
  771. var scriptData = this.process.scripts[script.data.id];
  772. if (!scriptData){
  773. this.process.process.scriptList.push(data);
  774. this.process.scripts[script.data.id] = data;
  775. }
  776. if (scriptList.indexOf(data.id) == -1){
  777. this.data[jsondata].push(data.id);
  778. }
  779. },
  780. setScriptItems: function(script, node){
  781. var jsondata = node.get("name");
  782. var scriptList = this.data[jsondata];
  783. scriptList.each(function(id){
  784. if (id){
  785. var data = this.process.scripts[id];
  786. if (data) script.setScriptItem(data);
  787. }
  788. }.bind(this));
  789. }
  790. });
  791. MWF.xApplication.process.FormDesigner.PropertyMulti = new Class({
  792. Extends: MWF.xApplication.process.FormDesigner.Property,
  793. Implements: [Options, Events],
  794. initialize: function(form, modules, propertyNode, designer, options){
  795. this.setOptions(options);
  796. this.modules = modules;
  797. this.form = form;
  798. // this.data = module.json;
  799. this.data = {};
  800. this.htmlPath = this.options.path;
  801. this.designer = designer;
  802. this.maplists = {};
  803. this.propertyNode = propertyNode;
  804. },
  805. load: function(){
  806. if (this.fireEvent("queryLoad")){
  807. MWF.getRequestText(this.htmlPath, function(responseText, responseXML){
  808. this.htmlString = responseText;
  809. MWF.require("MWF.widget.JsonTemplate", function(){
  810. this.fireEvent("postLoad");
  811. }.bind(this));
  812. }.bind(this));
  813. }
  814. },
  815. show: function(){
  816. if (!this.propertyContent){
  817. if (this.htmlString){
  818. this.JsonTemplate = new MWF.widget.JsonTemplate({}, this.htmlString);
  819. this.propertyContent = new Element("div", {"styles": {"overflow": "hidden"}}).inject(this.propertyNode);
  820. this.propertyContent.set("html", this.JsonTemplate.load());
  821. this.setEditNodeEvent();
  822. this.setEditNodeStyles(this.propertyContent);
  823. this.loadPropertyTab();
  824. this.loadMaplist();
  825. this.loadScriptArea();
  826. this.loadTreeData();
  827. this.loadArrayList();
  828. //this.loadEventsEditor();
  829. //this.loadHTMLArea();
  830. //this.loadJSONArea();
  831. // this.loadScriptInput();
  832. //MWF.process.widget.EventsEditor
  833. }
  834. }else{
  835. this.propertyContent.setStyle("display", "block");
  836. }
  837. },
  838. hide: function(){
  839. if (this.propertyContent) this.propertyContent.destroy();
  840. },
  841. changeStyle: function(name){
  842. this.modules.each(function(module){
  843. module.setPropertiesOrStyles(name);
  844. }.bind(this));
  845. },
  846. changeData: function(name, input, oldValue){
  847. this.modules.each(function(module){
  848. module._setEditStyle(name, input, oldValue);
  849. }.bind(this));
  850. },
  851. changeJsonDate: function(key, value){
  852. //alert(key+": "+value );
  853. this.modules.each(function(module){
  854. module.json[key] = value;
  855. }.bind(this));
  856. },
  857. });