From b0e8330a05a5d7a884aa8be5757967b8dcf918fa Mon Sep 17 00:00:00 2001
From: Kaarle Ritvanen <kaarle.ritvanen@datakunkku.fi>
Date: Fri, 6 Dec 2013 11:18:13 +0200
Subject: web client: do dependent field condition checking as part of
 validation

---
 web/client.js | 114 +++++++++++++++++++++++++++++-----------------------------
 1 file changed, 57 insertions(+), 57 deletions(-)

(limited to 'web/client.js')

diff --git a/web/client.js b/web/client.js
index 9bc6329..35f26bd 100644
--- a/web/client.js
+++ b/web/client.js
@@ -82,12 +82,6 @@ $(function() {
 		    _.contains(["collection", "model"], meta.type);
 	    }
 
-	    function match(data, filter) {
-		return _.every(_.map(filter, function(values, key) {
-		    return _.contains(values, data[key]);
-		}));
-	    }
-
 	    
 	    var txnMgr = (function(token, saveRequired) {
 		var txn, changed, invalid;
@@ -141,6 +135,13 @@ $(function() {
 			    return data.data[index(name)];
 			};
 
+			data.match = function(filter) {
+			    if (!filter) return true;
+			    return _.every(_.map(filter, function(values, key) {
+				return _.contains(values, data.data[key]);
+			    }));
+			};
+
 			data.status = function(name) {
 			    var p = join(path, name);
 			    function scan(objs) {
@@ -262,8 +263,7 @@ $(function() {
 							    mpath, field.name
 							);
 							if (field.required &&
-							    match(
-								data.data,
+							    data.match(
 								field.condition
 							    ) &&
 							    !(mmpath in invalid) &&
@@ -437,6 +437,8 @@ $(function() {
 
 	    var Widget = {
 		init: function(data, name, meta, level, editable, removable) {
+		    this.data = data;
+		    this.meta = meta;
 		    this.level = level;
 
 		    var value = data.get(name);
@@ -487,8 +489,28 @@ $(function() {
 
 		setStatus: function(status) {
 		    if (this.el) this.setElStatus(this.el, status);
-		}
-	    }
+		},
+
+		setContainer: function(container) {
+		    this.container = container;
+		    this.setVisible();
+		},
+
+		setVisible: function() {
+		    if (!this.container) return true;
+		    var visible = this.data.match(this.meta.condition);
+		    if (visible) this.container.show();
+		    else this.container.hide();
+		    return visible;
+		},
+
+		depends: function(field) {
+		    if (field.el)
+			field.el.on("validated", _.bind(this.validate, this));
+		},
+
+		validate: function() { this.setVisible(); }
+	    };
 
 
 	    var Field = Object.create(Widget);
@@ -496,7 +518,6 @@ $(function() {
 	    Field.init = function(
 		data, name, meta, level, editable, removable
 	    ) {
-		this.data = data;
 		this.name = name;
 		this.editable = editable && meta.editable;
 
@@ -504,7 +525,8 @@ $(function() {
 		    data, name, meta, level, editable, removable
 		);
 
-		this.onChange(this.validate);
+		if (this.editable)
+		    this.field.change(_.bind(this.validate, this));
 		if (data.status(name) == "invalid") this.validate();
 		
 		return el;
@@ -533,12 +555,8 @@ $(function() {
 		return td;
 	    };
 
-	    Field.onChange = function(cb) {
-		if (this.editable) this.field.change(_.bind(cb, this));
-	    }
-
 	    Field.validate = function() {
-		if (!this.editable) return;
+		if (!this.setVisible() || !this.editable) return;
 
 		this.msg.text("[checking]");
 		statusBar.setError("Validating changes", "validate");
@@ -549,7 +567,8 @@ $(function() {
 		    self.msg.empty()
 		    self.setStatus(self.data.status(self.name));
 		    statusBar.validationReady(txnValid);
-			    
+		    self.el.trigger("validated");
+		    
 		}).fail(function(xhr) {
 		    if (_.isString(xhr)) self.msg.text(xhr);
 		    
@@ -666,7 +685,7 @@ $(function() {
 	    };
 
 	    Inline.render = function(data, meta) {
-		this.data = data;
+		this.reqData = data;
 		var self = this;
 
 		if (data.meta.type == "model") {
@@ -682,34 +701,12 @@ $(function() {
 		    });
 
 		    _.each(data.meta.fields, function(field) {
-			if (field.condition) {
-			    var validate = false;
-			    function change() {
-				var f = self.fields[field.name];
-
-				if (match(
-				    _.object(_.map(
-					self.fields,
-					function(field, name) {
-						return [name, field.widget.get()];
-					    }
-				    )),
-				    field.condition)
-				   ) {
-
-				    if (validate) f.widget.validate();
-				    f.el.show();
-				}
-
-				else f.el.hide();
-			    }
-			    change();
-			    validate = true;
-
+			if (field.condition)
 			    _.each(field.condition, function(values, key) {
-				self.fields[key].widget.onChange(change);
+				self.fields[field.name].depends(
+				    self.fields[key]
+				);
 			    });
-			}
 		    });
 		}
 		
@@ -724,19 +721,21 @@ $(function() {
 		name, meta, label, editable, removable
 	    ) {
 		var widget = Object.create(this.widget(meta));
-		var el = this.appendWidget(
-		    widget.init(
-			this.data,
-			name,
-			meta,
-			this.level,
-			editable,
-			removable
-		    ),
-		    label
+		widget.setContainer(
+		    this.appendWidget(
+			widget.init(
+			    this.reqData,
+			    name,
+			    meta,
+			    this.level,
+			    editable,
+			    removable
+			),
+			label
+		    )
 		);
-		widget.setStatus(this.data.status(name));
-		return {widget: widget, el: el};
+		widget.setStatus(this.reqData.status(name));
+		return widget;
 	    }
 		
 	    Inline.renderCollectionMember = function(name, meta) {
@@ -755,6 +754,7 @@ $(function() {
 	    Inline.wrap = function() { return this.el; };
 
 	    Inline.validate = function() {
+		_.bind(Link.validate, this)();
 		if (this.fields)
 		    _.each(this.fields, function(field) {
 			field.widget.validate();
-- 
cgit v1.2.3