var i = 1;
var no = 4;
var timer = 5000;
var imgHeight = 181;
var imgHeight_s = 50;
var nowHeihgt = 0;
var m = 17;
var m_s = 35;
var lock = 0;
var tm_lock = 0;
var easing = "linear"
var am_tm = 400;

//timer = setInterval(function(){ img_cng(); },5000);

var tm;

$(function() {
	var cnt = 0;
	var mgn = 0;
	$("#btn li").each(function(i){
		cnt = cnt + 1;
		if( cnt != maxImage){
			mgn = 50 * cnt;
		}else{
			mgn = 0;
		}
		$(this).css({ marginTop : mgn });
	});

	$("#btn li").click(function(){
		nowHeihgt = parseInt($(this).css("marginTop").replace("px",""));
		if( nowHeihgt == 0 ){
			down();
		}else if( nowHeihgt == (imgHeight_s * 2) ){
			up();
		}
	});

	cnt = 0;
	mgn = 0;
	$("#img_box a").each(function(i){
		cnt = cnt + 1;
		if( cnt != maxImage){
			mgn = imgHeight * (cnt - 1);
		}else{
			mgn = imgHeight * -1;
		}
		$(this).css({ marginTop : mgn });
	});

	$("#up").click(function(i){
		down();
	});

	$("#down").click(function(i){
		up();
	});

	tm = setTimeout("timeChange();",3000);


});

function timeChange(){

	if( tm_lock == 0 ){
		lock = 1;
		$("#btn li").each(function(i){
			nowHeihgt = parseInt($(this).css("marginTop").replace("px",""));
			if( nowHeihgt < 0){
				mgn = imgHeight_s * (maxImage - 1);
				$(this).css({ marginTop : mgn });
			}
			nowHeihgt = parseInt($(this).css("marginTop").replace("px",""));
			mgn = nowHeihgt - imgHeight_s;
			$(this).stop().animate({ marginTop : mgn }
				, am_tm
				, easing
				, function(){
					nowHeihgt = parseInt($(this).css("marginTop").replace("px",""));
					if( nowHeihgt < 0){
						mgn = imgHeight_s * (maxImage - 1);
						$(this).css({ marginTop : mgn });
					}else if( nowHeihgt == imgHeight_s){
						$("#btn li img").removeClass("sel");
						$(this).children().addClass("sel");
					}
				}
			);
		});

		$("#img_box a").each(function(i){
			nowHeihgt = parseInt($(this).css("marginTop").replace("px",""));
			if( nowHeihgt <= ( imgHeight * -1 ) ){
				mgn = imgHeight * (maxImage - 2);
				$(this).css({ marginTop : mgn });
			}else{
				mgn = nowHeihgt - imgHeight;
				$(this).stop().animate({ marginTop : mgn }).oneTime(1000,function(){ lock = 0; });
			}
		});


	}
	tm_lock = 0;
	tm = setTimeout("timeChange();",timer);


}


function up() {
	if(lock == 0){
		lock = 1;
		tm_lock = 1;
		$("#btn li").each(function(i){
			nowHeihgt = parseInt($(this).css("marginTop").replace("px",""));
			if( nowHeihgt < 0){
				mgn = imgHeight_s * (maxImage - 1);
				$(this).css({ marginTop : mgn });
			}
			nowHeihgt = parseInt($(this).css("marginTop").replace("px",""));
			mgn = nowHeihgt - imgHeight_s;
			$(this).stop().animate({ marginTop : mgn }
				, am_tm
				, easing
				, function(){
					nowHeihgt = parseInt($(this).css("marginTop").replace("px",""));
					if( nowHeihgt < 0){
						mgn = imgHeight_s * (maxImage - 1);
						$(this).css({ marginTop : mgn });
					}else if( nowHeihgt == imgHeight_s){
						$("#btn li img").removeClass("sel");
						$(this).children().addClass("sel");
					}
				}
			);
		});

		$("#img_box a").each(function(i){
			nowHeihgt = parseInt($(this).css("marginTop").replace("px",""));
			if( nowHeihgt <= ( imgHeight * -1 ) ){
				mgn = imgHeight * (maxImage - 2);
				$(this).css({ marginTop : mgn });
			}else{
				mgn = nowHeihgt - imgHeight;
				$(this).stop().animate({ marginTop : mgn });
			}
		}).oneTime(1000,function(){ lock = 0; });
	}
}

function down() {
	if(lock == 0){
		lock = 1;
		tm_lock = 1;
		$("#btn li").each(function(i){
			nowHeihgt = parseInt($(this).css("marginTop").replace("px",""));
			if( nowHeihgt > imgHeight_s * (maxImage - 2)  ){
				mgn = imgHeight_s * -1;
				$(this).css({ marginTop : mgn });
			}
			nowHeihgt = parseInt($(this).css("marginTop").replace("px",""));
			mgn = nowHeihgt + imgHeight_s;
			$(this).stop().animate({ marginTop : mgn }
				, am_tm
				, easing
				, function(){
					nowHeihgt = parseInt($(this).css("marginTop").replace("px",""));
					if( nowHeihgt >= imgHeight_s * ( maxImage - 1 ) ){
						mgn = imgHeight_s * -1;
						$(this).css({ marginTop : mgn });
					}else if( nowHeihgt == imgHeight_s){
						$("#btn li img").removeClass("sel");
						$(this).children().addClass("sel");
					}
				}
			);
		});

		$("#img_box a").each(function(i){
			nowHeihgt = parseInt($(this).css("marginTop").replace("px",""));
			if( nowHeihgt >= ( ( imgHeight ) * ( maxImage - 2 ) ) ){
				mgn = ( imgHeight ) * -1;
				$(this).css({ marginTop : mgn });
			}else{
				mgn = nowHeihgt + imgHeight;
				$(this).stop().animate({ marginTop : mgn });
			}
		}).oneTime(800,function(){ lock = 0; });
	}
}

function img_cng() {
	if(i < no){
		i = i + 1;
	}else{
		i = 1;
	}
	var Height = nowHeihgt - imgHeight * (i-1);
	$("#img_box").animate({
	    top: '+='+Height+'px'
	}, "slow");
	nowHeihgt = imgHeight * (i-1);
}
function now_cng() {
	$("#big_banner").fadeOut(500,src_cng).fadeIn(500);
	$("#btn1").attr('src', 'common/img/2011/main_img_btn_1.jpg');
	$("#btn2").attr('src', 'common/img/2011/main_img_btn_2.jpg');
	$("#btn3").attr('src', 'common/img/2011/main_img_btn_3.jpg');
	$("#btn4").attr('src', 'common/img/2011/main_img_btn_4.jpg');
	$("#btn"+i).attr('src', 'common/img/2011/main_img_btn_'+ i +'_sel.jpg');
}

function src_cng(){
	$("#big_banner").attr('src', 'common/img/2011/banner/'+ i +'.jpg');

}