Changeset 1869

Timestamp:

2011-02-24 10:27:55 (15 months ago)

Author:

mpo

Message:

fixes #448 (and adds the tests)
We need to propagate hide and show methods to children of containers to make sure all spread out elements are hidden/shown correctly.

Location:

trunk/modules/kauri-forms/kauri-forms-framework/src

Files:

• main/kauri/static-{build}.key/kauri.forms/control.js (modified) (1 diff)
• test/kauri.forms/test-case.js (modified) (5 diffs)
• test/kauri.forms/test-composite.js (modified) (1 diff)

trunk/modules/kauri-forms/kauri-forms-framework/src/main/kauri/static-{build}.key/kauri.forms/control.js

@@ -2135 +2135 @@
     
     
-    
+    AbstractContainerControl.prototype.hide = function(){
+        this.eachChild(function(i, child){ child.hide();});
+        this['<super.call>']('hide');
+    }
+    
+    AbstractContainerControl.prototype.show = function(){
+        this.eachChild(function(i, child){ child.show();});
+        this['<super.call>']('show');
+    }
+
     AbstractContainerControl.prototype.disable = function() {
-        this.eachChild(AbstractContainerControl.childDisabler);
+        this.eachChild(function(i, child){ child.disable();});
         this['<super.call>']('disable');
     };
-    AbstractContainerControl.childDisabler = function(i, child){
-        child.disable();
-    }; 
     
     AbstractContainerControl.prototype.enable = function() {
-        this.eachChild(AbstractContainerControl.childEnabler);
+        this.eachChild(function(i, child){ child.enable();});
         this['<super.call>']('enable');
-    };
-    AbstractContainerControl.childEnabler = function(i, child){
-        child.enable();
     };
     

trunk/modules/kauri-forms/kauri-forms-framework/src/test/kauri.forms/test-case.js

@@ -9 +9 @@
     var id = "tcase";
     var fconf = { "members": {}};
-    fconf.members[id] = {
-        base : 'case', 
+    fconf.members[id] = { base : 'case', 
         cases : {
             "c1" : 'integer',
-            "c2" : 'boolean'
+            "c2" : 'boolean', 
+            "c3" : { base: 'composite',
+                members: { "a": "string", "b": "string" }
+            }
         }
     };
@@ -27 +29 @@
     var $c1 = $('<input kauri-idref="case-c1" ><span kauri-idref="case-c1" kauri-role="messages">init</span>').appendTo($case);
     var $c2 = $('<input kauri-idref="case-c2" type="checkbox" ><span kauri-idref="case-c2" kauri-role="messages">init</span>').appendTo($cas2);
+    var $c3a = $('<input kauri-idref="case-c3/a">').appendTo($case);
+    var $c3b = $('<div kauri-idref="case-c3"><input kauri-idref="b" /></div>').appendTo($cas2);
+    
+    // Note: the composite case c3 was added to check for the side effects of #448
+    // While it should just work: using this in a case might be indication that you should switch to actually using eventhandlers
     
     var $msg = $("<span kauri-role='messages'/>").appendTo($case);
@@ -33 +40 @@
 
     // test
-    expect(9);
+    expect(17);
     
     // verify creation of control
@@ -46 +53 @@
     ok($c1.is(':visible'), "the first member should be visible");
     ok($c2.is(':hidden'), "the second member should be hidden");
+    ok($c3a.is(':hidden'), "the third a-member should be hidden");
+    ok($c3b.is(':hidden'), "the third b-member should be hidden");
     
     var $c1Msg = form.findControl(id + "/case-c1").getElement("messages");
@@ -57 +66 @@
     ok($c1.is(':hidden'), "the first member should be hidden");
     ok($c2.is(':visible'), "the second member should be visible");
-    
+    ok($c3a.is(':hidden'), "the third a-member should be hidden");
+    ok($c3b.is(':hidden'), "the third b-member should be hidden");
+
+    c.setValue( { "case" : "c3", value : {a: "one", b: "two"}});
+
+    ok($c1.is(':hidden'), "the first member should be hidden");
+    ok($c2.is(':hidden'), "the second member should be hidden");
+    ok($c3a.is(':visible'), "the third a-member should be visible");
+    ok($c3b.is(':visible'), "the third b-member should be visible");
+
     // cleanup
     $main.html("").hide();

trunk/modules/kauri-forms/kauri-forms-framework/src/test/kauri.forms/test-composite.js

@@ -149 +149 @@
     $main.html("").hide();
 });
+
+
+test("composite with split HTML should hide/show all parts", function() {
+    // create
+    var $main = $('#main').show();
+    
+    // init form
+    var id = "tcomp3";
+
+    var fconf = { "members": {}};
+    fconf.members[id] = { "base": "composite",
+        "members" : { "m1" : "string", "m2" : "string" , "m3" : "string"}
+    };    
+    
+    var $form = $('<form />').appendTo($main);
+    var $compo1 = $('<div kauri-idref="' + id + '" ></div>)').appendTo($form);        
+    var $compo2 = $('<div></div>)').appendTo($form);        
+    var $compo3 = $('<div kauri-idref="' + id + '" ></div>)').appendTo($form);        
+    var $m1 = $('<input kauri-idref="m1" ><span kauri-idref="m1" kauri-role="messages">init</span>').appendTo($compo1);
+    var $m2 = $('<input kauri-idref="'+id+'/m2" ><span kauri-idref="'+id+'/m2" kauri-role="messages">init</span>').appendTo($compo2);
+    var $m3 = $('<input kauri-idref="m3" ><span kauri-idref="m3" kauri-role="messages">init</span>').appendTo($compo3);
+    
+    var form = new $.org.kauriproject.forms.Form($form, fconf);
+    
+    // start test
+    expect(15);
+
+
+    // verify creation of control
+    var c = form.findControl(id);
+    ok(c != null, "control creation passed");
+    equals(c.getForm(), form, "control form ok");
+    equals(c.getId(), id, "control id checked");
+
+    debugger;
+    c.hide();
+    ok($compo1.is(':hidden'),  "m1 container is associated to the composite and should be hidden");
+    ok($compo2.is(':visible'), "m2 container is not associated to the composite and should always be visible");
+    ok($compo3.is(':hidden'),  "m3 container is associated to the composite and should be hidden");
+    ok($m1.is(':hidden'), "m1 member should be hidden");
+    ok($m2.is(':hidden'), "m2 member should be hidden");
+    ok($m3.is(':hidden'), "m3 member should be hidden");
+
+    c.show();
+    ok($compo1.is(':visible'), "m1 container is associated to the composite and should always be visible");
+    ok($compo2.is(':visible'), "m2 container is not associated to the composite and should be visible");
+    ok($compo3.is(':visible'), "m1 container is associated to the composite and should always be visible");
+    ok($m1.is(':visible'), "m1 member should be visible");
+    ok($m2.is(':visible'), "m2 member should be visible");
+    ok($m3.is(':visible'), "m3 member should be visible");
+    
+    // cleanup
+    $main.html("").hide();
+});