jQuery(document).ready(function($){

	var currSectionId = '1';
	var currProductId = '1';
	var firstLoad = true;
	var speed = 600;
	var easing = 'easeOutQuad';
	var banner = $('#banner');
	var products = $('.products', banner);
	var productNavigation = $('.product-navigation', banner);
	var sectionNavigation = $('.section-navigation', banner);
	var prd = 1;
	
	$('.box,.program,.products > .title,.content,.more-info').hide()
	
	function gotoSection(id){
		if(!firstLoad) {
			$('.title[data-section-id='+currSectionId+']', sectionNavigation).fadeOut(300);
			$('ul[data-section-id='+currSectionId+']', productNavigation).fadeOut(300);
		}
		$('.title[data-section-id='+id+']', sectionNavigation).delay(300).fadeIn();
		$('ul[data-section-id='+id+']', productNavigation).delay(300).fadeIn();
		var productId = $('ul[data-section-id='+id+'] li a', productNavigation).first().data('product-id');
		gotoProduct(productId);
		currSectionId = id;
	}
	
	function gotoProduct(id){
		var currProduct = $('.product[data-product-id='+currProductId+']', products);
		var newProduct = $('.product[data-product-id='+id+']', products);
		if(!firstLoad) {
			currProduct.fadeOut(200);
		}
		newProduct.delay(200).show(0, function(){
			var box = $('.box', newProduct);
			var program = $('.program', newProduct);
			box.css({top: -200, left: parseFloat(box.data('end-x'))}).show().animate({top: parseFloat(box.data('end-y'))}, speed, easing);
			program.css({top: -400, left: parseFloat(program.data('end-x'))}).show().delay(200).animate({top: parseFloat(program.data('end-y'))}, speed, easing);
			$('.title', newProduct).css({top: 45, left: 900}).show().delay(400).animate({left: 390}, speed, 'easeOutQuint');
			$('.content', newProduct).css({top: 105, left: 900}).show().delay(800).animate({left: 392}, speed, 'easeOutQuint');
			$('.more-info', newProduct).css({top: 255, left: 900}).show().delay(1200).animate({left: 390}, speed, 'easeOutQuint');
			currProductId = id;
		});
		$('li', productNavigation).removeClass('current');
		$('a[data-product-id='+ id +']', productNavigation).parent().addClass('current');
	}
	
		$('.product-btn', productNavigation).click(function(){
				var cPrd = ($(this).data('product-id'));
				gotoProduct(cPrd);
				prd = cPrd;
		});
		
		$('.prev-btn', sectionNavigation).click(function(){
			var id = $('ul[data-section-id='+currSectionId+']', productNavigation).prev().data('section-id');
			if(!id){
				id = $('ul', productNavigation).last().data('section-id');
			}
			gotoSection(id);
		});
		
		$('.next-btn', sectionNavigation).click(function(){
			var id = $('ul[data-section-id='+currSectionId+']', productNavigation).next().data('section-id');
			if(!id){
				id = $('ul', productNavigation).first().data('section-id');
			}
			gotoSection(id);
		});
		
		gotoSection(currSectionId);
		firstLoad = false;
	
	var autoscroll = true;
	
		$('#banner').mouseover(function() {
			autoscroll = false;
		}).mouseout(function () {
			autoscroll = true;
		});
		
	setInterval(function(){
		if (autoscroll) {
			var newPrd = prd + 1;
			gotoProduct(newPrd);
			if(newPrd!=12) {
			prd = newPrd;
			}
			else prd = 0;
			if(prd == 1) {
				gotoSection(1);
			}			
			if(prd == 5) {
				gotoSection(2);
			}	
			if(prd == 9) {
				gotoSection(3);
			}	
		}
	}, 6000);
	
});