it/itf/static/js/frontpage.js

var slider;

$(function() {
    var slideInterval = 0;

    slider = new ItfSlider();
    $('#arrowLeft').click(function() {
        slider.moveRight(230, 150);
    });

    $('#arrowRight').click(function() {
        slider.moveLeft(230, 150);
    });


    $('#arrowLeft').mouseover(function() {
        slider.moveRight(230, 1500);
        slideInterval = setInterval(function() {
            slider.moveRight(230, 1500);
        }, 1500);       
    });

    $('#arrowLeft').mouseout(function() {
        clearInterval(slideInterval);
        slider.stop();
    });

    $('#arrowRight').mouseover(function() {
        slider.moveLeft(230, 1500);
        slideInterval = setInterval(function() {
            slider.moveLeft(230, 1500);
        }, 1500);    
    });

    $('#arrowRight').mouseout(function() {
        clearInterval(slideInterval);
        slider.stop();
    });

    $('#sliderTabs .tab').click(function() {
        var link = $(this).find(".moreTab").attr("href");
        location.href = link;
    });

    $('.banner').click(function() {
        var link = $(this).attr("data-link");
        if ($.trim(link) != '') {
            location.href = link;
        }
    });

    $('.buttons').click(function() {
        var $t = $(this);
        var buttonNo = parseInt($t.attr("id").replace("button", ""));
        $('.buttonsSelected').removeClass("buttonsSelected");
        $t.addClass("buttonsSelected");
        $('.banner').hide();
        $('.banner').eq(buttonNo).show();
        clearTimeout(frontImageTimeout);
        cycleFrontImages = false;
    });
});



/* for front images */
var frontImageTimeout;
$(function() {
    $('.banner').eq(0).show();
    $('#button0').addClass("buttonsSelected");
    frontImageTimeout = setTimeout(cycleFrontImage, 5000);
//    frontImageInterval = setInterval(cycleFrontImage, 1000); 

});

cycleFrontImages = true;
function cycleFrontImage() {
//    BOO = $('.buttonsSelected');
    var currImage = parseInt($('.buttonsSelected').attr("id").replace("button", ""));
    var currBanner = $('.banner').eq(currImage);
    if (currImage < ($('.buttons').length - 1)) {
        var nextImage = currImage + 1;
    } else {
        var nextImage = 0;
    }
//    console.log(nextImage);
    $('.banner').hide();
    $('.buttonsSelected').removeClass("buttonsSelected");
    $('.banner').eq(nextImage).show();
    $('#button' + nextImage).addClass("buttonsSelected");
    if (cycleFrontImages) frontImageTimeout = setTimeout(cycleFrontImage, 10000);
}
    

var ItfSlider = function(o) {
    var opts = $.extend({
        'jq': '#slider',
        'ul': '#sliderTabs',
        'li': '.tab',
        'width': 960,
        'liWidth': 230,
        'leftArr': '#arrowLeft',
        'rightArr': '#arrowRight'
    }, o);
    this.jq = $(opts.jq);
    this.ul = $(opts.ul);
    this.lis = this.ul.find(opts.li);
    this.leftArr = $(opts.leftArr);
    this.rightArr = $(opts.rightArr);
    this.width = opts.width;
    this.liWidth = opts.liWidth;    
    this.contentWidth = this.liWidth * this.lis.length;
    this.maxLeft = 0 - (this.contentWidth - this.width + 70);
    this.getLeft = function() {
        return parseInt(this.ul.css("left").replace("px", ""));
    };
    this.positionArrow = function() {
        var arrLeft = (0 - this.getLeft()) + (this.contentWidth - 10);
        console.log(arrLeft);
        this.rightArr.animate({'left': arrLeft + "px"});
    };
    this.stop = function() {
        this.ul.stop();
    };
};

ItfSlider.prototype.moveLeft = function(distance, speed) {
    if (typeof(distance) == 'undefined') {
        distance = this.liWidth;
    } 
    this.ul.stop();
    var left = this.getLeft();
    if (left > this.maxLeft) {
        var newLeft = left - distance;
        if (newLeft < this.maxLeft) { newLeft = this.maxLeft; }
        this.ul.animate({"left": newLeft + "px"}, speed);
//        this.positionArrow();
    }
};

ItfSlider.prototype.moveRight = function(distance, speed) {
    if (typeof(distance) == 'undefined') {
        distance = this.liWidth;
    }
    this.ul.stop();
    var left = this.getLeft();
    if (left <= 0) {
        var newLeft = left + distance;
        if (newLeft > 0) { newLeft = 0; }
        this.ul.animate({'left': newLeft + "px"}, speed);
//        this.positionArrow();
    }
};