Textarea.js 4.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124
  1. MWF.xDesktop.requireApp("process.Xform", "$Input", null, false);
  2. MWF.xApplication.process.Xform.Textarea = MWF.APPTextarea = new Class({
  3. Implements: [Events],
  4. Extends: MWF.APP$Input,
  5. _loadUserInterface: function(){
  6. this._loadNode();
  7. if (this.json.compute == "show"){
  8. this._setValue(this._computeValue());
  9. }else{
  10. this._loadValue();
  11. }
  12. },
  13. _loadNode: function(){
  14. if (this.readonly || this.json.isReadonly){
  15. this._loadNodeRead();
  16. }else{
  17. this._loadNodeEdit();
  18. }
  19. },
  20. _loadNodeRead: function(){
  21. this.node.empty();
  22. },
  23. _setValue: function(value){
  24. this._setBusinessData(value);
  25. if (this.node.getFirst()) this.node.getFirst().set("value", value || "");
  26. if (this.readonly || this.json.isReadonly){
  27. var reg = new RegExp("\n","g");
  28. var text = value.replace(reg,"<br/>");
  29. this.node.set("html", text);
  30. }
  31. },
  32. _loadNodeEdit: function(){
  33. var input = new Element("textarea", {"styles": {
  34. "background": "transparent",
  35. "width": "100%",
  36. "border": "0px"
  37. }});
  38. input.set(this.json.properties);
  39. if( this.form.json.textareaDisableResize )input.setStyle("resize","none");
  40. var node = new Element("div", {"styles": {
  41. "ovwrflow": "hidden",
  42. "position": "relative",
  43. "padding-right": "2px"
  44. }}).inject(this.node, "after");
  45. input.inject(node);
  46. this.node.destroy();
  47. this.node = node;
  48. //this.node = input;
  49. this.node.set({
  50. "id": this.json.id,
  51. "MWFType": this.json.type
  52. });
  53. this.node.addEvent("change", function(){
  54. this._setBusinessData(this.getInputData());
  55. }.bind(this));
  56. this.node.getFirst().addEvent("blur", function(){
  57. this.validation();
  58. }.bind(this));
  59. this.node.getFirst().addEvent("keyup", function(){
  60. this.validationMode();
  61. }.bind(this));
  62. },
  63. _afterLoaded: function(){
  64. if (!this.readonly){
  65. this.loadDescription();
  66. }
  67. },
  68. loadDescription: function(){
  69. if (this.readonly || this.json.isReadonly)return;
  70. var v = this._getBusinessData();
  71. if (!v){
  72. if (this.json.description){
  73. var size = this.node.getFirst().getSize();
  74. var w = size.x-23;
  75. this.descriptionNode = new Element("div", {"styles": this.form.css.descriptionNode, "text": this.json.description}).inject(this.node);
  76. this.descriptionNode.setStyles({
  77. "width": ""+w+"px",
  78. "height": ""+size.y+"px",
  79. "line-height": ""+size.y+"px"
  80. });
  81. this.setDescriptionEvent();
  82. }
  83. }
  84. },
  85. setDescriptionEvent: function(){
  86. if (this.descriptionNode){
  87. if (COMMON.Browser.Platform.name==="ios"){
  88. this.descriptionNode.addEvents({
  89. "click": function(){
  90. this.descriptionNode.setStyle("display", "none");
  91. this.node.getFirst().focus();
  92. }.bind(this)
  93. });
  94. }else if (COMMON.Browser.Platform.name==="android"){
  95. this.descriptionNode.addEvents({
  96. "click": function(){
  97. this.descriptionNode.setStyle("display", "none");
  98. this.node.getFirst().focus();
  99. }.bind(this)
  100. });
  101. }else{
  102. this.descriptionNode.addEvents({
  103. "click": function(){
  104. this.descriptionNode.setStyle("display", "none");
  105. this.node.getFirst().focus();
  106. }.bind(this)
  107. });
  108. }
  109. this.node.getFirst().addEvents({
  110. "focus": function(){
  111. this.descriptionNode.setStyle("display", "none");
  112. }.bind(this),
  113. "blur": function(){
  114. if (!this.node.getFirst().get("value")) this.descriptionNode.setStyle("display", "block");
  115. }.bind(this)
  116. });
  117. }
  118. }
  119. });