Main.js 86 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933193419351936193719381939194019411942194319441945194619471948194919501951195219531954195519561957195819591960196119621963196419651966196719681969197019711972197319741975197619771978197919801981198219831984198519861987198819891990199119921993199419951996199719981999200020012002200320042005200620072008200920102011201220132014201520162017201820192020202120222023202420252026202720282029203020312032203320342035203620372038203920402041204220432044204520462047204820492050205120522053205420552056205720582059206020612062206320642065206620672068206920702071207220732074207520762077207820792080208120822083208420852086208720882089209020912092209320942095209620972098209921002101210221032104210521062107210821092110211121122113211421152116211721182119212021212122212321242125212621272128212921302131213221332134213521362137213821392140214121422143214421452146214721482149215021512152215321542155
  1. MWF.APPFD = MWF.xApplication.process.FormDesigner;
  2. MWF.APPFD.options = {
  3. "multitask": true,
  4. "executable": false
  5. };
  6. //MWF.xDesktop.requireApp("process.ProcessManager", "Actions.RestActions", null, false);
  7. MWF.xDesktop.requireApp("process.FormDesigner", "Module.Package", null, false);
  8. MWF.xApplication.process.FormDesigner.Main = new Class({
  9. Extends: MWF.xApplication.Common.Main,
  10. Implements: [Options, Events],
  11. options: {
  12. "style": "default",
  13. "template": "form_classical.json",
  14. "templateId": "",
  15. "name": "process.FormDesigner",
  16. "icon": "icon.png",
  17. "title": MWF.APPFD.LP.title,
  18. "appTitle": MWF.APPFD.LP.title,
  19. "id": "",
  20. "actions": null,
  21. "category": null,
  22. "processData": null,
  23. "mvcStyle": "style.css"
  24. },
  25. onQueryLoad: function(){
  26. this._loadCss();
  27. this.shortcut = true;
  28. if (this.status){
  29. if(this.status.id)this.options.id = this.status.id;
  30. }
  31. if (!this.options.id){
  32. this.options.desktopReload = false;
  33. this.options.title = this.options.title + "-"+MWF.APPFD.LP.newForm;
  34. }
  35. this.actions = MWF.Actions.get("x_processplatform_assemble_designer");
  36. this.lp = MWF.xApplication.process.FormDesigner.LP;
  37. if( !this.application && this.options.application ){
  38. this.application = this.options.application;
  39. }
  40. },
  41. loadApplication: function(callback){
  42. this.createNode();
  43. if (!this.options.isRefresh){
  44. this.maxSize(function(){
  45. this.openForm();
  46. }.bind(this));
  47. }else{
  48. this.openForm();
  49. }
  50. this.addKeyboardEvents();
  51. if (callback) callback();
  52. },
  53. addKeyboardEvents: function(){
  54. this.addEvent("copy", function(){
  55. this.copyModule();
  56. }.bind(this));
  57. this.addEvent("paste", function(e){
  58. if( e.target && e.target.tagName && e.target.tagName.toLowerCase() === "textarea" )return;
  59. this.pasteModule();
  60. e.preventDefault();
  61. }.bind(this));
  62. this.addEvent("cut", function(){
  63. this.cutModule();
  64. }.bind(this));
  65. this.addEvent("keySave", function(e){
  66. this.keySave(e);
  67. }.bind(this));
  68. this.addEvent("keyDelete", function(e){
  69. this.keyDelete(e);
  70. }.bind(this));
  71. },
  72. keySave: function(e){
  73. if (this.shortcut) {
  74. if (this.form) this.saveForm();
  75. e.preventDefault();
  76. }
  77. },
  78. keyDelete: function(e){
  79. if (this.form){
  80. if (this.shortcut){
  81. if (this.form.currentSelectedModule){
  82. var module = this.form.currentSelectedModule;
  83. if (module.moduleType!="form" && module.moduleName.indexOf("$")==-1){
  84. module["delete"](module.node);
  85. }
  86. }
  87. }
  88. }
  89. },
  90. copyModule: function(){
  91. if (this.shortcut) {
  92. if (this.form) {
  93. if (this.form.currentSelectedModule) {
  94. var module = this.form.currentSelectedModule;
  95. if (module.moduleType != "form" && module.moduleName.indexOf("$") == -1) {
  96. this.form.fireEvent("queryGetFormData", [module.node]);
  97. var html = module.getHtml();
  98. var json = module.getJson();
  99. this.form.fireEvent("postGetFormData", [module.node]);
  100. MWF.clipboard.data = {
  101. "type": "form",
  102. "data": {
  103. "html": html,
  104. "json": json
  105. }
  106. };
  107. } else {
  108. MWF.clipboard.data = null;
  109. }
  110. }
  111. // }
  112. }
  113. }
  114. },
  115. cutModule: function(){
  116. if (this.shortcut) {
  117. if (this.form) {
  118. if (this.form.currentSelectedModule) {
  119. var module = this.form.currentSelectedModule;
  120. if (module.moduleType != "form" && module.moduleName.indexOf("$") == -1) {
  121. this.copyModule();
  122. var _form = module.form;
  123. if( _form.history ){
  124. module.addHistoryLog("cut");
  125. }
  126. module.destroy();
  127. _form.currentSelectedModule = null;
  128. _form.selected();
  129. _form = null;
  130. }
  131. }
  132. }
  133. }
  134. },
  135. pasteModule: function(){
  136. if (this.shortcut) {
  137. if (this.form) {
  138. if (MWF.clipboard.data) {
  139. if (MWF.clipboard.data.type == "form") {
  140. var datatemplateJsons = [];
  141. var idMap = {};
  142. var html = MWF.clipboard.data.data.html;
  143. var json = Object.clone(MWF.clipboard.data.data.json);
  144. var tmpNode = Element("div", {
  145. "styles": {"display": "none"},
  146. "html": html
  147. }).inject(this.content);
  148. Object.each(json, function (moduleJson) {
  149. var oid = moduleJson.id;
  150. var id = moduleJson.id;
  151. var idx = 1;
  152. while (this.form.json.moduleList[id]) {
  153. id = oid + "_" + idx;
  154. idx++;
  155. }
  156. if (oid != id) {
  157. idMap[oid] = id;
  158. moduleJson.id = id;
  159. var moduleNode = tmpNode.getElementById(oid);
  160. if (moduleNode) moduleNode.set("id", id);
  161. }
  162. if( moduleJson.type === "Datatemplate" )datatemplateJsons.push(moduleJson);
  163. this.form.json.moduleList[moduleJson.id] = moduleJson;
  164. }.bind(this));
  165. json = null;
  166. datatemplateJsons.each(function (json) {
  167. this.checkDatatemplateRelativeId(json, idMap);
  168. }.bind(this));
  169. var injectNode = this.form.node;
  170. var where = "bottom";
  171. var parent = this.form;
  172. if (this.form.currentSelectedModule) {
  173. var toModule = this.form.currentSelectedModule;
  174. injectNode = toModule.node;
  175. parent = toModule;
  176. if (toModule.moduleType != "container" && toModule.moduleType != "form") {
  177. where = "after";
  178. parent = toModule.parentContainer;
  179. }
  180. }
  181. var moduleList = [];
  182. var copyModuleNode = tmpNode.getFirst();
  183. while (copyModuleNode) {
  184. copyModuleNode.inject(injectNode, where);
  185. var copyModuleJson = this.form.getDomjson(copyModuleNode);
  186. var module = this.form.loadModule(copyModuleJson, copyModuleNode, parent);
  187. module._setEditStyle_custom("id");
  188. module.selected();
  189. moduleList.push( module );
  190. copyModuleNode = tmpNode.getFirst();
  191. }
  192. tmpNode.destroy();
  193. tmpNode = null;
  194. if( this.form.history && moduleList.length){
  195. moduleList[0].addHistoryLog("paste", moduleList);
  196. }
  197. }
  198. }
  199. }
  200. }
  201. },
  202. createNode: function(){
  203. this.content.setStyle("overflow", "hidden");
  204. this.node = new Element("div", {
  205. "styles": {"width": "100%", "height": "100%", "overflow": "hidden"}
  206. }).inject(this.content);
  207. },
  208. openForm: function(){
  209. this.initOptions();
  210. this.loadNodes();
  211. this.loadToolbar();
  212. this.loadFormNode();
  213. this.loadProperty();
  214. this.loadTools(function(){
  215. this.resizeNode();
  216. this.addEvent("resize", this.resizeNode.bind(this));
  217. }.bind(this));
  218. this.loadForm();
  219. MWF.require("MWF.widget.ScrollBar", function(){
  220. new MWF.widget.ScrollBar(this.propertyDomScrollArea, {
  221. "style":"default", "where": "before", "distance": 30, "friction": 4, "indent": false, "axis": {"x": false, "y": true}
  222. });
  223. }.bind(this));
  224. MWF.require("MWF.widget.ScrollBar", function(){
  225. new MWF.widget.ScrollBar(this.historyScrollArea, {
  226. "style":"default", "where": "before", "distance": 30, "friction": 4, "indent": false, "axis": {"x": false, "y": true}
  227. });
  228. }.bind(this));
  229. this.checkSidebars();
  230. },
  231. checkSidebars: function(){
  232. this.positionSidebarsFun = this.positionSidebars.bind(this);
  233. this.positionSidebarsId = window.setInterval(this.positionSidebarsFun, 1000);
  234. this.addEvent("queryClose", function(){
  235. if (this.positionSidebarsId){
  236. window.clearInterval(this.positionSidebarsId);
  237. this.positionSidebarsId = "";
  238. }
  239. }.bind(this));
  240. },
  241. positionSidebars: function(){
  242. if (this.pcForm){
  243. this.pcForm.moduleList.each(function(module){
  244. if (module.moduleName === "sidebar") module.position();
  245. }.bind(this));
  246. }
  247. },
  248. initOptions: function(){
  249. this.toolsData = null;
  250. this.toolbarMode = "all";
  251. this.tools = [];
  252. this.toolGroups = [];
  253. this.toolbarDecrease = 0;
  254. this.designNode = null;
  255. this.form = null;
  256. },
  257. loadNodes: function(){
  258. this.toolbarNode = new Element("div", {
  259. "styles": this.css.toolbarNode,
  260. "events": {"selectstart": function(e){e.preventDefault();}}
  261. }).inject(this.node);
  262. this.propertyNode = new Element("div", {
  263. "styles": this.css.propertyNode
  264. }).inject(this.node)
  265. this.formNode = new Element("div", {
  266. "styles": this.css.formNode
  267. }).inject(this.node);
  268. if (this.options.style=="bottom") this.propertyNode.inject(this.formNode, "after");
  269. },
  270. //loadToolbar----------------------
  271. loadToolbar: function(){
  272. this.toolbarTitleNode = new Element("div", {
  273. "styles": this.css.toolbarTitleNode,
  274. "text": MWF.APPFD.LP.tools
  275. }).inject(this.toolbarNode);
  276. this.toolbarTitleActionNode = new Element("div", {
  277. "styles": this.css.toolbarTitleActionNode,
  278. "events": {
  279. "click": function(e){
  280. this.switchToolbarMode();
  281. }.bind(this)
  282. }
  283. }).inject(this.toolbarNode);
  284. this.toolbarTitleCategoryActionNode = new Element("div", {
  285. "styles": this.css.toolbarTitleCategoryActionNode
  286. }).inject(this.toolbarNode);
  287. this.categoryActionMenu = new o2.xDesktop.Menu(this.toolbarTitleCategoryActionNode, {
  288. "event": "click", "style": "flatUser", "offsetX": 0, "offsetY": 0, "container": this.node,
  289. "onQueryShow": this.showCategoryMenu.bind(this)
  290. });
  291. this.categoryActionMenu.load();
  292. this.toolbarGroupContentNode = new Element("div", {"styles": this.css.toolbarGroupContentNode}).inject(this.toolbarNode);
  293. this.toolbarGroupContentNode.addEvent("selectstart", function(e){
  294. e.preventDefault();
  295. e.stopPropagation();
  296. });
  297. },
  298. showCategoryMenu: function(){
  299. this.categoryActionMenu.items.each(function(item){
  300. if (this.currentToolGroup && this.currentToolGroup.data.text==item.options.text){
  301. item.setDisable(true);
  302. var imgDiv = item.item.getFirst();
  303. var img = imgDiv.getElement("img");
  304. if (!img) img = new Element("img", {"styles": item.menu.css.menuItemImg}).inject(imgDiv);
  305. img.set("src", this.path+this.options.style+"/check.png");
  306. }else{
  307. item.setDisable(false);
  308. var imgDiv = item.item.getFirst();
  309. var img = imgDiv.getElement("img");
  310. if (img) img.destroy();
  311. }
  312. }.bind(this));
  313. },
  314. switchToolbarMode: function(){
  315. if (this.toolbarMode=="all"){
  316. var size = this.toolbarNode.getSize();
  317. this.toolbarDecrease = (size.x.toFloat())-60;
  318. this.tools.each(function(node){
  319. node.getLast().setStyle("display", "none");
  320. });
  321. this.toolbarTitleNode.set("text", "");
  322. this.toolbarNode.setStyle("width", "60px");
  323. var formMargin = this.formNode.getStyle("margin-left").toFloat();
  324. formMargin = formMargin - this.toolbarDecrease;
  325. this.formNode.setStyle("margin-left", ""+formMargin+"px");
  326. this.toolbarTitleActionNode.setStyles(this.css.toolbarTitleActionNodeRight);
  327. this.toolbarGroupContentNode.getElements(".o2formModuleTools").hide();
  328. this.toolbarMode="simple";
  329. }else{
  330. sizeX = 60 + this.toolbarDecrease;
  331. var formMargin = this.formNode.getStyle("margin-left").toFloat();
  332. formMargin = formMargin + this.toolbarDecrease;
  333. this.toolbarNode.setStyle("width", ""+sizeX+"px");
  334. this.formNode.setStyle("margin-left", ""+formMargin+"px");
  335. this.tools.each(function(node){
  336. node.getLast().setStyle("display", "block");
  337. });
  338. this.toolbarTitleNode.set("text", MWF.APPFD.LP.tools);
  339. this.toolbarTitleActionNode.setStyles(this.css.toolbarTitleActionNode);
  340. this.toolbarGroupContentNode.getElements(".o2formModuleTools").show();
  341. this.toolbarMode="all";
  342. }
  343. },
  344. //loadFormNode------------------------------
  345. loadFormNode: function(){
  346. this.formToolbarNode = new Element("div", {
  347. "styles": this.css.formToolbarNode
  348. }).inject(this.formNode);
  349. this.loadFormToolbar();
  350. this.formContentNode = new Element("div", {
  351. "styles": this.css.formContentNode
  352. }).inject(this.formNode);
  353. this.loadFormContent(function(){
  354. if (this.designDcoument) this.designDcoument.body.setStyles(this.css.designBody);
  355. if (this.designNode) this.designNode.setStyles(this.css.designNode);
  356. }.bind(this));
  357. },
  358. loaddesignerActionNode: function(){
  359. this.pcDesignerActionNode = this.formToolbarNode.getElement("#MWFFormPCDesignerAction");
  360. this.mobileDesignerActionNode = this.formToolbarNode.getElement("#MWFFormMobileDesignerAction");
  361. this.currentDesignerMode = "PC";
  362. this.pcDesignerActionNode.setStyles(this.css.designerActionNode_current);
  363. this.mobileDesignerActionNode.setStyles(this.css.designerActionNode);
  364. var iconNode = new Element("div", {"styles": this.css.designerActionPcIconNode}).inject(this.pcDesignerActionNode);
  365. iconNode = new Element("div", {"styles": this.css.designerActionMobileIconNode}).inject(this.mobileDesignerActionNode);
  366. var textNode = new Element("div", {"styles": this.css.designerActiontextNode, "text": "PC"}).inject(this.pcDesignerActionNode);
  367. textNode = new Element("div", {"styles": this.css.designerActiontextNode, "text": "Mobile"}).inject(this.mobileDesignerActionNode);
  368. this.pcDesignerActionNode.addEvent("click", function(){
  369. if (this.currentDesignerMode!="PC"){
  370. this.changeDesignerModeToPC();
  371. }
  372. }.bind(this));
  373. this.mobileDesignerActionNode.addEvent("click", function(){
  374. if (this.currentDesignerMode=="PC"){
  375. this.changeDesignerModeToMobile();
  376. }
  377. }.bind(this));
  378. this.formToolbarNode.setStyles({"position":"relative"});
  379. },
  380. changeDesignerModeToPC: function(){
  381. this.pcDesignerActionNode.setStyles(this.css.designerActionNode_current);
  382. this.mobileDesignerActionNode.setStyles(this.css.designerActionNode);
  383. this.designMobileNode.setStyle("display", "none");
  384. this.designNode.setStyle("display", "block");
  385. if (this.form.currentSelectedModule){
  386. if (this.form.currentSelectedModule==this){
  387. return true;
  388. }else{
  389. this.form.currentSelectedModule.unSelected();
  390. }
  391. }
  392. if (this.form.propertyMultiTd){
  393. this.form.propertyMultiTd.hide();
  394. this.form.propertyMultiTd = null;
  395. }
  396. this.form.unSelectedMulti();
  397. if (this.form.designTabPageScriptAreaNode) this.form.designTabPageScriptAreaNode.hide();
  398. this.form = this.pcForm;
  399. if ((this.scriptPage && this.scriptPage.isShow) || this.scriptPanel){
  400. this.loadAllScript();
  401. }
  402. this.currentDesignerMode = "PC";
  403. this.historyArea.show();
  404. this.historyAreaMobile.hide();
  405. this.currentHistoryNode = this.historyArea;
  406. },
  407. changeDesignerModeToMobile: function(){
  408. this.pcDesignerActionNode.setStyles(this.css.designerActionNode);
  409. this.mobileDesignerActionNode.setStyles(this.css.designerActionNode_current);
  410. this.designMobileNode.setStyle("display", "block");
  411. this.designNode.setStyle("display", "none");
  412. if (this.form.currentSelectedModule){
  413. if (this.form.currentSelectedModule==this){
  414. return true;
  415. }else{
  416. this.form.currentSelectedModule.unSelected();
  417. }
  418. }
  419. if (this.form.propertyMultiTd){
  420. this.form.propertyMultiTd.hide();
  421. this.form.propertyMultiTd = null;
  422. }
  423. this.form.unSelectedMulti();
  424. if (!this.mobileForm){
  425. this.mobileForm = new MWF.FCForm(this, this.designMobileNode, {"mode": "Mobile"});
  426. if (!Object.keys(this.formMobileData.json.moduleList).length){
  427. this.formMobileData = Object.clone(this.formData);
  428. }
  429. this.mobileForm.load(this.formMobileData);
  430. }
  431. if (this.form.designTabPageScriptAreaNode) this.form.designTabPageScriptAreaNode.hide();
  432. this.form = this.mobileForm;
  433. if ((this.scriptPage && this.scriptPage.isShow) || this.scriptPanel){
  434. this.loadAllScript();
  435. }
  436. this.currentDesignerMode = "Mobile";
  437. this.historyArea.hide();
  438. this.historyAreaMobile.show();
  439. this.currentHistoryNode = this.historyAreaMobile;
  440. },
  441. loadFormToolbar: function(callback){
  442. this.getFormToolbarHTML(function(toolbarNode){
  443. var spans = toolbarNode.getElements("span");
  444. spans.each(function(item, idx){
  445. var img = item.get("MWFButtonImage");
  446. if (img){
  447. item.set("MWFButtonImage", this.path+""+this.options.style+"/formtoolbar/"+img);
  448. }
  449. }.bind(this));
  450. $(toolbarNode).inject(this.formToolbarNode);
  451. MWF.require("MWF.widget.Toolbar", function(){
  452. this.formToolbar = new MWF.widget.Toolbar(toolbarNode, {"style": "ProcessCategory"}, this);
  453. this.formToolbar.load();
  454. this.loaddesignerActionNode();
  455. if (callback) callback();
  456. }.bind(this));
  457. }.bind(this));
  458. },
  459. getFormToolbarHTML: function(callback){
  460. var toolbarUrl = this.path+this.options.style+"/formToolbars.html";
  461. MWF.getRequestText(toolbarUrl, function(responseText, responseXML){
  462. var htmlString = responseText;
  463. htmlString = o2.bindJson(htmlString, {"lp": this.lp.formToolbar});
  464. var temp = new Element('div').set('html', htmlString);
  465. if (callback) callback( temp.childNodes[0] );
  466. }.bind(this));
  467. },
  468. loadFormContent: function(callback){
  469. //var iframe = new Element("iframe#iframeaa", {
  470. // "styles": {
  471. // "width": "100%",
  472. // "height": "100%"
  473. // },
  474. // //"src": "../x_component_process_FormDesigner/$Main/blank.html",
  475. // "border": "0"
  476. //}).inject(this.formContentNode);
  477. // window.setTimeout(function(){
  478. // iframe.contentDocument.designMode = "on";
  479. //
  480. //
  481. // var x = document.id("iframeaa");
  482. // this.designNode = document.id(iframe.contentDocument.body, false, iframe.contentDocument);
  483. // this.designNode.setStyle("margin", "0px");
  484. // this.designNode.setStyles(this.css.designNode);
  485. MWF.require("MWF.widget.Tab", null, false);
  486. this.designTabNode = new Element("div").inject(this.formContentNode);
  487. this.designTab = new MWF.widget.Tab(this.designTabNode, {"style": "design"});
  488. this.designTab.load();
  489. this.designTabPageAreaNode = Element("div");
  490. this.designNode = new Element("div", {
  491. "styles": this.css.designNode
  492. }).inject(this.designTabPageAreaNode);
  493. //this.designContentNode = new Element("div", {
  494. // "styles": {"overflow": "visible"}
  495. //}).inject(this.designNode);
  496. //MWF.require("MWF.widget.ScrollBar", function(){
  497. // new MWF.widget.ScrollBar(this.designNode, {"distance": 100});
  498. //}.bind(this));
  499. this.designMobileNode = new Element("div", {
  500. "styles": this.css.designMobileNode
  501. }).inject(this.designTabPageAreaNode);
  502. //MWF.require("MWF.widget.ScrollBar", function(){
  503. // new MWF.widget.ScrollBar(this.designMobileNode, {"distance": 50, "style": "xApp_mobileForm"});
  504. //}.bind(this));
  505. // }.bind(this), 2000);
  506. this.designTabScriptAreaNode = Element("div", {"styles": this.css.designTabScriptAreaNode});
  507. this.designPage = this.designTab.addTab(this.designTabPageAreaNode, this.lp.design);
  508. this.scriptPage = this.designTab.addTab(this.designTabScriptAreaNode, this.lp.script);
  509. this.setScriptPageEvent();
  510. this.designPage.showTabIm();
  511. this.scriptPage.addEvent("postShow", function(){
  512. this.checkLoadAllScript();
  513. this.fireEvent("resize");
  514. }.bind(this));
  515. this.designPage.addEvent("postShow", function(){
  516. this.fireEvent("resize");
  517. }.bind(this));
  518. },
  519. createScriptPanel: function(p, s){
  520. MWF.require("MWF.widget.Panel", function(){
  521. this.scriptPanel = new MWF.widget.Panel(this.designTabScriptAreaNode, {
  522. "title": this.lp.script,
  523. "minLeft": "500",
  524. "minTop": "1",
  525. "style": "page",
  526. "target": this.content,
  527. "limitMove": false,
  528. "isClose": false,
  529. "width": s.x,
  530. "height": s.y,
  531. "top": p.y,
  532. "left": p.x,
  533. "onPostLoad": function(){
  534. this.loadAllScript();
  535. this.fireEvent("resize");
  536. }.bind(this),
  537. "onResize": function(){
  538. this.fireEvent("resize");
  539. }.bind(this),
  540. "onDrag": function(el, e){
  541. if (el.getStyle("top").toInt()<0) el.setStyle("top", "0px");
  542. if (!this.scriptPage.tab.tabNodeContainer.isOutside(e)){
  543. this.scriptPage.tabNode.show();
  544. this.scriptPanel.container.setStyle("opacity", "0.5");
  545. }else{
  546. this.scriptPage.tabNode.hide();
  547. this.scriptPanel.container.setStyle("opacity", "1");
  548. }
  549. }.bind(this),
  550. "onCompleteMove": function(el, e){
  551. if (!this.scriptPage.tab.tabNodeContainer.isOutside(e)){
  552. this.scriptPage.tabNode.show();
  553. this.designTabScriptAreaNode.inject(this.designTab.contentNodeContainer.getLast());
  554. this.fireEvent("resize");
  555. this.scriptPage.showTabIm();
  556. this.scriptPanel.closePanel();
  557. this.scriptPanel = null;
  558. }
  559. }.bind(this)
  560. });
  561. this.scriptPanel.load();
  562. }.bind(this));
  563. },
  564. createScriptPageDragNode: function(e){
  565. var size = this.scriptPage.tab.contentNodeContainer.getSize();
  566. var position = this.scriptPage.tab.contentNodeContainer.getPosition(this.content);
  567. if (!this.scriptPageContentDrag){
  568. var dragNode = new Element("div", {"styles": this.css.scriptPageDragNode}).inject(this.content);
  569. this.scriptPageContentDrag = new Drag.Move(dragNode, {
  570. "droppables": [this.scriptPage.tab.tabNodeContainer],
  571. "onEnter": function(el, drop){
  572. this.scriptPage.tabNode.show();
  573. this.designTabScriptAreaNode.show();
  574. // this.scriptPageContentDrag.stop();
  575. // this.scriptPageContentDrag.detach();
  576. this.scriptPageContentDrag = null;
  577. dragNode.destroy();
  578. this.scriptPageDrag.start(e);
  579. }.bind(this),
  580. "onComplete": function(el, e){
  581. if (this.scriptPage.tab.tabNodeContainer.isOutside(e)){
  582. this.createScriptPanel(dragNode.getPosition(this.content), dragNode.getSize());
  583. this.designPage.showTabIm();
  584. }
  585. this.scriptPageContentDrag = null;
  586. if (dragNode) dragNode.destroy();
  587. this.designTabScriptAreaNode.show();
  588. }.bind(this)
  589. });
  590. }
  591. var tabPosition = this.scriptPage.tabNode.getPosition();
  592. var dx = e.page.x-tabPosition.x;
  593. var dy = e.page.y-tabPosition.y;
  594. this.scriptPage.tabNode.hide();
  595. this.designTabScriptAreaNode.hide();
  596. var w = size.x*0.7;
  597. var h = size.y*0.7;
  598. var x = position.x+dx;
  599. var y = position.y+dy-20;
  600. dragNode.setStyles({
  601. "width": ""+w+"px",
  602. "height": ""+h+"px",
  603. "top": ""+y+"px",
  604. "left": ""+x+"px"
  605. });
  606. this.scriptPageContentDrag.start(e);
  607. },
  608. setScriptPageEvent: function(){
  609. this.scriptPageDrag = new Drag(this.scriptPage.tabNode, {
  610. "snap": 20,
  611. "onStart": function(el,e){
  612. el.setStyle("position", "static");
  613. },
  614. "onDrag": function(el,e){
  615. if (this.scriptPage.tab.tabNodeContainer.isOutside(e)){
  616. this.scriptPageDrag.stop();
  617. el.setStyle("left", "auto");
  618. this.createScriptPageDragNode(e);
  619. }
  620. }.bind(this),
  621. "onComplete": function(el){
  622. el.setStyle("left", "auto");
  623. //el.setStyle("position", "relative");
  624. }.bind(this)
  625. });
  626. },
  627. checkLoadAllScript: function(){
  628. if (this.form){
  629. this.loadAllScript();
  630. }else{
  631. this.designPage.showTabIm();
  632. }
  633. },
  634. loadAllScript: function(){
  635. if (!this.form.designTabPageScriptAreaNode) this.form.designTabPageScriptAreaNode = Element("div", {"styles": this.css.designTabScriptPcAreaNode}).inject(this.designTabScriptAreaNode);
  636. this.form.designTabPageScriptAreaNode.show();
  637. if (!this.form.scriptDesigner){
  638. MWF.xDesktop.requireApp("portal.PageDesigner", "Script", function(){
  639. this.form.scriptDesigner = new MWF.xApplication.portal.PageDesigner.Script(this, this.form.designTabPageScriptAreaNode, this.form.json);
  640. // var moduleJson = this.pageData.json;
  641. // if (moduleJson.jsheader){
  642. // if (moduleJson.jsheader.code){
  643. //
  644. // }
  645. // }
  646. }.bind(this));
  647. }
  648. },
  649. reloadPropertyStyles: function(){
  650. //MWF.release(this.css);
  651. this.css = null;
  652. this.cssPath = "../x_component_"+this.options.name.replace(/\./g, "_")+"/$Main/"+this.options.style+"/css.wcss";
  653. this._loadCss();
  654. if (this.options.style=="bottom"){
  655. this.propertyNode.inject(this.formNode, "after");
  656. this.propertyTitleNode.setStyle("cursor", "row-resize");
  657. this.loadPropertyResizeBottom();
  658. }else{
  659. this.propertyNode.inject(this.formNode, "before");
  660. this.propertyTitleNode.setStyle("cursor", "default");
  661. if (this.propertyResizeBottom) this.propertyResizeBottom.detach();
  662. }
  663. this.formNode.clearStyles(false);
  664. this.formNode.setStyles(this.css.formNode);
  665. this.propertyNode.clearStyles(false);
  666. this.propertyNode.setStyles(this.css.propertyNode);
  667. this.propertyTitleNode.clearStyles(false);
  668. this.propertyTitleNode.setStyles(this.css.propertyTitleNode);
  669. this.propertyResizeBar.clearStyles(false);
  670. this.propertyResizeBar.setStyles(this.css.propertyResizeBar);
  671. this.propertyContentNode.clearStyles(false);
  672. this.propertyContentNode.setStyles(this.css.propertyContentNode);
  673. this.propertyDomContentArea.clearStyles(false);
  674. this.propertyDomContentArea.setStyles(this.css.propertyDomContentArea);
  675. this.propertyDomScrollArea.clearStyles(false);
  676. this.propertyDomScrollArea.setStyles(this.css.propertyDomScrollArea);
  677. this.propertyDomArea.clearStyles(false);
  678. this.propertyDomArea.setStyles(this.css.propertyDomArea);
  679. this.propertyContentArea.clearStyles(false);
  680. this.propertyContentArea.setStyles(this.css.propertyContentArea);
  681. this.propertyContentResizeNode.clearStyles(false);
  682. this.propertyContentResizeNode.setStyles(this.css.propertyContentResizeNode);
  683. this.propertyTitleActionNode.clearStyles(false);
  684. this.propertyTitleActionNode.setStyles(this.css.propertyTitleActionNode);
  685. this.resizeNode();
  686. },
  687. //loadProperty------------------------
  688. loadProperty: function(){
  689. this.propertyTitleActionNode = new Element("div", {
  690. "styles": this.css.propertyTitleActionNode
  691. }).inject(this.propertyNode);
  692. this.propertyTitleActionNode.addEvent("click", function(){
  693. this.options.style = (this.options.style=="default") ? "bottom" : "default";
  694. MWF.UD.putData("formDesignerStyle", {"style": this.options.style});
  695. this.reloadPropertyStyles();
  696. }.bind(this));
  697. this.propertyTitleNode = new Element("div", {
  698. "styles": this.css.propertyTitleNode,
  699. "text": MWF.APPFD.LP.property
  700. }).inject(this.propertyNode);
  701. if (this.options.style=="bottom"){
  702. this.propertyTitleNode.setStyle("cursor", "row-resize");
  703. this.loadPropertyResizeBottom();
  704. }
  705. this.propertyResizeBar = new Element("div", {
  706. "styles": this.css.propertyResizeBar
  707. }).inject(this.propertyNode);
  708. this.loadPropertyResize();
  709. this.propertyContentNode = new Element("div", {
  710. "styles": this.css.propertyContentNode
  711. }).inject(this.propertyNode);
  712. this.propertyDomContentArea = new Element("div", {
  713. "styles": this.css.propertyDomContentArea
  714. }).inject(this.propertyContentNode);
  715. this.propertyDomTabArea = new Element("div").inject(this.propertyDomContentArea);
  716. // this.propertyDomArea = new Element("div", {
  717. // "styles": this.css.propertyDomArea
  718. // }).inject(this.propertyDomScrollArea);
  719. this.loadPropertyTab();
  720. this.propertyDomPercent = 0.3;
  721. this.propertyContentResizeNode = new Element("div", {
  722. "styles": this.css.propertyContentResizeNode
  723. }).inject(this.propertyContentNode);
  724. this.propertyContentArea = new Element("div", {
  725. "styles": this.css.propertyContentArea
  726. }).inject(this.propertyContentNode);
  727. this.loadPropertyContentResize();
  728. },
  729. loadPropertyTab: function (callback) {
  730. var _self = this;
  731. MWF.require("MWF.widget.Tab", null, false);
  732. this.propertyDomTab = new MWF.widget.Tab(this.propertyDomTabArea, {"style": "formPropertyList"});
  733. this.propertyDomTab.load();
  734. this.tabDomNode = Element("div");
  735. this.propertyDomScrollArea = new Element("div", {
  736. "styles": this.css.propertyDomScrollArea
  737. }).inject(this.tabDomNode);
  738. this.propertyDomArea = new Element("div", {
  739. "styles": this.css.propertyDomArea
  740. }).inject(this.propertyDomScrollArea);
  741. this.tabHistoryNode = Element("div");
  742. this.historyScrollArea = new Element("div", {
  743. "styles": this.css.propertyDomScrollArea
  744. }).inject(this.tabHistoryNode);
  745. this.historyArea = new Element("div", {
  746. "styles": this.css.propertyDomArea
  747. }).inject(this.historyScrollArea);
  748. this.historyAreaMobile = new Element("div", {
  749. "styles": this.css.propertyDomArea
  750. }).inject(this.historyScrollArea);
  751. this.historyAreaMobile.hide();
  752. this.currentHistoryNode = this.historyArea;
  753. this.domPage = this.propertyDomTab.addTab(this.tabDomNode, this.lp.componentTree);
  754. this.historyPage = this.propertyDomTab.addTab(this.tabHistoryNode, this.lp.history);
  755. this.domPage.showTabIm();
  756. this.domPage.addEvent("postShow", function () {
  757. var module = this.form.currentSelectedModule;
  758. if (module && module.treeNode){
  759. (new Fx.Scroll(this.propertyDomScrollArea)).toElement(module.treeNode.node);
  760. }
  761. }.bind(this));
  762. // this.runPage.addEvent("postShow", function () {
  763. // this.selected();
  764. // }.bind(this));
  765. },
  766. loadPropertyResizeBottom: function(){
  767. if (!this.propertyResizeBottom){
  768. this.propertyResizeBottom = new Drag(this.propertyTitleNode,{
  769. "snap": 1,
  770. "onStart": function(el, e){
  771. var x = (Browser.name=="firefox") ? e.event.clientX : e.event.x;
  772. var y = (Browser.name=="firefox") ? e.event.clientY : e.event.y;
  773. el.store("position", {"x": x, "y": y});
  774. var size = this.propertyNode.getSize();
  775. el.store("initialWidth", size.x);
  776. el.store("initialHeight", size.y);
  777. }.bind(this),
  778. "onDrag": function(el, e){
  779. // var x = e.event.x;
  780. var y = (Browser.name=="firefox") ? e.event.clientY : e.event.y;
  781. var bodySize = this.content.getSize();
  782. var position = el.retrieve("position");
  783. var initialHeight = el.retrieve("initialHeight").toFloat();
  784. var dy = position.y.toFloat()-y.toFloat();
  785. var height = initialHeight+dy;
  786. if (height> bodySize.y/1.5) height = bodySize.y/1.5;
  787. if (height<40) height = 40;
  788. var percent = 1-(height/bodySize.y);
  789. this.resizeNode(percent);
  790. //var formNodeHeight = bodySize.y-height;
  791. //this.formNode.setStyle("height", ""+formNodeHeight+"px");
  792. //this.propertyNode.setStyle("height", ""+height+"px");
  793. }.bind(this)
  794. });
  795. }else{
  796. this.propertyResizeBottom.attach();
  797. }
  798. },
  799. loadPropertyResize: function(){
  800. // var size = this.propertyNode.getSize();
  801. // var position = this.propertyResizeBar.getPosition();
  802. this.propertyResize = new Drag(this.propertyResizeBar,{
  803. "snap": 1,
  804. "onStart": function(el, e){
  805. var x = (Browser.name=="firefox") ? e.event.clientX : e.event.x;
  806. var y = (Browser.name=="firefox") ? e.event.clientY : e.event.y;
  807. el.store("position", {"x": x, "y": y});
  808. var size = this.propertyNode.getSize();
  809. el.store("initialWidth", size.x);
  810. }.bind(this),
  811. "onDrag": function(el, e){
  812. var x = (Browser.name=="firefox") ? e.event.clientX : e.event.x;
  813. // var y = e.event.y;
  814. var bodySize = this.content.getSize();
  815. var position = el.retrieve("position");
  816. var initialWidth = el.retrieve("initialWidth").toFloat();
  817. var dx = position.x.toFloat()-x.toFloat();
  818. var width = initialWidth+dx;
  819. if (width> bodySize.x/2) width = bodySize.x/2;
  820. if (width<40) width = 40;
  821. this.formNode.setStyle("margin-right", width+1);
  822. this.propertyNode.setStyle("width", width);
  823. }.bind(this)
  824. });
  825. },
  826. propertyResizeDragTopBottom: function(el, e){
  827. var size = this.propertyContentNode.getSize();
  828. // var x = e.event.x;
  829. var y = e.event.y;
  830. var position = el.retrieve("position");
  831. var dy = y.toFloat()-position.y.toFloat();
  832. var initialHeight = el.retrieve("initialHeight").toFloat();
  833. var height = initialHeight+dy;
  834. if (height<40) height = 40;
  835. if (height> size.y-40) height = size.y-40;
  836. this.propertyDomPercent = height/size.y;
  837. this.setPropertyContentResize();
  838. },
  839. propertyResizeDragLeftRight: function(el, e){
  840. var size = this.propertyContentNode.getSize();
  841. var x = (Browser.name=="firefox") ? e.event.clientX : e.event.x;
  842. //var y = e.event.y;
  843. var position = el.retrieve("position");
  844. var dx = x.toFloat()-position.x.toFloat();
  845. var initialWidth = el.retrieve("initialWidth").toFloat();
  846. var width = initialWidth+dx;
  847. if (width<40) width = 40;
  848. if (width> size.x-40) width = size.x-40;
  849. this.propertyDomPercent = width/size.x;
  850. this.setPropertyContentResizeBottom();
  851. },
  852. loadPropertyContentResize: function(){
  853. this.propertyContentResize = new Drag(this.propertyContentResizeNode, {
  854. "snap": 1,
  855. "onStart": function(el, e){
  856. var x = (Browser.name=="firefox") ? e.event.clientX : e.event.x;
  857. var y = (Browser.name=="firefox") ? e.event.clientY : e.event.y;
  858. el.store("position", {"x": x, "y": y});
  859. var size = this.propertyDomContentArea.getSize();
  860. el.store("initialHeight", size.y);
  861. el.store("initialWidth", size.x);
  862. }.bind(this),
  863. "onDrag": function(el, e){
  864. if (this.options.style=="bottom"){
  865. this.propertyResizeDragLeftRight(el, e);
  866. }else{
  867. this.propertyResizeDragTopBottom(el, e);
  868. }
  869. }.bind(this)
  870. });
  871. },
  872. setPropertyContentResizeBottom: function(){
  873. var size = this.propertyContentNode.getSize();
  874. var resizeNodeSize = this.propertyContentResizeNode.getSize();
  875. var width = size.x-resizeNodeSize.x-6;
  876. var domWidth = this.propertyDomPercent*width;
  877. var contentMargin = domWidth+resizeNodeSize.x+6;
  878. this.propertyDomContentArea.setStyle("width", ""+domWidth+"px");
  879. this.propertyContentArea.setStyle("margin-left", ""+contentMargin+"px");
  880. },
  881. setPropertyContentResize: function(){
  882. var size = this.propertyContentNode.getSize();
  883. var resizeNodeSize = this.propertyContentResizeNode.getSize();
  884. var height = size.y-resizeNodeSize.y;
  885. var domHeight = this.propertyDomPercent*height;
  886. var contentHeight = height-domHeight;
  887. this.propertyDomContentArea.setStyle("height", ""+domHeight+"px");
  888. this.propertyDomScrollArea.setStyle("height", ""+(domHeight-28)+"px");
  889. this.historyScrollArea.setStyle("height", ""+(domHeight-28)+"px");
  890. this.propertyContentArea.setStyle("height", ""+contentHeight+"px");
  891. if (this.form){
  892. if (this.form.currentSelectedModule){
  893. if (this.form.currentSelectedModule.property){
  894. var tab = this.form.currentSelectedModule.property.propertyTab;
  895. if (tab){
  896. var tabTitleSize = tab.tabNodeContainer.getSize();
  897. tab.pages.each(function(page){
  898. var topMargin = page.contentNodeArea.getStyle("margin-top").toFloat();
  899. var bottomMargin = page.contentNodeArea.getStyle("margin-bottom").toFloat();
  900. var tabContentNodeAreaHeight = contentHeight - topMargin - bottomMargin - tabTitleSize.y.toFloat()-15;
  901. page.contentNodeArea.setStyle("height", tabContentNodeAreaHeight);
  902. }.bind(this));
  903. }
  904. }
  905. }
  906. }
  907. },
  908. //loadTools------------------------------
  909. loadTools: function(callback){
  910. o2.loadCss("../o2_lib/vue/element/index.css");
  911. this.getToolResource(function(){
  912. this.toolsGroupData.forEach(function(o){
  913. //var o = this.toolsGroupData[key];
  914. this.toolGroups.push(new MWF.xApplication.process.FormDesigner.ToolsGroup(o, this, o.name === this.currentUserDefaultTool));
  915. }, this);
  916. if (callback) callback();
  917. }.bind(this));
  918. },
  919. getToolResource: function(callback){
  920. var check = function () {
  921. var list = this.toolsGroupData.filter(function(o){
  922. return o.name === this.currentUserDefaultTool
  923. }.bind(this));
  924. if( list.length < 1 )this.currentUserDefaultTool = "default";
  925. callback();
  926. }.bind(this);
  927. this.getGroups(function(){
  928. if(this.toolsGroupData && this.currentUserDefaultTool )check();
  929. }.bind(this));
  930. this.getDefaultTool(function(){
  931. if(this.toolsGroupData && this.currentUserDefaultTool )check();
  932. }.bind(this));
  933. },
  934. getGroups: function(callback){
  935. if (this.toolsGroupData){
  936. if (callback) callback();
  937. }else{
  938. var toolsGroupDataUrl = this.path+this.options.style+"/toolsGroup.json";
  939. o2.JSON.get(toolsGroupDataUrl, function(responseJSON){
  940. this.toolsGroupData = responseJSON;
  941. if (callback) callback();
  942. }.bind(this));
  943. }
  944. },
  945. getDefaultTool: function(callback){
  946. if( typeOf(this.currentUserDefaultTool) === "string" ){
  947. if (callback) callback();
  948. }else{
  949. o2.UD.getDataJson("processTools", function (json) {
  950. this.currentUserDefaultTool = (json && json.defaultTool) || "default";
  951. if (callback) callback();
  952. }.bind(this));
  953. }
  954. },
  955. setDefaultTool: function(defaultTools, callback){
  956. o2.UD.getDataJson("processTools", function (json) {
  957. if(!json)json = {};
  958. json.defaultTool = defaultTools;
  959. o2.UD.putData("processTools", json, function () {
  960. if (callback) callback();
  961. }.bind(this));
  962. }.bind(this));
  963. },
  964. //resizeNode------------------------------------------------
  965. resizeNodeLeftRight: function(){
  966. var nodeSize = this.node.getSize();
  967. this.toolbarNode.setStyle("height", ""+nodeSize.y+"px");
  968. this.formNode.setStyle("height", ""+nodeSize.y+"px");
  969. this.propertyNode.setStyle("height", ""+nodeSize.y+"px");
  970. //nodeSize = {"x": nodeSize.x, "y": nodeSize.y*0.6};
  971. var formToolbarMarginTop = this.formToolbarNode.getStyle("margin-top").toFloat();
  972. var formToolbarMarginBottom = this.formToolbarNode.getStyle("margin-bottom").toFloat();
  973. var allFormToolberSize = this.formToolbarNode.getComputedSize();
  974. var y = nodeSize.y - allFormToolberSize.totalHeight - formToolbarMarginTop - formToolbarMarginBottom;
  975. this.formContentNode.setStyle("height", ""+y+"px");
  976. var tabSize = this.designTab.tabNodeContainer.getComputedSize();
  977. var tabMarginTop = this.designTab.tabNodeContainer.getStyle("margin-top").toFloat();
  978. var tabMarginBottom = this.designTab.tabNodeContainer.getStyle("margin-bottom").toFloat();
  979. y = y-tabSize.totalHeight-tabMarginTop-tabMarginBottom;
  980. this.designTab.contentNodeContainer.setStyle("height", ""+y+"px");
  981. if (this.designNode){
  982. var designMarginTop = this.designNode.getStyle("margin-top").toFloat();
  983. var designMarginBottom = this.designNode.getStyle("margin-bottom").toFloat();
  984. y = y - designMarginTop - designMarginBottom;
  985. this.designNode.setStyle("height", ""+y+"px");
  986. }
  987. var titleSize = this.toolbarTitleNode.getSize();
  988. var titleMarginTop = this.toolbarTitleNode.getStyle("margin-top").toFloat();
  989. var titleMarginBottom = this.toolbarTitleNode.getStyle("margin-bottom").toFloat();
  990. var titlePaddingTop = this.toolbarTitleNode.getStyle("padding-top").toFloat();
  991. var titlePaddingBottom = this.toolbarTitleNode.getStyle("padding-bottom").toFloat();
  992. y = titleSize.y+titleMarginTop+titleMarginBottom+titlePaddingTop+titlePaddingBottom;
  993. y = nodeSize.y-y;
  994. this.toolbarGroupContentNode.setStyle("height", ""+y+"px");
  995. var groupHeight = 0;
  996. // this.toolGroups.each(function(g){
  997. // groupHeight += g.toolbarGroupTitleNode.getSize().y;
  998. // });
  999. var contentHeight = y-groupHeight-5;
  1000. this.toolGroups.each(function(g){
  1001. g.setContentHeight(contentHeight);
  1002. //g.toolbarContentNode.setStyle("height", ""+contentHeight+"px");
  1003. });
  1004. titleSize = this.propertyTitleNode.getSize();
  1005. titleMarginTop = this.propertyTitleNode.getStyle("margin-top").toFloat();
  1006. titleMarginBottom = this.propertyTitleNode.getStyle("margin-bottom").toFloat();
  1007. titlePaddingTop = this.propertyTitleNode.getStyle("padding-top").toFloat();
  1008. titlePaddingBottom = this.propertyTitleNode.getStyle("padding-bottom").toFloat();
  1009. y = titleSize.y+titleMarginTop+titleMarginBottom+titlePaddingTop+titlePaddingBottom;
  1010. y = nodeSize.y-y;
  1011. this.propertyContentNode.setStyle("height", ""+y+"px");
  1012. this.propertyResizeBar.setStyle("height", ""+y+"px");
  1013. },
  1014. resizeNodeTopBottom: function(percent){
  1015. var nodeSize = this.node.getSize();
  1016. this.toolbarNode.setStyle("height", ""+nodeSize.y+"px");
  1017. var percentNumber = percent || 0.6
  1018. var designerHeight = nodeSize.y*percentNumber;
  1019. var propertyHeight = nodeSize.y - designerHeight;
  1020. this.formNode.setStyle("height", ""+designerHeight+"px");
  1021. this.propertyNode.setStyle("height", ""+propertyHeight+"px");
  1022. var formToolbarMarginTop = this.formToolbarNode.getStyle("margin-top").toFloat();
  1023. var formToolbarMarginBottom = this.formToolbarNode.getStyle("margin-bottom").toFloat();
  1024. var allFormToolberSize = this.formToolbarNode.getComputedSize();
  1025. var y = designerHeight - allFormToolberSize.totalHeight - formToolbarMarginTop - formToolbarMarginBottom;
  1026. // this.formContentNode.setStyle("height", ""+designerHeight+"px");
  1027. var tabSize = this.designTab.tabNodeContainer.getComputedSize();
  1028. var tabMarginTop = this.designTab.tabNodeContainer.getStyle("margin-top").toFloat();
  1029. var tabMarginBottom = this.designTab.tabNodeContainer.getStyle("margin-bottom").toFloat();
  1030. y = y-tabSize.totalHeight-tabMarginTop-tabMarginBottom;
  1031. this.designTab.contentNodeContainer.setStyle("height", ""+y+"px");
  1032. if (this.designNode){
  1033. var designMarginTop = this.designNode.getStyle("margin-top").toFloat();
  1034. var designMarginBottom = this.designNode.getStyle("margin-bottom").toFloat();
  1035. y = y - designMarginTop - designMarginBottom;
  1036. this.designNode.setStyle("height", ""+y+"px");
  1037. }
  1038. var titleSize = this.toolbarTitleNode.getSize();
  1039. var titleMarginTop = this.toolbarTitleNode.getStyle("margin-top").toFloat();
  1040. var titleMarginBottom = this.toolbarTitleNode.getStyle("margin-bottom").toFloat();
  1041. var titlePaddingTop = this.toolbarTitleNode.getStyle("padding-top").toFloat();
  1042. var titlePaddingBottom = this.toolbarTitleNode.getStyle("padding-bottom").toFloat();
  1043. y = titleSize.y+titleMarginTop+titleMarginBottom+titlePaddingTop+titlePaddingBottom;
  1044. y = nodeSize.y-y;
  1045. this.toolbarGroupContentNode.setStyle("height", ""+y+"px");
  1046. var groupHeight = 0;
  1047. // this.toolGroups.each(function(g){
  1048. // groupHeight += g.toolbarGroupTitleNode.getSize().y;
  1049. // });
  1050. var contentHeight = y-groupHeight-5;
  1051. this.toolGroups.each(function(g){
  1052. g.setContentHeight(contentHeight);
  1053. });
  1054. titleSize = this.propertyTitleNode.getSize();
  1055. titleMarginTop = this.propertyTitleNode.getStyle("margin-top").toFloat();
  1056. titleMarginBottom = this.propertyTitleNode.getStyle("margin-bottom").toFloat();
  1057. titlePaddingTop = this.propertyTitleNode.getStyle("padding-top").toFloat();
  1058. titlePaddingBottom = this.propertyTitleNode.getStyle("padding-bottom").toFloat();
  1059. y = titleSize.y+titleMarginTop+titleMarginBottom+titlePaddingTop+titlePaddingBottom;
  1060. y = propertyHeight-y;
  1061. this.propertyContentNode.setStyle("height", ""+y+"px");
  1062. this.propertyResizeBar.setStyle("height", ""+y+"px");
  1063. this.propertyDomContentArea.setStyle("height", ""+y+"px");
  1064. this.propertyDomScrollArea.setStyle("height", ""+(y-28)+"px");
  1065. this.historyScrollArea.setStyle("height", ""+(y-28)+"px");
  1066. this.propertyContentResizeNode.setStyle("height", ""+y+"px");
  1067. this.propertyContentArea.setStyle("height", ""+y+"px");
  1068. if (this.form){
  1069. if (this.form.currentSelectedModule){
  1070. if (this.form.currentSelectedModule.property){
  1071. var tab = this.form.currentSelectedModule.property.propertyTab;
  1072. if (tab){
  1073. var tabTitleSize = tab.tabNodeContainer.getSize();
  1074. tab.pages.each(function(page){
  1075. var topMargin = page.contentNodeArea.getStyle("margin-top").toFloat();
  1076. var bottomMargin = page.contentNodeArea.getStyle("margin-bottom").toFloat();
  1077. var tabContentNodeAreaHeight = y - topMargin - bottomMargin - tabTitleSize.y.toFloat()-15;
  1078. page.contentNodeArea.setStyle("height", tabContentNodeAreaHeight);
  1079. }.bind(this));
  1080. }
  1081. }
  1082. }
  1083. }
  1084. },
  1085. resizeNode: function(percent){
  1086. if (this.options.style=="bottom"){
  1087. this.resizeNodeTopBottom(percent);
  1088. this.setPropertyContentResizeBottom();
  1089. }else{
  1090. this.resizeNodeLeftRight(percent);
  1091. this.setPropertyContentResize();
  1092. }
  1093. },
  1094. //loadForm------------------------------------------
  1095. loadForm: function(){
  1096. // try{
  1097. this.getFormData(function(){
  1098. this.pcForm = new MWF.FCForm(this, this.designNode);
  1099. this.pcForm.load(this.formData);
  1100. this.form = this.pcForm;
  1101. }.bind(this));
  1102. // }catch(e){
  1103. // layout.notice("error", {x: "right", y:"top"}, e.message, this.designNode);
  1104. // }
  1105. // MWF.getJSON(COMMON.contentPath+"/res/js/testform.json", {
  1106. // "onSuccess": function(obj){
  1107. // this.form = new MWF.FCForm(this);
  1108. // this.form.load(obj);
  1109. // }.bind(this),
  1110. // "onerror": function(text){
  1111. // layout.notice("error", {x: "right", y:"top"}, text, this.designNode);
  1112. // }.bind(this),
  1113. // "onRequestFailure": function(xhr){
  1114. // layout.notice("error", {x: "right", y:"top"}, xhr.responseText, this.designNode);
  1115. // }
  1116. // });
  1117. },
  1118. getFormData: function(callback){
  1119. if (!this.options.id){
  1120. if (this.options.templateId){
  1121. this.loadNewFormDataFormTemplate(callback);
  1122. }else{
  1123. this.loadNewFormData(callback);
  1124. }
  1125. }else{
  1126. this.loadFormData(callback);
  1127. }
  1128. },
  1129. loadNewFormData: function(callback){
  1130. var url = "../x_component_process_FormDesigner/Module/Form/template/"+this.options.template;
  1131. //MWF.getJSON("../x_component_process_FormDesigner/Module/Form/template.json", {
  1132. MWF.getJSON(url, {
  1133. "onSuccess": function(obj){
  1134. this.formData = obj.pcData;
  1135. this.formData.id="";
  1136. this.formData.isNewForm = true;
  1137. this.formMobileData = obj.mobileData;
  1138. this.formMobileData.id="";
  1139. this.formMobileData.isNewForm = true;
  1140. if( typeOf( this.options.templateCode ) === "object" ){
  1141. var count = 0, total = Object.keys(this.options.templateCode).length;
  1142. Object.each(this.options.templateCode, function ( url, key ) {
  1143. MWF.getRequestText( url, function (text) {
  1144. var obj, keys = key.split(".");
  1145. keys.each(function (k, i) {
  1146. if( i === 0 ) {
  1147. obj = k === "pc" ? this.formData : this.formMobileData;
  1148. }else if( i === keys.length - 1 ){
  1149. obj[k] = text;
  1150. count++;
  1151. if( count === total ) {
  1152. if (callback) callback();
  1153. }
  1154. }else{
  1155. if( !obj[k] )obj[k] = {};
  1156. obj = obj[k];
  1157. }
  1158. }.bind(this))
  1159. }.bind(this))
  1160. }.bind(this))
  1161. }else{
  1162. if (callback) callback();
  1163. }
  1164. }.bind(this),
  1165. "onerror": function(text){
  1166. this.notice(text, "error");
  1167. }.bind(this),
  1168. "onRequestFailure": function(xhr){
  1169. this.notice(xhr.responseText, "error");
  1170. }.bind(this)
  1171. });
  1172. },
  1173. loadNewFormDataFormTemplate: function(callback){
  1174. this.actions.getFormTemplate(this.options.templateId, function(form){
  1175. if (form){
  1176. this.formData = JSON.decode(MWF.decodeJsonString(form.data.data));
  1177. this.formData.isNewForm = true;
  1178. this.formData.json.id = "";
  1179. if (form.data.mobileData){
  1180. this.formMobileData = JSON.decode(MWF.decodeJsonString(form.data.mobileData));
  1181. this.formMobileData.isNewForm = true;
  1182. this.formMobileData.json.id = "";
  1183. }else{
  1184. this.formMobileData = Object.clone(this.formData);
  1185. }
  1186. if (callback) callback();
  1187. //this.actions.getFormCategory(this.formData.json.formCategory, function(category){
  1188. // this.category = {"data": {"name": category.data.name, "id": category.data.id}};
  1189. // if (callback) callback();
  1190. //}.bind(this));
  1191. }
  1192. }.bind(this));
  1193. },
  1194. loadFormData: function(callback){
  1195. this.actions.getForm(this.options.id, function(form){
  1196. debugger;
  1197. if (form){
  1198. var formTemplete = null;
  1199. MWF.getJSON("../x_component_process_FormDesigner/Module/Form/template/form.json", {
  1200. "onSuccess": function(obj){ formTemplete = obj; }.bind(this)
  1201. }, false);
  1202. this.formData = JSON.decode(MWF.decodeJsonString(form.data.data));
  1203. if (formTemplete.pcData){
  1204. Object.merge(formTemplete.pcData, this.formData);
  1205. Object.merge(this.formData, formTemplete.pcData);
  1206. }
  1207. this.formData.isNewForm = false;
  1208. this.formData.json.id = form.data.id;
  1209. if (form.data.mobileData){
  1210. this.formMobileData = JSON.decode(MWF.decodeJsonString(form.data.mobileData));
  1211. if (formTemplete.mobileData){
  1212. Object.merge(formTemplete.mobileData, this.formMobileData);
  1213. Object.merge(this.formMobileData, formTemplete.mobileData);
  1214. }
  1215. this.formMobileData.isNewForm = false;
  1216. this.formMobileData.json.id = form.data.id;
  1217. }else{
  1218. this.formMobileData = Object.clone(this.formData);
  1219. }
  1220. this.setTitle(this.options.appTitle + "-"+this.formData.json.name);
  1221. if (this.taskitem) this.taskitem.setText(this.options.appTitle + "-"+this.formData.json.name);
  1222. this.options.appTitle = this.options.appTitle + "-"+this.formData.json.name;
  1223. if (!this.application){
  1224. this.actions.getApplication(form.data.application, function(json){
  1225. this.application = {"name": json.data.name, "id": json.data.id};
  1226. if (callback) callback();
  1227. }.bind(this));
  1228. }else{
  1229. if (callback) callback();
  1230. }
  1231. //this.actions.getFormCategory(this.formData.json.formCategory, function(category){
  1232. // this.category = {"data": {"name": category.data.name, "id": category.data.id}};
  1233. // if (callback) callback();
  1234. //}.bind(this));
  1235. }
  1236. }.bind(this));
  1237. },
  1238. getFieldList: function(){
  1239. //fieldTypes = ["calender", "checkbox", "datagrid", "htmledit", "number", "personfield", "radio", "select", "textarea", "textfield"];
  1240. dataTypes = {
  1241. "string": ["htmledit", "radio", "select", "textarea", "textfield","imageclipper","htmleditor","tinymceeditor"],
  1242. "person": ["personfield","orgfield","org"],
  1243. "date": ["calender"],
  1244. "number": ["number","currency"],
  1245. "array": ["checkbox"]
  1246. };
  1247. fieldList = [];
  1248. this.pcForm.moduleList.each(function(moudle){
  1249. var key = "";
  1250. for (k in dataTypes){
  1251. if (dataTypes[k].indexOf(moudle.moduleName.toLowerCase())!=-1){
  1252. key = k;
  1253. break;
  1254. }
  1255. }
  1256. if (key){
  1257. fieldList.push({
  1258. "name": moudle.json.id,
  1259. "dataType": key
  1260. });
  1261. }
  1262. }.bind(this));
  1263. return fieldList;
  1264. },
  1265. checkSubform: function(){
  1266. var pcSubforms = [];
  1267. if (this.pcForm){
  1268. this.pcForm.data.json.subformList = [];
  1269. this.pcForm.moduleList.each(function(module){
  1270. if (module.moduleName==="subform"){
  1271. if (module.json.subformSelected && module.json.subformSelected!=="none" && module.json.subformType!=="script"){
  1272. if (this.pcForm.data.json.subformList.indexOf(module.json.subformSelected) === -1) this.pcForm.data.json.subformList.push(module.json.subformSelected);
  1273. }
  1274. if (module.regetSubformData()){
  1275. module.subformData.updateTime = "";
  1276. var moduleNames = module.getConflictFields();
  1277. if (moduleNames.length){
  1278. var o = {
  1279. "id": module.json.id,
  1280. "fields": moduleNames
  1281. };
  1282. pcSubforms.push(o);
  1283. }
  1284. }
  1285. }
  1286. }.bind(this));
  1287. }
  1288. var mobileSubforms = [];
  1289. if (this.mobileForm){
  1290. this.mobileForm.data.json.subformList = [];
  1291. this.mobileForm.moduleList.each(function(module){
  1292. if (module.moduleName==="subform"){
  1293. if (module.json.subformSelected && module.json.subformSelected!=="none" && module.json.subformType!=="script"){
  1294. if (this.mobileForm.data.json.subformList.indexOf(module.json.subformSelected) === -1) this.mobileForm.data.json.subformList.push(module.json.subformSelected);
  1295. }
  1296. if (module.regetSubformData()){
  1297. module.subformData.updateTime = "";
  1298. var moduleNames = module.getConflictFields();
  1299. if (moduleNames.length){
  1300. var o = {
  1301. "id": module.json.id,
  1302. "fields": moduleNames
  1303. };
  1304. mobileSubforms.push(o);
  1305. }
  1306. }
  1307. }
  1308. }.bind(this));
  1309. }
  1310. var txt = "";
  1311. if (pcSubforms.length){
  1312. var pctxt = "";
  1313. pcSubforms.each(function(subform){
  1314. pctxt += subform.id+" ( "+subform.fields.join(", ")+" ) <br>";
  1315. });
  1316. txt += this.lp.checkSubformPcInfor.replace("{subform}", pctxt);
  1317. }
  1318. if (mobileSubforms.length){
  1319. var mobiletxt = "";
  1320. mobileSubforms.each(function(subform){
  1321. mobiletxt += subform.id+" ( "+subform.fields.join(", ")+" ) <br>";
  1322. });
  1323. txt += this.lp.checkSubformMobileInfor.replace("{subform}", mobiletxt);
  1324. }
  1325. return txt;
  1326. },
  1327. saveForm: function(){
  1328. if (!this.isSave){
  1329. var txt = this.checkSubform();
  1330. if (txt){
  1331. txt = this.lp.checkFormSaveError+txt;
  1332. // var p = this.node.getPosition(document.body);
  1333. // this.alert("error", {
  1334. // "event": {
  1335. // "x": p.x+150,
  1336. // "y": p.y+80
  1337. // }
  1338. // }, this.lp.checkSubformTitle, {"html": txt}, 400, 200);
  1339. this.notice(txt, "error", this.form.node);
  1340. return false;
  1341. }
  1342. // if (this.pcForm){
  1343. // this.pcForm.moduleList.each(function(module){
  1344. // if (module.moduleName==="subform"){
  1345. // module.refreshSubform();
  1346. // }
  1347. // }.bind(this));
  1348. // }
  1349. // if (this.mobileForm){
  1350. // this.mobileForm.moduleList.each(function(module){
  1351. // if (module.moduleName==="subform"){
  1352. // module.refreshSubform();
  1353. // }
  1354. // }.bind(this));
  1355. // }
  1356. // @todo 预先整理表单样式
  1357. // var loadedPcForm = !this.pcForm;
  1358. // var loadedMobileForm = !this.mobileForm;
  1359. // var checkLoad = function(){
  1360. // if (loadedPcForm && loadedMobileForm){
  1361. // this.isSave = true;
  1362. // var fieldList = this.getFieldList();
  1363. // this.actions.saveForm(pcData, mobileData, fieldList, function(responseJSON){
  1364. // this.notice(MWF.APPFD.LP.notice["save_success"], "ok", null, {x: "left", y:"bottom"});
  1365. // if (!this.pcForm.json.name) this.pcForm.treeNode.setText("<"+this.json.type+"> "+this.json.id);
  1366. // this.pcForm.treeNode.setTitle(this.pcForm.json.id);
  1367. // this.pcForm.node.set("id", this.pcForm.json.id);
  1368. //
  1369. // if (this.mobileForm){
  1370. // if (!this.mobileForm.json.name) this.mobileForm.treeNode.setText("<"+this.mobileForm.json.type+"> "+this.mobileForm.json.id);
  1371. // this.mobileForm.treeNode.setTitle(this.mobileForm.json.id);
  1372. // this.mobileForm.node.set("id", this.mobileForm.json.id+"_"+this.options.mode);
  1373. // }
  1374. //
  1375. // var name = this.pcForm.json.name;
  1376. // if (this.pcForm.data.isNewForm) this.setTitle(this.options.appTitle + "-"+name);
  1377. // this.pcForm.data.isNewForm = false;
  1378. // if (this.mobileForm) this.mobileForm.data.isNewForm = false;
  1379. //
  1380. // this.options.desktopReload = true;
  1381. // this.options.id = this.pcForm.json.id;
  1382. //
  1383. // if (this.pcForm) this.pcForm.fireEvent("postSave");
  1384. // if (this.mobileForm) this.mobileForm.fireEvent("postSave");
  1385. //
  1386. // this.isSave = false;
  1387. //
  1388. // }.bind(this), function(xhr, text, error){
  1389. // this.isSave = false;
  1390. //
  1391. // if (this.pcForm) this.pcForm.fireEvent("postSaveError");
  1392. // if (this.mobileForm) this.mobileForm.fireEvent("postSaveError");
  1393. //
  1394. // var errorText = error+":"+text;
  1395. // if (xhr) errorText = xhr.responseText;
  1396. // MWF.xDesktop.notice("error", {x: "right", y:"top"}, "request json error: "+errorText);
  1397. // }.bind(this));
  1398. // }
  1399. // }.bind(this);
  1400. //
  1401. //
  1402. // var pcData, mobileData;
  1403. // if (this.pcForm){
  1404. // this.pcForm._getFormData(function(){
  1405. // pcData = this.pcForm.data;
  1406. // loadedPcForm = true;
  1407. // checkLoad();
  1408. // });
  1409. // }
  1410. // if (this.mobileForm){
  1411. // this.mobileForm._getFormData(function(){
  1412. // mobileData = this.mobileForm.data;
  1413. // loadedMobileForm = true;
  1414. // checkLoad();
  1415. // });
  1416. // }else{
  1417. // if (this.formMobileData) mobileData = this.formMobileData;
  1418. // loadedMobileForm = true;
  1419. // checkLoad();
  1420. // }
  1421. var pcData, mobileData;
  1422. if (this.pcForm){
  1423. pcData = this.pcForm._getFormData();
  1424. //pcData = this.pcForm.data;
  1425. }
  1426. if (this.mobileForm){
  1427. mobileData = this.mobileForm._getFormData();
  1428. //mobileData = this.mobileForm.data;
  1429. }else{
  1430. if (this.formMobileData) mobileData = this.formMobileData;
  1431. }
  1432. this.isSave = true;
  1433. var fieldList = this.getFieldList();
  1434. //var subFormList = this.getSubformList();
  1435. this.actions.saveForm(pcData, mobileData, fieldList, function(responseJSON){
  1436. this.notice(MWF.APPFD.LP.notice["save_success"], "ok", null, {x: "left", y:"bottom"});
  1437. if (!this.pcForm.json.name) this.pcForm.treeNode.setText("<"+this.json.type+"> "+this.json.id);
  1438. this.pcForm.treeNode.setTitle(this.pcForm.json.id);
  1439. this.pcForm.node.set("id", this.pcForm.json.id);
  1440. if (this.mobileForm){
  1441. if (!this.mobileForm.json.name) this.mobileForm.treeNode.setText("<"+this.mobileForm.json.type+"> "+this.mobileForm.json.id);
  1442. this.mobileForm.treeNode.setTitle(this.mobileForm.json.id);
  1443. this.mobileForm.node.set("id", this.mobileForm.json.id+"_"+this.options.mode);
  1444. }
  1445. var name = this.pcForm.json.name;
  1446. if (this.pcForm.data.isNewForm) this.setTitle(this.options.appTitle + "-"+name);
  1447. this.pcForm.data.isNewForm = false;
  1448. if (this.mobileForm) this.mobileForm.data.isNewForm = false;
  1449. this.options.desktopReload = true;
  1450. this.options.id = this.pcForm.json.id;
  1451. if (this.pcForm) this.pcForm.fireEvent("postSave");
  1452. if (this.mobileForm) this.mobileForm.fireEvent("postSave");
  1453. this.isSave = false;
  1454. }.bind(this), function(xhr, text, error){
  1455. this.isSave = false;
  1456. if (this.pcForm) this.pcForm.fireEvent("postSaveError");
  1457. if (this.mobileForm) this.mobileForm.fireEvent("postSaveError");
  1458. // if (xhr.status!=0){
  1459. // var errorText = error;
  1460. // if (xhr){
  1461. // var json = JSON.decode(xhr.responseText);
  1462. // if (json){
  1463. // errorText = json.message.trim() || "request json error";
  1464. // }else{
  1465. // errorText = "request json error: "+xhr.responseText;
  1466. // }
  1467. // }
  1468. // errorText = errorText.replace(/\</g, "&lt;");
  1469. // errorText = errorText.replace(/\</g, "&gt;");
  1470. // if (layout.session && layout.session.user) MWF.xDesktop.notice("error", {x: "right", y:"top"}, errorText);
  1471. // }
  1472. var errorText = error+":"+text;
  1473. if (xhr) errorText = xhr.responseText;
  1474. MWF.xDesktop.notice("error", {x: "right", y:"top"}, "request json error: "+errorText);
  1475. }.bind(this));
  1476. }else{
  1477. MWF.xDesktop.notice("info", {x: "right", y:"top"}, this.lp.isSave);
  1478. }
  1479. //this.form.save(function(){
  1480. //
  1481. // var name = this.form.json.name;
  1482. // if (this.form.data.isNewForm) this.setTitle(this.options.appTitle + "-"+name);
  1483. // this.form.data.isNewForm = false;
  1484. // this.options.desktopReload = true;
  1485. // this.options.id = this.form.json.id;
  1486. //}.bind(this));
  1487. },
  1488. previewForm: function(){
  1489. this.form.preview();
  1490. },
  1491. formExplode: function(){
  1492. this.form.explode();
  1493. },
  1494. formImplode: function(){
  1495. this.form.implode();
  1496. },
  1497. htmlImplode: function(){
  1498. this.form.implodeHTML();
  1499. },
  1500. officeImplode: function(){
  1501. this.form.implodeOffice();
  1502. },
  1503. recordStatus: function(){
  1504. return {"id": this.options.id};
  1505. },
  1506. showFormVersion: function(){
  1507. this.form.showFormVersion();
  1508. },
  1509. clearNoDomModule: function(){
  1510. var _self = this;
  1511. this.confirm("warn", new Event(), MWF.APPFD.LP.clearNoDomModuleTitle, MWF.APPFD.LP.clearNoDomModuleContent, 460, 120, function(){
  1512. _self.form._clearNoDomModule();
  1513. this.close();
  1514. }, function(){
  1515. this.close();
  1516. });
  1517. },
  1518. onPostClose: function(){
  1519. if (this.pcForm){
  1520. MWF.release(this.pcForm.moduleList);
  1521. MWF.release(this.pcForm.moduleNodeList);
  1522. MWF.release(this.pcForm.moduleContainerNodeList);
  1523. MWF.release(this.pcForm.moduleElementNodeList);
  1524. MWF.release(this.pcForm.moduleComponentNodeList);
  1525. MWF.release(this.pcForm);
  1526. }
  1527. if (this.mobileForm){
  1528. MWF.release(this.mobileForm.moduleList);
  1529. MWF.release(this.mobileForm.moduleNodeList);
  1530. MWF.release(this.mobileForm.moduleContainerNodeList);
  1531. MWF.release(this.mobileForm.moduleElementNodeList);
  1532. MWF.release(this.mobileForm.moduleComponentNodeList);
  1533. MWF.release(this.mobileForm);
  1534. }
  1535. },
  1536. setTemplateFormNode: function(formNode){
  1537. var html = "<table align=\"center\" width=\"100%\" height=\"90%\" border=\"0\" cellPadding=\"0\" cellSpacing=\"0\">" +
  1538. "<tr><td colSpan=\"2\" style=\"height: 50px; line-height: 60px; text-align: center; font-size: 24px; font-weight: bold\">" +
  1539. this.lp.saveTemplate+"</td></tr>" +
  1540. "<tr><td style=\"height: 40px;\" width=\"80px\">" +this.lp.templateName+"</td><td>"+
  1541. "<input value=\""+this.pcForm.json.name+"\" type=\"text\" style=\"width: 98%; height: 22px; border: 1px solid #cccccc\"/>"+"</td></tr>" +
  1542. "<tr><td style=\"height: 40px;\">" +this.lp.templateCategory+"</td><td>"+
  1543. "<select style=\"width: 30%; height: 24px; border: 1px solid #cccccc\"></select>"+
  1544. "<input type=\"text\" style=\"width: 68%; height: 22px; border: 1px solid #cccccc\"/>"+"</td></tr>" +
  1545. "<tr><td style=\"height: 40px;\">" +this.lp.templateDescription+"</td><td>"+
  1546. "<textarea type=\"text\" style=\"width: 98%; height: 44px; border: 1px solid #cccccc\">"+this.pcForm.json.description+"</textarea>"+"</td></tr>" +
  1547. "<tr><td colSpan=\"2\" id=\"form_templatePreview\">" +
  1548. "<div style=\"position: relative; width: 180px; height: 180px; margin: 20px auto 0px auto; overflow: hidden\"></div>" +
  1549. "</td></tr>" +
  1550. "</table>";
  1551. formNode.set("html", html);
  1552. var tds = formNode.getElements("td");
  1553. var iconNode = tds[tds.length-1].getFirst();
  1554. var previewNode = this.pcForm.node.clone();
  1555. previewNode.setStyles({
  1556. "transform-origin": "0px 0px",
  1557. "transform": "scale(0.15,0.15)",
  1558. "position": "absolute",
  1559. "top": "0px",
  1560. "left": "0px"
  1561. }).inject(iconNode);
  1562. return iconNode;
  1563. },
  1564. setCategorySelect: function(categorySelect){
  1565. if (categorySelect){
  1566. new Element("option", {"value": "$newCategory","text": this.lp.newCategory}).inject(categorySelect);
  1567. this.actions.listFormTemplateCategory(function(json){
  1568. json.data.each(function(category){
  1569. new Element("option", {"value": category.name,"text": category.name}).inject(categorySelect);
  1570. }.bind(this));
  1571. }.bind(this));
  1572. }
  1573. },
  1574. setTemplateActions: function(markNode, areaNode, formNode, iconNode, nameNode, categorySelect, newCategoryNode, descriptionNode){
  1575. var actionAreaNode= new Element("div", {
  1576. "styles": this.css.templateActionNode
  1577. }).inject(formNode);
  1578. var cancelActionNode = new Element("div", {
  1579. "styles": this.css.templateCancelActionNode,
  1580. "text": this.lp.cancel,
  1581. "events":{
  1582. "click": function(){
  1583. markNode.destroy();
  1584. areaNode.destroy();
  1585. }
  1586. }
  1587. }).inject(actionAreaNode);
  1588. var saveActionNode = new Element("div", {
  1589. "styles": this.css.templateSaveActionNode,
  1590. "text": this.lp.save,
  1591. "events":{
  1592. "click": function(){
  1593. this.saveTemplate(markNode, areaNode, iconNode, nameNode, categorySelect, newCategoryNode, descriptionNode);
  1594. }.bind(this)
  1595. }
  1596. }).inject(actionAreaNode);
  1597. },
  1598. saveTemplate: function(markNode, areaNode, iconNode, nameNode, categorySelect, newCategoryNode, descriptionNode){
  1599. var pcData, mobileData;
  1600. if (this.pcForm){
  1601. pcData = this.pcForm._getFormData();
  1602. //pcData = this.pcForm.data;
  1603. }
  1604. if (this.mobileForm){
  1605. mobileData = this.mobileForm._getFormData();
  1606. //mobileData = this.mobileForm.data;
  1607. }
  1608. var name = nameNode.get("value");
  1609. var category = (categorySelect.options[categorySelect.selectedIndex].value=="$newCategory") ? newCategoryNode.get("value") : categorySelect.options[categorySelect.selectedIndex].value;
  1610. var description = descriptionNode.get("value");
  1611. if (!name){
  1612. this.notice(MWF.APPFD.LP.notice["saveTemplate_inputName"], "error", nameNode, {x: "left", y:"top"});
  1613. return false;
  1614. }
  1615. if (categorySelect.options[categorySelect.selectedIndex].value=="$newCategory" && !newCategoryNode.get("value")){
  1616. this.notice(MWF.APPFD.LP.notice["saveTemplate_inputCategory"], "error", categorySelect, {x: "left", y:"top"});
  1617. return false;
  1618. }
  1619. //var tds = formNode.getElements("td");
  1620. //var iconNode = tds[tds.length-1].getFirst();
  1621. var data = {
  1622. "name": name,
  1623. "category": category,
  1624. "description": description,
  1625. "outline": iconNode.get("html")
  1626. };
  1627. this.actions.addFormTemplate(pcData, mobileData, data, function(){
  1628. this.notice(MWF.APPFD.LP.notice["saveTemplate_success"], "ok", null, {x: "left", y:"bottom"});
  1629. markNode.destroy();
  1630. areaNode.destroy();
  1631. }.bind(this), function(xhr, text, error){
  1632. var errorText = error+":"+text;
  1633. if (xhr) errorText = xhr.responseText;
  1634. MWF.xDesktop.notice("error", {x: "right", y:"top"}, "request json error: "+errorText);
  1635. });
  1636. },
  1637. createTemplateSaveNode: function(){
  1638. var markNode = new Element("div", {
  1639. "styles": this.css.templateMarkNode,
  1640. "events": {
  1641. "mouseover": function(e){e.stopPropagation();},
  1642. "mouseout": function(e){e.stopPropagation();}
  1643. }
  1644. }).inject(this.content);
  1645. var areaNode = new Element("div", {
  1646. "styles": this.css.templateAreaNode
  1647. }).inject(this.content);
  1648. var createNode = new Element("div", {
  1649. "styles": this.css.templateInfoNode
  1650. }).inject(areaNode);
  1651. var formNode = new Element("div", {
  1652. "styles": this.css.templateFormNode
  1653. }).inject(createNode);
  1654. var iconNode = this.setTemplateFormNode(formNode);
  1655. var nodes = formNode.getElements("input");
  1656. var nameNode = nodes[0];
  1657. var newCategoryNode = nodes[1];
  1658. var descriptionNode = formNode.getElement("textarea");
  1659. var categorySelect = formNode.getElement("select");
  1660. this.setCategorySelect(categorySelect);
  1661. this.setTemplateActions(markNode, areaNode, formNode, iconNode, nameNode, categorySelect, newCategoryNode, descriptionNode);
  1662. },
  1663. saveFormAsTemplate: function(){
  1664. if (!this.isSave){
  1665. this.createTemplateSaveNode();
  1666. }else{
  1667. MWF.xDesktop.notice("info", {x: "right", y:"top"}, this.lp.isSave);
  1668. }
  1669. },
  1670. styleBrush: function(status, bt){
  1671. if (status==="on"){
  1672. var module = this.form.currentSelectedModule;
  1673. if (module && module.json.type!=="Form"){
  1674. this.form.brushStyle = module.json.styles;
  1675. if (module.json.inputStyles) this.form.brushInputStyle = Object.clone(module.json.inputStyles);
  1676. this.brushCursor = new Element("div", {"styles": {
  1677. "position": "absolute",
  1678. "width": "16px",
  1679. "height": "16px",
  1680. "z-index": 20000,
  1681. "background": "url("+this.path+this.options.style+"/formtoolbar/wand.png)"
  1682. }}).inject(this.content);
  1683. this.brushCursorMoveFun = this.brushCursorMove.bind(this);
  1684. this.contentPosition = this.content.getPosition();
  1685. this.content.addEvent("mousemove", this.brushCursorMoveFun);
  1686. //this.designNode.setStyle("cursor", "url(/"+this.path+this.options.style+"/pageToolbar/brush.png)");
  1687. }else{
  1688. bt.off();
  1689. }
  1690. }else{
  1691. this.form.brushStyle = null;
  1692. this.form.brushInputStyle = null;
  1693. if (this.brushCursorMoveFun) this.content.removeEvent("mousemove", this.brushCursorMoveFun);
  1694. if (this.brushCursor){
  1695. this.brushCursor.destroy();
  1696. this.brushCursor = null;
  1697. }
  1698. }
  1699. },
  1700. brushCursorMove: function(e){
  1701. if (this.brushCursor){
  1702. var x = e.page.x-this.contentPosition.x+10;
  1703. var y = e.page.y-this.contentPosition.y+10;
  1704. this.brushCursor.setStyles({
  1705. "left": ""+x+"px",
  1706. "top": ""+y+"px"
  1707. });
  1708. }
  1709. },
  1710. checkDatatemplateRelativeId: function( json, idMap ){
  1711. ["outerAddActionId","outerDeleteActionId","outerSelectAllId",
  1712. "addActionId","deleteActionId","sequenceId","selectorId"].each(function(key){
  1713. var str = json[key];
  1714. if(str){
  1715. var strArr;
  1716. if( str.indexOf("/") > -1 ) {
  1717. strArr = str.split("/");
  1718. }else if(str.indexOf(".*.") > -1){
  1719. strArr = str.split(".*.");
  1720. }
  1721. if(strArr){
  1722. strArr = strArr.map(function (s) {
  1723. return idMap[s] || s;
  1724. });
  1725. json[key] = strArr.join("/");
  1726. }else{
  1727. if( str && idMap[str] ){
  1728. json[key] = idMap[str];
  1729. }
  1730. }
  1731. }
  1732. }.bind(this));
  1733. }
  1734. });
  1735. MWF.xApplication.process.FormDesigner.ToolsGroup = new Class({
  1736. Implements: [Events],
  1737. initialize: function(data, app, showing){
  1738. this.data = data;
  1739. this.app = app;
  1740. this.css = this.app.css;
  1741. this.tools = [];
  1742. this.showing = showing;
  1743. this.load();
  1744. },
  1745. load: function(){
  1746. this.toolbarGroupNode = new Element("div", {
  1747. "styles": this.css.toolbarGroupNode,
  1748. }).inject(this.app.toolbarGroupContentNode);
  1749. // this.toolbarGroupTitleNode = new Element("div", {
  1750. // "class": "mainColor_bg",
  1751. // "styles": this.css.toolbarGroupTitleNode,
  1752. // "text": this.data.text,
  1753. // "events": {
  1754. // "click": this.show.bind(this)
  1755. // }
  1756. // }).inject(this.toolbarGroupNode);
  1757. this.toolbarContentNode = new Element("div", {
  1758. "styles": this.css.toolbarContentNode,
  1759. }).inject(this.toolbarGroupNode);
  1760. this.loadTools();
  1761. if (this.toolbarContentNode){
  1762. this.app.setScrollBar(this.toolbarContentNode, null, {
  1763. "V": {"x": 0, "y": 0},
  1764. "H": {"x": 0, "y": 0}
  1765. }, function(scrollBar){
  1766. this.scrollBar = scrollBar;
  1767. }.bind(this));
  1768. }
  1769. this.toolbarContentNode.setStyle("height", "0px");
  1770. this.toolbarContentNode.hide();
  1771. var memuItem = this.app.categoryActionMenu.addMenuItem(this.data.text, "click", function(){this.show();}.bind(this));
  1772. //memuItem.styleName = style.style;
  1773. // var imgDiv = memuItem.item.getFirst();
  1774. // var imgNode = new Element("div", {"styles": memuItem.menu.css.menuItemImg}).inject(imgDiv);
  1775. // imgNode.setStyle("background-color", color);
  1776. },
  1777. setContentHeight: function(height){
  1778. this.height = height;
  1779. if (this.isShow){
  1780. this.toolbarContentNode.setStyle("height", ""+this.height+"px");
  1781. }
  1782. },
  1783. show: function( notSetDefault ){
  1784. if (this.app.currentToolGroup != this){
  1785. if (this.app.currentToolGroup) this.app.currentToolGroup.hide();
  1786. // if (!this.morph){
  1787. // this.morph = new Fx.Morph(this.toolbarContentNode, {
  1788. // "duration": "100",
  1789. // transition: Fx.Transitions.Sine.easeOut
  1790. // });
  1791. // }
  1792. // this.toolbarContentNode.show();
  1793. // this.morph.start({"height": [0, this.height]}).chain(function(){
  1794. // if (this.scrollBar && this.scrollBar.scrollVAreaNode) this.scrollBar.scrollVAreaNode.show();
  1795. // this.app.currentToolGroup = this;
  1796. // this.isShow = true;
  1797. // }.bind(this));
  1798. this.toolbarContentNode.show();
  1799. this.toolbarContentNode.setStyle("height", this.height);
  1800. if (this.scrollBar && this.scrollBar.scrollVAreaNode) this.scrollBar.scrollVAreaNode.show();
  1801. this.app.currentToolGroup = this;
  1802. this.isShow = true;
  1803. if (this.app.toolbarMode=="all") this.app.toolbarTitleNode.set("text", this.data.text);
  1804. if(!notSetDefault)this.app.setDefaultTool( this.data.name );
  1805. }
  1806. },
  1807. hide: function(){
  1808. if (this.app.currentToolGroup==this) this.app.currentToolGroup = null;
  1809. // if (!this.morph){
  1810. // this.morph = new Fx.Morph(this.toolbarContentNode, {
  1811. // "duration": "100",
  1812. // transition: Fx.Transitions.Sine.easeOut
  1813. // });
  1814. // }
  1815. // this.isShow = false;
  1816. // if (this.scrollBar && this.scrollBar.scrollVAreaNode) this.scrollBar.scrollVAreaNode.hide();
  1817. // this.morph.start({
  1818. // "height": [this.height, 0]
  1819. // }).chain(function(){
  1820. // this.toolbarContentNode.hide();
  1821. // }.bind(this));
  1822. this.toolbarContentNode.hide();
  1823. if (this.scrollBar && this.scrollBar.scrollVAreaNode) this.scrollBar.scrollVAreaNode.hide();
  1824. this.isShow = false;
  1825. },
  1826. loadTools: function(){
  1827. var designer = this.app;
  1828. var group = this;
  1829. this.getTools(function(){
  1830. Object.each(this.toolsData, function(value, key){
  1831. var toolNode = new Element("div", {
  1832. "styles": this.css.toolbarToolNode,
  1833. "title": value.text,
  1834. "events": {
  1835. "mouseover": function(e){
  1836. try {
  1837. this.setStyles(designer.css.toolbarToolNodeOver);
  1838. }catch(e){
  1839. this.setStyles(designer.css.toolbarToolNodeOverCSS2);
  1840. };
  1841. },
  1842. "mouseout": function(e){
  1843. try {
  1844. this.setStyles(designer.css.toolbarToolNode);
  1845. }catch(e){};
  1846. },
  1847. "mousedown": function(e){
  1848. try {
  1849. this.setStyles(designer.css.toolbarToolNodeDown);
  1850. }catch(e){
  1851. this.setStyles(designer.css.toolbarToolNodeDownCSS2);
  1852. };
  1853. },
  1854. "mouseup": function(e){
  1855. try {
  1856. this.setStyles(designer.css.toolbarToolNodeUp);
  1857. }catch(e){
  1858. this.setStyles(designer.css.toolbarToolNodeUpCSS2);
  1859. };
  1860. }
  1861. }
  1862. }).inject(this.toolbarContentNode);
  1863. toolNode.store("toolClass", value.className);
  1864. var iconNode = new Element("div", {
  1865. "styles": this.css.toolbarToolIconNode
  1866. }).inject(toolNode);
  1867. if (value.icon) iconNode.setStyle("background-image", "url("+this.app.path+this.app.options.style+"/icon/"+value.icon+")");
  1868. if (value.fontIcon){
  1869. iconNode.addClass("mainColor_color");
  1870. iconNode.set("html", "<i class=\""+value.fontIcon+"\"></i>");
  1871. }
  1872. var textNode = new Element("div.o2formModuleTools", {
  1873. "styles": this.css.toolbarToolTextNode,
  1874. "text": value.text
  1875. });
  1876. textNode.inject(toolNode);
  1877. toolNode.addEvent("mousedown", function(e){
  1878. var className = this.retrieve("toolClass");
  1879. designer.form.createModule(className, e, group.data.name);
  1880. });
  1881. this.tools.push(toolNode);
  1882. }.bind(this));
  1883. // if (this.data.name==="default") this.show();
  1884. if( this.showing )this.show( true );
  1885. }.bind(this));
  1886. },
  1887. getTools: function(callback){
  1888. if (this.toolsData){
  1889. if (callback) callback();
  1890. }else{
  1891. var toolsDataUrl = this.app.path+this.app.options.style+"/"+this.data.json;
  1892. o2.JSON.get(toolsDataUrl, function(responseJSON){
  1893. this.toolsData = responseJSON;
  1894. if (!this.app.toolsData){
  1895. this.app.toolsData = this.toolsData;
  1896. }else{
  1897. this.app.toolsData = Object.merge(this.app.toolsData, this.toolsData)
  1898. }
  1899. if (callback) callback();
  1900. }.bind(this));
  1901. }
  1902. },
  1903. });