jQuery(function($) {
	$('.imgov1 img').click(function() {
	$('.imgov1 img').removeClass("alpha");
	var img = $(this);
	$(img).addClass("alpha");

	});
	
	$('.imgov2 img').click(function() {
	$('.imgov2 img').removeClass("alpha");
	var img = $(this);
	$(img).addClass("alpha");

	});

	$('.imgov3 img').click(function() {
	$('.imgov3 img').removeClass("alpha");
	var img = $(this);
	$(img).addClass("alpha");
	
	});

});


function search_db(){
		  
  	var h_chk = $("input[name=height]:checked").val();
	$("#height").val(h_chk);
	var w_chk = $("input[name=width]:checked").val();
	$("#width").val(w_chk);
	var d_chk = $("input[name=depth]:checked").val();
	$("#depth").val(d_chk);
	
	if(h_chk==null || w_chk==null || d_chk==null){
		alert("高さ・横幅・奥行を全て選択して下さい");
	}else{
	var targetOffset = $('#form1').offset().top;
	$('html,body').animate({scrollTop: targetOffset}, 1000);
	
	var height =$("#height").val();
	var width = $("#width").val();
	var depth = $("#depth").val();
	var step = 4;
	var type = 0;
	var color = 0;
	var size_c = $("input[name=height]:checked").attr("id")+$("input[name=width]:checked").attr("id")+"_";
	var sel_size ="高さ"+height+"mm×横幅"+width+"mm×奥行"+depth+"mm";
	var price_cm;
	$("#sel_s").html(sel_size);	
	$.getJSON(
		"js/ajax.php",
		{                                                       
	        "height": height,            
	        "width": width,         
	        "depth": depth,
	        "step": step,
			"type": type,
			"color": color
    	},
		function(data,status){
			    var rows = "";
				
				var stp_box="";
				stp_box += "<option value='2'>2段</option>";
				stp_box += "<option value='3'>3段</option>";
        		stp_box += "<option value='4' selected>4段</option>";
        		stp_box += "<option value='5'>5段</option>";
		        stp_box += "<option value='6'>6段</option>";
		        stp_box += "<option value='7'>7段</option>";
		        stp_box += "<option value='8'>8段</option>";
		        stp_box += "<option value='9'>9段</option>";
		      	stp_box += "<option value='10'>10段</option>";
		      	stp_box += "</select>";
								
				
                    //テーブルとして表示するため、htmlを構築
                    for (i = 0; i < data.length; i++) {
						price_cm=addFigure(data[i].price02);
                        rows += "<div>";
                            rows += "<p class='mod_tb' >";
                            rows += "<img src='http://taiyou-outlet.com/user_data/packages/default/img/est/" + data[i].model + ".jpg' />"
                            rows += "</p>";
                            rows += "<p class='link_tb' >";
							rows += "<a class='alpha2' href='http://taiyou-outlet.com/products/detail.php?product_id=" + data[i].product_id + "' id='product_link"+ i +"'><img src='http://taiyou-outlet.com/user_data/packages/default/img/est/i_link.jpg'></a><br /><a class='alpha2' id='size_link"+ i +"' href='http://taiyou-outlet.com/user_data/packages/default/img/sizepic/"+data[i].model+size_c+"s_4.gif' target='_blank'><img src='http://taiyou-outlet.com/user_data/packages/default/img/est/i_size.jpg' /></a>"
							rows += "</p>";
                            rows += "<p class='step_tb' id='r_stp" + i + "'>";
                            rows += "<select name='clcategory_id1' id='step" + i +"' name='step' onchange='search_db_nx("+i+")'>;"
                            rows += stp_box;
                            rows += "</p>";
                            rows += "<p class='type_tb'>";
                            rows += "<select name='type' id='type" + i + "' onchange='search_db_nx("+i+")'>";

								if(data[i].model==120 || data[i].model==150){
									rows += "<option value='0'>単体</option>";
									}
								else{
									rows += "<option value='0'>単体</option>";
									rows += "<option value='1'>増連</option>";
									}
                            rows += "</select>";
                            rows += "</p>";
                           	rows += "<p class='color_tb' id='r_col" + i + "'>";
							rows += "<select name='clcategory_id2' id='color" + i + "' onchange='search_db_nx("+i+")'>";
								if(data[i].model==120 || data[i].model==150|| data[i].model==200){
									rows += "<option value='0'>グレー</option>";
									}
								else{
									rows += "<option value='0'>グレー</option>";
									rows += "<option value='1'>グリーン</option>";
									}
                            rows += "</select>";
                            rows += "</p>";
                            rows += "<p class='price_tb'>";
                            rows += "<span class='pr' id='r_pri" + i + "'>"+price_cm + "</span>円<br />（税込／送料込）";
                            rows += "</p>";
                            rows += "<p class='cart_tb'>";
					        rows += "<a class='alpha2' href='javascript:cart_in("+i+")'><img src='http://taiyou-outlet.com/user_data/packages/default/img/est/cartin.jpg' alt='カートに追加' /></a>"
							rows += "<input type='hidden' value='" + data[i].model + "' id='r_mod" + i + "' />"
							rows += "<input type='hidden' value='" + data[i].product_id + "' id='p_id"+i+"' />"
							rows += "<input type='hidden' value='" + data[i].product_class_id + "' id='pc_id"+i+"' />"
                            rows += "</p>";
                       	 	rows += "</div>";
                    }
                    
                    //テーブルに作成したhtmlを追加する
                    $("#result div").remove();
                    $("#result").append(rows);
					$("#result_tb2").find("div:gt(0)").attr("style","display:none"); 
					$("#result_tb2").find("div:gt(0)").fadeIn("slow")
  	
                });
	}
}


