var staffScrollSpeed = 10;
var staffScrollDisplayWidth = 0;
var staffScrollTimer;

jQuery(document).ready(function($) {
    /* Staff Profiles */
    var staffProfile = $("div[@rel$=staffprofile]");
    staffScrollSpeed = 10;
    staffScrollDisplayWidth = staffProfile.find("div.stafflist").width();
    if (staffProfile.length) {
        var staffWidth = 144;
        var staffMargin = 4;
        var numStaff = parseInt(staffProfile.attr("rel"));
        staffProfile.find("div.stafflist > ul").css("width", (staffWidth * numStaff) + "px");
        
        // Attach scrolling events
        staffProfile.find("div.controls").find("a.prev").unbind("mousedown").bind("mousedown", toggleScrollStaffLeft);
        staffProfile.find("div.controls").find("a.next").unbind("mousedown").bind("mousedown", toggleScrollStaffRight);
        staffProfile.find("div.controls").find("a.prev").bind("mouseup", stopScroll);
        staffProfile.find("div.controls").find("a.next").bind("mouseup", stopScroll);
    }
});

function toggleScrollStaffLeft() {
    staffScrollTimer = setInterval(scrollStaffLeft, staffScrollSpeed);
}

function toggleScrollStaffRight() {
    staffScrollTimer = setInterval(scrollStaffRight, staffScrollSpeed);
}

function stopScroll() {
    clearInterval(staffScrollTimer);
}

function scrollStaffLeft() {
    var ul = staffProfile = $("div[@rel$=staffprofile] > div.stafflist > ul");
    var left = parseInt(ul.css("left"));
    if (left < -1) {
        ul.css("left", (left + staffScrollSpeed) + "px");
    } else {
        clearInterval(staffScrollTimer);
    }
}

function scrollStaffRight() {
    var ul = staffProfile = $("div[@rel$=staffprofile] > div.stafflist > ul");
    var left = parseInt(ul.css("left"));
    var width = parseInt(ul.css("width"));
    if (left > staffScrollDisplayWidth - width) {
        ul.css("left", (left - staffScrollSpeed) + "px");
    } else {
        clearInterval(staffScrollTimer);
    }
}



// S3 Slideshow Class
function S3Slideshow(selector, pauseTime, transitionTime) {
    if (pauseTime == undefined) pauseTime = 7000;
    if (transitionTime == undefined) transitionTime = 1000;
    this.init(selector, pauseTime, transitionTime);
}

S3Slideshow.prototype = {
    // Declare slideshow variables
    currentItem: 0,
    enableTagline: true,
    pager: null,
    isStarted: false,
    
    // FUNCTIONS
    init: function(selector, pauseTime, transitionTime) {
        this.transitionTime = transitionTime;
        this.pauseTime = pauseTime;
        
        this.target = $(selector);
        
        this.images = $(selector + " #slideshowimages > img");
        this.numItems = this.images.length;
        
        if (this.numItems > 1) {            
            // Dynamically add divs for the slideshow toggling
            var div1 = this.target.attr("id") + "_slideshowContainer1";
            var div2 = this.target.attr("id") + "_slideshowContainer2";
            
            this.target.append($.create("div", {"id": div1, "style": "position:absolute;top:0;left:0;" }, [
                "img", {}, [] ]));
            this.target.append($.create("div", {"id": div2, "style": "position:absolute;top:0;left:0;" }, [
                "img", {}, [] ]));
            
            // Set a reference to the two divs internally
            this.div1 = this.target.find("div#" + div1);
            this.div2 = this.target.find("div#" + div2);
            
            // Set up the initial display state
            // Hide the 2 divs
            this.div1.hide();
            this.div2.hide();
            
            this.getActiveDiv().fadeIn(this.transitionTime);
            this.setActiveImage(this.images.eq(this.getCurrentItem()).attr("src"));
            this.swapActiveBanner();
        }
    },
    
    start: function() {
        if (this.enableTagline) {
            $("#emphasis-bar > #slogan-bar").html( $("#banner > #slideshowimages > img:eq(" + this.currentItem + ")").attr("rel"));
        }
        this.setTimer();
        this.isStarted = true;
    },
    
    stop: function() {
        this.clearTimer();
        this.isStarted = false;
    },
    
    getStarted: function() {
        return this.isStarted;
    },
    
    next: function() {
        this.incrementItem();
        this.transition();
    },
    
    prev: function() {
        this.decrementItem();
        this.transition();
    },
    
    fadeOut: function() {
        this.swapActiveBanner();
        this.getActiveDiv().fadeOut(this.transitionTime);
    },
    
    transition: function() {
        this.fadeOut();
        this.setInactiveImage(this.images.eq(this.getCurrentItem()).attr("src"));
        this.getInactiveDiv().fadeIn(this.transitionTime);
        
        if (this.enableTagline) {
            $("#emphasis-bar > #slogan-bar").html( $("#banner > #slideshowimages > img:eq(" + this.getCurrentItem() + ")").attr("rel"));
        }
    },
    
    goTo: function(index) {
        this.stop();
        this.setCurrentItem(index-1);
        this.updatePager();
        this.transition();
    },
    
    clearTimer: function() {
        if (this.timer != undefined) clearInterval(this.timer);
    },
    
    setTimer: function() {
        this.timer = setInterval(this.delegate(this, this.next), this.pauseTime);
    },
    
    decrementItem: function() {
        this.currentItem--;
        if (this.currentItem < 0) {
            this.currentItem = this.numItems - 1;
        }
        this.updatePager();
    },
    
    incrementItem: function() {
        this.currentItem++;
        if (this.currentItem >= this.numItems) {
            this.currentItem = 0;
        }
        this.updatePager();
    },
    
    setActiveImage: function(imgUrl) {
        this.getActiveDiv().find("img").attr("src", imgUrl);
    },
    
    setInactiveImage: function(imgUrl) {
        this.getInactiveDiv().find("img").attr("src", imgUrl);
    },
    
    setCurrentItem: function(index) {
        this.currentItem = index;
    },
    
    getCurrentItem: function() {
        return this.currentItem;
    },
    
    getActiveDiv: function() {
        return (this.getActiveBanner() == 1 ? this.div1 : this.div2);
    },
    
    getInactiveDiv: function() {
        return (this.getActiveBanner() == 1 ? this.div2 : this.div1);
    },
    
    getActiveBanner: function() {
        return this.activeBanner;
    },
    
    swapActiveBanner: function() {
        this.activeBanner = this.activeBanner == 1 ? 2 : 1;
    },
    
    setPager: function(pager) {
        this.pager = pager;
    },
    
    updatePager: function() {
        if (this.pager != null) {
            this.pager.find("div.controls > a").removeClass("selected");
            this.pager.find("div.controls > a:eq(" + this.currentItem + ")").addClass("selected");
        }
    },
    
    // Delegate function for callbacks
    delegate: function ( that, thatMethod )
    {
        return function() { return thatMethod.call(that); }
    }
}