Script.js 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349
  1. MWF.xApplication = MWF.xApplication || {};
  2. MWF.xApplication.process = MWF.xApplication.process || {};
  3. MWF.xApplication.process.ScriptDesigner = MWF.xApplication.process.ScriptDesigner || {};
  4. MWF.APPSD = MWF.xApplication.process.ScriptDesigner;
  5. MWF.require("MWF.widget.Common", null, false);
  6. MWF.xDesktop.requireApp("process.ScriptDesigner", "lp."+MWF.language, null, false);
  7. MWF.require("MWF.widget.JavascriptEditor", null, false);
  8. MWF.xApplication.process.ScriptDesigner.Script = new Class({
  9. Extends: MWF.widget.Common,
  10. Implements: [Options, Events],
  11. options: {
  12. "style": "default",
  13. "showTab": true
  14. },
  15. initialize: function(designer, data, options){
  16. this.setOptions(options);
  17. this.path = "../x_component_process_ScriptDesigner/$Script/";
  18. this.cssPath = "../x_component_process_ScriptDesigner/$Script/"+this.options.style+"/css.wcss";
  19. this._loadCss();
  20. this.isChanged = false;
  21. this.designer = designer;
  22. this.data = data;
  23. if (!this.data.text) this.data.text = "";
  24. this.node = this.designer.designNode;
  25. this.tab = this.designer.scriptTab;
  26. this.areaNode = new Element("div", {"styles": {"overflow": "hidden", "height": "700px"}});
  27. this.propertyIncludeNode = this.designer.propertyDomArea;
  28. this.propertyNode = this.designer.propertyContentArea
  29. if(this.designer.application) this.data.applicationName = this.designer.application.name;
  30. if(this.designer.application) this.data.application = this.designer.application.id;
  31. this.isNewScript = (this.data.id) ? false : true;
  32. // this.createProperty();
  33. this.autoSave();
  34. this.designer.addEvent("queryClose", function(){
  35. if (this.autoSaveTimerID) window.clearInterval(this.autoSaveTimerID);
  36. }.bind(this));
  37. },
  38. autoSave: function(){
  39. this.autoSaveTimerID = window.setInterval(function(){
  40. if (!this.autoSaveCheckNode) this.autoSaveCheckNode = this.designer.contentToolbarNode.getElement("#MWFScriptAutoSaveCheck");
  41. if (this.autoSaveCheckNode){
  42. if (this.autoSaveCheckNode.get("checked")){
  43. if (this.isChanged){
  44. if (this.data.name) this.saveSilence();
  45. }
  46. }
  47. }
  48. }.bind(this), 60000);
  49. },
  50. //createProperty: function(){
  51. // this.scriptPropertyNode = new Element("div", {"styles": this.css.scriptPropertyNode}).inject(this.propertyNode);
  52. //},
  53. load : function(){
  54. debugger;
  55. this.setAreaNodeSize();
  56. this.designer.addEvent("resize", this.setAreaNodeSize.bind(this));
  57. this.page = this.tab.addTab(this.areaNode, this.data.name || this.designer.lp.newScript, (!this.data.isNewScript && this.data.id!=this.designer.options.id));
  58. this.page.script = this;
  59. this.page.addEvent("show", function(){
  60. this.designer.scriptListAreaNode.getChildren().each(function(node){
  61. var scrtip = node.retrieve("script");
  62. if (scrtip.id==this.data.id){
  63. if (this.designer.currentListScriptItem){
  64. this.designer.currentListScriptItem.setStyles(this.designer.css.listScriptItem);
  65. }
  66. node.setStyles(this.designer.css.listScriptItem_current);
  67. this.designer.currentListScriptItem = node;
  68. this.lisNode = node;
  69. }
  70. }.bind(this));
  71. this.designer.currentScript = this;
  72. this.setPropertyContent();
  73. this.setIncludeNode();
  74. if (this.editor){
  75. this.editor.focus();
  76. }else{
  77. this.loadEditor();
  78. }
  79. this.setAreaNodeSize();
  80. }.bind(this));
  81. var _self = this;
  82. this.page.addEvent("queryClose", function(){
  83. if (_self.autoSaveTimerID) window.clearInterval(_self.autoSaveTimerID);
  84. this.showIm();
  85. //_self.saveSilence();
  86. if (_self.lisNode) _self.lisNode.setStyles(_self.designer.css.listScriptItem);
  87. });
  88. this.page.tabNode.addEvent("dblclick", this.designer.maxOrReturnEditor.bind(this.designer));
  89. if (this.options.showTab) this.page.showTabIm();
  90. },
  91. getMode: function (){
  92. if( ( this.data.name || "" ).contains('.') ){
  93. switch(this.data.name.split('.').getLast()){
  94. case 'html': return 'html';
  95. case 'css': return 'css';
  96. case 'json': return 'json';
  97. default: return 'javascript';
  98. }
  99. }
  100. return 'javascript';
  101. },
  102. loadEditor:function(){
  103. this.editor = new MWF.widget.JavascriptEditor(this.areaNode, {"option": {"value": this.data.text, "mode": this.getMode()}});
  104. this.editor.load(function(){
  105. if (this.data.text) this.editor.setValue(this.data.text);
  106. // this.editor.addEditorEvent("onDidChangeModelContent", function(e){
  107. // if (!this.isChanged){
  108. // this.isChanged = true;
  109. // this.page.textNode.set("text", " * "+this.page.textNode.get("text"));
  110. // }
  111. // }.bind(this));
  112. this.editor.addEditorEvent("change", function(e){
  113. if (!this.isChanged){
  114. this.isChanged = true;
  115. this.page.textNode.set("text", " * "+this.page.textNode.get("text"));
  116. }
  117. }.bind(this));
  118. this.editor.addEvent("save", function(){
  119. this.save();
  120. }.bind(this));
  121. // this.editor.addEvent("reference", function(editor, e, e1){
  122. // if (!this.scriptReferenceMenu){
  123. // MWF.require("MWF.widget.ScriptHelp", function(){
  124. // this.scriptReferenceMenu = new MWF.widget.ScriptHelp(null, this.editor.editor, {
  125. // "onPostLoad": function(){
  126. // this.showReferenceMenu();
  127. // }.bind(this)
  128. // });
  129. // this.scriptReferenceMenu.getEditor = function(){return this.editor.editor;}.bind(this)
  130. // }.bind(this));
  131. // }else{
  132. // this.showReferenceMenu();
  133. // }
  134. // }.bind(this));
  135. var options = this.designer.styleSelectNode.options;
  136. for (var i=0; i<options.length; i++){
  137. var option = options[i];
  138. if (option.value==this.editor.theme){
  139. option.set("selected", true);
  140. break;
  141. }
  142. }
  143. var options = this.designer.fontsizeSelectNode.options;
  144. for (var i=0; i<options.length; i++){
  145. var option = options[i];
  146. if (option.value==this.editor.fontSize){
  147. option.set("selected", true);
  148. break;
  149. }
  150. }
  151. options = this.designer.editorSelectNode.options;
  152. for (var i=0; i<options.length; i++){
  153. var option = options[i];
  154. if (option.value==this.editor.options.type){
  155. option.set("selected", true);
  156. break;
  157. }
  158. }
  159. options = this.designer.monacoStyleSelectNode.options;
  160. for (var i=0; i<options.length; i++){
  161. var option = options[i];
  162. if (option.value==this.editor.theme){
  163. option.set("selected", true);
  164. break;
  165. }
  166. }
  167. if (this.editor.options.type=="ace"){
  168. this.designer.monacoStyleSelectNode.hide();
  169. this.designer.styleSelectNode.show();
  170. }else{
  171. this.designer.monacoStyleSelectNode.show();
  172. this.designer.styleSelectNode.hide();
  173. }
  174. }.bind(this));
  175. },
  176. showReferenceMenu: function(){
  177. var pos = this.editor.getCursorPixelPosition();
  178. var e = {"page": {}};
  179. e.page.x = pos.left;
  180. e.page.y = pos.top;
  181. this.scriptReferenceMenu.menu.showIm(e);
  182. },
  183. setIncludeNode: function(){
  184. this.designer.propertyIncludeListArea.empty();
  185. this.data.dependScriptList.each(function(name){
  186. this.designer.addIncludeToList(name);
  187. }.bind(this));
  188. },
  189. setPropertyContent: function(){
  190. this.designer.propertyIdNode.set("text", this.data.id || "");
  191. this.designer.propertyNameNode.set("value", this.data.name || "");
  192. this.designer.propertyAliasNode.set("value", this.data.alias || "");
  193. this.designer.propertyDescriptionNode.set("value", this.data.description || "");
  194. },
  195. setAreaNodeSize: function(){
  196. if( !this.areaNode.offsetParent )return;
  197. //var size = this.node.getSize();
  198. var size = this.node.getComputedSize();
  199. size.y = size.height;
  200. var tabSize = this.tab.tabNodeContainer.getSize();
  201. var y = size.y - tabSize.y;
  202. this.areaNode.setStyle("height", ""+y+"px");
  203. if (this.editor) this.editor.resize(y);
  204. },
  205. addInclude: function(){
  206. },
  207. save: function(callback){
  208. if (!this.isSave){
  209. debugger;
  210. // var m = monaco.editor.getModelMarkers();
  211. // var mod = this.editor.editor.getModel();
  212. // var ms = monaco.editor.getModelMarkers({"resource": mod.uri});
  213. //
  214. // var session = this.editor.editor.getSession();
  215. // var annotations = session.getAnnotations();
  216. var validated = this.editor.validated();
  217. // for (var i=0; i<annotations.length; i++){
  218. // if (annotations[i].type=="error"){
  219. // validated = false;
  220. // break;
  221. // }
  222. // }
  223. var name = this.designer.propertyNameNode.get("value");
  224. var alias = this.designer.propertyAliasNode.get("value");
  225. var description = this.designer.propertyDescriptionNode.get("value");
  226. if (!name){
  227. this.designer.notice(this.designer.lp.notice.inputName, "error");
  228. return false;
  229. }
  230. this.data.name = name;
  231. this.data.alias = alias;
  232. this.data.description = description;
  233. this.data.validated = validated;
  234. this.data.text = this.editor.getValue();
  235. this.isSave = true;
  236. this.designer.actions.saveScript(this.data, function(json){
  237. this.isSave = false;
  238. this.data.isNewScript = false;
  239. this.isChanged = false;
  240. this.page.textNode.set("text", this.data.name);
  241. if (this.lisNode) {
  242. this.lisNode.getLast().set("text", this.data.name);
  243. }
  244. this.designer.notice(this.designer.lp.notice.save_success, "success", this.node, {"x": "left", "y": "bottom"});
  245. this.data.id = json.data.id;
  246. if (callback) callback();
  247. }.bind(this), function(xhr, text, error){
  248. this.isSave = false;
  249. var errorText = error+":"+text;
  250. if (xhr) errorText = xhr.responseText;
  251. MWF.xDesktop.notice("error", {x: "right", y:"top"}, "request json error: "+errorText);
  252. }.bind(this));
  253. }else{
  254. MWF.xDesktop.notice("info", {x: "right", y:"top"}, this.designer.lp.isSave);
  255. }
  256. },
  257. saveSilence: function(callback){
  258. if (!this.isSave){
  259. // var session = this.editor.editor.getSession();
  260. // var annotations = session.getAnnotations();
  261. // var validated = true;
  262. // for (var i=0; i<annotations.length; i++){
  263. // if (annotations[i].type=="error"){
  264. // validated = false;
  265. // break;
  266. // }
  267. // }
  268. var validated = this.editor.validated();
  269. if( this.designer.currentScript == this ) {
  270. var name = this.designer.propertyNameNode.get("value");
  271. var alias = this.designer.propertyAliasNode.get("value");
  272. var description = this.designer.propertyDescriptionNode.get("value");
  273. if (!name) {
  274. this.designer.notice(this.designer.lp.notice.inputName, "error");
  275. return false;
  276. }
  277. this.data.name = name;
  278. this.data.alias = alias;
  279. this.data.description = description;
  280. this.data.validated = validated;
  281. }
  282. this.data.text = this.editor.getValue();
  283. this.isSave = true;
  284. this.designer.actions.saveScript(this.data, function(json){
  285. this.isSave = false;
  286. this.data.isNewScript = false;
  287. this.isChanged = false;
  288. this.page.textNode.set("text", this.data.name);
  289. if (this.lisNode) {
  290. this.lisNode.getLast().set("text", this.data.name);
  291. }
  292. this.data.id = json.data.id;
  293. if (callback) callback();
  294. }.bind(this), function(xhr, text, error){
  295. this.isSave = false;
  296. //
  297. //var errorText = error+":"+text;
  298. //if (xhr) errorText = xhr.responseText;
  299. //MWF.xDesktop.notice("error", {x: "right", y:"top"}, "request json error: "+errorText);
  300. }.bind(this));
  301. }else{
  302. MWF.xDesktop.notice("info", {x: "right", y:"top"}, this.designer.lp.isSave);
  303. }
  304. },
  305. saveAs: function(){},
  306. explode: function(){},
  307. implode: function(){}
  308. });