﻿/*
   Image Rotator
   Copyright (c) 2010 Fruitful Media Ltd

   Requires: JQuery v1.4.4

   Notes:
   All images for a rotator should be placed in a unique directory (referenced by 'rotatePath').
   Images should have a prefix, followed by a number (in sequence)
   
   ---
   To start a rotator call rotateImages(imageId, rotateTime, rotatePath, imagePrefix, imageSuffix)
   e.g.
       rotateImages('myImage', '5000', 'http://mysite/images/myRotator', 'fruit', '.jpg')

       This will perform image rotation on img tag with id 'myImage'
       Images will change every 5000 milliseconds
       Images are held in directory located at http://mysite/images/myRotator
       Images are labelled fruit1.jpg, fruit2.jpg, fruit3.jpg etc.
*/

function rotateImages(imageId, rotateTime, rotatePath, imagePrefix, imageSuffix, nextImage, currentImage) {

    // check for wrapping div (if doesn't exist then create one!)
    if ($("#" + imageId + "-container").size() == 0) {

        $("#" + imageId).wrap('<div id="' + imageId + '-container" />');
    }

    setTimeout(function () {

        if (nextImage == undefined) {
            nextImage = 2;
            currentImage = 1;
        }

        var currentImageName = rotatePath + imagePrefix + currentImage + imageSuffix
        $("#" + imageId + "-container").css({ background: "url('" + currentImageName + "') no-repeat top left" });

        var imageName = rotatePath + imagePrefix + nextImage + imageSuffix
        $("#" + imageId).fadeOut(0).attr("src", imageName).fadeIn('slow', 'linear');

        currentImage = nextImage;
        nextImage = nextImage + 1;

        imageName = rotatePath + imagePrefix + nextImage + imageSuffix

        $.ajax({
            url: imageName,
            type: 'HEAD',
            error:
                            function () {
                                nextImage = 1;
                                rotateImages(imageId, rotateTime, rotatePath, imagePrefix, imageSuffix, nextImage, currentImage);
                            },
            success:
                            function () {
                                rotateImages(imageId, rotateTime, rotatePath, imagePrefix, imageSuffix, nextImage, currentImage);
                            }
        });


    }, rotateTime);

};
