$(document).ready(function(){
 var gender = [/*Dependent On: 1_design */  
  /*  gender  */
    {'When': 'baby_face','Value': 'boy','Text': 'boy'},
	{'When': 'baby_face','Value': 'girl','Text': 'girl'},
	{'When': 'birdie','Value': '','Text': ''},
	{'When': 'elephant','Value': '','Text': ''},
	{'When': 'goldfish','Value': '','Text': ''},
	{'When': 'ladybug','Value': '','Text': ''},
	{'When': 'puppy','Value': '','Text': ''},
	 ];
 var skin = [/*Dependent On: 1_design */  
  /*  skin  */
    {'When': 'baby_face','Value': 'dark','Text': 'dark'},
	{'When': 'baby_face','Value': 'fair','Text': 'fair'},
	{'When': 'baby_face','Value': 'light','Text': 'light'},
	{'When': 'birdie','Value': '','Text': ''},
	{'When': 'elephant','Value': '','Text': ''},
	{'When': 'goldfish','Value': '','Text': ''},
	{'When': 'ladybug','Value': '','Text': ''},
	{'When': 'puppy','Value': '','Text': ''},
	 ];
 var color = [/*Dependent On: 1_design */  
  /*  elephant and birdie  */
    {'When': 'elephant','Value': 'blue','Text': 'blue'},
	{'When': 'elephant','Value': 'mint_green','Text': 'mint green'},
	{'When': 'elephant','Value': 'pink','Text': 'pink'},
	{'When': 'elephant','Value': 'yellow','Text': 'yellow'},
	{'When': 'birdie','Value': 'blue','Text': 'blue'},
	{'When': 'birdie','Value': 'mint_green','Text': 'mint green'},
	{'When': 'birdie','Value': 'pink','Text': 'pink'},
	{'When': 'birdie','Value': 'yellow','Text': 'yellow'},
	
	{'When': 'baby_face','Value': '','Text': ''},
	{'When': 'goldfish','Value': 'default','Text': 'default'},
	{'When': 'ladybug','Value': 'default','Text': 'default'},
	{'When': 'puppy','Value': 'default','Text': 'default'},
	 ];
	 /* Connect #3_design to #1_design */
    jQuery("#2_gender").cascade("#1_design", {
        list: gender,
        template: commonTemplate,
        match: commonMatch
    }).bind("loaded.cascade", function(){
        var opt = $('#1_design').val();
		if(opt =='baby_face'){
			$('#2_genderdiv').show();
			$('#3_skindiv').show();
			$('#4_colordiv').hide();
		}
		if(opt =='birdie' || opt =='elephant' || opt=='goldfish'|| opt=='ladybug'|| opt=='puppy'){
			$('#2_genderdiv').hide();
			$('#3_skindiv').hide();
			$('#4_colordiv').show();
		}
    });
	jQuery("#3_skin").cascade("#1_design", {
        list: skin,
        template: commonTemplate,
        match: commonMatch
    });
	jQuery("#4_color").cascade("#1_design", {
        list: color,
        template: commonTemplate,
        match: commonMatch
    });
	
	$('#1_design').trigger("change.cascade");
	});