Page.js 27 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796
  1. MWF.xApplication.portal.PageDesigner.Module = MWF.xApplication.portal.PageDesigner.Module || {};
  2. MWF.require("MWF.widget.Common", null, false);
  3. MWF.xApplication.portal.PageDesigner.Module.Page = MWF.PCPage = new Class({
  4. Extends: MWF.widget.Common,
  5. Implements: [Options, Events],
  6. options: {
  7. "style": "default",
  8. "propertyPath": "/x_component_portal_PageDesigner/Module/Page/page.html",
  9. "mode": "PC",
  10. "fields": ["Calendar", "Checkbox", "Datagrid", "Datagrid$Title", "Datagrid$Data", "Htmleditor", "Number", "Office", "Orgfield", "Personfield", "Radio", "Select", "Textarea", "Textfield"]
  11. },
  12. initializeBase: function(options){
  13. this.setOptions(options);
  14. this.path = "/x_component_portal_PageDesigner/Module/Page/";
  15. this.cssPath = "/x_component_portal_PageDesigner/Module/Page/"+this.options.style+"/css.wcss";
  16. this._loadCss();
  17. },
  18. initialize: function(designer, container, options){
  19. this.initializeBase(options);
  20. this.container = null;
  21. this.page = this;
  22. this.form = this;
  23. this.moduleType = "page";
  24. this.moduleList = [];
  25. this.moduleNodeList = [];
  26. this.moduleContainerNodeList = [];
  27. this.moduleElementNodeList = [];
  28. this.moduleComponentNodeList = [];
  29. // this.moduleContainerList = [];
  30. this.dataTemplate = {};
  31. this.designer = designer;
  32. this.container = container;
  33. this.selectedModules = [];
  34. },
  35. reload: function(data){
  36. this.moduleList.each(function(module){
  37. if (module.property){
  38. module.property.destroy();
  39. }
  40. }.bind(this));
  41. if (this.property) this.property.destroy();
  42. this.property = null;
  43. this.moduleList = [];
  44. this.moduleNodeList = [];
  45. this.moduleContainerNodeList = [];
  46. this.moduleElementNodeList = [];
  47. this.moduleComponentNodeList = [];
  48. this.dataTemplate = {};
  49. this.selectedModules = [];
  50. this.container.empty();
  51. if (this.treeNode){
  52. this.domTree.empty();
  53. this.domTree.node.destroy();
  54. this.domTree = null;
  55. this.treeNode = null;
  56. }
  57. this.currentSelectedModule = null;
  58. this.propertyMultiTd = null;
  59. if (this.autoSaveTimerID) window.clearInterval(this.autoSaveTimerID);
  60. this.load(data);
  61. },
  62. load : function(data){
  63. this.data = data;
  64. this.json = data.json;
  65. this.html = data.html;
  66. this.json.mode = this.options.mode;
  67. if (!this.json.css) this.json.css = {"code":""};
  68. this.isNewPage = (this.json.id) ? false : true;
  69. if (this.isNewPage) this.checkUUID();
  70. if(this.designer.application) this.data.json.applicationName = this.designer.application.name;
  71. if(this.designer.application) this.data.json.application = this.designer.application.id;
  72. this.container.set("html", this.html);
  73. this.loadStylesList(function(){
  74. var oldStyleValue = "";
  75. if ((!this.json.pageStyleType) || !this.stylesList[this.json.pageStyleType]) this.json.pageStyleType="blue-simple";
  76. if (this.options.mode=="Mobile"){
  77. if (this.json.pageStyleType != "defaultMobile"){
  78. oldStyleValue = this.json.pageStyleType;
  79. this.json.pageStyleType = "defaultMobile";
  80. }
  81. }
  82. this.templateStyles = (this.stylesList && this.json.pageStyleType) ? this.stylesList[this.json.pageStyleType] : null;
  83. this.loadDomModules();
  84. if (this.json.pageStyleType){
  85. if (this.stylesList[this.json.pageStyleType]){
  86. if (this.stylesList[this.json.pageStyleType]["page"]){
  87. this.setTemplateStyles(this.stylesList[this.json.pageStyleType]["page"]);
  88. }
  89. }
  90. }
  91. this.setCustomStyles();
  92. this.node.setProperties(this.json.properties);
  93. this.setNodeEvents();
  94. if (this.options.mode=="Mobile"){
  95. if (oldStyleValue) this._setEditStyle("pageStyleType", null, oldStyleValue);
  96. }
  97. this.selected();
  98. this.autoSave();
  99. this.designer.addEvent("queryClose", function(){
  100. if (this.autoSaveTimerID) window.clearInterval(this.autoSaveTimerID);
  101. }.bind(this));
  102. }.bind(this));
  103. },
  104. removeStyles: function(from, to){
  105. if (this.json[to]){
  106. Object.each(from, function(style, key){
  107. if (this.json[to][key] && this.json[to][key]==style){
  108. delete this.json[to][key];
  109. }
  110. }.bind(this));
  111. }
  112. },
  113. copyStyles: function(from, to){
  114. if (!this.json[to]) this.json[to] = {};
  115. Object.each(from, function(style, key){
  116. if (!this.json[to][key]) this.json[to][key] = style;
  117. }.bind(this));
  118. },
  119. clearTemplateStyles: function(styles){
  120. if (styles){
  121. if (styles.styles) this.removeStyles(styles.styles, "styles");
  122. if (styles.properties) this.removeStyles(styles.properties, "properties");
  123. }
  124. },
  125. setTemplateStyles: function(styles){
  126. if (styles.styles) this.copyStyles(styles.styles, "styles");
  127. if (styles.properties) this.copyStyles(styles.properties, "properties");
  128. },
  129. loadStylesList: function(callback){
  130. var stylesUrl = "/x_component_portal_PageDesigner/Module/Page/template/"+((this.options.mode=="Mobile") ? "styles": "styles")+".json";
  131. MWF.getJSON(stylesUrl,{
  132. "onSuccess": function(responseJSON){
  133. this.stylesList= responseJSON;
  134. if (callback) callback(this.stylesList);
  135. }.bind(this),
  136. "onRequestFailure": function(){
  137. this.stylesList = {};
  138. if (callback) callback(this.stylesList);
  139. }.bind(this),
  140. "onError": function(){
  141. this.stylesList = {};
  142. if (callback) callback(this.stylesList);
  143. }.bind(this)
  144. }
  145. );
  146. },
  147. autoSave: function(){
  148. this.autoSaveCheckNode = this.designer.pageToolbarNode.getElement("#MWFPageAutoSaveCheck");
  149. if (this.autoSaveCheckNode){
  150. this.autoSaveTimerID = window.setInterval(function(){
  151. if (this.autoSaveCheckNode.get("checked")){
  152. this.save();
  153. }
  154. }.bind(this), 60000);
  155. }
  156. },
  157. checkUUID: function(){
  158. this.designer.actions.getUUID(function(id){
  159. this.json.id = id;
  160. }.bind(this));
  161. },
  162. loadDomModules: function(){
  163. this.node = this.container.getFirst();
  164. this.node.set("id", this.json.id);
  165. this.node.setStyles(this.css.pageNode);
  166. this.node.store("module", this);
  167. var id = this.json.id.replace(/\-/g, "");
  168. this.node.addClass("css"+id);
  169. this.reloadCss();
  170. var y = this.container.getStyle("height");
  171. y = (y) ? y.toInt()-2 : this.container.getSize().y-2;
  172. this.node.setStyle("min-height", ""+y+"px");
  173. this.designer.addEvent("resize", function(){
  174. var y = this.container.getStyle("height");
  175. y = (y) ? y.toInt()-2 : this.container.getSize().y-2;
  176. this.node.setStyle("min-height", ""+y+"px");
  177. }.bind(this));
  178. this.loadDomTree();
  179. },
  180. loadDomTree: function(){
  181. MWF.require("MWF.widget.Tree", function(){
  182. this.domTree = new MWF.widget.Tree(this.designer.propertyDomArea, {"style": "domtree"});
  183. this.domTree.load();
  184. this.createPageTreeNode();
  185. this.parseModules(this, this.node);
  186. }.bind(this));
  187. },
  188. createPageTreeNode: function(){
  189. var text = "<"+this.json.type+"> "+this.json.name+" ["+this.options.mode+"] ";
  190. var o = {
  191. "expand": true,
  192. "title": this.json.id,
  193. "text": "<"+this.json.type+"> "+this.json.name+" ["+this.options.mode+"] ",
  194. "icon": (this.options.mode=="Mobile") ? "mobile.png": "pc.png"
  195. };
  196. o.action = function(){
  197. if (this.module) this.module.selected();
  198. };
  199. this.treeNode = this.domTree.appendChild(o);
  200. this.treeNode.setText(text);
  201. this.treeNode.module = this;
  202. },
  203. parseModules: function(parent, dom){
  204. var tmpDom = null;
  205. var subDom = dom.getFirst();
  206. while (subDom){
  207. if (subDom.get("MWFtype")){
  208. // var module = subDom.retrieve("module");
  209. // alert(subDom.get("id")+": "+module);
  210. // if (!module){
  211. var json = this.getDomjson(subDom);
  212. if (json) module = this.loadModule(json, subDom, parent);
  213. // }
  214. // if (module.moduleType=="container") this.parseModules(module, subDom);
  215. // }else{
  216. // this.parseModules(parent, subDom);
  217. }
  218. // else if (subDom.getFirst()){
  219. // subDom = subDom.getFirst();
  220. // this.parseModules(parent, subDom);
  221. // }else{
  222. // subDom = subDom.getNext();
  223. // }
  224. if (!json) tmpDom = subDom;
  225. subDom = subDom.getNext();
  226. if (tmpDom){
  227. tmpDom.destroy();
  228. tmpDom = null;
  229. }
  230. }
  231. },
  232. getDomjson: function(dom){
  233. var mwfType = dom.get("MWFtype");
  234. switch (mwfType) {
  235. case "page":
  236. return this.json;
  237. case "":
  238. return null;
  239. default:
  240. var id = dom.get("id");
  241. if (id){
  242. return this.json.moduleList[id];
  243. }else{
  244. return null;
  245. }
  246. }
  247. },
  248. loadModule: function(json, dom, parent){
  249. if (json) {
  250. var module = new MWF["PC" + json.type](this);
  251. module.load(json, dom, parent);
  252. return module;
  253. }
  254. },
  255. setNodeEvents: function(){
  256. this.node.addEvent("click", function(e){
  257. this.selected();
  258. }.bind(this));
  259. },
  260. createModule: function(className, e){
  261. this.getTemplateData(className, function(data){
  262. var moduleData = Object.clone(data);
  263. var newTool = new MWF["PC"+className](this);
  264. newTool.create(moduleData, e);
  265. }.bind(this));
  266. },
  267. getTemplateData: function(className, callback, async){
  268. if (this.dataTemplate[className]){
  269. if (callback) callback(this.dataTemplate[className]);
  270. }else{
  271. var templateUrl = "/x_component_portal_PageDesigner/Module/"+className+"/template.json";
  272. MWF.getJSON(templateUrl, function(responseJSON, responseText){
  273. this.dataTemplate[className] = responseJSON;
  274. if (callback) callback(responseJSON);
  275. }.bind(this), async);
  276. }
  277. },
  278. selected: function(){
  279. if (this.currentSelectedModule){
  280. if (this.currentSelectedModule==this){
  281. return true;
  282. }else{
  283. this.currentSelectedModule.unSelected();
  284. }
  285. }
  286. if (this.propertyMultiTd){
  287. this.propertyMultiTd.hide();
  288. this.propertyMultiTd = null;
  289. }
  290. this.unSelectedMulti();
  291. this.currentSelectedModule = this;
  292. if (this.treeNode){
  293. this.treeNode.selectNode();
  294. }
  295. this.showProperty();
  296. // this.isFocus = true;
  297. },
  298. unSelectedMulti: function(){
  299. while (this.selectedModules.length){
  300. this.selectedModules[0].unSelectedMulti();
  301. }
  302. if (this.multimoduleActionsArea) this.multimoduleActionsArea.setStyle("display", "none");
  303. },
  304. unSelectAll: function(){
  305. },
  306. _beginSelectMulti: function(){
  307. if (this.currentSelectedModule) this.currentSelectedModule.unSelected();
  308. this.unSelectedMulti();
  309. this.noSelected = true;
  310. },
  311. _completeSelectMulti: function(){
  312. if (this.selectedModules.length<2){
  313. this.selectedModules[0].selected();
  314. }else{
  315. this._showMultiActions();
  316. }
  317. },
  318. createMultimoduleActionsArea: function(){
  319. this.multimoduleActionsArea = new Element("div", {
  320. styles: {
  321. "display": "none",
  322. // "width": 18*this.options.actions.length,
  323. "position": "absolute",
  324. "background-color": "#F1F1F1",
  325. "padding": "1px",
  326. "padding-right": "0px",
  327. "border": "1px solid #AAA",
  328. "box-shadow": "0px 2px 5px #999",
  329. "z-index": 10001
  330. }
  331. }).inject(this.page.container, "after");
  332. },
  333. _showMultiActions: function(){
  334. if (!this.multimoduleActionsArea) this.createMultimoduleActionsArea();
  335. var firstModule = this._getFirstMultiSelectedModule();
  336. if (firstModule){
  337. // var module = firstModule.module;
  338. var y = firstModule.position.y-25;
  339. var x = firstModule.position.x;
  340. this.multimoduleActionsArea.setPosition({"x": x, "y": y});
  341. this.multimoduleActionsArea.setStyle("display", "block");
  342. }
  343. },
  344. _getFirstMultiSelectedModule: function(){
  345. var firstModule = null;
  346. this.selectedModules.each(function(module){
  347. var position = module.node.getPosition(module.form.node.getOffsetParent());
  348. if (!firstModule){
  349. firstModule = {"module": module, "position": position};
  350. }else{
  351. if (position.y<firstModule.position.y){
  352. firstModule = {"module": module, "position": position};
  353. }else if (position.y==firstModule.position.y){
  354. if (position.x<firstModule.position.x){
  355. firstModule = {"module": module, "position": position};
  356. }
  357. }
  358. }
  359. });
  360. return firstModule;
  361. },
  362. showProperty: function(){
  363. if (!this.property){
  364. this.property = new MWF.xApplication.process.FormDesigner.Property(this, this.designer.propertyContentArea, this.designer, {
  365. "path": this.options.propertyPath,
  366. "onPostLoad": function(){
  367. this.property.show();
  368. }.bind(this)
  369. });
  370. this.property.load();
  371. }else{
  372. this.property.show();
  373. }
  374. },
  375. hideProperty: function(){
  376. if (this.property) this.property.hide();
  377. },
  378. unSelected: function(){
  379. this.currentSelectedModule = null;
  380. this.hideProperty();
  381. },
  382. _dragIn: function(module){
  383. if (!this.Component) module.inContainer = this;
  384. module.parentContainer = this;
  385. this.node.setStyles({"border": "1px solid #ffa200"});
  386. var copyNode = module._getCopyNode();
  387. copyNode.inject(this.node);
  388. },
  389. _dragOut: function(module){
  390. module.inContainer = null;
  391. module.parentContainer = null;
  392. this.node.setStyles(this.css.pageNode);
  393. this.node.setStyles(this.json.styles);
  394. var copyNode = module._getCopyNode();
  395. copyNode.setStyle("display", "none");
  396. },
  397. _dragDrop: function(module){
  398. this.node.setStyles(this.css.pageNode);
  399. this.node.setStyles(this.json.styles);
  400. },
  401. _clearNoId: function(node){
  402. var subNode = node.getFirst();
  403. while (subNode){
  404. var nextNode = subNode.getNext();
  405. if (subNode.get("MWFType")){
  406. if (!subNode.get("id")){
  407. subNode.destroy();
  408. }else{
  409. if (subNode) this._clearNoId(subNode);
  410. }
  411. }else{
  412. if (subNode) this._clearNoId(subNode);
  413. }
  414. subNode = nextNode;
  415. }
  416. },
  417. _getPageData: function(){
  418. var copy = this.node.clone(true, true);
  419. copy.clearStyles(true);
  420. this._clearNoId(copy);
  421. var html = copy.outerHTML;
  422. copy.destroy();
  423. this.data.json.mode = this.options.mode;
  424. this.data.html = html;
  425. return this.data;
  426. },
  427. preview: function(){
  428. var url = "/x_desktop/portal.html?id="+this.json.application+"&page="+this.json.id;
  429. window.open(url);
  430. // MWF.xDesktop.requireApp("process.FormDesigner", "Preview", function(){
  431. //
  432. // if (this.options.mode=="Mobile"){
  433. // this.previewBox = new MWF.xApplication.process.FormDesigner.Preview(this, {"size": {"x": "340", "y": 580, "layout":"mobile"}});
  434. // }else{
  435. // this.previewBox = new MWF.xApplication.process.FormDesigner.Preview(this);
  436. // }
  437. // this.previewBox.load();
  438. //
  439. // }.bind(this));
  440. },
  441. save: function(callback){
  442. this.designer.savePage();
  443. },
  444. explode: function(){
  445. this._getPageData();
  446. MWF.require("MWF.widget.Base64", null, false);
  447. var data = MWF.widget.Base64.encode(JSON.encode(this.data));
  448. MWF.require("MWF.widget.Panel", function(){
  449. var node = new Element("div");
  450. var size = this.designer.pageNode.getSize();
  451. var position = this.designer.pageNode.getPosition(this.designer.pageNode.getOffsetParent());
  452. var textarea = new Element("textarea", {
  453. "styles": {
  454. "border": "1px solid #999",
  455. "width": "770px",
  456. "margin-left": "14px",
  457. "margin-top": "14px",
  458. "height": "580px"
  459. },
  460. "text": JSON.encode(this.data)
  461. }).inject(node);
  462. this.explodePanel = new MWF.widget.Panel(node, {
  463. "style": "page",
  464. "isResize": false,
  465. "isMax": false,
  466. "title": "",
  467. "width": 800,
  468. "height": 660,
  469. "top": position.y,
  470. "left": position.x+3,
  471. "isExpand": false,
  472. "target": this.designer.node
  473. });
  474. this.explodePanel.load();
  475. }.bind(this));
  476. },
  477. implode: function(){
  478. MWF.xDesktop.requireApp("portal.PageDesigner", "Import", function(){
  479. MWF.FormImport.create("O2", this);
  480. }.bind(this));
  481. // MWF.require("MWF.widget.Panel", function(){
  482. // var node = new Element("div");
  483. // var size = this.designer.pageNode.getSize();
  484. // var position = this.designer.pageNode.getPosition(this.designer.pageNode.getOffsetParent());
  485. //
  486. // var textarea = new Element("textarea", {
  487. // "styles": {
  488. // "border": "1px solid #999",
  489. // "width": "770px",
  490. // "margin-left": "14px",
  491. // "margin-top": "14px",
  492. // "height": "540px"
  493. // }
  494. // }).inject(node);
  495. // var button = new Element("div", {
  496. // "styles": {
  497. // "margin": "10px auto",
  498. // "width": "100px",
  499. // "border-radius": "8px",
  500. // "height": "30px",
  501. // "line-height": "30px",
  502. // "text-align": "center",
  503. // "cursor": "pointer",
  504. // "color": "#ffffff",
  505. // "background-color": "#4c6b87"
  506. // },
  507. // "text": "OK"
  508. // }).inject(node);
  509. // button.addEvent("click", function(e){
  510. // var _self = this;
  511. // this.designer.confirm("warn", e, this.designer.lp.implodeConfirmTitle, this.designer.lp.implodeConfirmText, 300, 120, function(){
  512. // var str = textarea.get("value");
  513. // _self.implodeJsonData(str);
  514. // this.close();
  515. // }, function(){
  516. // this.close();
  517. // });
  518. // }.bind(this));
  519. //
  520. // this.implodePanel = new MWF.widget.Panel(node, {
  521. // "style": "page",
  522. // "isResize": false,
  523. // "isMax": false,
  524. // "title": "",
  525. // "width": 800,
  526. // "height": 660,
  527. // "top": position.y,
  528. // "left": position.x+3,
  529. // "isExpand": false,
  530. // "target": this.designer.node
  531. // });
  532. //
  533. // this.implodePanel.load();
  534. // }.bind(this));
  535. },
  536. // implodeJsonData: function(str){
  537. // if (str){
  538. // //try{
  539. // debugger;
  540. // var data = JSON.decode(str);
  541. // if (data){
  542. // var json = data.json;
  543. // data.id = this.data.id;
  544. // data.isNewPage = this.data.isNewPage;
  545. // json.id = this.json.id;
  546. // json.name = this.json.name;
  547. // json.application = this.json.application;
  548. // json.applicationName = this.json.applicationName;
  549. //
  550. // this.reload(data);
  551. // this.implodePanel.closePanel();
  552. // }else{
  553. // this.designer.notice(this.designer.lp.implodeError, "error");
  554. // }
  555. // // }catch(e){
  556. // // this.designer.notice(this.designer.lp.implodeError, "error");
  557. // // }
  558. // }else{
  559. // this.designer.notice(this.designer.lp.implodeEmpty, "error");
  560. // }
  561. // },
  562. implodeHTML: function(){
  563. MWF.xDesktop.requireApp("portal.PageDesigner", "Import", function(){
  564. MWF.FormImport.create("html", this);
  565. }.bind(this));
  566. },
  567. implodeOffice: function(){
  568. MWF.xDesktop.requireApp("portal.PageDesigner", "Import", function(){
  569. MWF.FormImport.create("office", this);
  570. }.bind(this));
  571. },
  572. setPropertiesOrStyles: function(name){
  573. if (name==="styles"){
  574. this.setCustomStyles();
  575. }
  576. if (name==="properties"){
  577. this.node.setProperties(this.json.properties);
  578. }
  579. },
  580. setCustomStyles: function(){
  581. var border = this.node.getStyle("border");
  582. this.node.clearStyles();
  583. this.node.setStyles(this.css.pageNode);
  584. var y = this.container.getSize().y-2;
  585. this.node.setStyle("min-height", ""+y+"px");
  586. if (this.initialStyles) this.node.setStyles(this.initialStyles);
  587. this.node.setStyle("border", border);
  588. Object.each(this.json.styles, function(value, key){
  589. var reg = /^border\w*/ig;
  590. if (!key.test(reg)){
  591. this.node.setStyle(key, value);
  592. }
  593. }.bind(this));
  594. },
  595. _setEditStyle: function(name, obj, oldValue){
  596. if (name=="name"){
  597. var title = this.json.name || this.json.id;
  598. this.treeNode.setText("<"+this.json.type+"> "+title+" ["+this.options.mode+"] ");
  599. }
  600. if (name=="id"){
  601. if (!this.json.name) this.treeNode.setText("<"+this.json.type+"> "+this.json.id+" ["+this.options.mode+"] ");
  602. this.treeNode.setTitle(this.json.id);
  603. this.node.set("id", this.json.id);
  604. }
  605. if (name=="pageStyleType"){
  606. this.templateStyles = (this.stylesList && this.json.pageStyleType) ? this.stylesList[this.json.pageStyleType] : null;
  607. if (oldValue) {
  608. var oldTemplateStyles = this.stylesList[oldValue];
  609. if (oldTemplateStyles){
  610. if (oldTemplateStyles["page"]) this.clearTemplateStyles(oldTemplateStyles["page"]);
  611. }
  612. }
  613. if (this.templateStyles){
  614. if (this.templateStyles["page"]) this.setTemplateStyles(this.templateStyles["page"]);
  615. }
  616. this.setAllStyles();
  617. this.moduleList.each(function(module){
  618. if (oldTemplateStyles){
  619. module.clearTemplateStyles(oldTemplateStyles[module.moduleName]);
  620. }
  621. module.setStyleTemplate();
  622. module.setAllStyles();
  623. }.bind(this));
  624. }
  625. if (name==="css"){
  626. this.reloadCss();
  627. }
  628. this._setEditStyle_custom(name, obj, oldValue);
  629. },
  630. parseCSS: function(css){
  631. var rex = /(url\(.*\))/g;
  632. var match;
  633. while ((match = rex.exec(css)) !== null) {
  634. var pic = match[0];
  635. var len = pic.length;
  636. var s = pic.substring(pic.length-2, pic.length-1);
  637. var n0 = (s==="'" || s==="\"") ? 5 : 4;
  638. var n1 = (s==="'" || s==="\"") ? 2 : 1;
  639. pic = pic.substring(n0, pic.length-n1);
  640. if ((pic.indexOf("x_processplatform_assemble_surface")!=-1 || pic.indexOf("x_portal_assemble_surface")!=-1)){
  641. var host1 = MWF.Actions.getHost("x_processplatform_assemble_surface");
  642. var host2 = MWF.Actions.getHost("x_portal_assemble_surface");
  643. if (pic.indexOf("/x_processplatform_assemble_surface")!==-1){
  644. pic = pic.replace("/x_processplatform_assemble_surface", pic+"/x_processplatform_assemble_surface");
  645. }else if (pic.indexOf("x_processplatform_assemble_surface")!==-1){
  646. pic = pic.replace("x_processplatform_assemble_surface", pic+"/x_processplatform_assemble_surface");
  647. }
  648. if (pic.indexOf("/x_portal_assemble_surface")!==-1){
  649. pic = pic.replace("/x_portal_assemble_surface", host2+"/x_portal_assemble_surface");
  650. }else if (pic.indexOf("x_portal_assemble_surface")!==-1){
  651. pic = pic.replace("x_portal_assemble_surface", host2+"/x_portal_assemble_surface");
  652. }
  653. }
  654. pic = "url('"+pic+"')";
  655. var len2 = pic.length;
  656. css = css.substring(0, match.index) + pic + css.substring(rex.lastIndex, css.length);
  657. rex.lastIndex = rex.lastIndex + (len2-len);
  658. }
  659. return css;
  660. },
  661. reloadCss: function(){
  662. cssText = (this.json.css) ? this.json.css.code : "";
  663. //var head = (document.head || document.getElementsByTagName("head")[0] || document.documentElement);
  664. var styleNode = $("style"+this.json.id);
  665. if (styleNode) styleNode.destroy();
  666. if (cssText){
  667. cssText = this.parseCSS(cssText);
  668. var rex = new RegExp("(.+)(?=\\{)", "g");
  669. var match;
  670. var id = this.json.id.replace(/\-/g, "");
  671. while ((match = rex.exec(cssText)) !== null) {
  672. var prefix = ".css" + id + " ";
  673. var rule = prefix + match[0];
  674. cssText = cssText.substring(0, match.index) + rule + cssText.substring(rex.lastIndex, cssText.length);
  675. rex.lastIndex = rex.lastIndex + prefix.length;
  676. }
  677. var styleNode = document.createElement("style");
  678. styleNode.setAttribute("type", "text/css");
  679. styleNode.id="style"+this.json.id;
  680. styleNode.inject(this.container, "before");
  681. if(styleNode.styleSheet){
  682. var setFunc = function(){
  683. styleNode.styleSheet.cssText = cssText;
  684. };
  685. if(styleNode.styleSheet.disabled){
  686. setTimeout(setFunc, 10);
  687. }else{
  688. setFunc();
  689. }
  690. }else{
  691. var cssTextNode = document.createTextNode(cssText);
  692. styleNode.appendChild(cssTextNode);
  693. }
  694. }
  695. },
  696. setAllStyles: function(){
  697. this.setPropertiesOrStyles("styles");
  698. this.setPropertiesOrStyles("properties");
  699. this.reloadMaplist();
  700. },
  701. reloadMaplist: function(){
  702. if (this.property) Object.each(this.property.maplists, function(map, name){ map.reload(this.json[name]);}.bind(this));
  703. },
  704. _setEditStyle_custom: function(){
  705. },
  706. saveAsTemplete: function(){
  707. },
  708. checkModuleId: function(id, type, currentSubform){
  709. var fieldConflict = false;
  710. var elementConflict = false;
  711. if (this.json.moduleList[id]){
  712. elementConflict = true;
  713. if (this.options.fields.indexOf(type)!=-1 || this.options.fields.indexOf(this.json.moduleList[id].type)!=-1){
  714. fieldConflict = true;
  715. }
  716. return {"fieldConflict": fieldConflict, "elementConflict": elementConflict};
  717. }
  718. // if (this.subformList){
  719. // Object.each(this.subformList, function(subform){
  720. // if (!currentSubform || currentSubform!=subform.id){
  721. // if (subform.moduleList[id]){
  722. // elementConflict = true;
  723. // if (this.options.fields.indexOf(type)!=-1 || this.options.fields.indexOf(subform.moduleList[id].type)!=-1){
  724. // fieldConflict = true;
  725. // }
  726. // }
  727. // }
  728. // }.bind(this));
  729. // }
  730. return {"fieldConflict": fieldConflict, "elementConflict": elementConflict};
  731. }
  732. });