$(document).ready(function() {
	var mainList = $("#main-list .main-block");
	var tabList = $("#main-tab li");
	var now = 0;
	var timerID;
	var timerInterval = 8500;
	var tabFlag = false;

	mainList.each(function() {
		this.firstImage = $(this).find(".first-image");
		this.mainImage = $(this).find(".main-image");
		this.mainLead = $(this).find(".main-lead").find("img");
		this.serviceList = $(this).find(".main-box li");
		if (this.serviceList.length <= 3) {
			$(this).find(".main-box ul").addClass("block-" + this.serviceList.length);
		}

		this.firstImage.hide();
		this.mainImage.hide();
		this.mainLead.css({
			"opacity": "1",
			"display": "none"
		});

		this.showVisual = function() {
			this.firstImage.fadeIn(1000);
			this.mainImage.delay(2000).fadeIn(2200);

			this.mainLead.delay(1800).css({
				marginRight: "-60px",
				marginLeft: "60px",
				display: "block",
				opacity: 0
			}).animate({
				marginRight: "0",
				marginLeft: "0",
				opacity: 1
			}, {
				duration: 700,
				easing: "easeOutQuad"
			});

			this.serviceList.each(function(i, v) {
				//var timing = (this.serviceList.length >= 3) ? (3500 + i * 250) : (3500 + i * 550);
				$(this).delay(3500 + i * 250).css({
					marginRight: "-10px",
					marginLeft: "10px",
					display: "block",
					opacity: 0
				}).animate({
					marginRight: "0",
					marginLeft: "0",
					opacity: 1
				}, {
					duration: 600,
					easing: "easeOutQuad"
				});
			});

		};

		this.hideVisual = function() {
			this.firstImage.hide();
			this.mainImage.hide();
			this.mainLead.hide();
			this.serviceList.hide();
		};
	});

	var tabTimer = function(){
		timerID = setTimeout(function() {
			var next = now + 1;
			if(now == tabList.length) {
				now = 0;
				next = 1;
			}else if(next == tabList.length) {
				next = 0;
			}
			tabList.eq(now).removeClass("selected");
			tabList.eq(next).addClass("selected");
			tabList.eq(next).click();
		}, timerInterval);
		return false;
	};

	tabList.each(function(i){
		var image_cache = new Object();
		var img = $("a img",this);
		this.imgsrc = img.attr("src");
		var dot = this.imgsrc.lastIndexOf('.');
		this.imgsrc_on = this.imgsrc.substr(0, dot) + '-on' + this.imgsrc.substr(dot, 4);
		image_cache[this.imgsrc] = new Image();
		image_cache[this.imgsrc].src = this.imgsrc_on;
		$(this).click(function(){
			clearTimeout(timerID);
			if (!tabFlag) {
				tabFlag = true;

				mainList[now].hideVisual();
				mainList[i].showVisual();

				mainList.delay(100).fadeOut(500);
				mainList.eq(i).delay(100).fadeIn(500, function() {
					tabFlag = false;
				});
				var selectImg = $("#main-tab ul li.selected a img");
				tabList.eq(now).find("img").attr("src", tabList[now].imgsrc);
				$("#main-tab ul li.selected").removeClass("selected");
				//tabList.eq(i).addClass("selected");
				$(this).addClass("selected");
				now = i;
				tabList.eq(i).find("img").attr("src", tabList[now].imgsrc_on);
				tabTimer();
			}
			return false;
		});
		
		$(this).hover(
			function(){
				$("a img",this).attr("src", this.imgsrc_on);
			},
			function(){
				if($(this).hasClass("selected") == false){
					$("a img",this).attr("src", this.imgsrc);
				}
			}
		);
		
	});
	mainList.eq(0).hide();
	tabList.eq(0).click();
});

