// カラバリ情報を取得して表示する。
function lnShowColor(target, list_sub_parameter) {
	var id_target = target.parent().find('.ListStageoneboxProductId');
	var id = id_target.text();
	var color_target = target.find('.ListStageoneboxColor:hidden');
	var color_frame = color_target.find('.ColorStageMiddleInbox');

	if (id != "") {
		id_target.empty();

		// 位置の移動
		var image_target = target.find('img');
		var image_offset = image_target.offset();
		color_target.css('left', image_offset.left - 100);
		color_target.css('top', image_offset.top - 50);

		color_frame.append('Loading...');
		color_target.show();
		jQuery.getJSON('/products/list_color.php?id=' + id, function(json, status) {
			if (status != 'success') {
				// 失敗している場合、再試行可能とする。
				id_target.append(id);
				color_frame.empty();
			} else if (json.length > 0) {
				// カラー画像が存在する場合のみ処理
				// 画像の先読み
				var cnt = json.length;
				var n = 0;
				var m = 0;
				var imgList = [];
				jQuery.each(json, function() {
					imgList.push(new Image());
					imgList[n].onload = function() {
						m += 1;
						// 全部読み終えたら更新
						if (cnt == m) {
							// 見えているものがある場合のみ再表示
							var visible_color_target = target.find('.ListStageoneboxColor:visible');

							color_target.css('top', image_offset.top - 89 * Math.ceil(m / 4) - 33);

							color_target.hide();
							color_frame.empty();
							jQuery.each(json, function(lp) {
								var color_frame_html = '';
								color_frame_html += '<div class="colorimage">';
								if (this.stock == 0) {
									color_frame_html += '<span class="colorimage-block"></span>';
								}
								color_frame_html += '<a href="/products/detail.php?product_id=' + id;
								if (list_sub_parameter && list_sub_parameter.length > 0) {
									color_frame_html += '&amp;' + list_sub_parameter;
								}
								color_frame_html += '&amp;from=list_color">';
								//color_frame_html += '<img src="//jun-outlet.jp/vis/upload/save_image/' + this.list_image + '" alt="' + this.name + '" title="' + this.name + '" />';
								color_frame_html += '<img src="/upload/save_image/' + this.list_image + '" alt="' + this.name + '" title="' + this.name + '" />';
								color_frame_html += '</a>';
								color_frame_html += '</div>';
								if (lp % 4 == 3) {
									color_frame_html += '<br />';
								}
								color_frame.append(color_frame_html);
							});
							if (visible_color_target) {
//								visible_color_target.fadeIn(250);
								visible_color_target.show();
							}
						}
					};
					imgList[n].src = '/upload/save_image/' + this.list_image;
					n++;
				});
			} else {
				color_target.hide();
				color_target.empty();
			}
		});
	} else {
		// 内容が空でない場合のみ表示
		if (color_target.children().length != 0 || color_target.text() != '') {
			color_target.fadeIn(250);
//			color_target.show();
		}
	}
}
function lnHideColor(target) {
	var color_target = target.find('.ListStageoneboxColor:visible');
//	color_target.hide();
	color_target.fadeOut(250);
}