Actionbar.js 9.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237
  1. MWF.xApplication.process.FormDesigner.Module = MWF.xApplication.process.FormDesigner.Module || {};
  2. MWF.xDesktop.requireApp("process.FormDesigner", "Module.$Element", null, false);
  3. MWF.require("MWF.widget.Toolbar", null, false);
  4. MWF.xApplication.process.FormDesigner.Module.Actionbar = MWF.FCActionbar = new Class({
  5. Extends: MWF.FC$Element,
  6. Implements: [Options, Events],
  7. options: {
  8. "style": "default",
  9. "propertyPath": "/x_component_process_FormDesigner/Module/Actionbar/actionbar.html"
  10. },
  11. addAction: function(){
  12. },
  13. initialize: function(form, options){
  14. this.setOptions(options);
  15. this.path = "/x_component_process_FormDesigner/Module/Actionbar/";
  16. this.cssPath = "/x_component_process_FormDesigner/Module/Actionbar/"+this.options.style+"/css.wcss";
  17. this._loadCss();
  18. this.moduleType = "component";
  19. this.moduleName = "actionbar";
  20. this.Node = null;
  21. this.form = form;
  22. this.container = null;
  23. this.containerNode = null;
  24. this.systemTools = [];
  25. this.customTools = [];
  26. //this.containers = [];
  27. //this.elements = [];
  28. },
  29. setTemplateStyles: function(styles){
  30. this.json.style = styles.style;
  31. this.json.customIconStyle = styles.customIconStyle;
  32. },
  33. clearTemplateStyles: function(styles){
  34. this.json.style = "form";
  35. this.json.customIconStyle = "";
  36. },
  37. setAllStyles: function(){
  38. this._resetActionbar();
  39. },
  40. _createMoveNode: function(){
  41. this.moveNode = new Element("div", {
  42. "MWFType": "actionbar",
  43. "id": this.json.id,
  44. "styles": this.css.moduleNodeMove,
  45. "events": {
  46. "selectstart": function(e){
  47. e.preventDefault();
  48. }
  49. }
  50. }).inject(this.form.container);
  51. },
  52. _createNode: function(callback){
  53. this.node = new Element("div", {
  54. "id": this.json.id,
  55. "MWFType": "actionbar",
  56. "styles": this.css.moduleNode,
  57. "events": {
  58. "selectstart": function(e){
  59. e.preventDefault();
  60. }
  61. }
  62. }).inject(this.form.node);
  63. if (this.form.options.mode == "Mobile"){
  64. this.node.set("text", MWF.APPFD.LP.notice.notUseModuleInMobile+"("+this.moduleName+")");
  65. this.node.setStyles({"height": "24px", "line-height": "24px", "background-color": "#999"});
  66. }else{
  67. this.toolbarNode = new Element("div").inject(this.node);
  68. this.toolbarWidget = new MWF.widget.Toolbar(this.toolbarNode, {"style": this.json.style}, this);
  69. MWF.getJSON(this.path+"toolbars.json", function(json){
  70. this.json.defaultTools = json;
  71. this.setToolbars(json, this.toolbarNode);
  72. this.toolbarWidget.load();
  73. }.bind(this), false);
  74. // if (this.json.sysTools.editTools){
  75. // this.setToolbars(this.json.sysTools.editTools, this.toolbarNode);
  76. //// this.setToolbars(this.json.tools.editTools, this.toolbarNode);
  77. // }else{
  78. // this.setToolbars(this.json.sysTools, this.toolbarNode);
  79. //// this.setToolbars(this.json.tools, this.toolbarNode);
  80. // }
  81. // this.resetIcons();
  82. }
  83. },
  84. _initModule: function(){
  85. this.setStyleTemplate();
  86. this._setNodeProperty();
  87. if (!this.form.isSubform) this._createIconAction();
  88. this._setNodeEvent();
  89. this._refreshActionbar();
  90. if( !this.json.events ){
  91. MWF.getJSON(this.path+"template.json", function(json){
  92. this.json.events = json.events;
  93. }.bind(this), false);
  94. }
  95. },
  96. _refreshActionbar: function(){
  97. if (this.form.options.mode == "Mobile"){
  98. this.node.set("text", MWF.APPFD.LP.notice.notUseModuleInMobile+"("+this.moduleName+")");
  99. this.node.setStyles({"height": "24px", "line-height": "24px", "background-color": "#999"});
  100. }else{
  101. this.toolbarNode = this.node.getFirst("div");
  102. this.toolbarNode.empty();
  103. this.toolbarWidget = new MWF.widget.Toolbar(this.toolbarNode, {"style": this.json.style}, this);
  104. if (!this.json.actionStyles) this.json.actionStyles = Object.clone(this.toolbarWidget.css);
  105. this.toolbarWidget.css = this.json.actionStyles;
  106. if (this.json.defaultTools){
  107. var json = Array.clone(this.json.defaultTools);
  108. //if (this.json.tools) json.append(this.json.tools);
  109. this.setToolbars(json, this.toolbarNode);
  110. if (this.json.tools){
  111. this.setCustomToolbars(Array.clone(this.json.tools), this.toolbarNode);
  112. }
  113. this.toolbarWidget.load();
  114. //json = null;
  115. }else{
  116. MWF.getJSON(this.path+"toolbars.json", function(json){
  117. this.json.defaultTools = json;
  118. var json = Array.clone(this.json.defaultTools);
  119. //if (this.json.tools) json.append(this.json.tools);
  120. this.setToolbars(json, this.toolbarNode);
  121. if (this.json.tools){
  122. this.setCustomToolbars(Array.clone(this.json.tools), this.toolbarNode);
  123. }
  124. this.toolbarWidget.load();
  125. //json = null;
  126. }.bind(this), false);
  127. }
  128. }
  129. },
  130. _resetActionbar: function(){
  131. if (this.form.options.mode == "Mobile"){
  132. this.node.set("text", MWF.APPFD.LP.notice.notUseModuleInMobile+"("+this.moduleName+")");
  133. this.node.setStyles({"height": "24px", "line-height": "24px", "background-color": "#999"});
  134. }else{
  135. this.toolbarNode = this.node.getFirst("div");
  136. this.toolbarNode.empty();
  137. this.toolbarWidget = new MWF.widget.Toolbar(this.toolbarNode, {"style": this.json.style}, this);
  138. if (!this.json.actionStyles){
  139. this.json.actionStyles = Object.clone(this.toolbarWidget.css);
  140. }else{
  141. this.toolbarWidget.css = Object.merge( Object.clone(this.json.actionStyles), this.toolbarWidget.css );
  142. this.json.actionStyles = Object.clone(this.toolbarWidget.css);
  143. }
  144. if (this.json.defaultTools){
  145. var json = Array.clone(this.json.defaultTools);
  146. //if (this.json.tools) json.append(this.json.tools);
  147. this.setToolbars(json, this.toolbarNode);
  148. if (this.json.tools){
  149. this.setCustomToolbars(Array.clone(this.json.tools), this.toolbarNode);
  150. }
  151. this.toolbarWidget.load();
  152. //json = null;
  153. }else{
  154. MWF.getJSON(this.path+"toolbars.json", function(json){
  155. this.json.defaultTools = json;
  156. var json = Array.clone(this.json.defaultTools);
  157. //if (this.json.tools) json.append(this.json.tools);
  158. this.setToolbars(json, this.toolbarNode);
  159. if (this.json.tools){
  160. this.setCustomToolbars(Array.clone(this.json.tools), this.toolbarNode);
  161. }
  162. this.toolbarWidget.load();
  163. //json = null;
  164. }.bind(this), false);
  165. }
  166. }
  167. },
  168. setToolbars: function(tools, node){
  169. tools.each(function(tool){
  170. var actionNode = new Element("div", {
  171. "MWFnodetype": tool.type,
  172. "MWFButtonImage": this.path+""+this.options.style+"/tools/"+(this.json.style || "default")+"/"+tool.img,
  173. "title": tool.title,
  174. "MWFButtonAction": tool.action,
  175. "MWFButtonText": tool.text
  176. }).inject(node);
  177. this.systemTools.push(actionNode);
  178. if (tool.sub){
  179. var subNode = node.getLast();
  180. this.setToolbars(tool.sub, subNode);
  181. }
  182. }.bind(this));
  183. },
  184. setCustomToolbars: function(tools, node){
  185. //var style = (this.json.style || "default").indexOf("red") > -1 ? "red" : "blue";
  186. var path = "";
  187. if( this.json.customIconStyle ){
  188. path = this.json.customIconStyle + "/";
  189. }
  190. tools.each(function(tool){
  191. var actionNode = new Element("div", {
  192. "MWFnodetype": tool.type,
  193. "MWFButtonImage": this.path+""+this.options.style +"/custom/"+path+tool.img,
  194. "title": tool.title,
  195. "MWFButtonAction": tool.action,
  196. "MWFButtonText": tool.text
  197. }).inject(node);
  198. this.customTools.push(actionNode);
  199. if (tool.sub){
  200. var subNode = node.getLast();
  201. this.setToolbars(tool.sub, subNode);
  202. }
  203. }.bind(this));
  204. },
  205. _setEditStyle_custom: function(name){
  206. if (name=="hideSystemTools"){
  207. if (this.json.hideSystemTools){
  208. this.systemTools.each(function(tool){
  209. tool.setStyle("display", "none");
  210. });
  211. }else{
  212. this.systemTools.each(function(tool){
  213. tool.setStyle("display", "block");
  214. });
  215. }
  216. }
  217. if (name=="defaultTools" || name=="tools" || name==="actionStyles"){
  218. this._refreshActionbar();
  219. }
  220. }
  221. });