var timer;
var setTime = 4000;

$(function(){
	$("#jpre").mouseover(function(){
		$("#jpre img").attr("src","./img/slide_left_on.jpg");
	});
	$("#jpre").mouseout(function(){
		$("#jpre img").attr("src","./img/slide_left_off.jpg");
	});

	$("#jnext").mouseover(function(){
		$("#jnext img").attr("src","./img/slide_right_on.jpg");
	});
	$("#jnext").mouseout(function(){
		$("#jnext img").attr("src","./img/slide_right_off.jpg");
	});

	$("#outdoor_banner").mouseover(function(){
		$("#outdoor_banner img").attr("src","./img/outdoor-banner-on.png");
	});
	$("#outdoor_banner").mouseout(function(){
		$("#outdoor_banner img").attr("src","./img/outdoor-banner-off.png");
	});

	$("#ski_banner").mouseover(function(){
		$("#ski_banner img").attr("src","./img/ski-banner-on.png");
	});
	$("#ski_banner").mouseout(function(){
		$("#ski_banner img").attr("src","./img/ski-banner-off.png");
	});
});


$(document).ready(function() {
	$("#myController").jFlow({
	slides: "#slides",
	controller: ".jFlowControl",
	slideWrapper : "#jFlowSlide",
	selectedWrapper: "jFlowSelected",
	width: "960px",
	height: "70px",
	prev: ".jFlowPrev",
	next: ".jFlowNext"
	});
});

var strArray = new Array(
	"outdoor.jpg,outdoor_bg.jpg,outdoor_btn_on.jpg,outdoor_btn_off.jpg,outdoor_btn",
	"ski.jpg,ski_bg.jpg,ski_btn_on.jpg,ski_btn_off.jpg,ski_btn",
	"bcmap.jpg,bcmap_bg.jpg,bcmap_btn_on.jpg,bcmap_btn_off.jpg,bcmap_btn",
	"kanda.jpg,kanda_bg.jpg,kanda_btn_on.jpg,kanda_btn_off.jpg,kanda_btn",
	"online.jpg,online_bg.jpg,online_btn_on.jpg,online_btn_off.jpg,online_btn",
	"earthplaza.jpg,earthplaza_bg.jpg,earthplaza_btn_on.jpg,earthplaza_btn_off.jpg,earthplaza_btn",
	"hoka.jpg,hoka_bg.jpg,hoka_btn_on.jpg,hoka_btn_off.jpg,hoka_btn",
	"canoe.jpg,canoe_bg.jpg,canoe_btn_on.jpg,canoe_btn_off.jpg,canoe_btn"
);

var count = 2;
var all = strArray.length;
var timer; 

function funcA(s) {
	if(s == 0){
		;
	}
	else{
		count = s;
	}
	var acount = count - 1;
	var a = strArray[acount].split(",");
	var img1 = "./img/" + a[0];
	var img2 = "./img/" + a[1];
	var img3 = "./img/" + a[2];
	var img4 = "./img/" + a[3];
	var id_name = a[4];

	for(var i=0;i<all;i++){
		var b = strArray[i].split(",");
		$("#" + b[4] + " img").attr("src","./img/" + b[3]);
	}

	$("#photo1").css("background-image","url(" + img1 + ")");
	$("#photo2").fadeOut("slow",
	function(){
		$("#photo2").fadeIn();
		$("#photo2").css("background-image","url(" + img1 + ")");
	});


	$("#bg1").css("background-image","url(" + img2 + ")");
	$("#bg2").fadeOut("slow",
	function(){
		$("#bg2").fadeIn();
		$("#bg2").css("background-image","url(" + img2 + ")");
	});

	$("#" + id_name + " img").attr("src",img3);

	count++;
	if(count > all){
		count = 1;
	}
}

function setTimer(){
	timer = setInterval("funcA('0')",setTime);
}

window.onload = function() {
	timer = setInterval("funcA('0')",setTime);

	$("#outdoor_btn").mouseover(function(){
		clearInterval(timer);

		if ($("#photo2").is(':animated')) {
			;
		}
		else{
			funcA('1');
		}
	});
	$("#outdoor_btn").mouseout(function(){
		setTimer();
	});

	$("#ski_btn").mouseover(function(){
		clearInterval(timer);
		if ($("#photo2").is(':animated')) {
			;
		}
		else{
			funcA('2');
		}
	});
	$("#ski_btn").mouseout(function(){
		setTimer();
	});

	$("#bcmap_btn").mouseover(function(){
		clearInterval(timer);

		if ($("#photo2").is(':animated')) {
			;
		}
		else{
			funcA('3');
		}
	});
	$("#bcmap_btn").mouseout(function(){
		setTimer();
	});

	$("#kanda_btn").mouseover(function(){
		clearInterval(timer);

		if ($("#photo2").is(':animated')) {
			;
		}
		else{
			funcA('4');
		}
	});
	$("#kanda_btn").mouseout(function(){
		setTimer();
	});

	$("#online_btn").mouseover(function(){
		clearInterval(timer);

		if ($("#photo2").is(':animated')) {
			;
		}
		else{
			funcA('5');
		}
	});
	$("#online_btn").mouseout(function(){
		setTimer();
	});

	$("#earthplaza_btn").mouseover(function(){
		clearInterval(timer);

		if ($("#photo2").is(':animated')) {
			;
		}
		else{
			funcA('6');
		}
	});
	$("#earthplaza_btn").mouseout(function(){
		setTimer();
	});

	$("#hoka_btn").mouseover(function(){
		clearInterval(timer);
		if ($("#photo2").is(':animated')) {
			;
		}
		else{
			funcA('7');
		}
	});
	$("#hoka_btn").mouseout(function(){
		setTimer();
	});

	$("#canoe_btn").mouseover(function(){
		clearInterval(timer);
		if ($("#photo2").is(':animated')) {
			;
		}
		else{
			funcA('8');
		}
	});
	$("#canoe_btn").mouseout(function(){
		setTimer();
	});
}