var $j = jQuery.noConflict();
var index = 0;
var xScroll;
var yScroll;
var cacheImg = null;
var maxWidth;
var maxHeight;
var minWidth = 150; //最小幅(prev、nextがずれる為)
var title = "";
var adHeight = 49; //挿入される広告の高さ
var adWidth = 468; //挿入される広告の幅
var isAd = false; //バナーがあるかどうかのフラグ

//クリックイベントメイン
function imageClick(event){
	$j("select").hide();
	var height = $j('body:first').height();
	var width = document.documentElement.clientWidth;
	$j('#lightbox-overlay').height(height).width(width).show();
//	var t = event.target.rel ? event.target : event.target.parentNode.rel ? event.target.parentNode.rel : event.target.parentNode.parentNode;
	var t =  event.target.rel ? event.target :event.target.parentNode;
	index = t.rel-1;
	title = t.title ? t.title : t.innerText;
//	setInnerHtml(event.target.parentNode.parentNode.href ? event.target.parentNode.parentNode.href : event.target.parentNode.href);
	setInnerHtml(t.href);
	$j(window).unbind().resize(function(){imageLoaded()}).scroll(function(){imageLoaded()});
	return false;
};

//画像タグ書き出し
function setInnerHtml(image){

	$j('#lightbox-layer-image').hide();
	$j('#lightbox-layer-info').show();
	showLoading();

	//ajax request
	$j.ajax({
		type: 'GET',
		url: "/pic/"+picsid+"/img/",
		data: {
//			act: "api_getimagelightbox",
//			id: picsid,
			src: image
		},
		success: function(data){
			$j('#lightbox-layer-info').hide();
			var div = '<div id="lightbox-imageContainer">'+data+'</div>';

			var navi = '<div id="lightbox-nav">';
			if(index > 0){
				navi += '<a href="" id="lightbox-prev"></a>';
			}
			if(index < $j(".heightLine a").length - 1){
				navi += '<a href="" id="lightbox-next"></a>';
			}
			navi += '</div>';
//			var infoHeader = '<div id="lightbox-infoHeader"><a href="'+image+'" target="_blank">'+title+'</a></div>';
			var infoFooter = '<div id="lightbox-infoFooter"><span id="lightbox-close">Close X</span></div>';
			$j("#lightbox-layer-image").html(div + navi + infoFooter);

			cacheImg = new Image();
			cacheImg.onload = function(){
				this.onload = null;
				imageLoaded();
			};
			cacheImg.onerror = function(){
				cacheImg.src = "/"+site_category+"/common/img/no-l.jpg";
				var noImage = '<img src = "/'+site_category+'/common/img/no-l.jpg">';
				document.getElementById("lightbox-imageContainer").innerHTML = noImage;
			}

			cacheImg.src = image;

			$j('#lightbox-prev').click(function(event){
				prevImage(event);
				return false;
			});
			$j('#lightbox-next').click(function(event){
				nextImage(event);
				return false;
			});
		}
	});
};

//前画像、後画像
function prevImage(event){
	setInnerHtml($j('.heightLine a')[--index]);
};
function nextImage(event){
	setInnerHtml($j('.heightLine a')[++index]);
};

//lightbox位置、サイズ調整
function imageLoaded(){
	if(cacheImg == null) return;
	var height = cacheImg.height;
	var width = cacheImg.width;
	maxWidth = $j(window).width() * 0.8;
	maxHeight = $j(window).height() * 0.8;
	var hPer = maxHeight / cacheImg.height;
	var wPer = maxWidth / width;
	//縮められている場合
	if(hPer < 1 || wPer < 1){
		if(hPer < wPer){
			$j("#lightbox-imageContainer img").css("height", height*hPer);
			height = height * hPer;
			width = width * hPer;
		}else{
			$j("#lightbox-imageContainer img").css("width", width*wPer);
			height = height * wPer;
			width = width * wPer;
		}
	}
	if(width < minWidth){
		width = minWidth;
	}

	$j('#lightbox-layer-image').show();

	if (self.pageYOffset)
	{	// Some browser
		yScroll = self.pageYOffset;
		xScroll = self.pageXOffset;
	} else if (document.documentElement && document.documentElement.scrollTop)
	{	// Explorer 6 Strict
		yScroll = document.documentElement.scrollTop;
		xScroll = document.documentElement.scrollLeft;
	} else if (document.body)
	{	// All other browsers
		yScroll = document.body.scrollTop;
		xScroll = document.body.scrollLeft;	
	}

	//バナーがあるとき
	var h = 0;
	if(document.getElementById("lightbox-ad_area")){
		//高さを足す
		h = adHeight;
		//画像の幅＜バナーの幅
		if(width < adWidth){
			width = adWidth;
		}
	}

	$j('#lightbox-layer-image').height(height+$j("#lightbox-nav").height()+h).width(width);
	var top = ($j(window).height() - height - h - getHeaderHeight()) / 2 + yScroll;
	var left = ($j(window).width() - width) / 2 + xScroll;
	$j('#lightbox-imageContainer').width(width).height(height);
	$j('#lightbox-nav').width(width);
	$j('#lightbox-infoFooter').width(width);
	$j('#lightbox-infoFooter span').click(function(){closeLightBox()});
	$j('#lightbox-layer-loading').hide();
	$j('#lightbox-layer-info').css('top', top).css('left', left).show();
}

//onLoad処理
$j(document).ready(function () {
	var html = '<div id="lightbox-layer-loading" style="display:block;vertical-align:middle;text-align:center;"><img src="/'+site_category+'/common/img/loading.gif"></div>';
	html += '<div id="lightbox-layer-image" style="display:block"></div>';
	$j('#lightbox-layer-info').html(html);
	$j("#lightbox-layer-loading img").load(function(){showLoading();$j('#lightbox-layer-info').hide();});

	$j('#lightbox-overlay').click(function(){
		$j('#lightbox-overlay').hide();
		$j('#lightbox-layer-info').hide();
		$j('select').show();
		cacheImg = null;
	});
});

//lightbox終了処理
function closeLightBox(){
	$j('#lightbox-overlay').hide();
	$j('#lightbox-layer-info').hide();
	$j('select').show();
	cacheImg = null;
}

//ローディング画像表示
function showLoading(){
	$j('#lightbox-layer-image').hide();
	if (self.pageYOffset)
	{	// Some browser
		yScroll = self.pageYOffset;
		xScroll = self.pageXOffset;
	} else if (document.documentElement && document.documentElement.scrollTop)
	{	// Explorer 6 Strict
		yScroll = document.documentElement.scrollTop;
		xScroll = document.documentElement.scrollLeft;
	} else if (document.body)
	{	// All other browsers
		yScroll = document.body.scrollTop;
		xScroll = document.body.scrollLeft;	
	}
	var top = ($j(window).height() - $j('#lightbox-layer-info').height()) / 2 + yScroll;
	var left = ($j(window).width() - $j('#lightbox-layer-info').width()) / 2 + xScroll;
	$j('#lightbox-layer-info').css('top', top).css('left', left).show();
	$j('#lightbox-layer-loading').show();
}

//フッター部分の高さ取得
function getHeaderHeight(){
//	var header = $j("#lightbox-infoHeader").css("height").replace("px", "");
	var nav = $j("#lightbox-nav").css("height").replace("px", "");
	var footer = $j("#lightbox-infoFooter").css("height").replace("px", "");

	if(nav == "auto"){
		nav = 32;
	}
/*
	if(header == "auto"){
		header = 15.6;
	}
*/
	if(footer == "auto"){
		footer = 25.6;
	}

	return parseFloat(nav) + parseFloat(footer);
}