var curfolio = 1;
var prevfolio = 0;
var auto = 5000; //time delay for auto scroll next
var speed = 500; //scroll speed

//remember to change these values when changing in css file
var thumbBoxWidth = 320;
var logoWidth = 130;
var contentWidth = 220;

function setupPortfolio() {
	
	if(prevfolio!=0){
		newimg = jQuery("#portfolioDot"+prevfolio).attr("src").replace("FooterPortfolioDotOver.jpg","FooterPortfolioDot.jpg");
		jQuery("#portfolioDot"+prevfolio).attr("src",newimg);
	}
	
	newimg = jQuery("#portfolioDot"+curfolio).attr("src").replace("FooterPortfolioDot.jpg","FooterPortfolioDotOver.jpg");
	jQuery("#portfolioDot"+curfolio).attr("src",newimg);
	jQuery(".portfolioBoxThumbHolder").animate({ left: -((curfolio - 1) * 320) + "px" }, speed);
	jQuery(".portfolioContents").animate({ left: -((curfolio - 1) * 220) + "px" }, speed);
	jQuery(".csLeftContentLImgs").animate({ left: -((curfolio - 1) * 130) + "px" }, speed);
}

jQuery(document).ready(function() {
    var total = jQuery("#total").attr("value");

    jQuery(".portfolioBoxThumbHolder").css("width", (thumbBoxWidth * total) + "px");
    jQuery(".csLeftContentLImgs").css("width", (logoWidth * total) + "px");
    jQuery(".portfolioContents").css("width", (contentWidth * total) + "px");

    jQuery(".swapDot").mouseover(function() {

        curfoliodot = Number(this.id.replace("portfolioDot", ""));
        if (curfoliodot != curfolio) {
            newimg = jQuery("#" + this.id).attr("src").replace("FooterPortfolioDot.jpg", "FooterPortfolioDotOver.jpg");
            jQuery("#" + this.id).attr("src", newimg)
        }
    });

    jQuery(".swapDot").mouseout(function() {
        curfoliodot = Number(this.id.replace("portfolioDot", ""));
        if (curfoliodot != curfolio) {
            newimg = jQuery("#" + this.id).attr("src").replace("FooterPortfolioDotOver.jpg", "FooterPortfolioDot.jpg");
            jQuery("#" + this.id).attr("src", newimg)
        }
    });

    jQuery(".swapDot").click(function() {
        if (curfoliodot != curfolio) {
            prevfolio = curfolio;
            curfoliodot = Number(this.id.replace("portfolioDot", ""));
            curfolio = curfoliodot;
            setupPortfolio();
        }
    });

    jQuery("#thumbArrLeft").mouseover(function() {
        newimg = jQuery("#" + this.id + " img").attr("src").replace("thumbArrLeft.jpg", "thumbArrLeftOver.jpg");
        jQuery("#" + this.id + " img").attr("src", newimg)
    });

    jQuery("#thumbArrLeft").mouseout(function() {
        newimg = jQuery("#" + this.id + " img").attr("src").replace("thumbArrLeftOver.jpg", "thumbArrLeft.jpg");
        jQuery("#" + this.id + " img").attr("src", newimg)
    });

    jQuery("#thumbArrRight").mouseover(function() {
        newimg = jQuery("#" + this.id + " img").attr("src").replace("thumbArrRight.jpg", "thumbArrRightOver.jpg");
        jQuery("#" + this.id + " img").attr("src", newimg)
    });

    jQuery("#thumbArrRight").mouseout(function() {
        newimg = jQuery("#" + this.id + " img").attr("src").replace("thumbArrRightOver.jpg", "thumbArrRight.jpg");
        jQuery("#" + this.id + " img").attr("src", newimg)
    });

    jQuery("#thumbArrLeft").click(function() {
        prevfolio = curfolio;
        if (curfolio <= 1) {
            curfolio = total;
        }
        else {
            curfolio = curfolio - 1;
        }
        setupPortfolio();
    });

    jQuery("#thumbArrRight").click(function() {
        prevfolio = curfolio;
        if (curfolio >= total) {
            curfolio = 1;
        }
        else {
            curfolio = curfolio + 1;
        }
        setupPortfolio();
    });

    jQuery(".portfolioThumb").mouseover(function() {
        $(this).addClass("portfolioThumbOver");
    });

    jQuery(".portfolioThumb").mouseout(function() {
        $(this).removeClass("portfolioThumbOver");
    });

    jQuery("#csLeft").mouseover(function() {
        clearInterval(intervalID);
    });

    jQuery("#csLeft").mouseout(function() {
        intervalID = setInterval(function() { jQuery("#thumbArrRight").click() }, auto);
    });

    intervalID = setInterval(function() { jQuery("#thumbArrRight").click() }, auto);
});