//コーディネートページ
var tops_data = [];
var bottoms_data = [];
var photozou_data = [];

function initCarousel(carousel, state)
{
	var id = carousel.container[0].id;
	var url;
	var button;
	var label;
	var i;
	var age;
	var keyword;
	var akasugu_url = "akasugu.php?type=%s&age=%s&category=%s&keyword=%s";
	var photozou_url = "photozou.php?keyword=%s";

	if (state == 'init') {
		if ($("#akasugu_keyword").val() == "キーワードを入力してください") {
			keyword = '';
		} else {
			keyword = $("#akasugu_keyword").val();
		}

		switch (id) {
			case 'tops_carousel' :
				url = sprintf(akasugu_url, 't', '', '', encodeURIComponent(keyword));
				button = $('#tops_filter_button');
				label = $('#tops_count');
				i = tops_data.length;
				break;
			case 'bottoms_carousel' :
				url = sprintf(akasugu_url, 'b', '', '', encodeURIComponent(keyword));
				button = $('#bottoms_filter_button');
				label = $('#bottoms_count');
				i = bottoms_data.length;
				break;
			case 'photozou_carousel' :
				url = sprintf(photozou_url, encodeURIComponent($("#photozou_keyword").val()));
				button = $('#photozou_filter_button');
				label = $('#photozou_count');
				i = photozou_data.length;
				break;
		}

		if (i == 0) {
			$.getJSON(
				url,
				function(json){
					switch (id) {
						case 'tops_carousel' :
							tops_data = json;
							break;
						case 'bottoms_carousel' :
							bottoms_data = json;
							break;
						case 'photozou_carousel' :
							photozou_data = json;
							break;
					}
					carousel.size(json.length);
					carousel.reload();
					dispCount(label, json);
				}
			);
		}

		button.unbind();
		button.bind('click', function(e) {
			showLoading(id, 1);

			$("input[name='age']").each(function() {
				if (this.checked) {
					age = this.value;
				}
			});

			if ($("#akasugu_keyword").val() == "キーワードを入力してください") {
				keyword = '';
			} else {
				keyword = $("#akasugu_keyword").val();
			}

			switch (id) {
				case 'tops_carousel' :
					url = sprintf(akasugu_url, 't', age, $("#topsCategory").val(), encodeURIComponent(keyword));
					break;
				case 'bottoms_carousel' :
					url = sprintf(akasugu_url, 'b', age, $("#bottomsCategory").val(), encodeURIComponent(keyword));
					break;
				case 'photozou_carousel' :
					url = sprintf(photozou_url, encodeURIComponent($("#photozou_keyword").val()));
					break;
			}

			$.getJSON(
				url,
				function(json){
					switch (id) {
						case 'tops_carousel' :
							tops_data = json;
							break;
						case 'bottoms_carousel' :
							bottoms_data = json;
							break;
						case 'photozou_carousel' :
							photozou_data = json;
							break;
					}
					carousel.reset();
					carousel.size(json.length);
					carousel.reload();
					dispCount(label, json);
					hideLoading(id);
				}
			);
		});
	}
};

function loadCarousel(carousel, state)
{
	var id = carousel.container[0].id;
	var data;
	var html;
	var click = "onclick=\"setItems('%s','%s','%s','%s','%s');\">";
	var img = "<img src='%s' width='75' height='75' alt='%s' /></a>";

	switch (id) {
		case 'tops_carousel' :
			data = tops_data;
			break;
		case 'bottoms_carousel' :
			data = bottoms_data;
			break;
		case 'photozou_carousel' :
			data = photozou_data;
			break;
	}

	if (carousel.first == 1) {
		if (data.length == 0) {
			return;
		}
	}

	for (var i = carousel.first; i <= carousel.last; i++) {
		var item = data[i - 1];
		if (item.id == '') {
			html = '<img src="images/spacer.gif" width="75" height="75" alt="" />';
		} else {
			html = '<a href="javascript:void(0);" ';
			switch (id) {
				case 'tops_carousel' :
					html = html + sprintf(click, 't', item.id, item.image, item.title, item.url);
					html = html + sprintf(img, item.image, item.title);
					break;
				case 'bottoms_carousel' :
					html = html + sprintf(click, 'b', item.id, item.image, item.title, item.url);
					html = html + sprintf(img, item.image, item.title);
					break;
				case 'photozou_carousel' :
					html = html + sprintf(click, 'p', item.id, item.image, item.title, '');
					html = html + sprintf(img, item.thumbnail, item.title);
					break;
			}
		}
		carousel.add(i, html);
	}
};

