﻿var rotate = {
	image_url: new Array(),
	counter: null,
	
	changeImage: function(type)
	{
		$('#imageSlide').fadeOut('fast', function() {
			if(type == 'prev')
			{
				rotate.counter = (rotate.counter > 1) ? (rotate.counter-1) : rotate.image_url.length;
				rotate.getImage(rotate.counter);
			}
			else
			{
				// determine next image
				rotate.counter = (rotate.counter < rotate.image_url.length) ? (rotate.counter+1) : 1;
				rotate.getImage(rotate.counter);
			}
		});
	},
	
	slideSwitch: function()
	{
		var $active = $('#small-images img.active');
	    if ( $active.length == 0 ) $active = $('#small-images img:last');
	    var $next =  $active.next().length ? $active.next()
	        : $('#small-images img:first');
	
	    $active.addClass('last-active');
	
	    $next.css({opacity: 0.0})
	        .addClass('active')
	        .animate({opacity: 1.0}, 1000, function() {
	            $active.removeClass('active last-active');
	        });
	        
	    var $active_txt = $('#banner-text div.active');
	    if ( $active_txt.length == 0 ) $active_txt = $('#banner-text div:last');
	    var $next_txt =  $active_txt.next().length ? $active_txt.next()
	        : $('#banner-text div:first');
	
	    $active_txt.addClass('last-active');
	
	    $next_txt.css({opacity: 0.0})
	        .addClass('active')
	        .animate({opacity: 1.0}, 1000, function() {
	            $active_txt.removeClass('active last-active');
	        });
	    
	    if (rotate.counter < rotate.image_url.length)
	    {
	    	rotate.counter = rotate.counter +1;
	    }
	    else
	    {
	    	rotate.counter = 1;
	    }
	    
	    $('#imageSlide').fadeOut('fast', function() {
			$('#imageSlide').css('background-image', 'url(' + rotate.image_url[rotate.counter-1] + ')');
			$('#imageSlide').fadeIn('fast');
		});
	    
	    $('#counter').html(rotate.counter + '/' + rotate.image_url.length);
		$('#pagination li a').each(function (i) {
			if (i == rotate.counter-1)
			{
				$(this).html('<img src="images/current.png" />');
			}
			else{
				$(this).html('<img src="images/item.png" />');
			}
		});
	},
	
	getImage: function(id)
	{
		$('#imageSlide').fadeOut('fast', function() {
			$('#imageSlide').css('background-image', 'url(' + rotate.image_url[id-1] + ')');
			$('#imageSlide').fadeIn('fast');
		});
		
		var $active = $('#small-images img.active');
	    if ( $active.length == 0 ) $active = $('#small-images img:last');
	    $active.addClass('last-active');
		
		$('#small-images img').each(function (i) {
			if (i == id-1)
			{
				$(this).css({opacity: 0.0})
			        .addClass('active')
			        .animate({opacity: 1.0}, 1000, function() {
			            $active.removeClass('active last-active');
			        });
			}
			else{
				if (!$(this).hasClass("last-active"))
				{
					$(this).removeClass();
				}
			}
		});
		
		var $active_txt = $('#banner-text div.active');
	    if ( $active_txt.length == 0 ) $active_txt = $('#banner-text div:last');
	    $active_txt.addClass('last-active');
		
		$('#banner-text div').each(function (i) {
			if (i == id-1)
			{
				$(this).css({opacity: 0.0})
			        .addClass('active')
			        .animate({opacity: 1.0}, 1000, function() {
			            $active_txt.removeClass('active last-active');
			        });
			}
			else{
				if (!$(this).hasClass("last-active"))
				{
					$(this).removeClass();
				}
			}
		});
		
		rotate.setCurrent(id);
	},
	
	setCurrent: function(id)
	{
		rotate.counter = id;
	    $('#counter').html(rotate.counter + '/' + rotate.image_url.length);
	    
		$('#pagination li a').each(function (i) {
			if (i == rotate.counter-1)
			{
				$(this).html('<img src="images/current.png" />');
			}
			else{
				$(this).html('<img src="images/item.png" />');
			}
		});	
	},
	
	init: function()
	{
		rotate.image_url[0] = 'images/banner-images/Bayview-lrg.jpg';
	    rotate.image_url[1] = 'images/banner-images/CentralFire-lrg.jpg';
	    rotate.image_url[2] = 'images/banner-images/ELIM-lrg.jpg';
	    rotate.image_url[3] = 'images/banner-images/FPO-lrg.jpg';
	    rotate.image_url[4] = 'images/banner-images/MariesBakery-lrg.jpg';
	    
		rotate.counter = 1;
		$('#imageSlide').css('background-image', 'url(' + rotate.image_url[rotate.counter-1] + ')');
		$('#counter').html(rotate.counter + '/' + rotate.image_url.length);
		
		$('#pagination li a').each(function (i) {
			i = i+1;
			if (i == 1)
			{
				$(this).html('<img src="images/current.png" />');
			}
			else{
				$(this).html('<img src="images/item.png" />');
			}
			//$(this).attr('href', i);
			$(this).bind('click', function() { rotate.getImage(i); });
		});
		
		// add event next / previous images
		$('#previous').bind('click', function() { rotate.changeImage('prev'); });
		$('#next').bind('click', function() { rotate.changeImage('next'); });
		
		// add background images if js enabled
		$('#previous').html('<img src="images/previous.png" alt="Previous Image" />');
		$('#next').html('<img src="images/next.png" alt="Next Image" />');
	}
}

$(document).ready( function(){ 
	var slideInterval = setInterval("rotate.slideSwitch()", 10000 );
	
	$('#imageSlide').hover(function() {
    	clearInterval(slideInterval);
   	}, function() {
		slideInterval = setInterval("rotate.slideSwitch()", 10000);
	});
	
	rotate.init();
});