Add HTML control

examples/widgetapp/sample_page.e

@@ -29,7 +29,7 @@ feature
 			create textbox1.make_input ("txtBox1", "1")
 			create textbox2.make_input ("txtBox2", "2")
 			create button1.make_button ("sample_button1", "SUM")
-			create textbox_result.make_textarea ("txtBox3", "")
+			create textbox_result.make_html ("txtBox3","p", "")
 			button1.set_click_event (agent handle_click)
 			button1.add_class ("col-lg-offset-2")
 			create form.make_form_control ("panel")
@@ -61,9 +61,9 @@ feature
 					across
 						cklist.value as s
 					loop
-						text.append ("%N-" + s.item)
+						text.append ("<br />-" + s.item)
 					end
-					textbox_result.set_text (text)
+					textbox_result.set_html (text)
 				end
 			end
 		end
@@ -80,6 +80,6 @@ feature
 
 	cklist: WSF_CHECKBOX_LIST_CONTROL
 
-	textbox_result: WSF_TEXTAREA_CONTROL
+	textbox_result: WSF_HTML_CONTROL
 
 end

examples/widgetapp/widget.coffee

@@ -119,6 +119,26 @@ class WSF_TEXTAREA_CONTROL extends WSF_CONTROL
       window.states[@control_name]['text'] = state.text
       @$el.val(state.text)
 
+class WSF_TEXTAREA_CONTROL extends WSF_CONTROL
+  attach_events: () ->
+    self = @
+    @$el.change () ->
+      self.change()
+
+  change: () ->
+    window.states[@control_name]['text'] = @$el.val()
+    if window.states[@control_name]['callback_change']
+      trigger_callback(@control_name, 'change')
+    @trigger('change')
+
+  value:()->
+    return @$el.val()
+
+  update: (state) ->
+    if state.text?
+      window.states[@control_name]['text'] = state.text
+      @$el.val(state.text)
+
 class WSF_CHECKBOX_CONTROL extends WSF_CONTROL
   attach_events: ()->
     self = @
@@ -185,6 +205,16 @@ class WSF_FORM_ELEMENT_CONTROL extends WSF_CONTROL
   value: ()->
     @value_control.value()
 
+class WSF_HTML_CONTROL extends WSF_CONTROL
+
+  value:()->
+    return @$el.html()
+
+  update: (state) ->
+    if state.html?
+      window.states[@control_name]['html'] = state.html
+      @$el.html(state.html)
+
 #map class name to effective class
 typemap =
   "WSF_BUTTON_CONTROL":WSF_BUTTON_CONTROL
@@ -192,6 +222,7 @@ typemap =
   "WSF_TEXTAREA_CONTROL":WSF_TEXTAREA_CONTROL
   "WSF_CHECKBOX_CONTROL":WSF_CHECKBOX_CONTROL
   "WSF_FORM_ELEMENT_CONTROL": WSF_FORM_ELEMENT_CONTROL
+  "WSF_HTML_CONTROL": WSF_HTML_CONTROL
 
 #create a js class for each control
 for name,state of window.states

examples/widgetapp/widget.js

@@ -1,6 +1,6 @@
 // Generated by CoffeeScript 1.6.1
 (function() {
-  var $el, WSF_BUTTON_CONTROL, WSF_CHECKBOX_CONTROL, WSF_CONTROL, WSF_FORM_ELEMENT_CONTROL, WSF_INPUT_CONTROL, WSF_REGEXP_VALIDATOR, WSF_TEXTAREA_CONTROL, WSF_VALIDATOR, controls, name, state, trigger_callback, type, typemap, validatormap, _ref, _ref1, _ref2,
+  var $el, WSF_BUTTON_CONTROL, WSF_CHECKBOX_CONTROL, WSF_CONTROL, WSF_FORM_ELEMENT_CONTROL, WSF_HTML_CONTROL, WSF_INPUT_CONTROL, WSF_REGEXP_VALIDATOR, WSF_TEXTAREA_CONTROL, WSF_VALIDATOR, controls, name, state, trigger_callback, type, typemap, validatormap, _ref, _ref1, _ref2,
     __hasProp = {}.hasOwnProperty,
     __extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; };
 
@@ -221,6 +221,45 @@
 
   })(WSF_CONTROL);
 
+  WSF_TEXTAREA_CONTROL = (function(_super) {
+
+    __extends(WSF_TEXTAREA_CONTROL, _super);
+
+    function WSF_TEXTAREA_CONTROL() {
+      return WSF_TEXTAREA_CONTROL.__super__.constructor.apply(this, arguments);
+    }
+
+    WSF_TEXTAREA_CONTROL.prototype.attach_events = function() {
+      var self;
+      self = this;
+      return this.$el.change(function() {
+        return self.change();
+      });
+    };
+
+    WSF_TEXTAREA_CONTROL.prototype.change = function() {
+      window.states[this.control_name]['text'] = this.$el.val();
+      if (window.states[this.control_name]['callback_change']) {
+        trigger_callback(this.control_name, 'change');
+      }
+      return this.trigger('change');
+    };
+
+    WSF_TEXTAREA_CONTROL.prototype.value = function() {
+      return this.$el.val();
+    };
+
+    WSF_TEXTAREA_CONTROL.prototype.update = function(state) {
+      if (state.text != null) {
+        window.states[this.control_name]['text'] = state.text;
+        return this.$el.val(state.text);
+      }
+    };
+
+    return WSF_TEXTAREA_CONTROL;
+
+  })(WSF_CONTROL);
+
   WSF_CHECKBOX_CONTROL = (function(_super) {
 
     __extends(WSF_CHECKBOX_CONTROL, _super);
@@ -329,12 +368,36 @@
 
   })(WSF_CONTROL);
 
+  WSF_HTML_CONTROL = (function(_super) {
+
+    __extends(WSF_HTML_CONTROL, _super);
+
+    function WSF_HTML_CONTROL() {
+      return WSF_HTML_CONTROL.__super__.constructor.apply(this, arguments);
+    }
+
+    WSF_HTML_CONTROL.prototype.value = function() {
+      return this.$el.html();
+    };
+
+    WSF_HTML_CONTROL.prototype.update = function(state) {
+      if (state.html != null) {
+        window.states[this.control_name]['html'] = state.html;
+        return this.$el.html(state.html);
+      }
+    };
+
+    return WSF_HTML_CONTROL;
+
+  })(WSF_CONTROL);
+
   typemap = {
     "WSF_BUTTON_CONTROL": WSF_BUTTON_CONTROL,
     "WSF_INPUT_CONTROL": WSF_INPUT_CONTROL,
     "WSF_TEXTAREA_CONTROL": WSF_TEXTAREA_CONTROL,
     "WSF_CHECKBOX_CONTROL": WSF_CHECKBOX_CONTROL,
-    "WSF_FORM_ELEMENT_CONTROL": WSF_FORM_ELEMENT_CONTROL
+    "WSF_FORM_ELEMENT_CONTROL": WSF_FORM_ELEMENT_CONTROL,
+    "WSF_HTML_CONTROL": WSF_HTML_CONTROL
   };
 
   _ref = window.states;