https://www.midstatechamber.com/photorotator/includes/rotator_fade.js

1$(document).ready(function () {
2
3    var slideIndex = 0;
4    var totalSlides = 0;
5    var slideInterval;
6
7    var element = $('#photoRotator');
8
9    var autoSlide = (element.data('autoslide') == true);
10    var autoSlideTimer = parseInt(element.data('autoslidetimer')) * 1000;
11
12    element.find('div.slide:first').addClass('on');
13    totalSlides = element.find('div.slide').length;
14
15    if (autoSlide) {
16        slideInterval = setInterval(function () { goToNextSlide() }, autoSlideTimer);
17    }
18
19    $('a.prev').click(function () {
20        goToPrevSlide();
21        resetSlideTimer();
22    });
23    $('a.next').click(function () {
24        goToNextSlide();
25        resetSlideTimer();
26    });
27
28    $('.slideSelectors a.item').click(function () {
29        //get selector index
30        var index = $('.slideSelectors a.item').index(this);
31        element.find('div.slide').removeClass('on');
32        element.find('div.slide').eq(index).addClass('on');
33
34        //add the selected class
35        $('.slideSelectors a.item').removeClass('selected');
36        $(this).addClass('selected');
37
38        resetSlideTimer();
39    });
40
41    var setSlideSelector = function () {
42        //get index of current slide
43        var index = element.find('div.slide').index($('#photoRotator div.on:first'));
44
45        //add the selected class
46        $('.slideSelectors a.item').removeClass('selected');
47        $('.slideSelectors a.item').eq(index).addClass('selected');
48    };
49
50    var goToNextSlide = function () {
51        slideIndex = slideIndex + 1;
52        if (slideIndex >= totalSlides) {
53            slideIndex = 0;
54        }
55        element.find('div.slide').removeClass('on');
56        element.find('div.slide').eq(slideIndex).addClass('on');
57
58        setNextPrevSlides();
59        setSlideSelector();
60    };
61
62    var goToPrevSlide = function () {
63        if (slideIndex == 0) {
64            slideIndex = totalSlides - 1;
65        }
66        else {
67            slideIndex = slideIndex - 1;
68        }
69
70        element.find('div.slide').removeClass('on');
71        element.find('div.slide').eq(slideIndex).addClass('on');
72
73        setNextPrevSlides();
74        setSlideSelector();
75    };
76
77    var resetSlideTimer = function () {
78        //reset the interval
79        if (autoSlide) {
80            clearInterval(slideInterval);
81            slideInterval = setInterval(function () { goToNextSlide() }, autoSlideTimer);
82        }
83    }
84
85    var setNextPrevSlides = function () {
86        element.find('div.slide').removeClass('nextSlide').removeClass('prevSlide');
87
88        //next
89        if (slideIndex < totalSlides - 1) {
90            element.find('div.slide').eq(slideIndex + 1).addClass('nextSlide');
91        }
92        else {
93            element.find('div.slide').eq(0).addClass('nextSlide');
94        }
95
96        //prev
97        if (slideIndex > 0) {
98            element.find('div.slide').eq(slideIndex - 1).addClass('prevSlide');
99        }
100        else {
101            element.find('div.slide').eq(totalSlides - 1).addClass('prevSlide');
102        }
103    }
104
105    setNextPrevSlides();
106    setSlideSelector();
107});