Restructure callbacks

This commit is contained in:
YNH Webdev
2013-09-22 18:30:48 +02:00
parent f360e8a867
commit 3a9ede6e8c
10 changed files with 2023 additions and 722 deletions

View File

@@ -135,7 +135,7 @@ feature -- Execution
local local
f: WSF_FILE_RESPONSE f: WSF_FILE_RESPONSE
do do
create f.make_html (name) create f.make (name)
response.send (f) response.send (f)
end end

View File

@@ -20,10 +20,10 @@ feature
create container.make_multi_control ("container") create container.make_multi_control ("container")
container.add_class ("container") container.add_class ("container")
create navbar.make_navbar ("Sample Page") create navbar.make_navbar ("Sample Page")
navbar.add_element (create {WSF_BASIC_CONTROL}.make_with_body ("a", "href=%"/%"", "Home")) navbar.nav.add_control (create {WSF_BASIC_CONTROL}.make_with_body ("a", "href=%"/%"", "Home"))
navbar.add_element (create {WSF_BASIC_CONTROL}.make_with_body ("a", "href=%"/grid%"", "Grid")) navbar.nav.add_control (create {WSF_BASIC_CONTROL}.make_with_body ("a", "href=%"/grid%"", "Grid"))
navbar.add_element (create {WSF_BASIC_CONTROL}.make_with_body ("a", "href=%"/repeater%"", "Repeater")) navbar.nav.add_control (create {WSF_BASIC_CONTROL}.make_with_body ("a", "href=%"/repeater%"", "Repeater"))
navbar.add_element_right (create {WSF_BASIC_CONTROL}.make_with_body ("a", "href=%"#%"", "About")) navbar.nav_right.add_control (create {WSF_BASIC_CONTROL}.make_with_body ("a", "href=%"#%"", "About"))
container.add_control (navbar) container.add_control (navbar)
control := container control := container
end end

File diff suppressed because one or more lines are too long

View File

@@ -1,3 +1,4 @@
#IMPORTANT PLEASE COMPILE WITH:: coffee -cbw widget.coffee
cache = {} cache = {}
template = tmpl = (str, data) -> template = tmpl = (str, data) ->
# Simple JavaScript Templating # Simple JavaScript Templating
@@ -11,19 +12,19 @@ Mini =
render:template(t) render:template(t)
} }
trigger_callback = (control_name,event,event_parameter)-> build_control = (control_name, state, control)->
$.ajax $el = control.$el.find('[data-name='+control_name+']')
data: #get control type
control_name: control_name type = $el.data('type')
event: event #create class
event_parameter: event_parameter typeclass = null
states: JSON.stringify(window.states) try
cache: no typeclass = eval(type)
.done (new_states)-> catch e
#Update all classes typeclass = WSF_CONTROL
for name,state of new_states if type? and typeclass?
controls[name]?.update(state) return new typeclass(control, $el, control_name, state)
return return null
class WSF_VALIDATOR class WSF_VALIDATOR
constructor: (@parent_control, @settings)-> constructor: (@parent_control, @settings)->
@@ -55,21 +56,71 @@ class WSF_MAX_VALIDATOR extends WSF_VALIDATOR
val = @parent_control.value() val = @parent_control.value()
return (val.length<=@settings.max) return (val.length<=@settings.max)
validatormap =
"WSF_REGEXP_VALIDATOR":WSF_REGEXP_VALIDATOR
"WSF_MIN_VALIDATOR":WSF_MIN_VALIDATOR
"WSF_MAX_VALIDATOR":WSF_MAX_VALIDATOR
class WSF_CONTROL class WSF_CONTROL
constructor: (@control_name, @$el)-> constructor: (@parent_control, @$el, @control_name, @fullstate)->
@state = @fullstate.state
@load_subcontrols()
return return
load_subcontrols: ()->
if @fullstate.controls?
@controls=(build_control(control_name, state, @) for control_name, state of @fullstate.controls)
else
@controls = []
attach_events: ()-> attach_events: ()->
console.log "Attached #{@control_name}"
for control in @controls
if control?
control.attach_events()
return return
update: (state)-> update: (state)->
return return
get_state: ()->
@state
get_control_states:()->
result = {}
for control in @controls
if control?
result[control.control_name]=control.get_full_state()
result
get_full_state: ()->
{"state":@get_state(),"controls":@get_control_states()}
process_update: (new_states)->
if new_states[@control_name]?
@update(new_states[@control_name])
for control in @controls
if control?
control.process_update(new_states)
get_context_state : ()->
if @parent_control?
return @parent_control.get_context_state()
return @get_full_state()
trigger_callback: (control_name,event,event_parameter)->
if @parent_control?
return @parent_control.trigger_callback(control_name,event,event_parameter)
self = @
$.ajax
type: 'POST',
url: '?' + $.param
control_name: control_name
event: event
data:
JSON.stringify(@get_full_state())
processData: false,
contentType: 'application/json',
cache: no
.done (new_states)->
#Update all classes
self.process_update(new_states)
#Simple event listener #Simple event listener
#subscribe to an event #subscribe to an event
@@ -89,36 +140,45 @@ class WSF_CONTROL
ev.callback.call(ev.context) ev.callback.call(ev.context)
return @ return @
class WSF_PAGE_CONTROL extends WSF_CONTROL
constructor: (@fullstate)->
@state = @fullstate.state
@parent_control=null
@$el = $('[data-name='+@state.id+']')
@control_name = @state.id
@load_subcontrols()
controls = {} controls = {}
class WSF_BUTTON_CONTROL extends WSF_CONTROL class WSF_BUTTON_CONTROL extends WSF_CONTROL
attach_events: ()-> attach_events: ()->
super
self = @ self = @
@$el.click (e)-> @$el.click (e)->
e.preventDefault() e.preventDefault()
self.click() self.click()
click: ()-> click: ()->
if window.states[@control_name]['callback_click'] if @state['callback_click']
trigger_callback(@control_name, 'click') @trigger_callback(@control_name, 'click')
update: (state) -> update: (state) ->
if state.text? if state.text?
window.states[@control_name]['text'] = state.text @state['text'] = state.text
@$el.text(state.text) @$el.text(state.text)
class WSF_INPUT_CONTROL extends WSF_CONTROL class WSF_INPUT_CONTROL extends WSF_CONTROL
attach_events: ()-> attach_events: ()->
super
self = @ self = @
@$el.change ()-> @$el.change ()->
self.change() self.change()
change: ()-> change: ()->
#update local state #update local state
window.states[@control_name]['text'] = @$el.val() @state['text'] = @$el.val()
if window.states[@control_name]['callback_change'] if @state['callback_change']
trigger_callback(@control_name, 'change') @trigger_callback(@control_name, 'change')
@trigger('change') @trigger('change')
value:()-> value:()->
@@ -126,28 +186,31 @@ class WSF_INPUT_CONTROL extends WSF_CONTROL
update: (state) -> update: (state) ->
if state.text? if state.text?
window.states[@control_name]['text'] = state.text @state['text'] = state.text
@$el.val(state.text) @$el.val(state.text)
class WSF_TEXTAREA_CONTROL extends WSF_INPUT_CONTROL class WSF_TEXTAREA_CONTROL extends WSF_INPUT_CONTROL
class WSF_AUTOCOMPLETE_CONTROL extends WSF_INPUT_CONTROL class WSF_AUTOCOMPLETE_CONTROL extends WSF_INPUT_CONTROL
attach_events: () -> attach_events: () ->
super
self = @ self = @
@$el.typeahead({ @$el.typeahead({
name: @control_name name: @control_name
template: window.states[@control_name]['template'] template: @state['template']
engine: Mini engine: Mini
remote: remote:
url:"" url:""
replace: (url, uriEncodedQuery) -> replace: (url, uriEncodedQuery) ->
window.states[self.control_name]['text'] = self.$el.val() self.state['text'] = self.$el.val()
'?' + $.param '?' + $.param
control_name: self.control_name control_name: self.control_name
event: 'autocomplete' event: 'autocomplete'
states: JSON.stringify(window.states) states: JSON.stringify(self.get_context_state())
filter: (parsedResponse) -> filter: (parsedResponse) ->
parsedResponse[self.control_name]['suggestions'] parsedResponse[self.control_name]['suggestions']
fn: ()->
self.trigger_callback(self.control_name, 'autocomplete')
}) })
@$el.on 'typeahead:closed',()-> @$el.on 'typeahead:closed',()->
self.change() self.change()
@@ -156,16 +219,17 @@ class WSF_AUTOCOMPLETE_CONTROL extends WSF_INPUT_CONTROL
class WSF_CHECKBOX_CONTROL extends WSF_CONTROL class WSF_CHECKBOX_CONTROL extends WSF_CONTROL
attach_events: ()-> attach_events: ()->
super
self = @ self = @
@checked_value = window.states[@control_name]['checked_value'] @checked_value = @state['checked_value']
@$el.change ()-> @$el.change ()->
self.change() self.change()
change: ()-> change: ()->
#update local state #update local state
window.states[@control_name]['checked'] = @$el.is(':checked') @state['checked'] = @$el.is(':checked')
if window.states[@control_name]['callback_change'] if @state['callback_change']
trigger_callback(@control_name, 'change') @trigger_callback(@control_name, 'change')
@trigger('change') @trigger('change')
value:()-> value:()->
@@ -173,23 +237,25 @@ class WSF_CHECKBOX_CONTROL extends WSF_CONTROL
update: (state) -> update: (state) ->
if state.text? if state.text?
window.states[@control_name]['checked'] = state.checked @state['checked'] = state.checked
@$el.prop('checked',state.checked) @$el.prop('checked',state.checked)
class WSF_FORM_ELEMENT_CONTROL extends WSF_CONTROL class WSF_FORM_ELEMENT_CONTROL extends WSF_CONTROL
attach_events: ()-> attach_events: ()->
super
self = @ self = @
@value_control = controls[window.states[@control_name]['value_control']] @value_control = @controls[0]
if @value_control? if @value_control?
#subscribe to change event on value_control #subscribe to change event on value_control
@value_control.on('change',@change,@) @value_control.on('change',@change,@)
@serverside_validator = false @serverside_validator = false
#Initialize validators #Initialize validators
@validators = [] @validators = []
for validator in window.states[@control_name]['validators'] for validator in @state['validators']
if validatormap[validator.name]? try
@validators.push new validatormap[validator.name](@,validator) validatorclass = eval(validator.name)
else @validators.push new validatorclass(@,validator)
catch e
#Use serverside validator if no js implementation #Use serverside validator if no js implementation
@serverside_validator = true @serverside_validator = true
return return
@@ -203,7 +269,7 @@ class WSF_FORM_ELEMENT_CONTROL extends WSF_CONTROL
@showerror("") @showerror("")
#If there is validator which is not implemented in js ask server to validate #If there is validator which is not implemented in js ask server to validate
if @serverside_validator if @serverside_validator
trigger_callback(@control_name, 'validate') @trigger_callback(@control_name, 'validate')
return return
showerror: (message)-> showerror: (message)->
@@ -228,18 +294,15 @@ class WSF_HTML_CONTROL extends WSF_CONTROL
update: (state) -> update: (state) ->
if state.html? if state.html?
window.states[@control_name]['html'] = state.html @state['html'] = state.html
@$el.html(state.html) @$el.html(state.html)
class WSF_CHECKBOX_LIST_CONTROL extends WSF_CONTROL class WSF_CHECKBOX_LIST_CONTROL extends WSF_CONTROL
attach_events: ()-> attach_events: ()->
self = @ super
@subcontrols = []
#Listen to events of subelements and forward them #Listen to events of subelements and forward them
for name,control of controls for control in @controls
if @$el.has(control.$el).length > 0
@subcontrols.push(control)
control.on('change',@change,@) control.on('change',@change,@)
return return
@@ -248,7 +311,7 @@ class WSF_CHECKBOX_LIST_CONTROL extends WSF_CONTROL
value:()-> value:()->
result = [] result = []
for subc in @subcontrols for subc in @controls
if subc.value() if subc.value()
result.push(subc.checked_value) result.push(subc.checked_value)
return result return result
@@ -256,20 +319,22 @@ class WSF_CHECKBOX_LIST_CONTROL extends WSF_CONTROL
class WSF_PROGRESS_CONTROL extends WSF_CONTROL class WSF_PROGRESS_CONTROL extends WSF_CONTROL
attach_events:() -> attach_events:() ->
super
self = @ self = @
runfetch= ()-> runfetch= ()->
self.fetch() self.fetch()
setInterval(runfetch, 5000) setInterval(runfetch, 5000)
fetch: ()-> fetch: ()->
trigger_callback(@control_name, 'progress_fetch') @trigger_callback(@control_name, 'progress_fetch')
update: (state)-> update: (state)->
if state.progress? if state.progress?
window.states[@control_name]['progress'] = state.progress @state['progress'] = state.progress
@$el.children('.progress-bar').attr('aria-valuenow', state.progress).width(state.progress + '%') @$el.children('.progress-bar').attr('aria-valuenow', state.progress).width(state.progress + '%')
class WSF_PAGINATION_CONTROL extends WSF_CONTROL class WSF_PAGINATION_CONTROL extends WSF_CONTROL
attach_events: ()-> attach_events: ()->
self = @ self = @
@$el.on 'click', 'a', (e)-> @$el.on 'click', 'a', (e)->
@@ -279,11 +344,11 @@ class WSF_PAGINATION_CONTROL extends WSF_CONTROL
click: (e)-> click: (e)->
nr = $(e.target).data('nr') nr = $(e.target).data('nr')
if nr == "next" if nr == "next"
trigger_callback(@control_name, "next") @trigger_callback(@control_name, "next")
else if nr == "prev" else if nr == "prev"
trigger_callback(@control_name, "prev") @trigger_callback(@control_name, "prev")
else else
trigger_callback(@control_name, "goto", nr) @trigger_callback(@control_name, "goto", nr)
update: (state) -> update: (state) ->
if state._html? if state._html?
@@ -291,49 +356,25 @@ class WSF_PAGINATION_CONTROL extends WSF_CONTROL
class WSF_GRID_CONTROL extends WSF_CONTROL class WSF_GRID_CONTROL extends WSF_CONTROL
attach_events: ()-> attach_events: ()->
super
self = @ self = @
update: (state) -> update: (state) ->
if state.datasource? if state.datasource?
window.states[@control_name]['datasource'] = state.datasource @state['datasource'] = state.datasource
if state._body? if state._body?
@$el.find('tbody').html(state._body) @$el.find('tbody').html(state._body)
class WSF_REPEATER_CONTROL extends WSF_CONTROL class WSF_REPEATER_CONTROL extends WSF_CONTROL
attach_events: ()-> attach_events: ()->
super
self = @ self = @
update: (state) -> update: (state) ->
if state.datasource? if state.datasource?
window.states[@control_name]['datasource'] = state.datasource @state['datasource'] = state.datasource
if state._body? if state._body?
@$el.find('.repeater_content').html(state._body) @$el.find('.repeater_content').html(state._body)
console.log state._body console.log state._body
#map class name to effective class
typemap =
"WSF_BUTTON_CONTROL": WSF_BUTTON_CONTROL
"WSF_INPUT_CONTROL": WSF_INPUT_CONTROL
"WSF_TEXTAREA_CONTROL": WSF_TEXTAREA_CONTROL
"WSF_AUTOCOMPLETE_CONTROL": WSF_AUTOCOMPLETE_CONTROL
"WSF_CHECKBOX_CONTROL": WSF_CHECKBOX_CONTROL
"WSF_FORM_ELEMENT_CONTROL": WSF_FORM_ELEMENT_CONTROL
"WSF_HTML_CONTROL": WSF_HTML_CONTROL
"WSF_CHECKBOX_LIST_CONTROL": WSF_CHECKBOX_LIST_CONTROL
"WSF_PROGRESS_CONTROL": WSF_PROGRESS_CONTROL
"WSF_PAGINATION_CONTROL": WSF_PAGINATION_CONTROL
"WSF_GRID_CONTROL": WSF_GRID_CONTROL
"WSF_REPEATER_CONTROL":WSF_REPEATER_CONTROL
#create a js class for each control
for name,state of window.states
#find control DOM element
$el = $('[data-name='+name+']')
#get control type
type = $el.data('type')
#create class
if type? and typemap[type]?
controls[name]=new typemap[type](name,$el)
for name,state of window.states
controls[name]?.attach_events()

