Introduce actions

First working modal

examples/widgetapp/application.e

@@ -87,6 +87,7 @@ feature -- Router and Filter
 				-- this way, it handles the caching and so on
 			map_agent_uri ("/widget.js", agent load_file("widget.js", ?, ?), Void)
 			map_agent_uri ("/jquery.min.js", agent load_file("jquery.min.js", ?, ?), Void)
+			map_agent_uri ("/bootstrap.min.js", agent load_file("bootstrap.min.js", ?, ?), Void)
 			map_agent_uri ("/typeahead.min.js", agent load_file("typeahead.min.js", ?, ?), Void)
 			map_agent_uri ("/widget.css", agent load_file("widget.css", ?, ?), Void)
 			map_agent_uri ("/bootstrap.min.css", agent load_file("bootstrap.min.css", ?, ?), Void)

examples/widgetapp/base_page.e

@@ -24,7 +24,9 @@ feature
 			navbar.add_list_element (create {WSF_BASIC_CONTROL}.make_with_body ("a", "href=%"/grid%"", "Grid"))
 			navbar.add_list_element (create {WSF_BASIC_CONTROL}.make_with_body ("a", "href=%"/repeater%"", "Repeater"))
 			navbar.add_list_element_right (create {WSF_BASIC_CONTROL}.make_with_body ("a", "href=%"#%"", "About"))
-			container.add_control (navbar)
+			if not attached get_parameter ("ajax") then
+				container.add_control (navbar)
+			end
 			control := container
 		end
 

examples/widgetapp/sample_page.e

@@ -69,27 +69,37 @@ feature
 			button1.set_click_event (agent handle_click)
 			button1.add_class ("col-lg-offset-2")
 			form.add_control (button1)
+				--Button 2
+			create button2.make_button ("sample_button2", "Start Modal Grid")
+			button2.set_click_event (agent handle_click2)
+			button2.add_class ("col-lg-offset-2")
+			form.add_control (button2)
 				--Result
 			create result_html.make_html ("txtBox3", "p", "")
 			form.add_control (create {WSF_FORM_ELEMENT_CONTROL [STRING]}.make_form_element ("Result", result_html))
 			container.add_control (form)
 
 				--Progress bar
-			container.add_control (create {WSF_BASIC_CONTROL}.make_with_body("h4","","Autoincrementing progressbar"))
+			container.add_control (create {WSF_BASIC_CONTROL}.make_with_body ("h4", "", "Autoincrementing progressbar"))
 			create source.make
 			create progress.make_progress_with_source ("progress1", source)
 			source.set_control (progress)
-			progress.set_isolation(true)
+			progress.set_isolation (true)
 			container.add_control (progress)
 		end
 
+	handle_click2
+	do
+		start_modal ("/")
+	end
+
 	handle_click
 		local
 			text: STRING
 		do
 			form.validate
 			if form.is_valid then
-				--progress.set_progress ((textbox1.text.to_integer_64 / textbox2.text.to_integer_64 * 100).ceiling)
+					--progress.set_progress ((textbox1.text.to_integer_64 / textbox2.text.to_integer_64 * 100).ceiling)
 				text := textbox1.text + " + " + textbox2.text + " = " + (textbox1.text.to_integer_64 + textbox2.text.to_integer_64).out
 				text.append ("<ul>")
 				across
@@ -100,7 +110,7 @@ feature
 				text.append ("</ul>")
 				result_html.set_html (text)
 			else
-				result_html.set_html ("VALIDATION ERROR")
+				show_alert ("VALIDATION ERROR")
 			end
 		end
 
@@ -110,6 +120,8 @@ feature
 
 	button1: WSF_BUTTON_CONTROL
 
+	button2: WSF_BUTTON_CONTROL
+
 	textbox1: WSF_INPUT_CONTROL
 
 	textbox2: WSF_INPUT_CONTROL

examples/widgetapp/widget.coffee

@@ -93,6 +93,13 @@ class WSF_CONTROL
 
   update: (state)->
     return 
+  process_actions: (actions)->
+    for action in actions
+      try
+        fn = eval(action.type)
+        fn(action)
+      catch e
+        console.log "Failed preforming action #{action.type}"
  
   process_update: (new_states)->
     if new_states[@control_name]?
@@ -136,6 +143,8 @@ class WSF_CONTROL
       cache: no
     .done (new_states)->
       #Update all classes
+      if new_states.actions?
+        self.process_actions(new_states.actions)
       self.process_update(new_states)
   #Simple event listener
 
@@ -165,7 +174,7 @@ class WSF_PAGE_CONTROL extends WSF_CONTROL
     @url = @state['url']
     @url_params = jQuery.unparam(@state['url_params'])
     @load_subcontrols()
-    
+
   wrap : (cname,state)->
     state
 
@@ -398,4 +407,37 @@ class WSF_REPEATER_CONTROL extends WSF_CONTROL
       @$el.find('.repeater_content').html(state._body)
       console.log state._body
 
- 
+ 
+
+
+
+
+#### actions
+
+show_alert = (action)->
+    alert(action.message)
+
+start_modal = (action)->
+  modal = $("""<div class="modal fade">
+  <div class="modal-dialog">
+    <div class="modal-content">
+      <div class="modal-header">
+        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+        <h4 class="modal-title">Modal title</h4>
+      </div>
+      <div class="modal-body">
+      
+      </div>
+      <div class="modal-footer">
+        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
+        <button type="button" class="btn btn-primary">Save changes</button>
+      </div>
+    </div><!-- /.modal-content -->
+  </div><!-- /.modal-dialog -->
+</div><!-- /.modal -->""")
+  modal.appendTo('body')
+  modal.modal()
+  $.get( action.url, { ajax: 1 } )
+    .done (data) ->
+      modal.find('.modal-body').append(data)
+  

examples/widgetapp/widget.js

@@ -1,5 +1,5 @@
 // Generated by CoffeeScript 1.6.1
-var Mini, WSF_AUTOCOMPLETE_CONTROL, WSF_BUTTON_CONTROL, WSF_CHECKBOX_CONTROL, WSF_CHECKBOX_LIST_CONTROL, WSF_CONTROL, WSF_FORM_ELEMENT_CONTROL, WSF_GRID_CONTROL, WSF_HTML_CONTROL, WSF_INPUT_CONTROL, WSF_MAX_VALIDATOR, WSF_MIN_VALIDATOR, WSF_PAGE_CONTROL, WSF_PAGINATION_CONTROL, WSF_PROGRESS_CONTROL, WSF_REGEXP_VALIDATOR, WSF_REPEATER_CONTROL, WSF_TEXTAREA_CONTROL, WSF_VALIDATOR, build_control, cache, controls, template, tmpl,
+var Mini, WSF_AUTOCOMPLETE_CONTROL, WSF_BUTTON_CONTROL, WSF_CHECKBOX_CONTROL, WSF_CHECKBOX_LIST_CONTROL, WSF_CONTROL, WSF_FORM_ELEMENT_CONTROL, WSF_GRID_CONTROL, WSF_HTML_CONTROL, WSF_INPUT_CONTROL, WSF_MAX_VALIDATOR, WSF_MIN_VALIDATOR, WSF_PAGE_CONTROL, WSF_PAGINATION_CONTROL, WSF_PROGRESS_CONTROL, WSF_REGEXP_VALIDATOR, WSF_REPEATER_CONTROL, WSF_TEXTAREA_CONTROL, WSF_VALIDATOR, build_control, cache, controls, show_alert, start_modal, template, tmpl,
   __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; };
 
@@ -174,6 +174,21 @@ WSF_CONTROL = (function() {
 
   WSF_CONTROL.prototype.update = function(state) {};
 
+  WSF_CONTROL.prototype.process_actions = function(actions) {
+    var action, fn, _i, _len, _results;
+    _results = [];
+    for (_i = 0, _len = actions.length; _i < _len; _i++) {
+      action = actions[_i];
+      try {
+        fn = eval(action.type);
+        _results.push(fn(action));
+      } catch (e) {
+        _results.push(console.log("Failed preforming action " + action.type));
+      }
+    }
+    return _results;
+  };
+
   WSF_CONTROL.prototype.process_update = function(new_states) {
     var control, _i, _len, _ref, _results;
     if (new_states[this.control_name] != null) {
@@ -238,6 +253,9 @@ WSF_CONTROL = (function() {
       contentType: 'application/json',
       cache: false
     }).done(function(new_states) {
+      if (new_states.actions != null) {
+        self.process_actions(new_states.actions);
+      }
       return self.process_update(new_states);
     });
   };
@@ -731,3 +749,19 @@ WSF_REPEATER_CONTROL = (function(_super) {
   return WSF_REPEATER_CONTROL;
 
 })(WSF_CONTROL);
+
+show_alert = function(action) {
+  return alert(action.message);
+};
+
+start_modal = function(action) {
+  var modal;
+  modal = $("<div class=\"modal fade\">\n<div class=\"modal-dialog\">\n  <div class=\"modal-content\">\n    <div class=\"modal-header\">\n      <button type=\"button\" class=\"close\" data-dismiss=\"modal\" aria-hidden=\"true\">&times;</button>\n      <h4 class=\"modal-title\">Modal title</h4>\n    </div>\n    <div class=\"modal-body\">\n    \n    </div>\n    <div class=\"modal-footer\">\n      <button type=\"button\" class=\"btn btn-default\" data-dismiss=\"modal\">Close</button>\n      <button type=\"button\" class=\"btn btn-primary\">Save changes</button>\n    </div>\n  </div><!-- /.modal-content -->\n</div><!-- /.modal-dialog -->\n</div><!-- /.modal -->");
+  modal.appendTo('body');
+  modal.modal();
+  return $.get(action.url, {
+    ajax: 1
+  }).done(function(data) {
+    return modal.find('.modal-body').append(data);
+  });
+};

library/server/wsf_js_widget/webcontrol/wsf_control.e

@@ -30,10 +30,35 @@ feature {NONE} -- Initialization
 			make (a_tag_name)
 			control_name := n
 			create state_changes.make
+			create actions.make_array
 		ensure
 			attached state_changes
 		end
 
+feature -- Actions
+
+	start_modal(url:STRING)
+		--Start a modal window containg an other or the same page
+		local
+			modal:JSON_OBJECT
+		do
+			create modal.make
+			modal.put (create {JSON_STRING}.make_json("start_modal"), "type")
+			modal.put (create {JSON_STRING}.make_json(url), "url")
+			actions.add (modal)
+		end
+
+	show_alert(mesage:STRING)
+		--Start a modal window containg an other or the same page
+		local
+			modal:JSON_OBJECT
+		do
+			create modal.make
+			modal.put (create {JSON_STRING}.make_json("show_alert"), "type")
+			modal.put (create {JSON_STRING}.make_json(mesage), "message")
+			actions.add (modal)
+		end
+
 feature {WSF_PAGE_CONTROL, WSF_CONTROL} -- STATE MANAGEMENT
 
 	load_state (new_states: JSON_OBJECT)
@@ -62,6 +87,18 @@ feature {WSF_PAGE_CONTROL, WSF_CONTROL} -- STATE MANAGEMENT
 			if state_changes.count > 0 then
 				states.put (state_changes, control_name)
 			end
+			if actions.count > 0 then
+				if not attached states.item ("actions") then
+					states.put (create {JSON_ARRAY}.make_array,"actions")
+				end
+				if attached {JSON_ARRAY}states.item ("actions") as action_list then
+					across
+						actions.array_representation as action
+					loop
+						action_list.add (action.item)
+					end
+				end
+			end
 		end
 
 	state: JSON_OBJECT
@@ -117,4 +154,5 @@ feature -- Properties
 
 	isolate: BOOLEAN
 
+	actions: JSON_ARRAY
 end

library/server/wsf_js_widget/webcontrol/wsf_page_control.e

@@ -7,11 +7,22 @@ note
 deferred class
 	WSF_PAGE_CONTROL
 
+inherit
+
+	WSF_CONTROL
+		rename
+			make as make_wsf_control
+		redefine
+			full_state,
+			read_state_changes
+		end
+
 feature {NONE} -- Initialization
 
 	make (req: WSF_REQUEST; res: WSF_RESPONSE)
 			-- Initialize
 		do
+			make_control (req.request_time_stamp.out, "body")
 			request := req
 			response := res
 			initialize_controls
@@ -60,68 +71,66 @@ feature -- Implementation
 				request.read_input_data_into (states)
 				create json_parser.make_parser (states)
 				if attached {JSON_OBJECT} json_parser.parse_json as sp then
-					if attached {JSON_OBJECT} sp.item ("controls") as ct and then attached {JSON_OBJECT} ct.item (control.control_name) as value_state then
+					set_state (sp)
-						control.load_state (value_state)
-					end
 				end
-				control.handle_callback (event_control_name, event, event_parameter)
+				handle_callback (event_control_name, event, event_parameter)
 				create states_changes.make
-				control.read_state_changes (states_changes)
+				read_state_changes (states_changes)
 				response.put_header ({HTTP_STATUS_CODE}.ok, <<["Content-Type", "application/json; charset=ISO-8859-1"]>>)
 				response.put_string (states_changes.representation)
 			else
 				process
-				render
+				render_page
 			end
 		end
 
-	render
+	render_page
 			-- Render and send the HTML Page
 		local
-			data: STRING
 			page: WSF_PAGE_RESPONSE
-			states: JSON_OBJECT
 		do
-			data := "<html><head>"
-			data.append ("<link href=%"/bootstrap.min.css%" rel=%"stylesheet%">")
-			data.append ("<link href=%"/widget.css%" rel=%"stylesheet%">")
-			data.append ("</head><body data-name=%"" + control_name + "%" data-type=%"WSF_PAGE_CONTROL%">")
-			data.append (control.render)
-			data.append ("<script src=%"/jquery.min.js%"></script>")
-			data.append ("<script src=%"/typeahead.min.js%"></script>")
-			data.append ("<script src=%"/widget.js%"></script>")
-			data.append ("<script type=%"text/javascript%">$(function() {var page= new WSF_PAGE_CONTROL(")
-			data.append (full_state.representation)
-			data.append (");page.attach_events();});</script>")
-			data.append ("</body></html>")
 			create page.make
 			page.put_header ({HTTP_STATUS_CODE}.ok, <<["Content-Type", "text/html; charset=ISO-8859-1"]>>)
-			page.set_body (data)
+			page.set_body (render)
 			response.send (page)
 		end
 
-	control_name: STRING
+	render: STRING
-		do
-			Result := request.request_time_stamp.out
-		end
-
-	state: JSON_OBJECT
-		do
-			create Result.make
-			Result.put (create {JSON_STRING}.make_json (control_name), "id")
-			Result.put (create {JSON_STRING}.make_json (request.path_info), "url")
-			Result.put (create {JSON_STRING}.make_json (request.query_string), "url_params")
-		end
-
-	full_state: JSON_OBJECT
 		local
-			controls_state: JSON_OBJECT
+			ajax: BOOLEAN
 		do
-			create Result.make
+			ajax := attached get_parameter ("ajax")
-			create controls_state.make
+			create Result.make_empty
-			controls_state.put (control.full_state, control.control_name)
+			if not ajax then
-			Result.put (controls_state, "controls")
+				Result.append ("<html><head>")
-			Result.put (state, "state")
+				Result.append ("<link href=%"/bootstrap.min.css%" rel=%"stylesheet%">")
+				Result.append ("<link href=%"/widget.css%" rel=%"stylesheet%">")
+				Result.append ("</head><body data-name=%"" + control_name + "%" data-type=%"WSF_PAGE_CONTROL%">")
+				Result.append (control.render)
+				Result.append ("<script src=%"/jquery.min.js%"></script>")
+				Result.append ("<script src=%"/typeahead.min.js%"></script>")
+				Result.append ("<script src=%"/bootstrap.min.js%"></script>")
+				Result.append ("<script src=%"/widget.js%"></script>")
+				Result.append ("<script type=%"text/javascript%">$(function() {var page= new WSF_PAGE_CONTROL(")
+				Result.append (full_state.representation)
+				Result.append (");page.attach_events();});</script>")
+				Result.append ("</body></html>")
+			else
+				Result.append ("<div data-name=%"" + control_name + "%" data-type=%"WSF_PAGE_CONTROL%">")
+				Result.append (control.render)
+				Result.append ("<script type=%"text/javascript%">$(function() {var page= new WSF_PAGE_CONTROL(")
+				Result.append (full_state.representation)
+				Result.append (");page.attach_events();});</script>")
+				Result.append ("</div>")
+			end
+
+		end
+
+	read_state_changes (states: JSON_OBJECT)
+			-- Add a new entry in the `states_changes` JSON object with the `control_name` as key and the `state` as value
+		do
+			Precursor (states)
+			control.read_state_changes (states)
 		end
 
 	get_parameter (key: STRING): detachable STRING
@@ -136,6 +145,42 @@ feature -- Implementation
 			end
 		end
 
+feature -- EVENT HANDLING
+
+	handle_callback (cname: STRING; event: STRING; event_parameter: detachable STRING)
+			-- Forward callback to control
+		do
+			control.handle_callback (cname, event, event_parameter)
+		end
+
+feature {WSF_PAGE_CONTROL, WSF_CONTROL} -- STATE MANAGEMENT
+
+	state: JSON_OBJECT
+		do
+			create Result.make
+			Result.put (create {JSON_STRING}.make_json (control_name), "id")
+			Result.put (create {JSON_STRING}.make_json (request.path_info), "url")
+			Result.put (create {JSON_STRING}.make_json (request.query_string), "url_params")
+		end
+
+	set_state (sp: JSON_OBJECT)
+		do
+			if attached {JSON_OBJECT} sp.item ("controls") as ct and then attached {JSON_OBJECT} ct.item (control.control_name) as value_state then
+				control.load_state (value_state)
+			end
+		end
+
+	full_state: JSON_OBJECT
+		local
+			controls_state: JSON_OBJECT
+		do
+			create Result.make
+			create controls_state.make
+			controls_state.put (control.full_state, control.control_name)
+			Result.put (controls_state, "controls")
+			Result.put (state, "state")
+		end
+
 feature {NONE} -- Root control
 
 	control: WSF_CONTROL