var curscroll = 0;

// function to add the mouseover event to images with class "thumbnail"
function addthumbmouseover() {
    var thumbs = getElementsByClassName("thumbnail");
    hoverpics=new Array();
    for (var i=0; i< thumbs.length; i++) {
        function makeHandler(i) {
            return function() {showBigPic(thumbs[i]);};
        }
        thumbs[i].onmouseover = makeHandler(i);
        hoverpics[i] = new Image;
        hoverpics[i].src = thumbs[i].src.replace("b.jpg", "a.jpg");
    }
    showBigPic(thumbs[0]);
}

// function to show the large picture
function showBigPic(image) {
    thumbsrc = image.src;
    thumbid = image.id;
    bigsrc = thumbsrc.replace("b.jpg", "a.jpg");
    document.getElementById("featureimg").src = bigsrc;
    document.getElementById("featureimg").style.display = "block";
    var descs = getElementsByClassName("buildingdesc");
    for (var i=0; i< descs.length; i++) {
        descs[i].style.display = "none";
    } 
    descid = thumbid + "description";
    //document.getElementById(descid).style.display = "block";
    var plans = getElementsByClassName("floorplan");
    for (var i=0; i< plans.length; i++) {
        plans[i].style.display = "none";
    } 
    planid = thumbid + "floorplan";
    if (document.getElementById(planid)) {
	    document.getElementById(planid).style.display = "block"; 
    }
    document.getElementById("scrollable2").scrollTop = 0;
    curscroll = 0;
			// vertical slider control
			/*var slider3 = new Control.Slider('handle3', 'track3', {
				axis: 'vertical',
				onSlide: function(v) { scrollVertical(v, $('scrollable2'), slider3);  },
				onChange: function(v) { scrollVertical(v, $('scrollable2'), slider3); }
			}); */
			
			
			// scroll the element vertically based on its width and the slider maximum value
			function scrollVertical(value, element, slider) {
				element.scrollTop = Math.round(value/slider.maximum*(element.scrollHeight-element.offsetHeight));
			}
			



			// disable vertical scrolling if text doesn't overflow the div
			if ($('scrollable2').scrollHeight <= $('scrollable2').offsetHeight) {
				$('wrap3').style.display = "none";
			} else {
				$('wrap3').style.display = "block";			
			 $('uparrow').onmouseover = scrollUp;
			 $('uparrow').onmouseout = stopScroll;
			 $('downarrow').onmouseover = scrollDown;
			 $('downarrow').onmouseout = stopScroll;
            }
			 
    
}
function scrollUp() {
    if (window.movedownvar) clearTimeout(movedownvar)
    element = document.getElementById("scrollable2");
    if (curscroll < 5 && curscroll >= 0) {
        curscroll = 0;
    } else if (curscroll > 5) {
        curscroll = curscroll - 5;
    }
    element.scrollTop = curscroll;
    moveupvar=setTimeout("scrollUp()",20)		
}

function scrollDown() {
    if (window.moveupvar) clearTimeout(moveupvar)
    element = document.getElementById("scrollable2");
    if (curscroll > element.scrollHeight-element.offsetHeight - 5 && curscroll <= element.scrollHeight-element.offsetHeight) {
        curscroll = element.scrollHeight-element.offsetHeight;
    } else if (curscroll <  element.scrollHeight-element.offsetHeight - 5) {
        curscroll = curscroll + 5;
    }
    element.scrollTop = curscroll;			
    movedownvar=setTimeout("scrollDown()",20)
}

function stopScroll(){
    if (window.moveupvar) clearTimeout(moveupvar)
    if (window.movedownvar) clearTimeout(movedownvar)
}


// function to swap the large picture
function swapBigPic(newimage) {
    document.getElementById("featureimg").src = newimage;
}

// function to get all elements with a specified class name
function getElementsByClassName(className, tag, elm){
	var testClass = new RegExp("(^|\\\\s)" + className + "(\\\\s|$)");
	var tag = tag || "*";
	var elm = elm || document;
	var elements = (tag == "*" && elm.all)? elm.all : elm.getElementsByTagName(tag);
	var returnElements = [];
	var current;
	var length = elements.length;
	for(var i=0; i<length; i++){
		current = elements[i];
		if(testClass.test(current.className)){
			returnElements.push(current);
		}
	}
	return returnElements;
}

// Add the onload javascript
if (window.addEventListener) {
	window.addEventListener("load", addthumbmouseover, false) //invoke function
}
if (window.attachEvent) {
	window.attachEvent("onload", addthumbmouseover)
}