var Background = {
	Init: function(){
		var speed = 1500;
		var delay = 4000;
		var presentImage = 0;
		//make div
		//$('.index').append('');
		//set div sytle
		$('#bg').css({
			position: 'absolute',
			top: 0,
			left: 0,
			bottom: 0,
			right: 0,
			overflow: 'hidden'
		});
		var windowWidth = $('#bg').width();
		var imgs = []
		for(var i = 0; i < 5; i++){
			makeImage(i+1);
		}
		function makeImage(x){
			var img = new Image();
			$(img).attr({
				src: 'assets/images/background_'+x+'.jpg',
				id: 'image'+x
			});
			$(img).css({
				position: 'absolute',
				opacity: 0
			});
			imgs.push(img);
		}
		var imgJoin = imgs.join("");
		
		//append image
		$('#bg').append(imgs[0]);
		$('#bg').append(imgs[1]);
		$('#bg').append(imgs[2]);
		$('#bg').append(imgs[3]);
		$('#bg').append(imgs[4]);
		
		function swapImg(){
			$('#'+imgs[presentImage].id).animate({
				opacity: 1
			},speed,null,function(){
				var self = this;
				function aniOut(){
					$(self).animate({
						opacity: 0
					},speed,null,function(){
						$(self).css({
							position: 'absolute',
							opacity: 0
						});
					});
				}
				setTimeout(aniOut,delay-(speed+100));
			});
			if(presentImage >= imgs.length-1){
				presentImage = 0;
			}else {
				presentImage += 1;
			}
			setTimeout(swapImg,delay);
		}
		swapImg();
	}
};
/*
var XBackground = {
	Init: function(){
		var speed = 1500;
		var delay = 4000;
		var presentImage = 0;
		//make div
		//$('.index').append('');
		//set div sytle
		$('#bg').css({
			position: 'absolute',
			top: 0,
			left: 0,
			bottom: 0,
			right: 0,
			overflow: 'hidden'
		});
		var windowWidth = $('#bg').width();
		var imgs = []
		for(var i = 0; i < 5; i++){
			makeImage(i+1);
		}
		function makeImage(x){
			var img = new Image();
			$(img).attr({
				src: 'assets/images/background_'+x+'.jpg',
				id: 'image'+x
			});
			$(img).css({
				position: 'absolute',
				opacity: 0,
				marginLeft: -windowWidth
			});
			imgs.push(img);
		}
		var imgJoin = imgs.join("");
		
		//append image
		$('#bg').append(imgs[0]);
		$('#bg').append(imgs[1]);
		$('#bg').append(imgs[2]);
		$('#bg').append(imgs[3]);
		$('#bg').append(imgs[4]);
		
		function swapImg(){
			$('#'+imgs[presentImage].id).animate({
				opacity: 1,
	            marginLeft: "0"
			},speed,null,function(){
				var self = this;
				function aniOut(){
					$(self).animate({
					//	opacity: 0,
			            marginLeft: windowWidth
					},speed,null,function(){
						$(self).css({
							position: 'absolute',
							opacity: 0,
							marginLeft: -windowWidth
						});
					});
				}
				setTimeout(aniOut,delay-(speed+100));
			});
			if(presentImage >= imgs.length-1){
				presentImage = 0;
			}else {
				presentImage += 1;
			}
			setTimeout(swapImg,delay);
		}
		swapImg();
	}
};
*/
var TitleBG= {
	Init: function() {
		

		//$('.mask').css('width','100px')
		
		
		var bgWidth = 0;
		var titleBGTimer;
		var titleString = $('h1.red a').html();
		//console.log(titleString.length );
		function titleBG(){
			bgWidth += 1;
			
			$('h1.red a').css('color','#FFFFFF');
			
			$('.mask').css('width',bgWidth+'px')
			titleBGTimer = setTimeout(titleBG, 10);
			
			if(bgWidth >= 7){$('.g').fadeIn();}
			if(bgWidth >= 14){$('.o').fadeIn();}
			if(bgWidth >= 21){$('.d').fadeIn();}
			if(bgWidth >= 34){$('.e').fadeIn();}
			if(bgWidth >= 35){$('.r').fadeIn();}
			if(bgWidth >= 40){$('.b').fadeIn();}
			if(bgWidth >= 50){$('.a').fadeIn();}
			if(bgWidth >= 60){$('.u').fadeIn();}
			if(bgWidth >= 70){$('.e2').fadeIn();}
			if(bgWidth >= 80){$('.r2').fadeIn();}
			if(bgWidth >= 240){
				clearInterval(titleBGTimer)
			}
		}
		titleBG();
	}
};
