diff --git a/draft/library/wsf_js_widget/kernel/input/wsf_file_control.e b/draft/library/wsf_js_widget/kernel/input/wsf_file_control.e index 64e7b2b0..bc334986 100644 --- a/draft/library/wsf_js_widget/kernel/input/wsf_file_control.e +++ b/draft/library/wsf_js_widget/kernel/input/wsf_file_control.e @@ -19,8 +19,9 @@ create feature {NONE} -- Initialization - make + make (a_removable: BOOLEAN) do + removable := a_removable make_value_control ("input") end @@ -28,9 +29,14 @@ feature {WSF_PAGE_CONTROL, WSF_CONTROL} -- State management set_state (new_state: JSON_OBJECT) -- Restore text from json + local + id: detachable STRING do - if attached {JSON_STRING} new_state.item ("file") as new_name and attached {JSON_STRING} new_state.item ("type") as new_type and attached {JSON_NUMBER} new_state.item ("size") as new_size then - create file.make (new_name.unescaped_string_32, new_type.unescaped_string_32, new_size.item.to_integer_32, VOID); + if attached {JSON_STRING} new_state.item ("file_name") as new_name and attached {JSON_STRING} new_state.item ("file_type") as new_type and attached {JSON_NUMBER} new_state.item ("file_size") as new_size then + if attached {JSON_STRING} new_state.item ("file_id") as a_id then + id := a_id.unescaped_string_32 + end + create file.make (new_name.unescaped_string_32, new_type.unescaped_string_32, new_size.item.to_integer_32, id); end end @@ -45,6 +51,7 @@ feature {WSF_PAGE_CONTROL, WSF_CONTROL} -- State management Result.put_integer (f.size, "file_size") Result.put_string (f.id, "file_id") end + Result.put_boolean (removable, "removable") end feature -- Event handling @@ -55,6 +62,12 @@ feature -- Event handling change_event := e end + set_upload_done_event (e: attached like upload_done_event) + -- Set text change event handle + do + upload_done_event := e + end + set_upload_function (e: attached like upload_function) -- Set button click event handle do @@ -63,18 +76,28 @@ feature -- Event handling handle_callback (cname: LIST [STRING]; event: STRING; event_parameter: detachable ANY) local - a_file: WSF_FILE + f_name: detachable STRING + f_type: detachable STRING + f_size: detachable INTEGER + f_id: detachable STRING do if Current.control_name.same_string (cname [1]) then if attached change_event as cevent and event.same_string ("change") then cevent.call (Void) - elseif attached upload_function as ufunction and event.same_string ("uploadfile") and attached {ITERABLE [WSF_UPLOADED_FILE]} event_parameter as files then + elseif event.same_string ("uploadfile") and attached {ITERABLE [WSF_UPLOADED_FILE]} event_parameter as files then if attached file as f then - a_file := f - else - create a_file.make ("", "", 0, VOID) + if attached upload_function as ufunction then + f.set_id (ufunction.item ([files])) + end + f_name := f.name + f_type := f.type + f_size := f.size + f_id := f.id end - a_file.set_id (ufunction.item ([files])) + state_changes.replace_with_string (f_name, "file_name") + state_changes.replace_with_string (f_type, "file_type") + state_changes.replace_with_integer (f_size, "file_size") + state_changes.replace_with_string (f_id, "file_id") end end end @@ -104,12 +127,18 @@ feature -- Implementation feature -- Properties + removable: BOOLEAN + -- Defines if a file can be removed once it is uploaded + file: detachable WSF_FILE -- Text to be displayed change_event: detachable PROCEDURE [ANY, TUPLE] -- Procedure to be execued on change + upload_done_event: detachable PROCEDURE [ANY, TUPLE] + -- Procedure to be execued when upload was successful + upload_function: detachable FUNCTION [ANY, TUPLE [ITERABLE [WSF_UPLOADED_FILE]], detachable STRING] -- Store uploaded file and return server side file id diff --git a/examples/widgetapp/assets/widget.coffee b/examples/widgetapp/assets/widget.coffee index 0e7f7cc0..5830a1a8 100644 --- a/examples/widgetapp/assets/widget.coffee +++ b/examples/widgetapp/assets/widget.coffee @@ -166,6 +166,7 @@ class WSF_CONTROL @controls=(build_control(control_name, state, @) for control_name, state of @fullstate.controls) else @controls = [] + return attach_events: ()-> console.log "Attached #{@control_name}" @@ -190,6 +191,7 @@ class WSF_CONTROL fn(action) catch e console.log "Failed preforming action #{action.type}" + return process_update: (new_states)-> try @@ -204,8 +206,6 @@ class WSF_CONTROL return return - - get_context_state : ()-> if @parent_control? and not @isolation return @parent_control.get_context_state() @@ -372,6 +372,8 @@ class WSF_FILE_CONTROL extends WSF_CONTROL @uploading = false start_upload: ()-> + if @$el[0].files.length==0 + return if @uploading return @uploading = true @@ -415,14 +417,15 @@ class WSF_FILE_CONTROL extends WSF_CONTROL change: ()-> #update local state - @state['file'] = null - @state['type'] = null - @state['size'] = null + @state['file_name'] = null + @state['file_type'] = null + @state['file_size'] = null + @state['file_id'] = null if @$el[0].files.length>0 file = @$el[0].files[0] - @state['file'] = file.name - @state['type'] = file.type - @state['size'] = file.size + @state['file_name'] = file.name + @state['file_type'] = file.type + @state['file_size'] = file.size if @state['callback_change'] @trigger_callback(@control_name, 'change') @trigger('change') @@ -431,10 +434,39 @@ class WSF_FILE_CONTROL extends WSF_CONTROL return @$el.val() update: (state) -> - if state.upload_file? - @progressbar.hide() - @$el.parent().append($("""
""").addClass("form-control-static").text(@state['file'])) - @state['upload_file'] = state.upload_file + if state.removable != undefined + @state['removable'] = state.removable + if state.file_name != undefined + @state['file_name'] = state.file_name + if state.file_type != undefined + @state['file_type'] = state.file_type + if state.file_size != undefined + @state['file_size'] = state.file_size + if state.file_id != undefined + @uploading = false + @progressbar.remove() + @state['file_id'] = state.file_id + @$el.parent().find("p").remove() + if state.file_id!=null + @$el.hide() + fname = $("""""").addClass("form-control-static").text(@state['file_name']) + @$el.parent().append(fname) + if @state['removable'] + fname.append(" "); + btn = $("").text("Remove").addClass("btn btn-xs btn-danger") + self = @ + btn.click ()-> + self.progressbar.remove() + self.$el.parent().find("p").remove() + self.$el.show() + self.$el.val('') + self.change() + fname.append(btn) + else + @$el.show() + @$el.val('') + @change() + class WSF_PASSWORD_CONTROL extends WSF_INPUT_CONTROL diff --git a/examples/widgetapp/assets/widget.js b/examples/widgetapp/assets/widget.js index 2dac6b4d..40e9d2a2 100644 --- a/examples/widgetapp/assets/widget.js +++ b/examples/widgetapp/assets/widget.js @@ -263,7 +263,7 @@ WSF_CONTROL = (function() { WSF_CONTROL.prototype.load_subcontrols = function() { var control_name, state; if (this.fullstate.controls != null) { - return this.controls = (function() { + this.controls = (function() { var _ref, _results; _ref = this.fullstate.controls; _results = []; @@ -274,7 +274,7 @@ WSF_CONTROL = (function() { return _results; }).call(this); } else { - return this.controls = []; + this.controls = []; } }; @@ -293,24 +293,22 @@ WSF_CONTROL = (function() { WSF_CONTROL.prototype.update = function(state) {}; WSF_CONTROL.prototype.process_actions = function(actions) { - var action, fn, _i, _len, _results; - _results = []; + var action, fn, _i, _len; for (_i = 0, _len = actions.length; _i < _len; _i++) { action = actions[_i]; try { fn = null; if (this[action.type] != null) { fn = this[action.type]; - _results.push(fn.call(this, action)); + fn.call(this, action); } else { fn = eval(action.type); - _results.push(fn(action)); + fn(action); } } catch (e) { - _results.push(console.log("Failed preforming action " + action.type)); + console.log("Failed preforming action " + action.type); } } - return _results; }; WSF_CONTROL.prototype.process_update = function(new_states) { @@ -613,6 +611,9 @@ WSF_FILE_CONTROL = (function(_super) { WSF_FILE_CONTROL.prototype.start_upload = function() { var action, file, formData; + if (this.$el[0].files.length === 0) { + return; + } if (this.uploading) { return; } @@ -665,14 +666,15 @@ WSF_FILE_CONTROL = (function(_super) { WSF_FILE_CONTROL.prototype.change = function() { var file; - this.state['file'] = null; - this.state['type'] = null; - this.state['size'] = null; + this.state['file_name'] = null; + this.state['file_type'] = null; + this.state['file_size'] = null; + this.state['file_id'] = null; if (this.$el[0].files.length > 0) { file = this.$el[0].files[0]; - this.state['file'] = file.name; - this.state['type'] = file.type; - this.state['size'] = file.size; + this.state['file_name'] = file.name; + this.state['file_type'] = file.type; + this.state['file_size'] = file.size; } if (this.state['callback_change']) { this.trigger_callback(this.control_name, 'change'); @@ -685,10 +687,46 @@ WSF_FILE_CONTROL = (function(_super) { }; WSF_FILE_CONTROL.prototype.update = function(state) { - if (state.upload_file != null) { - this.progressbar.hide(); - this.$el.parent().append($("").addClass("form-control-static").text(this.state['file'])); - return this.state['upload_file'] = state.upload_file; + var btn, fname, self; + if (state.removable !== void 0) { + this.state['removable'] = state.removable; + } + if (state.file_name !== void 0) { + this.state['file_name'] = state.file_name; + } + if (state.file_type !== void 0) { + this.state['file_type'] = state.file_type; + } + if (state.file_size !== void 0) { + this.state['file_size'] = state.file_size; + } + if (state.file_id !== void 0) { + this.uploading = false; + this.progressbar.remove(); + this.state['file_id'] = state.file_id; + this.$el.parent().find("p").remove(); + if (state.file_id !== null) { + this.$el.hide(); + fname = $("").addClass("form-control-static").text(this.state['file_name']); + this.$el.parent().append(fname); + if (this.state['removable']) { + fname.append(" "); + btn = $("").text("Remove").addClass("btn btn-xs btn-danger"); + self = this; + btn.click(function() { + self.progressbar.remove(); + self.$el.parent().find("p").remove(); + self.$el.show(); + self.$el.val(''); + return self.change(); + }); + return fname.append(btn); + } + } else { + this.$el.show(); + this.$el.val(''); + return this.change(); + } } }; diff --git a/examples/widgetapp/upload_page.e b/examples/widgetapp/upload_page.e index b0437cad..cbe9b137 100644 --- a/examples/widgetapp/upload_page.e +++ b/examples/widgetapp/upload_page.e @@ -26,15 +26,14 @@ feature -- Implementation control.add_control (create {WSF_BASIC_CONTROL}.make_with_body ("h1", "", "File Upload Demo")) create form.make --File - create filebox.make + create filebox.make (true) filebox.set_upload_function (agent upload_file) create n0_container.make ("File Upload", filebox) n0_container.add_validator (create {WSF_FILESIZE_VALIDATOR}.make (10000000, "File must be smaller than 10MB")) form.add_control (n0_container) --File - create filebox2.make + create filebox2.make (true) create n1_container.make ("Auto start Upload", filebox2) - filebox2.set_upload_function (agent upload_file) filebox2.set_change_event (agent do n1_container.validate