//
var WINDOW_WIDTH;
var CONTAINER_WIDTH;
var CONTAINER_MARGIN;
var COLMUN_WIDTH;
var COLMUN_HEIGHT; 
var GRID_WIDTH;
var NAVI_BOX_WIDTH;
var NAVI_WIDTH;  
var ROW_NUMBER;
var PRE_NUMBER;
var VERTICAL_GROUP   = new Array();
//SETTING
var WINDOW_MARGIN    =              30;
var COLMUN_MARGIN    =              18;
var NAVI_MARGIN      =              18;
var MAX_NUMBER       =               7;
var MIN_NUMBER       =               3;
var VERTICAL_MARGIN  =              18;
var MINIMUM_WIDTH    =             950;
var OPENING_TIME     =            260;
var DURATION_TIME    =             350;
var DELAY_TIME       =              80;

var OPEN_MOVE        =   "easeOutSine";
var HEAD_MOVE        =   "easeOutSine";
var BASE_MOVE        =   "easeOutSine";
var MOVE_TYPE        =   "easeOutSine";
/*-----EASE_TYPE-----

"swing"
"easeInQuad"
"easeOutQuad"
"easeInOutQuad"
"easeInCubic"
"easeOutCubic"
"easeInOutCubic"
"easeInQuart"
"easeOutQuart"
"aseInOutQuart"
"easeInQuint"
"easeOutQuint"
"easeInOutQuint"
"easeInSine"
"easeOutSine"
"easeInOutSine"
"easeInExpo"
"easeOutExpo"
"easeInOutExpo"
"easeInCirc"
"easeOutCirc"
"easeInOutCirc"
"easeInElastic"
"easeOutElastic"
"easeInOutElastic"
"easeInBack"
"easeOutBack"
"easeInOutBack"
"easeInBounce"
"easeOutBounce"
"easeInOutBounce"

-------------------*/


init();
//
$(window).resize( function() {
	move();
});

function move() {
	$(document).ready( function() {
		$("#head > div.logoR").stop();
		$("#grid > div.fix").stop();
		$("#grid").stop();
		//
		WINDOW_WIDTH     = Math.max($(window).width(), MINIMUM_WIDTH);
		CONTAINER_WIDTH  = WINDOW_WIDTH - WINDOW_MARGIN*2;
		//
		ROW_NUMBER       =  Math.min(Math.floor((CONTAINER_WIDTH-NAVI_WIDTH+COLMUN_MARGIN)/(COLMUN_WIDTH+COLMUN_MARGIN)), MAX_NUMBER);
		ROW_NUMBER       =  Math.max(ROW_NUMBER, MIN_NUMBER);
		//
		GRID_WIDTH       = (COLMUN_WIDTH + COLMUN_MARGIN)*ROW_NUMBER - COLMUN_MARGIN;
		CONTAINER_MARGIN = Math.max((CONTAINER_WIDTH - (GRID_WIDTH+NAVI_WIDTH))/2 + WINDOW_MARGIN, 0);
		//
		VERTICAL_GROUP   = clear(ROW_NUMBER);
		//
		$("#head > div.logoR").animate({left:WINDOW_WIDTH-$("#head > div.logoR").width()+"px"}, DURATION_TIME, HEAD_MOVE);
		$("#grid").css({width:(GRID_WIDTH+NAVI_WIDTH)+"px"});
		$("#grid > div.fix").animate({left:NAVI_WIDTH+"px"});
		$("#grid").animate({left:CONTAINER_MARGIN+"px"}, DURATION_TIME, BASE_MOVE, function() {																			
				//alert(PRE_NUMBER  + " / " +  ROW_NUMBER);
				if (PRE_NUMBER != ROW_NUMBER) {
					$("#grid > div.item").each( function(i) {
						//"#grid > div.column" + i
						$(this).stop();
						//
						var posN = minimum(VERTICAL_GROUP);
						var posX = NAVI_WIDTH + (posN%ROW_NUMBER)*(COLMUN_WIDTH + COLMUN_MARGIN);
						var posY = VERTICAL_GROUP[posN%ROW_NUMBER];
						//
						var val  = VERTICAL_GROUP[posN%ROW_NUMBER];
							val += $(this).height();
							val += COLMUN_MARGIN;
							val += get_val($("#grid > div.item").css("padding-top"));
							val += get_val($("#grid > div.item").css("padding-bottom"));
						//	
						VERTICAL_GROUP[posN%ROW_NUMBER] = val;
						//
						$(this).animate({left:posX+"px", top:posY+"px"}, DURATION_TIME+i*DELAY_TIME, MOVE_TYPE);	
					});
					$("#grid > div.foot").css({top:foot()+"px", left:"0px"});
					$("html").css({height:($("#head").height() + foot() + $("#grid > div.foot").height()+20)+"px"});
				}
				PRE_NUMBER    = ROW_NUMBER;
		});
	});
}

