/*	Initialize Function
------------------------------*/
var activeCardClass = 'activeCard';
var hoverCardClass = 'hoverCard';
var loadCardClass = 'loadCard';
var cardList = [];
var basePositon = [];
var movePositon = [];

var disableQuery = '';//'#recycleCard';

var otherCardOpen = new Function();

(function($){
$(function(){
	$('img.imgover, input.imgover').imgHover({ suffix : '_o' });
	$('p.link02 a').click(function(e){
		setTimeout(function(){
			$.scrollFor('#pagetop');
		}, 1);
		e.preventDefault();
	});
});

$(function(){
	var row = 0;
	$('div.card').each(function(index, item){
		var card = $(this);
		var cardId = card.attr('id');
		var targetElem = card.find('a.target').click(function(e){ e.preventDefault(); });
		card.append('<div class="eventLayer"></div>');
		card.not(disableQuery).click(function(){
			if (targetElem.hasClass('blanklink')) {
				window.open(targetElem.attr('href'));
			} else {
				$(this).unbind();
				openCard(cardId);
			}
		}).hover(
			function(){
				$(this).addClass(hoverCardClass).find('div.cardLayer').hide();
			},
			function(){
				$(this).removeClass(hoverCardClass).find('div.cardLayer').show();
			}
		);

		/* set baseposition */
		if(!basePositon[row]){ basePositon[row] = []; }
		basePositon[row].push(cardId);
		if((index+1) % 5 == 0){ row++; }
		cardList.push(cardId);
	}).not(disableQuery).css('cursor', 'pointer');
});

$(function(){
	$('#sitemapModule').change(function(){
		this.blur();
		document.body.focus();
		var selectVal = $(this).val();
		if(selectVal != ''){

			var targetElem = $('#' + selectVal + ' a.target');
			if (targetElem.hasClass('blanklink')) {
				window.open(targetElem.attr('href'));
			} else {
				restoreImgFunc('allLabel');
				refineCard('allLabel');
				openCard(selectVal);
			}
		}
	});
	controlImgFunc('allLabel');
});

$(function(){
	$('#categoryModule li').click(function(e){
		var categoryId = $(this).find('img').attr('id');
		eventsLogging(categoryId);
		refineCard(categoryId);
	});

	$('a.cardOpenLink').live('click', function(e){
		otherCardOpen($(this).attr('href'));
		e.preventDefault();
	});
});


/*	Initilize Card Open / Other Card Open
------------------------------------------------------- */
$(window).load(function(){
	var queryString = location.href.replace(/^[^\?]+\??/,'');
	var params = parseQuery( queryString );
	if(params.c){
		openCard(params.c, params.p);
	}
});
otherCardOpen = function(url){
	var queryString = url.replace(/^[^\?]+\??/,'');
	var params = parseQuery( queryString );
	restoreImgFunc('allLabel');
	refineCard('allLabel');
	if(params.c){
		openCard(params.c, params.p);
	}
};
function parseQuery ( query ) {
	var Params = {};
	if ( ! query ) {return Params;}// return empty object
	var Pairs = query.split(/[;&]/);
	for ( var i = 0; i < Pairs.length; i++ ) {
		var KeyVal = Pairs[i].split('=');
		if ( ! KeyVal || KeyVal.length != 2 ) {continue;}
		var key = unescape( KeyVal[0] );
		var val = unescape( KeyVal[1] );
		val = val.replace(/\+/g, ' ');
		Params[key] = val;
	}
	return Params;
}

/*	Controll Rollover
------------------------------------------------------- */
var activeBtnClass = 'controlActive';
var suffix = '_o';

function controlImgFunc(btnId){
	$('#categoryModule').each(controlFunc);
	function controlFunc() {
		var controlBtns = $(this).find('img').imgHover({ suffix : suffix });
		
		controlBtns.mousedown(function(){
			restoreImgFunc($(this).attr('id'));
		});
		controlBtns.filter('#' + btnId).unbind().addClass(activeBtnClass).each(function(){
			this.src = $.combineSuffix(this.src, suffix);
		});
	}
}
function restoreImgFunc(btnId) {
	var currentImg = $('#' + btnId);
	$('#categoryModule').find('img.'+activeBtnClass).removeClass(activeBtnClass).attr('src', function(){
		var imgsrc_on = this.src;
		var regObj = new RegExp(suffix+'\.gif');
		return imgsrc_on.replace(regObj, '.gif');
	}).imgHover({ suffix : suffix }).mousedown(function(){
		restoreImgFunc($(this).attr('id'));
	});
	currentImg.unbind().addClass(activeBtnClass).each(function(){
		this.src = $.combineSuffix(this.src, suffix);
	});
}

/*	Category Logging
------------------------------------------------------- */
function eventsLogging(categoryId){
	var logClass = 'logFrame';
	$('iframe.'+logClass).remove();
	var iframe = document.createElement('iframe');
	iframe.id = categoryId + 'Frame' + new Date().getTime();
	iframe.name =  categoryId + 'Frame' + new Date().getTime();
	iframe.className = logClass;
	iframe.src = '/log/' + categoryId + '.html';
	$(document.body).append(iframe);
}


/*	Refine Card Function
------------------------------*/
function refineCard(labelname){
	/* Close Active Card */
	var activeCardId = $('div.' + activeCardClass).attr('id');
	closeCard(activeCardId);

	cardList = [];
	basePositon = [];
	var row = 0;
	var count = 0;
	$('div.card').each(function(index, item){
		var card = $(this);
		var cardId = card.attr('id');
		if(labelname == 'allLabel' || card.find('ul.label li.' + labelname).length > 0){
			card.show();

			/* set baseposition */
			if(!basePositon[row]){ basePositon[row] = []; }
			basePositon[row].push(cardId);
			if((count+1) % 5 == 0){ row++; }
			cardList.push(cardId);
			count++;
		} else {
			card.hide().css({ 'top' : '0px', 'left' : '0px' });
		}
	});
	execReposition(basePositon);
}

/*	Open Card Function
------------------------------*/
function openCard(cardId, pageName){
	$(document.body).append('<div id="preventLayer"></div');
	var card = $('#' + cardId).addClass(loadCardClass).removeClass(hoverCardClass);
	card.find('div.cardLayer').remove();

	var contentArea = card.find('div.bodyInner');
	var targetHref = contentArea.find('a.target').attr('href');
	var iframe = document.createElement('iframe');
	iframe.id = cardId + 'Frame' + new Date().getTime();
	iframe.name =  cardId + 'Frame' + new Date().getTime();
	$(iframe).css({ 'visibility' : 'hidden' }).load(function(){ sizeupCard(cardId); });
	if(pageName){
		iframe.src = targetHref + pageName;
	} else {
		iframe.src = targetHref;
	}
	contentArea.find('div.minArea').hide();
	contentArea.append('<div class="loadingCard"></div>');
	contentArea.append(iframe);
}

/*	Close Card Function
------------------------------*/
function closeCard(cardId){
	var contentArea = $('#' + cardId + ' div.bodyInner');
	contentArea.find('iframe').remove();
	contentArea.find('div.minArea').show();
	sizedownCard(cardId);
}

/*	SizeUp Card Function
------------------------------*/
function sizeupCard(cardId){
	/* Close Active Card */
	var activeCardId = $('div.' + activeCardClass).attr('id');
	if(activeCardId && (activeCardId != cardId)){
		closeCard(activeCardId);
	}

	/* Insert Card Layer */
	$('div.cardLayer').remove();
	var layer = document.createElement('div');
	$(layer).addClass('cardLayer').css({ 'opacity' : '0.5' });
	$('div.card').not('#' + cardId).find('div.bodyInner').append(layer);

	/* Get Elements & Set Attributes */
	var targetCard = $('#' + cardId);
	targetCard.find('div.eventLayer').hide();
	var targetFrame =  targetCard.find('iframe');
	var frameWindow = targetFrame.get(0).contentWindow;
	frameWindow.document.getElementsByTagName('html')[0].style.overflow = 'hidden';
	var frameBody = $(frameWindow.document.body).css({ 'overflow' : 'hidden', 'visibility' : 'hidden' });

	/* Set Close Event */
	frameBody.find('p.close').css('cursor', 'pointer').click(function(){
		execReposition(basePositon);
		closeCard(cardId);
	});

	/* Compute Card Size */
	var noframe = frameBody.hasClass('noframe');
	var classArray = frameBody.attr('class').split(' ');
	var sizeQuery = $.grep(classArray, function(item, index){
		return item.search(/^size/) != -1;
	})[0];
	/* Frame */
	if(noframe){
		targetCard.addClass('noframeCard');
	} else {
		targetCard.removeClass('noframeCard');
	}

	var sizeObj = convertSizeQuery(sizeQuery);
	var cardRow = 296 * sizeObj.row - 6;
	var cardCol = 186 * sizeObj.col - 8;
	if(noframe){
		cardCol += 1; // For IE width
	}

	var detailHeight = $.support.boxModel ? cardRow - 10 : cardRow;
	frameBody.find('#detail').css({
		'position' : 'relative',
		'height' : detailHeight + 'px'
	});
	frameBody.find('div#bottomBox').css({
		'position' : 'absolute',
		'bottom' :'0px'
	});

	/* Get Card Position */
	var posObj = searchCardPosition(basePositon, cardId);

	/* Reposition */
	repositionCard(cardId, sizeObj, posObj);
	execReposition(movePositon, function(){
	});

	/* Display Sizeup Card */
	targetCard.removeClass(loadCardClass).find('div.loadingCard').remove();
	targetFrame.css({ 'visibility' : 'visible' });
	var cssObj = {
		'width' : cardCol + 'px',
		'height' : cardRow + 'px',
		'z-index' : '10'
	};

	/* LoadComplete Function */
	var completeFunc = function(){
		frameBody.css({ 'visibility' : 'visible' });
		$('#preventLayer').remove();
		$.scrollFor('#' +cardId);
	};
	if(targetCard.hasClass(activeCardClass)){
		targetCard.css(cssObj).css('cursor', 'default');
		completeFunc();
	} else {
		targetCard.addClass(activeCardClass).animate(cssObj, function(){
			completeFunc();
		}).css('cursor', 'default');
	}
}

/*	SizeDown Card Function
------------------------------*/
function sizedownCard(cardId){
	$('div.cardLayer').remove();
	var targetCard = $('#' + cardId).removeClass(activeCardClass).click(function(){
		$(this).unbind();
		openCard(cardId);
	}).hover(
		function(){
			$(this).addClass(hoverCardClass).find('div.cardLayer').hide();
		},
		function(){
			$(this).removeClass(hoverCardClass).find('div.cardLayer').show();
		}
	).css({
		'width' : '178px',
		'height' :'290px',
		'z-index' : '0',
		'cursor' : 'pointer'
	});
	targetCard.removeClass('noframeCard');
	targetCard.find('div.eventLayer').show();
}

/*	Reposition Card Function
------------------------------*/
function repositionCard(cardId, sizeObj, posObj){
	movePositon = [];
	var excess = posObj.col + sizeObj.col - 5;
	if(excess > 0) { posObj.col = posObj.col - excess }
	for(var i=0; i < posObj.row; i++) {
		movePositon[i] = new Array(5);
	}
	for(var j=posObj.row; j < posObj.row + sizeObj.row; j++) {
		movePositon[j] = new Array(5);
		for(var j2=0; j2 < sizeObj.col; j2++) {
			if(j == posObj.row && j2 == 0){
				movePositon[j][posObj.col] = cardId;
			} else {
				movePositon[j][posObj.col + j2] = 'empty';
			}
		}
	}

	var count = 0;
	$.each(movePositon, function(rowIndex, rowArray){
		$.each(rowArray, function(colIndex, cardPosition){
			if(cardList[count] == cardId){ count++; }
			if(cardPosition){ return }
			if(!cardList[count]){ return }
			movePositon[rowIndex][colIndex] = cardList[count];
			count++;
		});
	});
	
	if(count < cardList.length){
		var loop = 0;
		var plusRow = movePositon.length;
		movePositon.push(new Array(5));
		while(count < cardList.length){
			if(loop == 5){
				movePositon.push(new Array(5));
				plusRow++;
				loop = 0;
			}
			if(cardList[count] != cardId){
				movePositon[plusRow][loop] = cardList[count];
				loop++;
			}
			count++;
		}
	}
	//dumpArr(movePositon);
}

/*	Exec Reposition
------------------------------*/
function execReposition(positionArray, callback){
	var areaHeight = 296 * positionArray.length;
	$('#pickupArea').css({'height' : areaHeight + 'px'});

	var count = 0;
	$.each(positionArray, function(rowIndex, rowArray){
		$.each(rowArray, function(colIndex, cardId){
			if(!cardId || cardId == 'empty'){ return }
			var cardLeft = 186 * colIndex;
			var cardTop = 296 * rowIndex;
			$('#'+cardId).animate({
				'left' : cardLeft + 'px',
				'top' : cardTop + 'px'
			}, function(){
				count++;
				if(count >= cardList.length && callback){
					callback();
				}
			});
		});
	});
}

/*	Util
------------------------------*/
function convertSizeQuery(query){
	query.match(/^sizeR([0-9]+)C([0-9]+)$/);
	return {
		row : Number(RegExp.$1),
		col : Number(RegExp.$2)
	};
}
function searchCardPosition(positionArray, cardId){
	var obj = {};
	$.each(positionArray, function(rowIndex, rowArray){
		$.each(rowArray, function(colIndex, cardPosition){
			if(cardId == cardPosition){
				obj.row = rowIndex;
				obj.col = colIndex;
				return;
			}
		});
	});
	return obj;
}

function dumpArr(array){
	$.each(array, function(rowIndex, rowArray){
		$.each(rowArray, function(colIndex, cardId){
			alert(rowIndex + ' || ' + colIndex + ' || ' + cardId);
		});
	});
}
})($jq['1.3.2']);
