$(document).ready(function(){
 var design = [
 	/* heart */
	{'When': 'VT-1010','Value': 'beach','Text': 'beach'},
	{'When': 'VT-1010','Value': 'butterfly','Text': 'butterfly'},
	{'When': 'VT-1010','Value': 'cake','Text': 'cake'},
	{'When': 'VT-1010','Value': 'damask','Text': 'damask'},
	{'When': 'VT-1010','Value': 'double_happiness','Text': 'double happiness'},
	{'When': 'VT-1010','Value': 'fall','Text': 'fall'},
	{'When': 'VT-1010','Value': 'flowers','Text': 'flowers'},
	{'When': 'VT-1010','Value': 'garden','Text': 'garden'},
	{'When': 'VT-1010','Value': 'photo','Text': 'photo'},
	{'When': 'VT-1010','Value': 'rings','Text': 'rings'},
	{'When': 'VT-1010','Value': 'snowflakes','Text': 'snowflakes'},
	{'When': 'VT-1010','Value': 'vegas','Text': 'vegas'},
	/* round */
	{'When': 'VT-1020','Value': 'beach','Text': 'beach'},
	{'When': 'VT-1020','Value': 'butterfly','Text': 'butterfly'},
	{'When': 'VT-1020','Value': 'cake','Text': 'cake'},
	{'When': 'VT-1020','Value': 'damask','Text': 'damask'},
	{'When': 'VT-1020','Value': 'double_happiness','Text': 'double happiness'},
	{'When': 'VT-1020','Value': 'fall','Text': 'fall'},
	{'When': 'VT-1020','Value': 'flowers','Text': 'flowers'},
	{'When': 'VT-1020','Value': 'garden','Text': 'garden'},
	{'When': 'VT-1020','Value': 'photo','Text': 'photo'},
	{'When': 'VT-1020','Value': 'rings','Text': 'rings'},
	{'When': 'VT-1020','Value': 'snowflakes','Text': 'snowflakes'},
 ];
 var color = [
	{'When': 'beach','Value': 'default','Text': 'default'},					
	{'When': 'butterfly','Value': 'black','Text': 'black'},	{'When': 'butterfly','Value': 'blue','Text': 'blue'},	{'When': 'butterfly','Value': 'green','Text': 'green'},	{'When': 'butterfly','Value': 'pink','Text': 'pink'},	{'When': 'butterfly','Value': 'purple','Text': 'purple'},	{'When': 'butterfly','Value': 'red','Text': 'red'},{'When': 'butterfly','Value': 'yellow','Text': 'yellow'},
	{'When': 'cake','Value': 'black','Text': 'black'},	{'When': 'cake','Value': 'blue','Text': 'blue'},	{'When': 'cake','Value': 'brown','Text': 'brown'},	{'When': 'cake','Value': 'dark_pink','Text': 'dark pink'},	{'When': 'cake','Value': 'light_pink','Text': 'light pink'},	{'When': 'cake','Value': 'purple','Text': 'purple'},
	{'When': 'damask','Value': 'black','Text': 'black'},	{'When': 'damask','Value': 'blue','Text': 'blue'},	{'When': 'damask','Value': 'brown','Text': 'brown'},	{'When': 'damask','Value': 'green','Text': 'green'},	{'When': 'damask','Value': 'pink','Text': 'pink'},	{'When': 'damask','Value': 'purple','Text': 'purple'},{'When': 'damask','Value': 'red','Text': 'red'},{'When': 'damask','Value': 'yellow','Text': 'yellow'},
	{'When': 'double_happiness','Value': 'blue','Text': 'blue'},	{'When': 'double_happiness','Value': 'gray','Text': 'gray'},	{'When': 'double_happiness','Value': 'purple','Text': 'purple'},	{'When': 'double_happiness','Value': 'red','Text': 'red'},		
	{'When': 'fall','Value': 'brown','Text': 'brown'},	{'When': 'fall','Value': 'yellow','Text': 'yellow'},				
	{'When': 'flowers','Value': 'black','Text': 'black'},	{'When': 'flowers','Value': 'blue','Text': 'blue'},	{'When': 'flowers','Value': 'brown','Text': 'brown'},	{'When': 'flowers','Value': 'green','Text': 'green'},	{'When': 'flowers','Value': 'pink','Text': 'pink'},	{'When': 'flowers','Value': 'purple','Text': 'purple'},{'When': 'flowers','Value': 'red','Text': 'red'},{'When': 'flowers','Value': 'yellow','Text': 'yellow'},
	{'When': 'garden','Value': 'multi','Text': 'multi'},	{'When': 'garden','Value': 'orange','Text': 'orange'},	{'When': 'garden','Value': 'red','Text': 'red'},	{'When': 'garden','Value': 'white','Text': 'white'},	{'When': 'garden','Value': 'yellow','Text': 'yellow'},	
	{'When': 'photo','Value': 'default','Text': 'default'},					
	{'When': 'rings','Value': 'green','Text': 'green'},	{'When': 'rings','Value': 'white','Text': 'white'},	{'When': 'rings','Value': 'yellow','Text': 'yellow'},			
	{'When': 'snowflakes','Value': 'dark_blue','Text': 'dark blue'},	{'When': 'snowflakes','Value': 'gray','Text': 'gray'},	{'When': 'snowflakes','Value': 'light_blue','Text': 'light blue'},	{'When': 'snowflakes','Value': 'red','Text': 'red'},		
	{'When': 'vegas','Value': 'default','Text': 'default'},					
 ];
 /* Connect #3_color to #2_design */
	jQuery("#3_design").cascade("#1_shape", {
        list: design,
        template: commonTemplate,
        match: commonMatch
    }).bind("loaded.cascade", function(e, target){
        $('#3_design').trigger("change");
    });
 /* Connect #4_color to #3_design */
	jQuery("#4_color").cascade("#3_design", {
        list: color,
        template: commonTemplate,
        match: commonMatch
   
    });
	 function setMaxLength(element_id, length){
        $(element_id).attr("maxlength", length);
        note = element_id + '_note';
        $(note).html('(up to ' + length + ' characters)');
    }
	 function prepFields(text_lengths){
        if (text_lengths[0]){$('#5_text1div').show();setMaxLength('#5_text1', text_lengths[0]);} else {$('#5_text1div').hide();}
		if (text_lengths[1]){$('#6_text2div').show();setMaxLength('#6_text2', text_lengths[1]);} else {$('#6_text2div').hide();}
		if (text_lengths[2]){$('#7_text3div').show();setMaxLength('#7_text3', text_lengths[2]);} else {$('#7_text3div').hide();}
		if (text_lengths[3]){$('#8_text4div').show();setMaxLength('#8_text4', text_lengths[3]);} else {$('#8_text4div').hide();}
    }
	$("#3_design").bind("change", function(e){
        $('#5_text1,#6_text2,#7_text3,#8_text4').val(''); //set value to none when onchange
        var opt = $('#3_design :selected').val();
        switch (opt) {
		case "beach": prepFields([17,1,16]); break;
		case "butterfly": prepFields([17,26]); break;
		case "cake": prepFields([12,12]); break;
		case "damask": prepFields([17,3,17]); break;
		case "double_happiness": prepFields([17,1]); break;
		case "fall": prepFields([12,10,10]); break;
		case "flowers": prepFields([3,18]); break;
		case "garden": prepFields([10,17,17]); break;
		case "photo": prepFields([17,14]); break;
		case "rings": prepFields([17,17]); break;
		case "snowflakes": prepFields([14,14,16,1]); break;
		case "vegas": prepFields([17]); break;
			}
 	});
});
