diff options
author | Kaarle Ritvanen <kaarle.ritvanen@datakunkku.fi> | 2013-09-27 11:03:40 +0300 |
---|---|---|
committer | Kaarle Ritvanen <kaarle.ritvanen@datakunkku.fi> | 2013-09-27 16:37:41 +0300 |
commit | 4f2ade31ad0071511911b8a2575ee63235d9bce1 (patch) | |
tree | 913c0460cededdee6643da02c5d9a6dd9ed87907 /web | |
parent | c9e69347d7b60c5118000201b95ca96b19bf12bd (diff) | |
download | aconf-4f2ade31ad0071511911b8a2575ee63235d9bce1.tar.bz2 aconf-4f2ade31ad0071511911b8a2575ee63235d9bce1.tar.xz |
resolve reference choices on client side
Diffstat (limited to 'web')
-rw-r--r-- | web/client.js | 113 |
1 files changed, 72 insertions, 41 deletions
diff --git a/web/client.js b/web/client.js index 1c1bc89..a0449c9 100644 --- a/web/client.js +++ b/web/client.js @@ -383,7 +383,13 @@ $(function() { return el; } - this.el = this.render(value, meta); + this.makeEl(); + + var self = this; + this.requestData(value, meta).done(function(value, meta) { + self.render(value, meta); + self.setStatus(status); + }); var el = this.wrap(); @@ -399,8 +405,6 @@ $(function() { el.append(link); } - this.setStatus(status); - return el; }, @@ -408,6 +412,12 @@ $(function() { el.prop("class", status); }, + makeEl: function() { this.el = this.createEl(); }, + + requestData: function(value, meta) { + return $.Deferred().resolve(value, meta); + }, + wrap: function() { return this.el; }, setStatus: function(status) { @@ -426,8 +436,6 @@ $(function() { ); if (editable) { - if (!this.field) this.field = this.el; - var self = this; function change() { @@ -473,8 +481,15 @@ $(function() { return $("<div>").text(value); }; + Field.makeEl = function() { + _.bind(Widget.makeEl, this)(); + if (!this.field) this.field = this.el; + }; + + Field.createEl = function() { return $("<input>"); }; + Field.render = function(value, meta) { - return $("<input>").attr({type: "text", value: value}); + this.field.attr({type: "text", value: value}); }; Field.wrap = function() { @@ -490,8 +505,10 @@ $(function() { var ComboBox = Object.create(Field); + ComboBox.createEl = function() { return $("<select>"); }; + ComboBox.render = function(value, meta) { - var el = $("<select>"); + var el = this.field; function opt(value, ui_value, selected) { el.append($("<option>").attr( @@ -508,8 +525,6 @@ $(function() { opt(choice[0], choice[1], value == choice[0]); } ); - - return el; } var CheckBox = Object.create(Field); @@ -522,16 +537,16 @@ $(function() { }; CheckBox.render = function(value, meta) { - return $("<input>").attr({type: "checkbox", checked: value}); + this.field.attr({type: "checkbox", checked: value}); }; - CheckBox.get = function() { return this.el.is(":checked"); }; + CheckBox.get = function() { return this.field.is(":checked"); }; var Link = Object.create(Widget); - Link.staticRender = function(value) { - var el = href(); + Link.staticRender = function(value, el) { + el = el || href(); if (value) { el.click(function() { $.bbq.pushState("#" + value); @@ -540,8 +555,10 @@ $(function() { return el; }; + Link.createEl = function() { return href(); }; + Link.render = function(value, meta) { - return this.staticRender(value); + this.staticRender(value, this.el) }; Link.wrap = function() { return $("<td>").html(this.el); }; @@ -554,7 +571,7 @@ $(function() { Inline.init = function( data, name, meta, level, editable, removable ) { - var el = _.bind(Widget.init, this)( + return _.bind(Link.init, this)( data, name, meta, @@ -562,20 +579,19 @@ $(function() { editable, removable ); - this.requestData(data.get(name)); - return el; - } + }; Inline.setStatus = function(status) {}; - Inline.requestData = function(path) { - var self = this; - return txnMgr.query(path).done(function(data) { - self.renderObject(data); + Inline.requestData = function(value, meta) { + var def = $.Deferred(); + txnMgr.query(value).done(function(data) { + def.resolve(data, meta); }); + return def; }; - Inline.renderObject = function(data) { + Inline.render = function(data, meta) { this.data = data; var self = this; @@ -630,9 +646,11 @@ $(function() { var Horizontal = Object.create(Inline); - Horizontal.staticRender = function(value) { + Horizontal.createEl = function() { this.previous = null; - return $("<tr>").html($("<td>").prop("class", "placeholder")); + return $("<tr>").html($("<td>").prop( + "class", "placeholder" + )); }; Horizontal.appendWidget = function(el, label) { @@ -671,11 +689,11 @@ $(function() { var Vertical = Object.create(Inline); - Vertical.staticRender = function(value) { return $("<div>"); }; + Vertical.createEl = function() { return $("<div>"); }; Vertical.wrap = function() { return $("<div>").html(this.el); }; - Vertical.renderObject = function(data) { + Vertical.render = function(data, meta) { this.el.append( $("<h" + this.level + ">").text(data.meta["ui-name"]) ); @@ -686,7 +704,7 @@ $(function() { this.div = $("<div>"); this.el.append(this.div); - _.bind(Inline.renderObject, this)(data); + _.bind(Inline.render, this)(data, meta); var self = this; @@ -778,7 +796,7 @@ $(function() { Reference.init = function( data, name, meta, level, editable, removable ) { - this.field = ComboBox.render(data.get(name), meta); + this.field = ComboBox.createEl(); return _.bind(ComboBox.init, this)( data, name, meta, level, editable, removable ); @@ -792,20 +810,34 @@ $(function() { ComboBox.setElStatus(el.find("select"), status); }; + Reference.createEl = function() { return $("<div>"); }; + + Reference.requestData = function(value, meta) { + var def = $.Deferred(); + txnMgr.query(meta.scope).done(function(data) { + meta.choice = _.values(data.data); + meta["ui-choice"] = _.map(meta.choice, function(path) { + return split(path).pop(); + }); + def.resolve(value, meta); + }); + return def; + }; + Reference.render = function(value, meta) { - var el = $("<div>").html(this.field); - el.append(" "); + _.bind(ComboBox.render, this)(value, meta); + + this.el.html(this.field); + this.el.append(" "); var link = $("<div>"); var update = _.bind(function() { link.html(Link.staticRender(this.get())); }, this); - el.append(link); + this.el.append(link); this.field.change(update); update(); - - return el; }; @@ -821,9 +853,9 @@ $(function() { var Tabular = Object.create(Vertical); - Tabular.renderObject = function(data) { + Tabular.render = function(data, meta) { this.header = true; - _.bind(Vertical.renderObject, this)(data); + _.bind(Vertical.render, this)(data, meta); }; Tabular.widget = function(meta) { @@ -853,13 +885,12 @@ $(function() { var layout = data.meta.widget; var form = Object.create(layout ? layouts[layout] : Vertical); - form.staticRender = function(value) { - return $("#content"); + form.createEl = function() { + return $("#content").empty(); }; form.wrap = function() { return this.el; }; - form.requestData = function(path) { - this.el.empty(); - this.renderObject(data); + form.requestData = function(value, meta) { + return $.Deferred().resolve(data, meta); }; var name = split(path).pop(); |