// Goodwill Industries of Central Indiana custom jQuery function for the Image Rotator

(function ($) {

    $.fn.gwImageRotator = function () {
        var args = arguments[0] || {}; // the plugin arguments
        var delay = args.delay; // how long is the delay?
        var list = $(this).append('<ul></ul>'); // create the unordered list
        var count = $('img', this).length; // how many images are there?
        var imgs = $('img', this); // get the images in the div
        var boxLinkBg = '#000'; // the box link background color
        var boxLinkBgRot = '#fff' // the boxlink color when highlighted
        var boxLinkBgHover = '#fff'; // the boxlink background color when hovered over
        var counter = 0;

        for (i = 0; i < count; i++) { // display our box links

            $('ul', this).append('<li></li>'); // lets append each box link to our unordered list

        }

        // our function for displaying the image
        function showImg() {
            imgs.fadeOut(300).filter(function (index) {
                return index == counter % count;
            }).fadeIn(300);

            $('li', list).css('background-color', boxLinkBg).filter(function (index) {
                return index == counter % count;
            }).css('background-color', boxLinkBgRot);

            counter++;
        };

        showImg();

        // lets set it to display images according to the delay value
        setInterval(function () {
            showImg();
        }, 1500 * delay);

//        $('li', list).hover( // lets change color on the mouse hover
//            function () {
//                $(this).animate({
//                    backgroundColor: boxLinkBgHover
//                });
//            },
//            function () {
//                var bgcolor = $(this).css('backgroundColor');
//                $(this).animate({
//                    backgroundColor: bgColor
//                });
//            }
//        );

//        $('li', list).click(function () {
//            var index = $(this).index();

//            $('div.gwImageRotator > img').fadeOut(300).filter('div.gwImageRotator > img:eq(' + index + ')').fadeIn(300);

//        });

    };

})(jQuery);