jQuery.noConflict(); var $ = jQuery;

$(function() {

	////////////////////////////////////////////////////////////////////////////////////////////////////	
	// cookie | language | layout
	////////////////////////////////////////////////////////////////////////////////////////////////////	

	setCookie();	
	initLng();
	doMasonry();

	////////////////////////////////////////////////////////////////////////////////////////////////////	
	// opening animation
	////////////////////////////////////////////////////////////////////////////////////////////////////	

	var sprite=0;	
	anm_obj = new Array("#logo","#submenu","#menu","#content","#footer");

	$.timer(400, function (timer) {
	
	 	if(sprite==anm_obj.length){
			timer.stop();
		}else{
			$(anm_obj[sprite]).animate({opacity:1},{queue:false, duration:200});
			sprite++;
		}
		if(sprite==4){
			checkVisible();
		}
	
	});

	////////////////////////////////////////////////////////////////////////////////////////////////////	
	// masonry when resized
	////////////////////////////////////////////////////////////////////////////////////////////////////	
	
	$(window).resize(function () {
		doMasonry();
	});

	////////////////////////////////////////////////////////////////////////////////////////////////////	
	//text animation
	////////////////////////////////////////////////////////////////////////////////////////////////////	

	$(".text_shuffle").each(function(){
		$(this).data('orgTxt',$(this).html());
		$(this).data('isAnimated','false');
	});

	////////////////////////////////////////////////////////////////////////////////////////////////////	
	//box animation
	////////////////////////////////////////////////////////////////////////////////////////////////////	

	$("#header").find("a").hover(function(){
		$(this).animate({color: "#ff3399" },{queue:false, duration:200});
	},function(){
		$(this).animate({color: "#444" },{queue:false, duration:200});	
	});
	
	$(".box").each(function(){
		$(this).data('isVisible','false');
	});

	$('.box').hover(function(){
		$(this).find(".text_shuffle").html($(this).find(".text_shuffle").data('orgTxt'));
		$(this).find(".text_shuffle").scrambledWriter();
		$(this).find("a").css('text-decoration','underline');
		$(this).find("img").animate({opacity:0.6},{queue:false, duration:200});
		$(this).find("h3").animate({color: "#ff3399" },{queue:false, duration:200});
		$(this).find("h4").animate({color: "#ff3399" },{queue:false, duration:200});
		$(this).find("h2").animate({color: "#ff3399" },{queue:false, duration:200});
		$(this).animate({color: "#ff3399" },{queue:false, duration:400});
	},function(){
		$(this).find("a").css('text-decoration','none');
		$(this).find("img").animate({opacity:1},{queue:false, duration:200});
		$(this).find("h3").animate({color: "#444" },{queue:false, duration:200});
		$(this).find("h4").animate({color: "#444" },{queue:false, duration:200});
		$(this).find("h2").animate({color: "#444" },{queue:false, duration:200});
		$(this).animate({color: "#444" },{queue:false, duration:400});
	})

	////////////////////////////////////////////////////////////////////////////////////////////////////	
	// check box visiblity when scroll
	////////////////////////////////////////////////////////////////////////////////////////////////////	
	
	$(window).scroll(function () {
		checkVisible();
	});

	////////////////////////////////////////////////////////////////////////////////////////////////////	
	// language switcher
	////////////////////////////////////////////////////////////////////////////////////////////////////	
	
	$(".lng_button a").click(function(){
		toggleLng($(this).html());
	});
	
})

/* FUNCTION */

//////////////////////////////////////////////////////////////////////////////////////////////////////////	
// setCookie
//////////////////////////////////////////////////////////////////////////////////////////////////////////	

function setCookie(){

	var whatCountry = geoplugin_countryName();
	
	var lng=$.cookie('lng');
	if(whatCountry == "Japan"){
		$.cookie('lng','JA',{path:'/'});
	
	}else{
		$.cookie('lng','EN',{path:'/'});
	
	}
}

//////////////////////////////////////////////////////////////////////////////////////////////////////////	
// initLng
//////////////////////////////////////////////////////////////////////////////////////////////////////////	

function initLng(){
	if($.cookie('lng')=='JA'){
		$(".EN").hide();
		$(".JA").show();
	}else if($.cookie('lng')=='EN'){
		$(".JA").hide();	
		$(".EN").show();
	}	
/* 	$("#lng .l_"+$.cookie('lng')).css('color','#33cc00'); */
}

//////////////////////////////////////////////////////////////////////////////////////////////////////////	
// doMasonry
//////////////////////////////////////////////////////////////////////////////////////////////////////////	

function doMasonry(){
	var colWrap = $("#wrap").width();
	var colNum = Math.floor(colWrap / 240);
	var colFixed = Math.floor(colWrap / colNum);
	$("#container").width(colNum*240+30);
	$('#boxes').masonry({
		columnWidth: 240
	});
}

//////////////////////////////////////////////////////////////////////////////////////////////////////////	
// checkVisible
//////////////////////////////////////////////////////////////////////////////////////////////////////////	

function checkVisible(){
	$(".box").each(function(){
		var me = $(this);
		if(isScrolledIntoView(me)){
			if(me.data('isVisible')=='false'){
				me.data('isVisible','true');

				if(me.css('opacity')=='0'){
						me.delay(200*(1+Math.floor(4*Math.random()))).animate({opacity:1},{queue:true, duration:200});
				
				}
			}
		}else{
			if(me.data('isVisible')=='true'){
				me.data('isVisible','false');
			}			
		}
	});
	$(".text_shuffle").each(function(){
		var me = $(this);
		if(isScrolledIntoView(me)){
			if(me.data('isVisible')=='false' || me.data('isVisible')==null){
				me.data('isVisible','true');
				$(this).scrambledWriter();
			}
		}else{
			if(me.data('isVisible')=='true'){
				me.data('isVisible','false');
			}			
		}
	});

}

function isScrolledIntoView(elem){
    var docViewTop = $(window).scrollTop();
    var docViewBottom = docViewTop + $(window).height();

    var elemTop = $(elem).offset().top;
    var elemBottom = elemTop + $(elem).height();

    return ((elemBottom >= docViewTop) && (elemTop <= docViewBottom));
}

//////////////////////////////////////////////////////////////////////////////////
//toggleLng
//////////////////////////////////////////////////////////////////////////////////

function toggleLng(lng){
	$("#wrap").animate({opacity:0},function(){	
/* 			$("#lng .l_"+$.cookie('lng')).css('color','#333'); */
		$.cookie('lng',lng,{expires:30,path:'/'});
		initLng();
		doMasonry();
		$("#wrap").animate({opacity:1});			
	});	
}