﻿// Image Rotation Script by Adam Wilson

$(function() {

imgArray = new Array(); //fill array with images
imgArray[0] = new Image();
imgArray[0].src = 'images/homerotate1.jpg';
imgArray[0].title = 'It\'s about Quality';
imgArray[0].alt = 'We are dedicated to bringing you the highest quality maintenance and parts so that you can continue your journey worry-free.';
imgArray[1] = new Image();
imgArray[1].src = 'images/homerotate2.jpg';
imgArray[1].title = 'It\'s about the Environment';
imgArray[1].alt = 'We care about the environment. We have implemented industry leading practices to ensure that our work does not harm the environment and that your vehicle is as environmentally friendly as possible.';
imgArray[2] = new Image();
imgArray[2].src = 'images/homerotate3.jpg';
imgArray[2].title = 'It\'s about Service';
imgArray[2].alt = 'We understand that your car is important to you. Whether it is a simple oil change or a complete overhual, we will strive to serve you in any way that we can.';
imgArray[3] = new Image();
imgArray[3].src = 'images/homerotate4.jpg';
imgArray[3].title = 'It\'s about People';
imgArray[3].alt = 'We realize that people are the most important element of any business, whether they are customers, employees, or the community around us. We wish to not only service your vehicle, but to make sure that you are informed about your vehicle and help you make the right decisions.';

var numImages = 4; // total number of images. if there are more than this number, the ones above it in array will not show up!
var fadeTime = 14000; // how many miliseconds an image will display (1000 = 1 second)
var fadeOutTime = 1000; // how slowly images will transition, should be less than above image or crazy things may happen
var fadeTextTime = 750;

var count = 0;

//start rotating images
$('#Rotater').css('background','url("' + imgArray[count].src + '")');
$('#RotaterTitle').html(imgArray[count].title);
$('#RotaterText').html(imgArray[count].alt);
$('#Rotater img').attr('src',imgArray[count].src);
$('#Rotater img').fadeIn(fadeTime, function() {
	nextImg();
});

function nextImg() {
//rotate the counter
count++;
if (count>(numImages-1)) {
	count=0;
}

//do transition
$('#Rotater').css('background','url("' + imgArray[count].src + '")');

$('#RotaterText').fadeOut(fadeTextTime).delay(fadeTextTime);
$('#RotaterTitle').fadeOut(fadeTextTime).delay(fadeTextTime);
$('#Rotater img').fadeOut(fadeOutTime, function() {
	$('#RotaterTitle').html(imgArray[count].title);
	$('#RotaterText').html(imgArray[count].alt);
	$('#Rotater img').attr('src',imgArray[count].src);
	$('#RotaterTitle').fadeIn(fadeTextTime).delay(fadeTextTime);
	$('#RotaterText').fadeIn(fadeTextTime).delay(fadeTextTime);
	$('#Rotater img').fadeIn(fadeTime, function() {
			nextImg()		
		});
});
}
});
