Html.js 3.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125
  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.Html = MWF.FCHtml = new Class({
  4. Extends: MWF.FC$Element,
  5. Implements: [Options, Events],
  6. options: {
  7. "style": "default",
  8. "propertyPath": "../x_component_process_FormDesigner/Module/Html/html.html"
  9. },
  10. initialize: function(form, options){
  11. this.setOptions(options);
  12. this.path = "../x_component_process_FormDesigner/Module/Html/";
  13. this.cssPath = "../x_component_process_FormDesigner/Module/Html/"+this.options.style+"/css.wcss";
  14. this._loadCss();
  15. this.moduleType = "element";
  16. this.moduleName = "html";
  17. this.form = form;
  18. this.container = null;
  19. this.containerNode = null;
  20. },
  21. _createMoveNode: function(){
  22. this.moveNode = new Element("div", {
  23. "MWFType": "html",
  24. "id": this.json.id,
  25. "styles": this.css.moduleNodeMove,
  26. "text": ""
  27. }).inject(this.form.container);
  28. this.textarea = new Element("textarea", {
  29. "styles":{
  30. "background": "transparent",
  31. "border": "0px",
  32. "width": "100%",
  33. "overflow": "hidden",
  34. "cursor": "pointer",
  35. "webkit-user-select": "text",
  36. "moz-user-select": "text",
  37. "font-size": "12px",
  38. "color": "#193ee1",
  39. "height": "18px",
  40. "line-height": "18px"
  41. }
  42. }).inject(this.moveNode);
  43. },
  44. _loadNodeStyles: function(){
  45. this.textarea = this.node.getFirst("textarea");
  46. this.textarea.setStyles({
  47. "background": "transparent",
  48. "border": "0px",
  49. "width": "100%",
  50. "overflow": "hidden",
  51. "cursor": "pointer",
  52. "webkit-user-select": "text",
  53. "moz-user-select": "text",
  54. "font-size": "12px",
  55. "color": "#193ee1",
  56. "height": "18px",
  57. "line-height": "18px"
  58. });
  59. this.textarea.set("value", this.json.text);
  60. },
  61. _setNodeProperty: function(){
  62. this.textarea.set("value", this.json.text);
  63. if (this.property){
  64. var editNode = this.property.propertyNode.getElement(".MWF_editHtmlText");
  65. if (editNode) editNode.set("value", this.textarea.get("value"));
  66. }
  67. this._setTextareaHeight();
  68. },
  69. _createNode: function(){
  70. this.node = this.moveNode.clone(true, true);
  71. this.node.setStyles(this.css.moduleNode);
  72. this.textarea = this.node.getFirst("textarea");
  73. this.textarea.set("value", this.json.text);
  74. },
  75. _setTextareaHeight: function(){
  76. this.textarea.setStyle("height", "18px");
  77. var scroll = this.textarea.getScrollSize();
  78. var size = this.textarea.getSize();
  79. if (scroll.y>size.y){
  80. this.textarea.setStyle("height", ""+scroll.y+"px");
  81. }
  82. },
  83. _setOtherNodeEvent: function(){
  84. this.textarea.focus();
  85. this.textarea.addEvents({
  86. "keydown": function(e){
  87. this._setTextareaHeight();
  88. e.stopPropagation();
  89. }.bind(this),
  90. "keyup": function(e){
  91. if (e.code==8 || e.code==46 || (e.control && e.code==88)){
  92. this._setTextareaHeight();
  93. }
  94. if (this.property){
  95. var editNode = this.property.propertyNode.getElement(".MWF_editHtmlText");
  96. if (editNode) editNode.set("value", this.textarea.get("value"));
  97. }
  98. // var editNode = $("editHtmlText");
  99. // if (editNode) editNode.set("value", this.textarea.get("value"));
  100. }.bind(this),
  101. "change": function(){
  102. this.json.text = this.textarea.get("value");
  103. }.bind(this),
  104. "blur": function(){
  105. this.json.text = this.textarea.get("value");
  106. }.bind(this)
  107. });
  108. },
  109. _setEditStyle_custom: function(name){
  110. if (name=="text"){
  111. this.textarea.set("value", this.json.text);
  112. this._setTextareaHeight();
  113. }
  114. }
  115. });