ImageClipper.js 4.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169
  1. MWF.xApplication.process.FormDesigner.Module = MWF.xApplication.process.FormDesigner.Module || {};
  2. MWF.xDesktop.requireApp("process.FormDesigner", "Module.$Element", null, false);
  3. MWF.xApplication.process.FormDesigner.Module.ImageClipper = MWF.FCImageClipper = new Class({
  4. Extends: MWF.FC$Element,
  5. Implements: [Options, Events],
  6. options: {
  7. "style": "default",
  8. "propertyPath": "../x_component_process_FormDesigner/Module/ImageClipper/imageclipper.html"
  9. },
  10. initialize: function(form, options){
  11. this.setOptions(options);
  12. this.path = "../x_component_process_FormDesigner/Module/ImageClipper/";
  13. this.cssPath = "../x_component_process_FormDesigner/Module/ImageClipper/"+this.options.style+"/css.wcss";
  14. this._loadCss();
  15. this.moduleType = "element";
  16. this.moduleName = "imageclipper";
  17. this.form = form;
  18. this.container = null;
  19. this.containerNode = null;
  20. },
  21. _createNode: function(){
  22. this.node = this.moveNode.clone(true, true);
  23. this.node.setStyles(this.css.moduleNode);
  24. this.node.set("id", this.json.id);
  25. this.node.addEvent("selectstart", function(){
  26. return false;
  27. });
  28. },
  29. _createMoveNode: function(){
  30. this.moveNode = new Element("div", {
  31. "MWFType": "button",
  32. "id": this.json.id,
  33. "styles": this.css.moduleNodeMove,
  34. "events": {
  35. "selectstart": function(){
  36. return false;
  37. }
  38. }
  39. }).inject(this.form.container);
  40. //var imageNode = new Element("img", {
  41. // "src": this.json.src || this.path+this.options.style+"/icon/image1.png",
  42. // "styles": this.css.imageNode
  43. //}).inject(this.moveNode);
  44. var button = new Element("button", {
  45. "styles": this.css.buttonIcon,
  46. "text": this.json.name || this.json.id
  47. }).inject(this.moveNode);
  48. },
  49. _loadNodeStyles: function(){
  50. var button = this.node.getFirst("button");
  51. button.setStyles(this.css.buttonIcon);
  52. button.setStyles(this.json.buttonStyles);
  53. },
  54. setAllStyles: function(){
  55. this.setPropertiesOrStyles("styles");
  56. this.setPropertiesOrStyles("buttonStyles");
  57. this.setPropertiesOrStyles("imageStyles");
  58. this.setPropertiesOrStyles("properties");
  59. this.reloadMaplist();
  60. },
  61. _initModule: function(){
  62. if (!this.json.isSaved) this.setStyleTemplate();
  63. this._resetModuleDomNode();
  64. this.setPropertiesOrStyles("styles");
  65. this.setPropertiesOrStyles("buttonStyles");
  66. this.setPropertiesOrStyles("imageStyles");
  67. this.setPropertiesOrStyles("properties");
  68. this._setNodeProperty();
  69. if (!this.form.isSubform) this._createIconAction();
  70. this._setNodeEvent();
  71. this.json.isSaved = true;
  72. },
  73. unSelected: function(){
  74. this.node.setStyles({
  75. "border": "1px dashed #999"
  76. });
  77. if (this.actionArea) this.actionArea.setStyle("display", "none");
  78. this.form.currentSelectedModule = null;
  79. this.hideProperty();
  80. },
  81. unOver: function(){
  82. if (!this.form.moveModule) if (this.form.currentSelectedModule!=this) this.node.setStyles({
  83. "border": "1px dashed #999"
  84. });
  85. },
  86. _createCopyNode: function(){
  87. this.copyNode = new Element("div", {
  88. "styles": this.css.moduleNodeShow
  89. });
  90. this.copyNode.addEvent("selectstart", function(){
  91. return false;
  92. });
  93. },
  94. _getCopyNode: function(){
  95. if (!this.copyNode) this._createCopyNode();
  96. this.copyNode.setStyle("display", "inline-block");
  97. return this.copyNode;
  98. },
  99. setPropertiesOrStyles: function(name){
  100. if (name=="styles"){
  101. try{
  102. this.setCustomStyles();
  103. }catch(e){}
  104. }
  105. if (name=="properties"){
  106. try{
  107. this.setCustomProperties();
  108. }catch(e){}
  109. }
  110. if (name=="buttonStyles"){
  111. if (this.json.buttonStyles){
  112. var button = this.node.getElement("button");
  113. button.clearStyles();
  114. button.setStyles(this.css.buttonIcon);
  115. button.setStyles(this.json.buttonStyles);
  116. }
  117. }
  118. },
  119. _setEditStyle_custom: function(name){
  120. if (name=="name"){
  121. if (this.json.name){
  122. var button = this.node.getElement("button");
  123. button.set("text", this.json.name);
  124. }
  125. }
  126. if (name=="id"){
  127. if (!this.json.name){
  128. var button = this.node.getElement("button");
  129. button.set("text", this.json.id);
  130. }
  131. }
  132. },
  133. getData: function(){
  134. return this.attachmentController.getAttachmentNames();
  135. }
  136. //_setEditStyle_custom: function(name){
  137. // if (name=="name"){
  138. // if (this.json.name){
  139. // var img = this.node.getElement("img");
  140. // //button.set("text", this.json.name);
  141. // img.setStyles( this.css.imageNode );
  142. // }
  143. // }
  144. // if (name=="id"){
  145. // if (!this.json.name){
  146. // var img = this.node.getElement("img");
  147. // //button.set("text", this.json.name);
  148. // img.setStyles( this.css.imageNode );
  149. // }
  150. // }
  151. //}
  152. });