var scrollSpeed = 10;
var timer;
var minOffset;
var maxOffset;

addEvent(window, "load", init);
addEvent(window, "resize", setLimits);

function init()
{

    var leftArrow = document.getElementById("leftarrow");
    var rightArrow = document.getElementById("rightarrow");

    leftArrow.onmousedown = function () { return startScroll(10); }
    rightArrow.onmousedown = function () { return startScroll(-scrollSpeed); }

    leftArrow.onmouseup = stopScroll;
    rightArrow.onmouseup = stopScroll;

    leftArrow.onclick = function () { return false; }
    rightArrow.onclick = function () { return false; }

    setLimits();
}

function setLimits()
{
	var arrowWidth = 32;
	var thumbnailWidth  = 59;
	var thumbnailMargin = 7;

	var box = document.getElementById("thumbnails");
	var thumbnails = box.getElementsByTagName("img").length;

	var totalWidth = thumbnails * (thumbnailWidth + 2 * thumbnailMargin);

	var base = document.getElementById("base");
	var baseWidth = base.offsetWidth - (arrowWidth);

	minOffset = Math.min(baseWidth - totalWidth, 0);
	maxOffset = arrowWidth;
}

function startScroll(speed)
{
	timer = setInterval("scroll(" + speed + ")", 25);
	return false;
}

function stopScroll()
{
	clearInterval(timer);
	return false;
}

function scroll(value)
{
	var box = document.getElementById("thumbnails");

	var offset = box.style.left ? parseInt(box.style.left) : maxOffset;
	offset += value;

	if (offset < minOffset) {
		offset = minOffset;
		stopScroll();
	}
		
	if (offset > maxOffset) {
		offset = maxOffset;
		stopScroll();
	}

	box.style.left = offset + "px";
}

function load(id)
{
	var content = document.getElementById("content");
	var set = content.getElementsByTagName("div");
	var sidebar = document.getElementById("sidebar");
	var oldImage = sidebar.getElementsByTagName("img")[0];
	var newImage = document.createElement("img");

	for (var i = 0; i < set.length; i++) {
        if (set[i].id == "subnavigation")
            ;
		else if (set[i].id == "item" + id)
			set[i].className = "portfolioitem";
		else
			set[i].className = "hidden";
	}

	newImage.setAttribute("src", "/images/portfolio/m" + id + ".jpg");
	newImage.setAttribute("alt", "Portfolio Image");
	sidebar.replaceChild(newImage, oldImage);

	return false;
}

// Adapted from youngpup (www.youngpup.net)
function addEvent(object, eventType, handler) { 
	if (object.addEventListener)
		object.addEventListener(eventType, handler, false);
	else if (object.attachEvent)
		object.attachEvent("on" + eventType, handler); 
}

