﻿
//PWI Video Slider - Written By Mike Horen 9/11/2010

var arrSlidePic = [
           		{
           			imgSlide: "http://images-cdn.perfectworld.com/en/portal/media/slidePic01.jpg", 
           			imgHref: "/media/listEpisode/?sid=12",
           			imgTitle: "Naruto Shippuden",
           			imgDescription: "Naruto Uzumaki wants to be the best ninja in the land. He's done well so far, but with the looming danger posed by the mysterious Akatsuki organization, Naruto knows he must train harder than ever and leaves his village for intense exercises that will push him to his limits. As Naruto finds out more about the Akatsuki’s goals in his ever-continuing search for Sasuke, he realizes that nothing in his universe is as it seems. Naruto is finding that he’s older, but will he prove wiser or stronger?"
           		},
           		{
           			imgSlide: "http://images-cdn.perfectworld.com/en/portal/media/slidePic02.jpg", 
           			imgHref: "/media/listEpisode/?sid=19",
           			imgTitle: "Shugo Chara!",
           			imgDescription: "The heroine of the story, Amu Hinamori, is a transfer student at Seiyo Elementary. At first glance, her classmates deem her \"cool and spicy\" and rumors speculate about her personal life. However, her real personality is that of a very shy girl who has trouble showing her true personality.  One day she wakes up to find three decorated eggs, and when each egg hatches, a little Guardian Character emerges to help Amu express her different selves."
           		},
           		{
           			imgSlide: "http://images-cdn.perfectworld.com/en/portal/media/slidePic03.jpg", 
           			imgHref: "/media/listEpisode/?sid=20",
           			imgTitle: "Skip Beat!",
           			imgDescription: "The story of Skip Beat! is about Kyoko Mogami, a wistful yet cheery sixteen year-old girl who loves her childhood friend, Shotaro, but is cruelly betrayed and thus seeks revenge against him."
           		},
           		{
           			imgSlide: "http://images-cdn.perfectworld.com/en/portal/media/slidePic04.jpg", 
           			imgHref: "/media/listEpisode/?sid=6",
           			imgTitle: "Gintama",
           			imgDescription: "The Shogunate has become a puppet of alien occupation armies. All samurais have been disarmed and reduced to temp workers with no skills who just try to make ends meet. Gintama is a story of a handyman named Gintoki, a samurai with no respect for rules set by the invaders, who's ready to take any job to survive with his Odd Jobs gang..."
           		},
           		{
           			imgSlide: "http://images-cdn.perfectworld.com/en/portal/media/slidePic05.jpg", 
           			imgHref: "/media/listEpisode/?sid=121",
           			imgTitle: "Coffee Prince",
           			imgDescription: "Go Eun-chan (Yoon Eun-hye) is a bright young girl who works multiple jobs to help keep her family afloat. One day, a great opportunity lands in her lap, but there’s a catch. This coffee shop only hires good-looking males. Eun-chan takes on the disguise of a male, causes misunderstandings among her co-workers, and discovers her dream of becoming a barista."
           		}
];