View File

@@ -1,6 +1,5 @@
// Generated by CoffeeScript 1.6.1 // Generated by CoffeeScript 1.6.1
(function() { 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 $el, 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_PAGINATION_CONTROL, WSF_PROGRESS_CONTROL, WSF_REGEXP_VALIDATOR, WSF_REPEATER_CONTROL, WSF_TEXTAREA_CONTROL, WSF_VALIDATOR, cache, controls, name, state, template, tmpl, trigger_callback, type, typemap, validatormap, _ref, _ref1, _ref2,
__hasProp = {}.hasOwnProperty, __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; }; __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; };
@@ -24,24 +23,20 @@
} }
}; };
trigger_callback = function(control_name, event, event_parameter) { build_control = function(control_name, state, control) {
return $.ajax({ var $el, type, typeclass;
data: { $el = control.$el.find('[data-name=' + control_name + ']');
control_name: control_name, type = $el.data('type');
event: event, typeclass = null;
event_parameter: event_parameter, try {
states: JSON.stringify(window.states) typeclass = eval(type);
}, } catch (e) {
cache: false typeclass = WSF_CONTROL;
}).done(function(new_states) {
var name, state, _ref;
for (name in new_states) {
state = new_states[name];
if ((_ref = controls[name]) != null) {
_ref.update(state);
} }
if ((type != null) && (typeclass != null)) {
return new typeclass(control, $el, control_name, state);
} }
}); return null;
}; };
WSF_VALIDATOR = (function() { WSF_VALIDATOR = (function() {
@@ -117,24 +112,120 @@
})(WSF_VALIDATOR); })(WSF_VALIDATOR);
validatormap = {
"WSF_REGEXP_VALIDATOR": WSF_REGEXP_VALIDATOR,
"WSF_MIN_VALIDATOR": WSF_MIN_VALIDATOR,
"WSF_MAX_VALIDATOR": WSF_MAX_VALIDATOR
};
WSF_CONTROL = (function() { WSF_CONTROL = (function() {
function WSF_CONTROL(control_name, $el) { function WSF_CONTROL(parent_control, $el, control_name, fullstate) {
this.control_name = control_name; this.parent_control = parent_control;
this.$el = $el; this.$el = $el;
this.control_name = control_name;
this.fullstate = fullstate;
this.state = this.fullstate.state;
this.load_subcontrols();
return; return;
} }
WSF_CONTROL.prototype.attach_events = function() {}; WSF_CONTROL.prototype.load_subcontrols = function() {
var control_name, state;
if (this.fullstate.controls != null) {
return this.controls = (function() {
var _ref, _results;
_ref = this.fullstate.controls;
_results = [];
for (control_name in _ref) {
state = _ref[control_name];
_results.push(build_control(control_name, state, this));
}
return _results;
}).call(this);
} else {
return this.controls = [];
}
};
WSF_CONTROL.prototype.attach_events = function() {
var control, _i, _len, _ref;
console.log("Attached " + this.control_name);
_ref = this.controls;
for (_i = 0, _len = _ref.length; _i < _len; _i++) {
control = _ref[_i];
if (control != null) {
control.attach_events();
}
}
};
WSF_CONTROL.prototype.update = function(state) {}; WSF_CONTROL.prototype.update = function(state) {};
WSF_CONTROL.prototype.get_state = function() {
return this.state;
};
WSF_CONTROL.prototype.get_control_states = function() {
var control, result, _i, _len, _ref;
result = {};
_ref = this.controls;
for (_i = 0, _len = _ref.length; _i < _len; _i++) {
control = _ref[_i];
if (control != null) {
result[control.control_name] = control.get_full_state();
}
}
return result;
};
WSF_CONTROL.prototype.get_full_state = function() {
return {
"state": this.get_state(),
"controls": this.get_control_states()
};
};
WSF_CONTROL.prototype.process_update = function(new_states) {
var control, _i, _len, _ref, _results;
if (new_states[this.control_name] != null) {
this.update(new_states[this.control_name]);
}
_ref = this.controls;
_results = [];
for (_i = 0, _len = _ref.length; _i < _len; _i++) {
control = _ref[_i];
if (control != null) {
_results.push(control.process_update(new_states));
} else {
_results.push(void 0);
}
}
return _results;
};
WSF_CONTROL.prototype.get_context_state = function() {
if (this.parent_control != null) {
return this.parent_control.get_context_state();
}
return this.get_full_state();
};
WSF_CONTROL.prototype.trigger_callback = function(control_name, event, event_parameter) {
var self;
if (this.parent_control != null) {
return this.parent_control.trigger_callback(control_name, event, event_parameter);
}
self = this;
return $.ajax({
type: 'POST',
url: '?' + $.param({
control_name: control_name,
event: event
}),
data: JSON.stringify(this.get_full_state()),
processData: false,
contentType: 'application/json',
cache: false
}).done(function(new_states) {
return self.process_update(new_states);
});
};
WSF_CONTROL.prototype.on = function(name, callback, context) { WSF_CONTROL.prototype.on = function(name, callback, context) {
if (this._events == null) { if (this._events == null) {
this._events = {}; this._events = {};
@@ -166,6 +257,23 @@
})(); })();
WSF_PAGE_CONTROL = (function(_super) {
__extends(WSF_PAGE_CONTROL, _super);
function WSF_PAGE_CONTROL(fullstate) {
this.fullstate = fullstate;
this.state = this.fullstate.state;
this.parent_control = null;
this.$el = $('[data-name=' + this.state.id + ']');
this.control_name = this.state.id;
this.load_subcontrols();
}
return WSF_PAGE_CONTROL;
})(WSF_CONTROL);
controls = {}; controls = {};
WSF_BUTTON_CONTROL = (function(_super) { WSF_BUTTON_CONTROL = (function(_super) {
@@ -178,6 +286,7 @@
WSF_BUTTON_CONTROL.prototype.attach_events = function() { WSF_BUTTON_CONTROL.prototype.attach_events = function() {
var self; var self;
WSF_BUTTON_CONTROL.__super__.attach_events.apply(this, arguments);
self = this; self = this;
return this.$el.click(function(e) { return this.$el.click(function(e) {
e.preventDefault(); e.preventDefault();
@@ -186,14 +295,14 @@
}; };
WSF_BUTTON_CONTROL.prototype.click = function() { WSF_BUTTON_CONTROL.prototype.click = function() {
if (window.states[this.control_name]['callback_click']) { if (this.state['callback_click']) {
return trigger_callback(this.control_name, 'click'); return this.trigger_callback(this.control_name, 'click');
} }
}; };
WSF_BUTTON_CONTROL.prototype.update = function(state) { WSF_BUTTON_CONTROL.prototype.update = function(state) {
if (state.text != null) { if (state.text != null) {
window.states[this.control_name]['text'] = state.text; this.state['text'] = state.text;
return this.$el.text(state.text); return this.$el.text(state.text);
} }
}; };
@@ -212,6 +321,7 @@
WSF_INPUT_CONTROL.prototype.attach_events = function() { WSF_INPUT_CONTROL.prototype.attach_events = function() {
var self; var self;
WSF_INPUT_CONTROL.__super__.attach_events.apply(this, arguments);
self = this; self = this;
return this.$el.change(function() { return this.$el.change(function() {
return self.change(); return self.change();
@@ -219,9 +329,9 @@
}; };
WSF_INPUT_CONTROL.prototype.change = function() { WSF_INPUT_CONTROL.prototype.change = function() {
window.states[this.control_name]['text'] = this.$el.val(); this.state['text'] = this.$el.val();
if (window.states[this.control_name]['callback_change']) { if (this.state['callback_change']) {
trigger_callback(this.control_name, 'change'); this.trigger_callback(this.control_name, 'change');
} }
return this.trigger('change'); return this.trigger('change');
}; };
@@ -232,7 +342,7 @@
WSF_INPUT_CONTROL.prototype.update = function(state) { WSF_INPUT_CONTROL.prototype.update = function(state) {
if (state.text != null) { if (state.text != null) {
window.states[this.control_name]['text'] = state.text; this.state['text'] = state.text;
return this.$el.val(state.text); return this.$el.val(state.text);
} }
}; };
@@ -263,23 +373,27 @@
WSF_AUTOCOMPLETE_CONTROL.prototype.attach_events = function() { WSF_AUTOCOMPLETE_CONTROL.prototype.attach_events = function() {
var self; var self;
WSF_AUTOCOMPLETE_CONTROL.__super__.attach_events.apply(this, arguments);
self = this; self = this;
this.$el.typeahead({ this.$el.typeahead({
name: this.control_name, name: this.control_name,
template: window.states[this.control_name]['template'], template: this.state['template'],
engine: Mini, engine: Mini,
remote: { remote: {
url: "", url: "",
replace: function(url, uriEncodedQuery) { replace: function(url, uriEncodedQuery) {
window.states[self.control_name]['text'] = self.$el.val(); self.state['text'] = self.$el.val();
return '?' + $.param({ return '?' + $.param({
control_name: self.control_name, control_name: self.control_name,
event: 'autocomplete', event: 'autocomplete',
states: JSON.stringify(window.states) states: JSON.stringify(self.get_context_state())
}); });
}, },
filter: function(parsedResponse) { filter: function(parsedResponse) {
return parsedResponse[self.control_name]['suggestions']; return parsedResponse[self.control_name]['suggestions'];
},
fn: function() {
return self.trigger_callback(self.control_name, 'autocomplete');
} }
} }
}); });
@@ -305,17 +419,18 @@
WSF_CHECKBOX_CONTROL.prototype.attach_events = function() { WSF_CHECKBOX_CONTROL.prototype.attach_events = function() {
var self; var self;
WSF_CHECKBOX_CONTROL.__super__.attach_events.apply(this, arguments);
self = this; self = this;
this.checked_value = window.states[this.control_name]['checked_value']; this.checked_value = this.state['checked_value'];
return this.$el.change(function() { return this.$el.change(function() {
return self.change(); return self.change();
}); });
}; };
WSF_CHECKBOX_CONTROL.prototype.change = function() { WSF_CHECKBOX_CONTROL.prototype.change = function() {
window.states[this.control_name]['checked'] = this.$el.is(':checked'); this.state['checked'] = this.$el.is(':checked');
if (window.states[this.control_name]['callback_change']) { if (this.state['callback_change']) {
trigger_callback(this.control_name, 'change'); this.trigger_callback(this.control_name, 'change');
} }
return this.trigger('change'); return this.trigger('change');
}; };
@@ -326,7 +441,7 @@
WSF_CHECKBOX_CONTROL.prototype.update = function(state) { WSF_CHECKBOX_CONTROL.prototype.update = function(state) {
if (state.text != null) { if (state.text != null) {
window.states[this.control_name]['checked'] = state.checked; this.state['checked'] = state.checked;
return this.$el.prop('checked', state.checked); return this.$el.prop('checked', state.checked);
} }
}; };
@@ -344,20 +459,22 @@
} }
WSF_FORM_ELEMENT_CONTROL.prototype.attach_events = function() { WSF_FORM_ELEMENT_CONTROL.prototype.attach_events = function() {
var self, validator, _i, _len, _ref; var self, validator, validatorclass, _i, _len, _ref;
WSF_FORM_ELEMENT_CONTROL.__super__.attach_events.apply(this, arguments);
self = this; self = this;
this.value_control = controls[window.states[this.control_name]['value_control']]; this.value_control = this.controls[0];
if (this.value_control != null) { if (this.value_control != null) {
this.value_control.on('change', this.change, this); this.value_control.on('change', this.change, this);
} }
this.serverside_validator = false; this.serverside_validator = false;
this.validators = []; this.validators = [];
_ref = window.states[this.control_name]['validators']; _ref = this.state['validators'];
for (_i = 0, _len = _ref.length; _i < _len; _i++) { for (_i = 0, _len = _ref.length; _i < _len; _i++) {
validator = _ref[_i]; validator = _ref[_i];
if (validatormap[validator.name] != null) { try {
this.validators.push(new validatormap[validator.name](this, validator)); validatorclass = eval(validator.name);
} else { this.validators.push(new validatorclass(this, validator));
} catch (e) {
this.serverside_validator = true; this.serverside_validator = true;
} }
} }
@@ -375,7 +492,7 @@
} }
this.showerror(""); this.showerror("");
if (this.serverside_validator) { if (this.serverside_validator) {
trigger_callback(this.control_name, 'validate'); this.trigger_callback(this.control_name, 'validate');
} }
}; };
@@ -418,7 +535,7 @@
WSF_HTML_CONTROL.prototype.update = function(state) { WSF_HTML_CONTROL.prototype.update = function(state) {
if (state.html != null) { if (state.html != null) {
window.states[this.control_name]['html'] = state.html; this.state['html'] = state.html;
return this.$el.html(state.html); return this.$el.html(state.html);
} }
}; };
@@ -436,16 +553,13 @@
} }
WSF_CHECKBOX_LIST_CONTROL.prototype.attach_events = function() { WSF_CHECKBOX_LIST_CONTROL.prototype.attach_events = function() {
var control, name, self; var control, _i, _len, _ref;
self = this; WSF_CHECKBOX_LIST_CONTROL.__super__.attach_events.apply(this, arguments);
this.subcontrols = []; _ref = this.controls;
for (name in controls) { for (_i = 0, _len = _ref.length; _i < _len; _i++) {
control = controls[name]; control = _ref[_i];
if (this.$el.has(control.$el).length > 0) {
this.subcontrols.push(control);
control.on('change', this.change, this); control.on('change', this.change, this);
} }
}
}; };
WSF_CHECKBOX_LIST_CONTROL.prototype.change = function() { WSF_CHECKBOX_LIST_CONTROL.prototype.change = function() {
@@ -455,7 +569,7 @@
WSF_CHECKBOX_LIST_CONTROL.prototype.value = function() { WSF_CHECKBOX_LIST_CONTROL.prototype.value = function() {
var result, subc, _i, _len, _ref; var result, subc, _i, _len, _ref;
result = []; result = [];
_ref = this.subcontrols; _ref = this.controls;
for (_i = 0, _len = _ref.length; _i < _len; _i++) { for (_i = 0, _len = _ref.length; _i < _len; _i++) {
subc = _ref[_i]; subc = _ref[_i];
if (subc.value()) { if (subc.value()) {
@@ -479,6 +593,7 @@
WSF_PROGRESS_CONTROL.prototype.attach_events = function() { WSF_PROGRESS_CONTROL.prototype.attach_events = function() {
var runfetch, self; var runfetch, self;
WSF_PROGRESS_CONTROL.__super__.attach_events.apply(this, arguments);
self = this; self = this;
runfetch = function() { runfetch = function() {
return self.fetch(); return self.fetch();
@@ -487,12 +602,12 @@
}; };
WSF_PROGRESS_CONTROL.prototype.fetch = function() { WSF_PROGRESS_CONTROL.prototype.fetch = function() {
return trigger_callback(this.control_name, 'progress_fetch'); return this.trigger_callback(this.control_name, 'progress_fetch');
}; };
WSF_PROGRESS_CONTROL.prototype.update = function(state) { WSF_PROGRESS_CONTROL.prototype.update = function(state) {
if (state.progress != null) { if (state.progress != null) {
window.states[this.control_name]['progress'] = state.progress; this.state['progress'] = state.progress;
return this.$el.children('.progress-bar').attr('aria-valuenow', state.progress).width(state.progress + '%'); return this.$el.children('.progress-bar').attr('aria-valuenow', state.progress).width(state.progress + '%');
} }
}; };
@@ -522,11 +637,11 @@
var nr; var nr;
nr = $(e.target).data('nr'); nr = $(e.target).data('nr');
if (nr === "next") { if (nr === "next") {
return trigger_callback(this.control_name, "next"); return this.trigger_callback(this.control_name, "next");
} else if (nr === "prev") { } else if (nr === "prev") {
return trigger_callback(this.control_name, "prev"); return this.trigger_callback(this.control_name, "prev");
} else { } else {
return trigger_callback(this.control_name, "goto", nr); return this.trigger_callback(this.control_name, "goto", nr);
} }
}; };
@@ -550,12 +665,13 @@
WSF_GRID_CONTROL.prototype.attach_events = function() { WSF_GRID_CONTROL.prototype.attach_events = function() {
var self; var self;
WSF_GRID_CONTROL.__super__.attach_events.apply(this, arguments);
return self = this; return self = this;
}; };
WSF_GRID_CONTROL.prototype.update = function(state) { WSF_GRID_CONTROL.prototype.update = function(state) {
if (state.datasource != null) { if (state.datasource != null) {
window.states[this.control_name]['datasource'] = state.datasource; this.state['datasource'] = state.datasource;
} }
if (state._body != null) { if (state._body != null) {
return this.$el.find('tbody').html(state._body); return this.$el.find('tbody').html(state._body);
@@ -576,12 +692,13 @@
WSF_REPEATER_CONTROL.prototype.attach_events = function() { WSF_REPEATER_CONTROL.prototype.attach_events = function() {
var self; var self;
WSF_REPEATER_CONTROL.__super__.attach_events.apply(this, arguments);
return self = this; return self = this;
}; };
WSF_REPEATER_CONTROL.prototype.update = function(state) { WSF_REPEATER_CONTROL.prototype.update = function(state) {
if (state.datasource != null) { if (state.datasource != null) {
window.states[this.control_name]['datasource'] = state.datasource; this.state['datasource'] = state.datasource;
} }
if (state._body != null) { if (state._body != null) {
this.$el.find('.repeater_content').html(state._body); this.$el.find('.repeater_content').html(state._body);
@@ -592,38 +709,3 @@
return WSF_REPEATER_CONTROL; return WSF_REPEATER_CONTROL;
})(WSF_CONTROL); })(WSF_CONTROL);
typemap = {
"WSF_BUTTON_CONTROL": WSF_BUTTON_CONTROL,
"WSF_INPUT_CONTROL": WSF_INPUT_CONTROL,
"WSF_TEXTAREA_CONTROL": WSF_TEXTAREA_CONTROL,
"WSF_AUTOCOMPLETE_CONTROL": WSF_AUTOCOMPLETE_CONTROL,
"WSF_CHECKBOX_CONTROL": WSF_CHECKBOX_CONTROL,
"WSF_FORM_ELEMENT_CONTROL": WSF_FORM_ELEMENT_CONTROL,
"WSF_HTML_CONTROL": WSF_HTML_CONTROL,
"WSF_CHECKBOX_LIST_CONTROL": WSF_CHECKBOX_LIST_CONTROL,
"WSF_PROGRESS_CONTROL": WSF_PROGRESS_CONTROL,
"WSF_PAGINATION_CONTROL": WSF_PAGINATION_CONTROL,
"WSF_GRID_CONTROL": WSF_GRID_CONTROL,
"WSF_REPEATER_CONTROL": WSF_REPEATER_CONTROL
};
_ref = window.states;
for (name in _ref) {
state = _ref[name];
$el = $('[data-name=' + name + ']');
type = $el.data('type');
if ((type != null) && (typemap[type] != null)) {
controls[name] = new typemap[type](name, $el);
}
}
_ref1 = window.states;
for (name in _ref1) {
state = _ref1[name];
if ((_ref2 = controls[name]) != null) {
_ref2.attach_events();
}
}
}).call(this);

View File

@@ -12,7 +12,7 @@ inherit
WSF_VALUE_CONTROL [LIST [STRING]] WSF_VALUE_CONTROL [LIST [STRING]]
undefine undefine
load_state, load_state,
read_state, full_state,
read_state_changes read_state_changes
end end

View File

@@ -35,7 +35,7 @@ feature {WSF_PAGE_CONTROL, WSF_CONTROL} -- STATE MANAGEMENT
load_state (new_states: JSON_OBJECT) load_state (new_states: JSON_OBJECT)
-- Select state stored with `control_name` as key -- Select state stored with `control_name` as key
do do
if attached {JSON_OBJECT} new_states.item (control_name) as new_state_obj then if attached {JSON_OBJECT} new_states.item ("state") as new_state_obj then
set_state (new_state_obj) set_state (new_state_obj)
end end
end end
@@ -45,10 +45,11 @@ feature {WSF_PAGE_CONTROL, WSF_CONTROL} -- STATE MANAGEMENT
deferred deferred
end end
read_state (states: JSON_OBJECT) full_state: JSON_OBJECT
-- Add a new entry in the `states` JSON object with the `control_name` as key and the `state` as value -- Return state of object
do do
states.put (state, control_name) create Result.make
Result.put (state, "state")
end end
read_state_changes (states: JSON_OBJECT) read_state_changes (states: JSON_OBJECT)
@@ -62,6 +63,8 @@ feature {WSF_PAGE_CONTROL, WSF_CONTROL} -- STATE MANAGEMENT
state: JSON_OBJECT state: JSON_OBJECT
-- Returns the current state of the Control as JSON. This state will be transfered to the client. -- Returns the current state of the Control as JSON. This state will be transfered to the client.
deferred deferred
ensure
controls_not_defined: not (attached Result.item ("controls"))
end end
state_changes: JSON_OBJECT state_changes: JSON_OBJECT

View File

@@ -13,7 +13,7 @@ inherit
redefine redefine
read_state_changes, read_state_changes,
load_state, load_state,
read_state full_state
end end
WSF_VALIDATABLE WSF_VALIDATABLE
@@ -52,7 +52,9 @@ feature {WSF_PAGE_CONTROL, WSF_CONTROL} -- State management
-- Pass new_states to subcontrols -- Pass new_states to subcontrols
do do
Precursor (new_states) Precursor (new_states)
value_control.load_state (new_states) if attached {JSON_OBJECT} new_states.item ("controls") as ct and then attached {JSON_OBJECT} ct.item (value_control.control_name) as value_state then
value_control.load_state (value_state)
end
end end
set_state (new_state: JSON_OBJECT) set_state (new_state: JSON_OBJECT)
@@ -61,11 +63,14 @@ feature {WSF_PAGE_CONTROL, WSF_CONTROL} -- State management
value_control.set_state (new_state) value_control.set_state (new_state)
end end
read_state (states: JSON_OBJECT) full_state: JSON_OBJECT
-- Read states in subcontrols local
controls_state: JSON_OBJECT
do do
Precursor (states) Result := Precursor
value_control.read_state (states) create controls_state.make
controls_state.put (value_control.full_state, value_control.control_name)
Result.put (controls_state, "controls")
end end
read_state_changes (states: JSON_OBJECT) read_state_changes (states: JSON_OBJECT)

View File

@@ -11,7 +11,7 @@ inherit
WSF_CONTROL WSF_CONTROL
redefine redefine
read_state, full_state,
read_state_changes, read_state_changes,
load_state load_state
end end
@@ -40,11 +40,15 @@ feature {WSF_PAGE_CONTROL, WSF_CONTROL} -- State management
-- Pass new_states to subcontrols -- Pass new_states to subcontrols
do do
Precursor (new_states) Precursor (new_states)
if attached {JSON_OBJECT} new_states.item ("controls") as ct then
across across
controls as c controls as c
loop loop
if attached {WSF_CONTROL} c.item as cont then if attached {WSF_CONTROL} c.item as cont then
cont.load_state (new_states) if attached {JSON_OBJECT} ct.item (cont.control_name) as value_state then
cont.load_state (value_state)
end
end
end end
end end
end end
@@ -54,17 +58,21 @@ feature {WSF_PAGE_CONTROL, WSF_CONTROL} -- State management
do do
end end
read_state (states: JSON_OBJECT) full_state: JSON_OBJECT
-- Read states in subcontrols -- Read states in subcontrols
local
controls_state: JSON_OBJECT
do do
Precursor (states) Result := Precursor
create controls_state.make
across across
controls as c controls as c
loop loop
if attached {WSF_CONTROL} c.item as cont then if attached {WSF_CONTROL} c.item as cont then
cont.read_state (states) controls_state.put (cont.full_state, cont.control_name)
end end
end end
Result.put (controls_state, "controls")
end end
read_state_changes (states: JSON_OBJECT) read_state_changes (states: JSON_OBJECT)

View File

@@ -47,21 +47,24 @@ feature -- Implementation
local local
event: detachable STRING event: detachable STRING
event_parameter: detachable STRING event_parameter: detachable STRING
control_name: detachable STRING event_control_name: detachable STRING
states: detachable STRING states: STRING
states_changes: JSON_OBJECT states_changes: JSON_OBJECT
json_parser: JSON_PARSER json_parser: JSON_PARSER
do do
control_name := get_parameter ("control_name") event_control_name := get_parameter ("control_name")
event := get_parameter ("event") event := get_parameter ("event")
event_parameter := get_parameter ("event_parameter") event_parameter := get_parameter ("event_parameter")
states := get_parameter ("states") if attached event and attached event_control_name and attached control then
if attached event and attached control_name and attached control and attached states then create states.make_empty
request.read_input_data_into (states)
create json_parser.make_parser (states) create json_parser.make_parser (states)
if attached {JSON_OBJECT} json_parser.parse_json as sp then if attached {JSON_OBJECT} json_parser.parse_json as sp then
control.load_state (sp) 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
control.handle_callback (control_name, event, event_parameter) end
control.handle_callback (event_control_name, event, event_parameter)
create states_changes.make create states_changes.make
control.read_state_changes (states_changes) control.read_state_changes (states_changes)
response.put_header ({HTTP_STATUS_CODE}.ok, <<["Content-Type", "application/json; charset=ISO-8859-1"]>>) response.put_header ({HTTP_STATUS_CODE}.ok, <<["Content-Type", "application/json; charset=ISO-8859-1"]>>)
@@ -82,16 +85,14 @@ feature -- Implementation
data := "<html><head>" data := "<html><head>"
data.append ("<link href=%"/bootstrap.min.css%" rel=%"stylesheet%">") data.append ("<link href=%"/bootstrap.min.css%" rel=%"stylesheet%">")
data.append ("<link href=%"/widget.css%" rel=%"stylesheet%">") data.append ("<link href=%"/widget.css%" rel=%"stylesheet%">")
data.append ("</head><body>") data.append ("</head><body data-name=%"" + control_name + "%" data-type=%"WSF_PAGE_CONTROL%">")
data.append (control.render) data.append (control.render)
data.append ("<script type=%"text/javascript%">window.states=")
create states.make
control.read_state (states)
data.append (states.representation)
data.append (";</script>")
data.append ("<script src=%"/jquery.min.js%"></script>") data.append ("<script src=%"/jquery.min.js%"></script>")
data.append ("<script src=%"/typeahead.min.js%"></script>") data.append ("<script src=%"/typeahead.min.js%"></script>")
data.append ("<script src=%"/widget.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>") data.append ("</body></html>")
create page.make create page.make
page.put_header ({HTTP_STATUS_CODE}.ok, <<["Content-Type", "text/html; charset=ISO-8859-1"]>>) page.put_header ({HTTP_STATUS_CODE}.ok, <<["Content-Type", "text/html; charset=ISO-8859-1"]>>)
@@ -99,6 +100,28 @@ feature -- Implementation
response.send (page) response.send (page)
end end
control_name: 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")
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
get_parameter (key: STRING): detachable STRING get_parameter (key: STRING): detachable STRING
-- Read query parameter as string -- Read query parameter as string
local local