function setItems(type, id, filename, title, url)
{
	var element;
	var element2;
	var parameter = sprintf("file=%s&type=%s", filename, type);
	var link = "<a href='%s' target='_blank' class='link_external'>%s</a>";

	if (!parent.combi || !parent.combi.dd) {
		return;
	}

	switch (type) {
		case 't' :
			element = parent.combi.dd.elements.tops;
			element2 = parent.combi.dd.elements.desc;
			$("#tops_title").html(sprintf(link, url, title));
			$("#tops_code").val(id);
			break;
		case 'b' :
			element = parent.combi.dd.elements.bottoms;
			element2 = parent.combi.dd.elements.desc;
			$("#bottoms_title").html(sprintf(link, url, title));
			$("#bottoms_code").val(id);
			break;
		case 'p' :
			element = parent.combi.dd.elements.photozou;
			element2 = parent.combi.dd.elements.desc;
			break;
	}

	showLoading('cordinate_space_wrapper', 2);
	element2.hide();
	element.hide();

	$.getJSON(
		"size.php?" + parameter,
		function(json){
			src = 'img.php?' + parameter;
			element.swapImage(src);
			element.resizeTo(json.width, json.height);
			element.moveTo(0, 0);

			setTimeout(
				function() {
					element.show();
					hideLoading('cordinate_space_wrapper');
				},
				700
			);
		}
	);
};

function setDefault()
{
	if (!parent.combi || !parent.combi.dd) {
		return;
	}

	$("#tops_title").html('選択されていません');
	$("#tops_code").val('');

	$("#bottoms_title").html('選択されていません');
	$("#bottoms_code").val('');

	parent.combi.dd.elements.tops.swapImage('images/spacer.gif');
	parent.combi.dd.elements.bottoms.swapImage('images/spacer.gif');
	parent.combi.dd.elements.photozou.swapImage('images/spacer.gif');
	parent.combi.dd.elements.desc.show();
};


function postComment()
{
	var commentText = ($("#comment").val() == 'コメントを入力してください') ? '' : $("#comment").val();

	hidePopupComment();

	$.post("add.php",
		{
			"tops" : $("#tops_code").val(),
			"bottoms" : $("#bottoms_code").val(),
			"comment" : commentText
		},
		function(data){
			if (data != "") {
				alert(data);
			} else {
				alert("マイコーディネートに登録されました");
			}
		}
	);
};

function showLoading(id, type)
{
	var bid = id + '_block';

	var p = $('#' + id).position();
	var w = $('#' + id).innerWidth();
	var h = $('#' + id).innerHeight();

	$('#' + bid).remove();

	$('<div id="' + bid + '"></div>')
	.css({
		'z-index' : '1000',
		'position' : 'absolute',
		'top' : p.top + 1,
		'left' : p.left + 1,
		'width' : w,
		'height' : h,
		'background-color' : '#CCCCCC',
		'color' : '#FFFFFF',
		'opacity' : '0.6'
	})
	.appendTo('div.cordinate_right');

	if (type == 1) {
		$('<p><img src="images/loader.gif" width="220" height="19" /></p>')
		.css({
			'z-index' : '1001',
			'position' : 'absolute',
			'margin-top' : (h / 2) - 9,
			'margin-left' : (w / 2) - 100
		})
		.appendTo('#' + bid);
	} else {
		$('<p><img src="images/loader.gif" width="220" height="19" /></p>')
		.css({
			'z-index' : '1001',
			'position' : 'absolute',
			'margin-top' : (h / 2) - 9,
			'margin-left' : (w / 2) - 100
		})
		.appendTo('#' + bid);
	}
};

function hideLoading(id)
{
	var bid = id + '_block';
	$('#' + bid).fadeOut();
};



function showTip(e)
{
	if (document.all) {
		e = event;
	}

	var st = Math.max(document.body.scrollTop, document.documentElement.scrollTop);
	if (navigator.userAgent.toLowerCase().indexOf('safari')>=0) {
		st = 0;
	}


	$('#tooltip')
	.css({
		'z-index' : 999,
		'left' : (e.clientX < 0 ) ? 0 : e.clientX - 100 + 'px',
		'top' : e.clientY + 20 + st + 'px'
	})
	.show();
};

function hideTip()
{
	$('#tooltip').hide();
};

function onKeyword(obj, desc)
{
	if (obj.value == desc) {
		obj.style.color = '#000000';
		obj.value = '';
	}
};

function outKeyword(obj, desc)
{
	if (obj.value == '') {
		obj.style.color = '#AAAAAA';
		obj.value = desc;
	}
};

function dispCount(element, data)
{
	var total = data.length;
	var count = 0;
	var more = '';

	for (var i = 0; i < total; i++) {
		if (data[i].id != '') {
			count++;
		}
	}

	if (count == 300) {
		more = ' 以上';
	}
	element.text('（' + count + ' 件' + more + '）');
};

function sprintf()
{
	var format = Array.prototype.shift.apply(arguments);
	var args = arguments;
	var i=0;
	return format.replace(/%s/g, function(){
		return args[i++];
	});
};


function showPopupComment(sender)
{
	var p = $(sender).position();

	hidePopupComment();
	$('#popup_comment')
	.css({
		'background' : "url(images/comment_bg.gif) no-repeat",
		'top' : p.top - 100,
		'left' : p.left - 90
	})
	.fadeIn("medium");
};

function hidePopupComment()
{
	$('#popup_comment').hide();
	$("#comment").val('コメントを入力してください').css({'color' : '#AAAAAA'});
};