function search_db_nx(num){
	
	var height = $('#height').val();
	var width = $('#width').val();
	var depth = $('#depth').val();
	var step = $('#step' + num).val();
	var type = $('#type' + num).val();
	var type_a
	switch(type){
		case "0" : type_a="s";break;
		case "1" : type_a="a";break;
	}
	
	var color = $('#color' + num).val();
	var model = $('#r_mod' + num).val();
	var size_c = $("input[name=height]:checked").attr("id")+$("input[name=width]:checked").attr("id")+"_";
	
	$.getJSON(
		"js/ajax.php",
		{                                                       
	        "model":model,
			"height": height,            
	        "width": width,         
	        "depth": depth,
	        "step": step,
			"type": type,
			"color": color
    	},
		function(data,status){
			
				$("#product_link" + num).attr("href","http://www.taiyou-outlet.com/products/detail.php?product_id="+data[0].product_id);
				$("#size_link" + num).attr("href","http://www.taiyou-outlet.com/user_data/packages/default/img/sizepic/"+model+size_c+type_a+"_"+step+".gif");
				$("#r_pri" + num).html(addFigure(data[0].price02));
				$("#p_id" + num).attr("value",data[0].product_id);
				$("#pc_id" + num).attr("value",data[0].product_class_id);
		});
}


function cart_in(num){

	var p_id = $("#p_id" + num).val();
	var pc_id = $("#pc_id" + num).val();
	var cc_id1 = $("#step" + num).val();
	var cc_id2 = $("#color" + num).val();
	
	
	$("#form1").attr("action","http://www.taiyou-outlet.com/products/detail.php?product_id="+p_id);
	$("#product_id").attr("value",p_id);
	$("#product_class_id").attr("value",pc_id);
	$("#classcategory_id1").attr("value",cc_id1);
	$("#classcategory_id2").attr("value",cc_id2);
	
	
	$("#form1").submit();
}

function addFigure(str) {

　var num = new String(str).replace(/,/g, "");

　while(num != (num = num.replace(/^(-?\d+)(\d{3})/, "$1,$2")));

　return num;

}