Main.js 33 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840
  1. MWF.SRVID = MWF.xApplication.service.InvokeDesigner = MWF.xApplication.service.InvokeDesigner || {};
  2. MWF.SRVID.options = {
  3. "multitask": true,
  4. "executable": false
  5. };
  6. //MWF.xDesktop.requireApp("process.ProcessManager", "Actions.RestActions", null, false);
  7. MWF.xDesktop.requireApp("service.InvokeDesigner", "Invoke", null, false);
  8. MWF.require("MWF.xDesktop.UserData", null, false);
  9. MWF.xApplication.service.InvokeDesigner.Main = new Class({
  10. Extends: MWF.xApplication.Common.Main,
  11. Implements: [Options, Events],
  12. options: {
  13. "style": "default",
  14. "name": "service.InvokeDesigner",
  15. "icon": "icon.png",
  16. "title": MWF.SRVID.LP.title,
  17. "appTitle": MWF.SRVID.LP.title,
  18. "id": "",
  19. "actions": null,
  20. "category": null,
  21. "serviceData": null
  22. },
  23. onQueryLoad: function(){
  24. if (this.status){
  25. this.options.id = this.status.id;
  26. }
  27. if (!this.options.id){
  28. this.options.desktopReload = false;
  29. this.options.title = this.options.title + "-"+MWF.SRVID.LP.newInvoke;
  30. }
  31. this.actions = MWF.Actions.get("x_program_center");
  32. //this.actions = new MWF.xApplication.process.ProcessManager.Actions.RestActions();
  33. this.lp = MWF.xApplication.service.InvokeDesigner.LP;
  34. this.addEvent("queryClose", function(e){
  35. if (this.explorer){
  36. this.explorer.reload();
  37. }
  38. }.bind(this));
  39. // this.processData = this.options.processData;
  40. },
  41. loadApplication: function(callback){
  42. this.createNode();
  43. if (!this.options.isRefresh){
  44. this.maxSize(function(){
  45. this.openInvoke();
  46. }.bind(this));
  47. }else{
  48. this.openInvoke();
  49. }
  50. if (callback) callback();
  51. },
  52. createNode: function(){
  53. this.content.setStyle("overflow", "hidden");
  54. this.node = new Element("div", {
  55. "styles": {"width": "100%", "height": "100%", "overflow": "hidden"}
  56. }).inject(this.content);
  57. },
  58. openInvoke: function(){
  59. this.loadNodes();
  60. this.loadInvokeListNodes();
  61. this.loadContentNode(function(){
  62. this.loadProperty();
  63. // this.loadTools();
  64. this.resizeNode();
  65. this.addEvent("resize", this.resizeNode.bind(this));
  66. this.loadInvoke();
  67. if (this.toolbarContentNode){
  68. this.setScrollBar(this.toolbarContentNode, null, {
  69. "V": {"x": 0, "y": 0},
  70. "H": {"x": 0, "y": 0}
  71. });
  72. this.setScrollBar(this.propertyDomArea, null, {
  73. "V": {"x": 0, "y": 0},
  74. "H": {"x": 0, "y": 0}
  75. });
  76. }
  77. }.bind(this));
  78. },
  79. loadNodes: function(){
  80. this.invokeListNode = new Element("div", {
  81. "styles": this.css.invokeListNode
  82. }).inject(this.node);
  83. this.propertyNode = new Element("div", {
  84. "styles": this.css.propertyNode
  85. }).inject(this.node);
  86. this.contentNode = new Element("div", {
  87. "styles": this.css.contentNode
  88. }).inject(this.node);
  89. },
  90. //loadInvokeList-------------------------------
  91. loadInvokeListNodes: function(){
  92. this.invokeListTitleNode = new Element("div", {
  93. "styles": this.css.invokeListTitleNode,
  94. "text": MWF.SRVID.LP.invokeLibrary
  95. }).inject(this.invokeListNode);
  96. this.invokeListResizeNode = new Element("div", {"styles": this.css.invokeListResizeNode}).inject(this.invokeListNode);
  97. this.invokeListAreaSccrollNode = new Element("div", {"styles": this.css.invokeListAreaSccrollNode}).inject(this.invokeListNode);
  98. this.invokeListAreaNode = new Element("div", {"styles": this.css.invokeListAreaNode}).inject(this.invokeListAreaSccrollNode);
  99. this.loadInvokeListResize();
  100. this.loadInvokeList();
  101. },
  102. loadInvokeListResize: function(){
  103. // var size = this.propertyNode.getSize();
  104. // var position = this.propertyResizeBar.getPosition();
  105. this.invokeListResize = new Drag(this.invokeListResizeNode,{
  106. "snap": 1,
  107. "onStart": function(el, e){
  108. var x = (Browser.name=="firefox") ? e.event.clientX : e.event.x;
  109. var y = (Browser.name=="firefox") ? e.event.clientY : e.event.y;
  110. el.store("position", {"x": x, "y": y});
  111. var size = this.invokeListAreaSccrollNode.getSize();
  112. el.store("initialWidth", size.x);
  113. }.bind(this),
  114. "onDrag": function(el, e){
  115. var x = (Browser.name=="firefox") ? e.event.clientX : e.event.x;
  116. // var y = e.event.y;
  117. var bodySize = this.content.getSize();
  118. var position = el.retrieve("position");
  119. var initialWidth = el.retrieve("initialWidth").toFloat();
  120. var dx = x.toFloat() - position.x.toFloat();
  121. var width = initialWidth+dx;
  122. if (width> bodySize.x/2) width = bodySize.x/2;
  123. if (width<40) width = 40;
  124. this.contentNode.setStyle("margin-left", width+1);
  125. this.invokeListNode.setStyle("width", width);
  126. }.bind(this)
  127. });
  128. },
  129. loadInvokeList: function() {
  130. this.actions.listInvoke(function (json) {
  131. json.data.each(function(invoke){
  132. this.createListInvokeItem(invoke);
  133. }.bind(this));
  134. }.bind(this), null, false);
  135. },
  136. createListInvokeItem: function(invoke, isNew){
  137. var _self = this;
  138. var listInvokeItem = new Element("div", {"styles": this.css.listInvokeItem}).inject(this.invokeListAreaNode, (isNew) ? "top": "bottom");
  139. var listInvokeItemIcon = new Element("div", {"styles": this.css.listInvokeItemIcon}).inject(listInvokeItem);
  140. var listInvokeItemText = new Element("div", {"styles": this.css.listInvokeItemText, "text": (invoke.name) ? invoke.name+" ("+invoke.alias+")" : this.lp.newInvoke}).inject(listInvokeItem);
  141. listInvokeItem.store("invoke", invoke);
  142. listInvokeItem.addEvents({
  143. "dblclick": function(e){_self.loadInvokeByData(this, e);},
  144. "mouseover": function(){if (_self.currentListInvokeItem!=this) this.setStyles(_self.css.listInvokeItem_over);},
  145. "mouseout": function(){if (_self.currentListInvokeItem!=this) this.setStyles(_self.css.listInvokeItem);}
  146. });
  147. this.listInvokeItemMove(listInvokeItem);
  148. },
  149. createInvokeListCopy: function(node){
  150. var copyNode = node.clone().inject(this.node);
  151. copyNode.position({
  152. "relativeTo": node,
  153. "position": "upperLeft",
  154. "edge": "upperLeft"
  155. });
  156. var size = copyNode.getSize();
  157. copyNode.setStyles({
  158. "width": ""+size.x+"px",
  159. "height": ""+size.y+"px",
  160. "z-index": 50001
  161. });
  162. return copyNode;
  163. },
  164. listDrinvokeer: function(dragging, inObj){
  165. var markNode = inObj.retrieve("markNode");
  166. if (!markNode){
  167. var size = inObj.getSize();
  168. markNode = new Element("div", {"styles": this.css.dragListItemMark}).inject(this.node);
  169. markNode.setStyles({
  170. "width": ""+size.x+"px",
  171. "height": ""+size.y+"px",
  172. "position": "absolute",
  173. "background-color": "#666",
  174. "z-index": 50000,
  175. "opacity": 0.3
  176. // "border": "2px solid #ffba00"
  177. });
  178. markNode.position({
  179. "relativeTo": inObj,
  180. "position": "upperLeft",
  181. "edge": "upperLeft"
  182. });
  183. var y = markNode.getStyle("top").toFloat()-1;
  184. var x = markNode.getStyle("left").toFloat()-2;
  185. markNode.setStyles({
  186. "left": ""+x+"px",
  187. "top": ""+y+"px"
  188. });
  189. inObj.store("markNode", markNode);
  190. }
  191. },
  192. listDragLeave: function(dragging, inObj){
  193. var markNode = inObj.retrieve("markNode");
  194. if (markNode) markNode.destroy();
  195. inObj.eliminate("markNode");
  196. },
  197. listInvokeItemMove: function(node){
  198. var iconNode = node.getFirst();
  199. iconNode.addEvent("mousedown", function(e){
  200. var invoke = node.retrieve("invoke");
  201. if (invoke.id!=this.invokeTab.showPage.invoke.data.id){
  202. var copyNode = this.createInvokeListCopy(node);
  203. var droppables = [this.designNode, this.propertyDomArea];
  204. var listItemDrag = new Drag.Move(copyNode, {
  205. "droppables": droppables,
  206. "onEnter": function(dragging, inObj){
  207. this.listDrinvokeer(dragging, inObj);
  208. }.bind(this),
  209. "onLeave": function(dragging, inObj){
  210. this.listDragLeave(dragging, inObj);
  211. }.bind(this),
  212. "onDrag": function(e){
  213. //nothing
  214. }.bind(this),
  215. "onDrop": function(dragging, inObj){
  216. if (inObj){
  217. //this.addIncludeInvoke(invoke);
  218. this.listDragLeave(dragging, inObj);
  219. copyNode.destroy();
  220. }else{
  221. copyNode.destroy();
  222. }
  223. }.bind(this),
  224. "onCancel": function(dragging){
  225. copyNode.destroy();
  226. }.bind(this)
  227. });
  228. listItemDrag.start(e);
  229. }
  230. }.bind(this));
  231. },
  232. addIncludeInvoke: function(invoke){
  233. var currentInvoke = this.invokeTab.showPage.invoke;
  234. if (currentInvoke.data.dependInvokeList.indexOf(invoke.name)==-1){
  235. currentInvoke.data.dependInvokeList.push(invoke.name);
  236. this.addIncludeToList(invoke.name);
  237. }
  238. },
  239. addIncludeToList: function(name){
  240. this.actions.getInvokeByName(name, function(json){
  241. var invoke = json.data;
  242. var includeInvokeItem = new Element("div", {"styles": this.css.includeInvokeItem}).inject(this.propertyIncludeListArea);
  243. var includeInvokeItemAction = new Element("div", {"styles": this.css.includeInvokeItemAction}).inject(includeInvokeItem);
  244. var includeInvokeItemText = new Element("div", {"styles": this.css.includeInvokeItemText}).inject(includeInvokeItem);
  245. includeInvokeItemText.set("text", invoke.name+" ("+invoke.alias+")");
  246. includeInvokeItem.store("invoke", invoke);
  247. var _self = this;
  248. includeInvokeItemAction.addEvent("click", function(){
  249. var node = this.getParent();
  250. var invoke = node.retrieve("invoke");
  251. if (invoke){
  252. _self.invokeTab.showPage.invoke.data.dependInvokeList.erase(invoke.name);
  253. }
  254. node.destroy();
  255. });
  256. }.bind(this), function(){
  257. this.invokeTab.showPage.invoke.data.dependInvokeList.erase(name);
  258. }.bind(this));
  259. },
  260. loadInvokeByData: function(node, e){
  261. var invoke = node.retrieve("invoke");
  262. var openNew = true;
  263. for (var i = 0; i<this.invokeTab.pages.length; i++){
  264. if (invoke.id==this.invokeTab.pages[i].invoke.data.id){
  265. this.invokeTab.pages[i].showTabIm();
  266. openNew = false;
  267. break;
  268. }
  269. }
  270. if (openNew){
  271. this.loadInvokeData(invoke.id, function(data){
  272. var invoke = new MWF.xApplication.service.InvokeDesigner.Invoke(this, data);
  273. invoke.load();
  274. }.bind(this), true);
  275. }
  276. //var _self = this;
  277. //var options = {
  278. // "onQueryLoad": function(){
  279. // this.actions = _self.actions;
  280. // this.options.id = invoke.id;
  281. // this.application = _self.application;
  282. // }
  283. //};
  284. //this.desktop.openApplication(e, "service.InvokeDesigner", options);
  285. },
  286. //loadContentNode------------------------------
  287. loadContentNode: function(toolbarCallback, contentCallback){
  288. this.contentToolbarNode = new Element("div#contentToolbarNode", {
  289. "styles": this.css.contentToolbarNode
  290. }).inject(this.contentNode);
  291. this.loadContentToolbar(toolbarCallback);
  292. this.editContentNode = new Element("div", {
  293. "styles": this.css.editContentNode
  294. }).inject(this.contentNode);
  295. this.loadEditContent(function(){
  296. // if (this.designDcoument) this.designDcoument.body.setStyles(this.css.designBody);
  297. if (this.designNode) this.designNode.setStyles(this.css.designNode);
  298. if (contentCallback) contentCallback();
  299. }.bind(this));
  300. },
  301. loadContentToolbar: function(callback){
  302. this.getFormToolbarHTML(function(toolbarNode){
  303. var spans = toolbarNode.getElements("span");
  304. spans.each(function(item, idx){
  305. var img = item.get("MWFButtonImage");
  306. if (img){
  307. item.set("MWFButtonImage", this.path+""+this.options.style+"/toolbar/"+img);
  308. }
  309. }.bind(this));
  310. $(toolbarNode).inject(this.contentToolbarNode);
  311. MWF.require("MWF.widget.Toolbar", function(){
  312. this.toolbar = new MWF.widget.Toolbar(toolbarNode, {"style": "ProcessCategory"}, this);
  313. this.toolbar.load();
  314. var _self = this;
  315. this.styleSelectNode = toolbarNode.getElement("select[MWFnodetype='theme']");
  316. this.styleSelectNode.addEvent("change", function(){
  317. _self.changeEditorStyle(this);
  318. });
  319. this.fontsizeSelectNode = toolbarNode.getElement("select[MWFnodetype='fontSize']");
  320. this.fontsizeSelectNode.addEvent("change", function(){
  321. _self.changeFontSize(this);
  322. });
  323. this.editorSelectNode = toolbarNode.getElement("select[MWFnodetype='editor']");
  324. this.editorSelectNode.addEvent("change", function(){
  325. _self.changeEditor(this);
  326. });
  327. this.monacoStyleSelectNode = toolbarNode.getElement("select[MWFnodetype='monaco-theme']");
  328. this.monacoStyleSelectNode.addEvent("change", function(){
  329. _self.changeEditorStyle(this);
  330. });
  331. if (callback) callback();
  332. }.bind(this));
  333. }.bind(this));
  334. },
  335. changeEditor: function(node){
  336. var idx = node.selectedIndex;
  337. var value = node.options[idx].value;
  338. if (!MWF.editorData){
  339. MWF.editorData = {
  340. "javascriptEditor": {
  341. "monaco_theme": "vs",
  342. "theme": "tomorrow",
  343. "fontSize" : "12px"
  344. }
  345. };
  346. }
  347. MWF.editorData.javascriptEditor["editor"] = value;
  348. MWF.UD.putData("editor", MWF.editorData);
  349. this.invokeTab.pages.each(function(page){
  350. var editor = page.invoke.editor;
  351. if (editor) editor.changeEditor(value);
  352. }.bind(this));
  353. if (value=="ace"){
  354. this.monacoStyleSelectNode.hide();
  355. this.styleSelectNode.show();
  356. }else{
  357. this.monacoStyleSelectNode.show();
  358. this.styleSelectNode.hide();
  359. }
  360. },
  361. changeFontSize: function(node){
  362. var idx = node.selectedIndex;
  363. var value = node.options[idx].value;
  364. //var editorData = null;
  365. this.invokeTab.pages.each(function(page){
  366. //if (!editorData) editorData = page.invoke.editor.editorData;
  367. var editor = page.invoke.editor;
  368. if (editor) editor.setFontSize(value);
  369. }.bind(this));
  370. //if (!editorData) editorData = MWF.editorData;
  371. //editorData.javainvokeEditor.theme = value;
  372. if (!MWF.editorData){
  373. MWF.editorData = {
  374. "javascriptEditor": {
  375. "monaco_theme": "vs",
  376. "theme": "tomorrow",
  377. "fontSize" : "12px"
  378. }
  379. };
  380. }
  381. MWF.editorData.javascriptEditor["fontSize"] = value;
  382. MWF.UD.putData("editor", MWF.editorData);
  383. },
  384. changeEditorStyle: function(node){
  385. var idx = node.selectedIndex;
  386. var value = node.options[idx].value;
  387. //var editorData = null;
  388. this.invokeTab.pages.each(function(page){
  389. //if (!editorData) editorData = page.script.editor.editorData;
  390. var editor = page.invoke.editor;
  391. if (editor) editor.setTheme(value);
  392. }.bind(this));
  393. //if (!editorData) editorData = MWF.editorData;
  394. //editorData.javascriptEditor.theme = value;
  395. if (!MWF.editorData){
  396. MWF.editorData = {
  397. "javascriptEditor": {
  398. "monaco_theme": "vs",
  399. "theme": "tomorrow",
  400. "fontSize" : "12px"
  401. }
  402. };
  403. }
  404. if (MWF.editorData.javascriptEditor.editor === "monaco"){
  405. MWF.editorData.javascriptEditor.monaco_theme = value;
  406. }else{
  407. MWF.editorData.javascriptEditor.theme = value;
  408. }
  409. MWF.UD.putData("editor", MWF.editorData);
  410. },
  411. getFormToolbarHTML: function(callback){
  412. var toolbarUrl = this.path+this.options.style+"/toolbars.html";
  413. var r = new Request.HTML({
  414. url: toolbarUrl,
  415. method: "get",
  416. onSuccess: function(responseTree, responseElements, responseHTML, responseJavaScript){
  417. var toolbarNode = responseTree[0];
  418. if (callback) callback(toolbarNode);
  419. }.bind(this),
  420. onFailure: function(xhr){
  421. this.notice("request processToolbars error: "+xhr.responseText, "error");
  422. }.bind(this)
  423. });
  424. r.send();
  425. },
  426. maxOrReturnEditor: function(){
  427. if (!this.isMax){
  428. this.designNode.inject(this.node);
  429. this.designNode.setStyles({
  430. "position": "absolute",
  431. "width": "100%",
  432. "height": "100%",
  433. "top": "0px",
  434. "margin": "0px",
  435. "left": "0px"
  436. });
  437. this.invokeTab.pages.each(function(page){
  438. page.invoke.setAreaNodeSize();
  439. });
  440. this.isMax = true;
  441. }else{
  442. this.isMax = false;
  443. this.designNode.inject(this.editContentNode);
  444. this.designNode.setStyles(this.css.designNode);
  445. this.designNode.setStyles({
  446. "position": "static"
  447. });
  448. this.resizeNode();
  449. this.invokeTab.pages.each(function(page){
  450. page.invoke.setAreaNodeSize();
  451. });
  452. }
  453. },
  454. loadEditContent: function(callback){
  455. this.designNode = new Element("div", {
  456. "styles": this.css.designNode
  457. }).inject(this.editContentNode);
  458. MWF.require("MWF.widget.Tab", function(){
  459. this.invokeTab = new MWF.widget.Tab(this.designNode, {"style": "script"});
  460. this.invokeTab.load();
  461. }.bind(this), false);
  462. //MWF.require("MWF.widget.ScrollBar", function(){
  463. // new MWF.widget.ScrollBar(this.designNode, {"distance": 100});
  464. //}.bind(this));
  465. },
  466. //loadProperty------------------------
  467. loadProperty: function(){
  468. this.propertyTitleNode = new Element("div", {
  469. "styles": this.css.propertyTitleNode,
  470. "text": MWF.SRVID.LP.property
  471. }).inject(this.propertyNode);
  472. this.propertyResizeBar = new Element("div", {
  473. "styles": this.css.propertyResizeBar
  474. }).inject(this.propertyNode);
  475. this.loadPropertyResize();
  476. this.propertyContentNode = new Element("div", {
  477. "styles": this.css.propertyContentNode
  478. }).inject(this.propertyNode);
  479. //this.propertyDomArea = new Element("div", {
  480. // "styles": this.css.propertyDomArea
  481. //}).inject(this.propertyContentNode);
  482. //this.propertyDomPercent = 0.3;
  483. //this.propertyContentResizeNode = new Element("div", {
  484. // "styles": this.css.propertyContentResizeNode
  485. //}).inject(this.propertyContentNode);
  486. this.propertyContentArea = new Element("div", {
  487. "styles": this.css.propertyContentArea
  488. }).inject(this.propertyContentNode);
  489. //this.loadPropertyContentResize();
  490. this.setPropertyContent();
  491. //this.setIncludeNode();
  492. },
  493. setIncludeNode: function(){
  494. this.includeTitleNode = new Element("div", {"styles": this.css.includeTitleNode}).inject(this.propertyDomArea);
  495. this.includeTitleActionNode = new Element("div", {"styles": this.css.includeTitleActionNode}).inject(this.includeTitleNode);
  496. this.includeTitleTextNode = new Element("div", {"styles": this.css.includeTitleTextNode, "text": this.lp.include}).inject(this.includeTitleNode);
  497. this.includeTitleActionNode.addEvent("click", function(){
  498. this.addInclude();
  499. }.bind(this));
  500. this.propertyIncludeListArea = new Element("div", {
  501. "styles": {"overflow": "hidden"}
  502. }).inject(this.propertyDomArea);
  503. },
  504. addInclude: function(){
  505. },
  506. setPropertyContent: function(){
  507. var node = new Element("div", {"styles": this.css.propertyItemTitleNode, "text": this.lp.id+":"}).inject(this.propertyContentArea);
  508. this.propertyIdNode = new Element("div", {"styles": this.css.propertyTextNode, "text": ""}).inject(this.propertyContentArea);
  509. node = new Element("div", {"styles": this.css.propertyItemTitleNode, "text": this.lp.name+":"}).inject(this.propertyContentArea);
  510. this.propertyNameNode = new Element("input", {"styles": this.css.propertyInputNode, "value": ""}).inject(this.propertyContentArea);
  511. node = new Element("div", {"styles": this.css.propertyItemTitleNode, "text": this.lp.alias+":"}).inject(this.propertyContentArea);
  512. this.propertyAliasNode = new Element("input", {"styles": this.css.propertyInputNode, "value": ""}).inject(this.propertyContentArea);
  513. node = new Element("div", {"styles": this.css.propertyItemTitleNode, "text": this.lp.remoteAddrRegex+":"}).inject(this.propertyContentArea);
  514. this.propertyRemoteAddrRegexNode = new Element("input", {"styles": this.css.propertyInputNode, "value": ""}).inject(this.propertyContentArea);
  515. node = new Element("div", {"styles": this.css.propertyItemTitleNode, "text": this.lp.lastStartTime+":"}).inject(this.propertyContentArea);
  516. this.propertyLastStartTimeNode = new Element("div", {"styles": this.css.propertyTextNode, "value": ""}).inject(this.propertyContentArea);
  517. node = new Element("div", {"styles": this.css.propertyItemTitleNode, "text": this.lp.lastEndTime+":"}).inject(this.propertyContentArea);
  518. this.propertyLastEndTimeNode = new Element("div", {"styles": this.css.propertyTextNode, "value": ""}).inject(this.propertyContentArea);
  519. node = new Element("div", {"styles": this.css.propertyItemTitleNode, "text": this.lp.description+":"}).inject(this.propertyContentArea);
  520. this.propertyDescriptionNode = new Element("textarea", {"styles": this.css.propertyInputAreaNode, "value": ""}).inject(this.propertyContentArea);
  521. node = new Element("div", {"styles": this.css.propertyItemTitleNode, "text": this.lp.isEnable+":"}).inject(this.propertyContentArea);
  522. this.propertyEnableNode = new Element("select", {"styles": this.css.propertySelectNode }).inject(this.propertyContentArea);
  523. new Element("option" , { "value" : "true", "text" : this.lp.true }).inject(this.propertyEnableNode);
  524. new Element("option" , { "value" : "false", "text" : this.lp.false }).inject(this.propertyEnableNode);
  525. node = new Element("div", {"styles": this.css.propertyItemTitleNode, "text": this.lp.invokeUri+":"}).inject(this.propertyContentArea);
  526. this.propertyInvokeUriNode = new Element("div", {"styles": this.css.propertyTextNode, "text": ""}).inject(this.propertyContentArea);
  527. this.propertyInvokeUriNode.setStyles({
  528. "word-break":"break-all",
  529. "height" : "auto"
  530. });
  531. node = new Element("div", {"styles": this.css.propertyItemTitleNode, "text": this.lp.invokeMethod+":"}).inject(this.propertyContentArea);
  532. this.propertyInvokeMethodNode = new Element("div", {"styles": this.css.propertyTextNode, "text": "POST"}).inject(this.propertyContentArea);
  533. },
  534. loadPropertyResize: function(){
  535. // var size = this.propertyNode.getSize();
  536. // var position = this.propertyResizeBar.getPosition();
  537. this.propertyResize = new Drag(this.propertyResizeBar,{
  538. "snap": 1,
  539. "onStart": function(el, e){
  540. var x = (Browser.name=="firefox") ? e.event.clientX : e.event.x;
  541. var y = (Browser.name=="firefox") ? e.event.clientY : e.event.y;
  542. el.store("position", {"x": x, "y": y});
  543. var size = this.propertyNode.getSize();
  544. el.store("initialWidth", size.x);
  545. }.bind(this),
  546. "onDrag": function(el, e){
  547. var x = (Browser.name=="firefox") ? e.event.clientX : e.event.x;
  548. // var y = e.event.y;
  549. var bodySize = this.content.getSize();
  550. var position = el.retrieve("position");
  551. var initialWidth = el.retrieve("initialWidth").toFloat();
  552. var dx = position.x.toFloat()-x.toFloat();
  553. var width = initialWidth+dx;
  554. if (width> bodySize.x/2) width = bodySize.x/2;
  555. if (width<40) width = 40;
  556. this.contentNode.setStyle("margin-right", width+1);
  557. this.propertyNode.setStyle("width", width);
  558. }.bind(this)
  559. });
  560. },
  561. loadPropertyContentResize: function(){
  562. this.propertyContentResize = new Drag(this.propertyContentResizeNode, {
  563. "snap": 1,
  564. "onStart": function(el, e){
  565. var x = (Browser.name=="firefox") ? e.event.clientX : e.event.x;
  566. var y = (Browser.name=="firefox") ? e.event.clientY : e.event.y;
  567. el.store("position", {"x": x, "y": y});
  568. var size = this.propertyDomArea.getSize();
  569. el.store("initialHeight", size.y);
  570. }.bind(this),
  571. "onDrag": function(el, e){
  572. var size = this.propertyContentNode.getSize();
  573. // var x = e.event.x;
  574. var y = (Browser.name=="firefox") ? e.event.clientY : e.event.y;
  575. var position = el.retrieve("position");
  576. var dy = y.toFloat()-position.y.toFloat();
  577. var initialHeight = el.retrieve("initialHeight").toFloat();
  578. var height = initialHeight+dy;
  579. if (height<40) height = 40;
  580. if (height> size.y-40) height = size.y-40;
  581. this.propertyDomPercent = height/size.y;
  582. this.setPropertyContentResize();
  583. }.bind(this)
  584. });
  585. },
  586. setPropertyContentResize: function(){
  587. var size = this.propertyContentNode.getSize();
  588. //var resizeNodeSize = this.propertyContentResizeNode.getSize();
  589. //var height = size.y-resizeNodeSize.y;
  590. //var domHeight = this.propertyDomPercent*height;
  591. //var contentHeight = height-domHeight;
  592. //this.propertyDomArea.setStyle("height", ""+domHeight+"px");
  593. //this.propertyContentArea.setStyle("height", ""+contentHeight+"px");
  594. this.propertyContentArea.setStyle("height", ""+size.y+"px");
  595. },
  596. //resizeNode------------------------------------------------
  597. resizeNode: function(){
  598. if (!this.isMax){
  599. var nodeSize = this.node.getSize();
  600. this.contentNode.setStyle("height", ""+nodeSize.y+"px");
  601. this.propertyNode.setStyle("height", ""+nodeSize.y+"px");
  602. var contentToolbarMarginTop = this.contentToolbarNode.getStyle("margin-top").toFloat();
  603. var contentToolbarMarginBottom = this.contentToolbarNode.getStyle("margin-bottom").toFloat();
  604. var allContentToolberSize = this.contentToolbarNode.getComputedSize();
  605. var y = nodeSize.y - allContentToolberSize.totalHeight - contentToolbarMarginTop - contentToolbarMarginBottom;
  606. this.editContentNode.setStyle("height", ""+y+"px");
  607. if (this.designNode){
  608. var designMarginTop = this.designNode.getStyle("margin-top").toFloat();
  609. var designMarginBottom = this.designNode.getStyle("margin-bottom").toFloat();
  610. y = nodeSize.y - allContentToolberSize.totalHeight - contentToolbarMarginTop - contentToolbarMarginBottom - designMarginTop - designMarginBottom;
  611. this.designNode.setStyle("height", ""+y+"px");
  612. }
  613. titleSize = this.propertyTitleNode.getSize();
  614. titleMarginTop = this.propertyTitleNode.getStyle("margin-top").toFloat();
  615. titleMarginBottom = this.propertyTitleNode.getStyle("margin-bottom").toFloat();
  616. titlePaddingTop = this.propertyTitleNode.getStyle("padding-top").toFloat();
  617. titlePaddingBottom = this.propertyTitleNode.getStyle("padding-bottom").toFloat();
  618. y = titleSize.y+titleMarginTop+titleMarginBottom+titlePaddingTop+titlePaddingBottom;
  619. y = nodeSize.y-y;
  620. this.propertyContentNode.setStyle("height", ""+y+"px");
  621. this.propertyResizeBar.setStyle("height", ""+y+"px");
  622. this.setPropertyContentResize();
  623. titleSize = this.invokeListTitleNode.getSize();
  624. titleMarginTop = this.invokeListTitleNode.getStyle("margin-top").toFloat();
  625. titleMarginBottom = this.invokeListTitleNode.getStyle("margin-bottom").toFloat();
  626. titlePaddingTop = this.invokeListTitleNode.getStyle("padding-top").toFloat();
  627. titlePaddingBottom = this.invokeListTitleNode.getStyle("padding-bottom").toFloat();
  628. nodeMarginTop = this.invokeListAreaSccrollNode.getStyle("margin-top").toFloat();
  629. nodeMarginBottom = this.invokeListAreaSccrollNode.getStyle("margin-bottom").toFloat();
  630. y = titleSize.y+titleMarginTop+titleMarginBottom+titlePaddingTop+titlePaddingBottom+nodeMarginTop+nodeMarginBottom;
  631. y = nodeSize.y-y;
  632. this.invokeListAreaSccrollNode.setStyle("height", ""+y+"px");
  633. this.invokeListResizeNode.setStyle("height", ""+y+"px");
  634. }
  635. },
  636. //loadForm------------------------------------------
  637. loadInvoke: function(){
  638. //this.invokeTab.addTab(node, title);
  639. this.getInvokeData(this.options.id, function(data){
  640. this.invoke = new MWF.xApplication.service.InvokeDesigner.Invoke(this, data);
  641. this.invoke.load();
  642. if (this.status){
  643. if (this.status.openInvokes){
  644. this.status.openInvokes.each(function(id){
  645. this.loadInvokeData(id, function(data){
  646. var showTab = true;
  647. if (this.status.currentId){
  648. if (this.status.currentId!=data.id) showTab = false;
  649. }
  650. var invoke = new MWF.xApplication.service.InvokeDesigner.Invoke(this, data, {"showTab": showTab});
  651. invoke.load();
  652. }.bind(this), true);
  653. }.bind(this));
  654. }
  655. }
  656. //if (!this.invokeHelpMenu){
  657. // MWF.require("MWF.widget.ScriptHelp", function(){
  658. // this.invokeHelpMenu = new MWF.widget.ScriptHelp($("MWFScriptAutoCode"), this.invoke.editor);
  659. // this.invokeHelpMenu.getEditor = function(){
  660. // if (this.invokeTab.showPage) return this.invokeTab.showPage.invoke.editor.editor;
  661. // return null;
  662. // }.bind(this)
  663. // }.bind(this));
  664. //}
  665. }.bind(this));
  666. },
  667. getInvokeData: function(id, callback){
  668. if (!id){
  669. this.loadNewInvokeData(callback);
  670. }else{
  671. this.loadInvokeData(id, callback);
  672. }
  673. },
  674. loadNewInvokeData: function(callback){
  675. MWF.Actions.get("x_cms_assemble_control").getUUID(function(id){
  676. var data = {
  677. "name": "",
  678. "id": id,
  679. "alias": "",
  680. "description": "",
  681. //"language": "javascript",
  682. //"dependInvokeList": [],
  683. "isNewInvoke": true,
  684. "text": "",
  685. "enable" : true,
  686. "remoteAddrRegex" : "",
  687. "lastStartTime" : "",
  688. "lastEndTime" : ""
  689. };
  690. this.createListInvokeItem(data, true);
  691. if (callback) callback(data);
  692. }.bind(this))
  693. },
  694. loadInvokeData: function(id, callback, notSetTile){
  695. this.actions.getInvoke(id, function(json){
  696. if (json){
  697. var data = json.data;
  698. if (!notSetTile){
  699. this.setTitle(this.options.appTitle + "-"+data.name);
  700. this.taskitem.setText(this.options.appTitle + "-"+data.name);
  701. this.options.appTitle = this.options.appTitle + "-"+data.name;
  702. }
  703. if (callback) callback(data);
  704. }
  705. }.bind(this));
  706. },
  707. saveInvoke: function(){
  708. if (this.invokeTab.showPage){
  709. var invoke = this.invokeTab.showPage.invoke;
  710. invoke.save(function(){
  711. if (invoke==this.invoke){
  712. var name = invoke.data.name;
  713. this.setTitle(MWF.SRVID.LP.title + "-"+name);
  714. this.options.desktopReload = true;
  715. this.options.id = invoke.data.id;
  716. }
  717. }.bind(this));
  718. }
  719. },
  720. saveDictionaryAs: function(){
  721. this.dictionary.saveAs();
  722. },
  723. dictionaryExplode: function(){
  724. this.dictionary.explode();
  725. },
  726. dictionaryImplode: function(){
  727. this.dictionary.implode();
  728. },
  729. recordStatus: function(){
  730. if (this.invokeTab){
  731. var openInvokes = [];
  732. this.invokeTab.pages.each(function(page){
  733. if (page.invoke.data.id!=this.options.id) openInvokes.push(page.invoke.data.id);
  734. }.bind(this));
  735. var currentId = this.invokeTab.showPage.invoke.data.id;
  736. var status = {
  737. "id": this.options.id,
  738. "openInvokes": openInvokes,
  739. "currentId": currentId
  740. };
  741. return status;
  742. }
  743. return {"id": this.options.id};
  744. }
  745. });