VS = { //video slider object
		// 0 indexed
		curVid:  0, //keeps track of what video we're on
		vidNum: 4, //number of videos
		timer: 5, //seconds
		slideSpeed: .6, //speed of animation in seconds
		pt1: -597, //hidden left point
		pt2: 0, //visible
		pt3: 597, //hidden right point
		timerObject: null, //will hold the setInterval Method
		toggle: true, //to keep track of which of the two anchors are visible, if this is true #lnkSlidePicAlt is next, if false the other one is next
		
		play: function(){
		
			this.timerObject = setInterval(this.slideLeft, this.timer * 1000);
			this.preloader();
			
			$('#btnSlideNext').bind('click', VS.slideLeft);
			$('#btnSlidePrev').bind('click', VS.slideRight);
			$('#slideNavWrap').find('a').bind('click', VS.goTo);
			

		},
		
		slideLeft: function(){ //next arrow or timer
			
			if(!$('#lnkSlidePicAlt').is(":animated")){
				
				VS.resetTimeout();
				
				if(VS.toggle){
					
					$('#lnkSlidePicAlt').css('left', VS.pt3 + 'px');
					var a = '#lnkSlidePic';
					var b = '#lnkSlidePicAlt';
					VS.toggle = false;
					
				}else{
					
					$('#lnkSlidePic').css('left', VS.pt3 + 'px');
					var a = '#lnkSlidePicAlt';
					var b = '#lnkSlidePic';
					VS.toggle = true;
					
				}
				
				(VS.curVid == VS.vidNum)? VS.curVid = 0: VS.curVid++; //figure out current video
				
				VS.formatNext();
	
				$(a).animate({  left: VS.pt1  }, VS.slideSpeed * 1000, 'swing');
				$(b).animate({  left: VS.pt2  }, VS.slideSpeed * 1000, 'swing');
			
			}//end if
		},
		
		slideRight: function(){ //right arrow is clicked
			
			if(!$('#lnkSlidePicAlt').is(":animated")){
			
				VS.resetTimeout();
				
				if(VS.toggle){
					
					$('#lnkSlidePicAlt').css('left', VS.pt1 + 'px');
					var a = '#lnkSlidePic';
					var b = '#lnkSlidePicAlt';
					VS.toggle = false;
					
				}else{
					
					$('#lnkSlidePic').css('left', VS.pt1 + 'px');
					var a = '#lnkSlidePicAlt';
					var b = '#lnkSlidePic';
					VS.toggle = true;
					
				}
				
				(VS.curVid == 0)? VS.curVid = VS.vidNum: VS.curVid--; //figure out current video
				
				VS.formatNext();
				
				$(a).animate({  left: VS.pt3  }, VS.slideSpeed * 1000, 'swing');
				$(b).animate({  left: VS.pt2  }, VS.slideSpeed * 1000, 'swing');
			
			}//end if
		},
		
		goTo: function(){ //navigation icons are clicked
		
			if(!$('#lnkSlidePicAlt').is(":animated")){
			
				VS.resetTimeout();
				
				if(VS.toggle){
					
					$('#lnkSlidePicAlt').css('left', VS.pt3 + 'px');
					var a = '#lnkSlidePic';
					var b = '#lnkSlidePicAlt';
					VS.toggle = false;
					
				}else{
					
					$('#lnkSlidePic').css('left', VS.pt3 + 'px');
					var a = '#lnkSlidePicAlt';
					var b = '#lnkSlidePic';
					VS.toggle = true;
				}
				
				$('#slideNavWrap').find('a').removeClass('current');
				$(this).addClass('current');
				
				for(var i=0; i<VS.vidNum; i++){ //determines which icon was clicked where i is the index of the icon clicked
				
					if($('#slideNavWrap').find('a').eq(i).hasClass('current')) break;
				}
				
				VS.curVid = i;
				VS.formatNext();
				
				$(a).animate({  left: VS.pt1  }, VS.slideSpeed * 1000, 'swing');
				$(b).animate({  left: VS.pt2  }, VS.slideSpeed * 1000, 'swing');
			
			} //end if
			
		},
		
		formatNext: function(){ //this generates and formats the incoming banner
			
			if(VS.toggle){
				
				$('#lnkSlidePic').css('background', 'url('+arrSlidePic[VS.curVid].imgSlide+')');
				$('#lnkSlidePic').attr('href', arrSlidePic[VS.curVid].imgHref);
				
			}else{
				
				$('#lnkSlidePicAlt').css('background', 'url('+arrSlidePic[VS.curVid].imgSlide+')');
				$('#lnkSlidePicAlt').attr('href', arrSlidePic[VS.curVid].imgHref);
			}
			
			$('#slideDescription').find('h3').fadeOut(200);
			$('#slideDescription').find('div.content').fadeOut(200);
			
			setTimeout("$('#slideDescription').find('h3').eq(0).remove(); $('#slideDescription').find('div.content').eq(0).remove();", 200);

			$('#slideDescription').append('<h3>'+arrSlidePic[VS.curVid].imgTitle+'</h3><div class="content">'+arrSlidePic[VS.curVid].imgDescription+'</div>');
			
			$('#slideNavWrap').find('a').removeClass('current');
			$('#slideNavWrap').find('a').eq(VS.curVid).addClass('current');
			
		},
		
		resetTimeout: function(){
			
			clearTimeout(VS.timerObject);
			VS.timerObject = setInterval(VS.slideLeft, VS.timer * 1000)
			
		},
		
		preloader: function(){ //preload images
			
			for(var i = 0; i<VS.vidNum; i++){
				
				preLoadImg(arrSlidePic[i].imgSlide);
				
			}
			
		}

}

