/**
 * @require jQuery 1.4.2+
 * @require constants.js
 * @require util.js
 * @require common.js
 * 
 * @version 1.0.0
 */
jQuery.js.popupImage = {}

jQuery.js.popupImage.openFancyBoxEvent = function() {
	j$('a.popupImage').live('click', function() {
		j$.js.property.imageListSearch(this.id);
	});
};

jQuery.js.popupImage.openFancyBox = function(target) {
	if (target) {
		j$("a[rel=image_" + target + "]").fancybox({
	        'type'              : 'image',
	        'transitionIn'		: 'none',
	        'transitionOut'		: 'none',
	        'titlePosition' 	: 'over',
	        'padding'			: '0',
	        'titleFormat'		: function(title, currentArray, currentIndex, currentOpts) {
	            return '<span id="fancybox-title-over">' + (currentIndex + 1) + ' / ' + currentArray.length + (title.length ? ' &nbsp; ' + title : '') + '</span>';
	        }
	    });
	    
	    j$('.image_' + target + ':first').trigger('click');
	}
};

jQuery.js.popupImage.openEvent = function(a) {
	
	/**
	 * クリックで開く
	 */
	j$(a).live('click', function(e){
		e.stopImmediatePropagation();
	
		var target = j$(this);
		var searchKey = target.attr('rel');
		var no = target.attr('name');
		
		if (searchKey) {
			// input hiddenオブジェクトの配列（valueが画像URL）
			var form = j$('#imgForm_' + searchKey);
			var imgs = form.find('input.imageHiddenList');
			var layoutImgNo = form.find('.layoutImgNo').val();
			j$.js.popupImage.openPopup(imgs, no - 1, layoutImgNo);
			this.blur();
		}
		return false;
	});

};

/**
 * ポップアップ表示
 */
jQuery.js.popupImage.openPopup = function(imgs, imgNo, layoutImgNo) {

	// 初期処理
	imgNo = imgNo ? imgNo : 0;
	
	// サムネイルを取り込む処理と、リサイズする処理
	imgs.each(function(e) {
		j$('#thumbnailList').append('<li><a href="javascript:void(0);" class="thumbnail" rel="' + e + '"' + '><img class="lazyLoadPopupThumbnail" src="' + j$.constants.img.loading + '" name="' + j$(this).val() + '" alt="" width="60" height="60" title="' + j$(this).attr('title') + '" comment="' + j$(this).attr('comment') + '" /></a></li>');
	});
	
	// ポップアップ初期表示
	thumbnailFocus(imgNo);
	j$.js.common.overlay.show();
	reflectCurrentSelection(imgNo, layoutImgNo);
	j$.js.common.popup.popupEvent(j$('#imagePopup'));
	
	j$.js.common.lazyLoad.onetime('.lazyLoadPopupThumbnail', {
		noImg : j$.constants.img.noImg
	});
	
	// サムネイル画像クリックするイベント
	j$('#imagePopup a.thumbnail').click(function(e){
		j$(this).blur();
		e.stopImmediatePropagation();
		var position = j$(this).attr('rel');
		reflectCurrentSelection(position, layoutImgNo);
		thumbnailFocus(position);
		return false;
	});

	// 閉じる
	j$('#' + j$.js.common.overlay.conf.targetIdName + ', #closeImagePopup').click(function() {
		j$(window).focus();
		j$('#closeImagePopup').unbind('click');
		j$('#imagePopup').hide();
		if (j$.util.browser.isIE6()) {
			j$('select').not('.showSelect').css('visibility', 'visible');
			j$.util.popupResize.unbind();
			j$.util.popupScroll.unbind();
		} else {
			j$.util.popupResize.unbindFixed();
		}
		j$('#' + j$.js.common.overlay.conf.targetIdName).unbind('click');
		j$.util.overlay.hide(j$('#' + j$.js.common.overlay.conf.targetIdName));
		j$('#' + j$.js.common.overlay.conf.targetIdName).remove();
		j$('#mainImg').attr('src', j$.constants.img.noImgBig);
		j$('#caution_layout1').hide();
		j$('#thumbnailList').html('');
		return false;
	});
	
	// マウスオーバー時のボーダー
	j$('#thumbnailList li').hover(function() {
		var target = j$(this);
		if (!target.hasClass('focus')) {
			target.css('border', '2px solid #ffffff');
		} else {
			target.css('border', '2px solid #6caf59');
		}
		return false;
	}, function() {
		var target = j$(this);
		if (!target.hasClass('focus')) {
			target.css('border', '2px solid #5ab4ee');
		} else {
			target.css('border', '2px solid #6caf59');
		}
		return false;
	});
	
	/**
	 * 今の選択をポップアップに反映する
	 */
	function reflectCurrentSelection(imgNo, layoutImgNo) {
		var imgUrl = j$(imgs[imgNo]).val();
		if (imgUrl && (imgNo || imgNo == 0)) {
			j$('#mainImg').attr('src', imgUrl);
			if (layoutImgNo && (parseInt(layoutImgNo) == parseInt(imgNo) + 1)) {
				j$('#caution_layout1').show();
			} else {
				j$('#caution_layout1').hide();
			}
		}
	};

	/**
	 * メイン画像になっているサムネイル画像をfocus
	 */
	function thumbnailFocus(imgNo) {
		var thumbnailImg = j$('#thumbnailList li');
		thumbnailImg.removeClass('focus').css('border', '2px solid #5ab4ee').find('a').css({cursor : ''});
		thumbnailImg.eq(imgNo).addClass('focus').css('border', '2px solid #6caf59').find('a')
			.css({cursor : 'default'});
        
        var img = j$('img', thumbnailImg.eq(imgNo));
            
        if( j$(img).attr('title') != '' && j$(img).attr('title') != 'undefined' ){
        	j$('p.title').show();
        	j$('p.title').html(j$(img).attr('title'));
        } else {
        	j$('p.title').hide();
        }
        if( j$(img).attr('comment') != '' && j$(img).attr('comment') != 'undefined' ){
        	j$('p.comment').show();
        	j$('p.comment').html(j$(img).attr('comment'));
        } else {
        	j$('p.comment').hide();
        }
	}
};