function init() {	
	$(document).ready( function() {
		WINDOW_WIDTH     = Math.max($(window).width(), MINIMUM_WIDTH);
		CONTAINER_WIDTH  = WINDOW_WIDTH - WINDOW_MARGIN*2;
		COLMUN_WIDTH	 = 207;  //$("#grid > div.item").width();
		NAVI_BOX_WIDTH   = $("#grid > div.navi").width();
		NAVI_WIDTH       = NAVI_BOX_WIDTH + NAVI_MARGIN;
		//Column��
		ROW_NUMBER       =  Math.min(Math.floor((CONTAINER_WIDTH-NAVI_WIDTH+COLMUN_MARGIN)/(COLMUN_WIDTH+COLMUN_MARGIN)), MAX_NUMBER);
		ROW_NUMBER       =  Math.max(ROW_NUMBER, MIN_NUMBER);
		PRE_NUMBER       =  ROW_NUMBER;
		//
		GRID_WIDTH       = (COLMUN_WIDTH + COLMUN_MARGIN)*ROW_NUMBER - COLMUN_MARGIN;
		CONTAINER_MARGIN = Math.max((CONTAINER_WIDTH - (GRID_WIDTH+NAVI_WIDTH))/2 + WINDOW_MARGIN, 0);
		//
		VERTICAL_GROUP   = clear(ROW_NUMBER);
		//
		//$("#head").css({top:-8, left:-8});
		$("#head > div.logoR").css({left:WINDOW_WIDTH-$("#head > div.logoR").width()+"px"});
		//
		$("#grid").css({width:(GRID_WIDTH+NAVI_WIDTH)+"px", top:VERTICAL_MARGIN+"px", left:CONTAINER_MARGIN+"px"});
		$("#grid > div.fix").css({left:NAVI_WIDTH+"px"});
		//
		$("#grid > div.item").each( function(i) {
				//					 
				//$(this).css({height:(Math.floor(Math.random()*165)+165)+"px"});
				//
				var posN = minimum(VERTICAL_GROUP);
				var posX = NAVI_WIDTH + (posN%ROW_NUMBER)*(COLMUN_WIDTH + COLMUN_MARGIN);
				var posY = VERTICAL_GROUP[posN%ROW_NUMBER];
				//
				var val  = VERTICAL_GROUP[posN%ROW_NUMBER];
					val += $(this).height();
					val += COLMUN_MARGIN;
					val += get_val($("#grid > div.item").css("padding-top"));
					val += get_val($("#grid > div.item").css("padding-bottom"));
				//
				VERTICAL_GROUP[posN%ROW_NUMBER] = val;
				//alert(VERTICAL_GROUP[posN%ROW_NUMBER] + $(this).height() + COLMUN_MARGIN + 36);
				//
				$(this).css({left:posX+"px", top:posY+"px"});
				/*
				$(this).hover(
					function() { $(this).animate({opacity: 1.0}, DURATION_TIME, MOVE_TYPE); }, 
					function() { $(this).animate({opacity: 0.5}, DURATION_TIME, MOVE_TYPE); }
				);
				*/
		});
		$("#grid > div.foot").css({top:foot()+"px", left:"0px"});
		$("body").animate({opacity: 1.0}, OPENING_TIME, OPEN_MOVE, function() { $("body").stop(); });
		$("html").css({height:($("#head").height() + foot() + $("#grid > div.foot").height()+20)+"px"});
	});
}
//
function foot() {
	var _up  = $("#grid > div.fix").height();
		_up += COLMUN_MARGIN;
		_up += get_val($("#grid > div.fix").css("padding-top"));
		_up += get_val($("#grid > div.fix").css("padding-bottom"));
	//
	var _cr  = VERTICAL_GROUP[maximum(VERTICAL_GROUP)];
	//
	return Math.max(_up, _cr);
}

function maximum(_ary) {
	var _m = 0;
	var _v = _ary[_m];
	if (_ary.length>1) {
		for (var i=1; i<_ary.length; i++) {
			if (_v<_ary[i]) {
				_m = i;
				_v = _ary[i];
			}
		}
	}
	return _m;
}

function minimum(_ary) {
	var _m = 0;
	var _v = _ary[_m];
	if (_ary.length>1) {
		for (var i=1; i<_ary.length; i++) {
			if (_v>_ary[i]) {
				_m = i;
				_v = _ary[i];
			}
		}
	}
	return _m;
}

function clear(_max) {
	var _pos = new Array();
	//
	var _up  = $("#grid > div.fix").height();
	//
	_up += COLMUN_MARGIN;
	_up += get_val($("#grid > div.fix").css("padding-top"));
	_up += get_val($("#grid > div.fix").css("padding-bottom"));
	//
	for (var n=0; n<_max; n++) {
		//
		if (n<MIN_NUMBER) {
			_pos[n] = _up;
		} else {
			_pos[n] = 0;
		}
	}
	return _pos;
}

//
function get_val(_str) {
	var _val  = "";
	var _char = "";
	for (var i=0; i<_str.length; i++) {
		_char = _str.substr(i, 1);
		if (0<=parseInt(_char) && parseInt(_char)<=9) {
			_val += _char;
		} else {
			break;
		}
	}
	return parseInt(_val);
}