var carouselImgArr = [];
var carouselMsgArr = [];
var hoverImgNumber = 0;
var initialPosition = true;


$(document).ready(
    function () {
		 //Call function that will set all carousel images into an array
		 if (initialPosition) {
			LoadCarouselArray();
			LoadMsgArray();
						
			//Initially hide all messages 
			$.each(carouselMsgArr, function (index, value) {
				$(value).hide();
			});
			
		 }
		//Call the function that will listen for the rollover
        LoadCarousel();
	}
);

//Put all carousel images into an array
this.LoadCarouselArray = function () {
    for (var i = 0; i < $("div.AccImg").length; i++) {
        carouselImgArr.push($("div.AccImg")[i]);
   }
};

//Put all message divs into an array
this.LoadMsgArray = function () {
    for (var i = 0; i < $("div.Message").length; i++) {
        carouselMsgArr.push($("div.Message")[i]);
   }
};

//Function called when an image in the carousel is hovered over
this.LoadCarousel = function () {
    $("div.AccImg").hover(
                function () {
                   	hoverImgNumber = this.title;
                    shufflePics(hoverImgNumber);
					internalDivAppear(hoverImgNumber);
                }, function () {
              });
};

this.shufflePics = function (moused) {
    initialPosition = false;
	 $.each(carouselImgArr, function (i, v) {
		if (v.title == moused) {
			$(v).stop().animate({ width: "66%" }, "slow");
		}else
		{
			$(v).stop().animate({ width: "17%" }, "slow");
		}
	});
	 
	}; 
	
this.internalDivAppear = function (moused) {
	 $.each(carouselMsgArr, function (i, v) {
		if (v.title == moused) {
			$(v).stop().delay(500).fadeIn("slow", function() {
        // Animation complete
     	 });
		}else
		{
			$(v).stop().hide();
		}
	});
	 
	};