var clientWidth = 0;
var clientHeight = 0;


function positionDivs() {
    scrollDiv = document.getElementById("scrollContainer");
    imageDiv = document.getElementById("imageContainer");
    iconsDivObj = document.getElementById("iconsDivContainer");
    theImg = document.getElementById("selectedImage");
       
    getWindowSize();
    scrollDiv.style.width = clientWidth - 50;
    iconsDivObj.style.width = clientWidth - 110;
    iconsDivObj.style.height = "120px";
    iconsDivObj.style.left = "0px";
    imageDiv.style.height = clientHeight - 100;
    theImg.style.height = clientHeight - 150;
	
    initiateScroll();
}


function ResizedDivs(e)
{

	positionDivs();
}


function getWindowSize() {
	if (typeof( window.innerWidth ) == 'number' ) {
		//Non-IE
	    	clientWidth = window.innerWidth;
	    	clientHeight = window.innerHeight;
	} 
	else if (document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight)) {
	    //IE 6+ in 'standards compliant mode'
	    clientWidth = document.documentElement.clientWidth;
	    clientHeight = document.documentElement.clientHeight;
	} 
	else if (document.body && (document.body.clientWidth || document.body.clientHeight)) {
	    //IE 4 compatible
	    clientWidth = document.body.clientWidth;
	    clientHeight = document.body.clientHeight;
	}
}


function swapImage(imageName) {

    imgIcon = document.getElementById(imageName + '_icon');

    if (imgIcon.src.indexOf('portfolio') > 0) {
        newImgSrc = 'images/portfolio/' + imageName + '_1200.jpg';
    }
    else {
        if (imgIcon.src.indexOf('techniques/detail') > 0) {
            newImgSrc = 'images/techniques/detail/' + imageName + '_overall.jpg';
        }
	else {
        if (imgIcon.src.indexOf('techniques/overall') > 0) {
            newImgSrc = 'images/techniques/overall/' + imageName + '_overall.jpg';
        }
	}
    }
    theImg = document.getElementById("selectedImage");
    theImg.src = newImgSrc;
    
    imgIconTD = document.getElementById(imageName + '_td');
    imgIconTD.className = 'selectedTD';
    previousImgName = document.getElementById('previousImg').value;
    document.getElementById(previousImgName + '_td').className = 'unselectedTD';
    document.getElementById('previousImg').value = imageName;


	document.getElementById("photoCredit").innerHTML = "";
	document.getElementById("descText").innerHTML = "";
	document.getElementById("detailText").innerHTML = "";
	if (imageName.indexOf('ceiling') == 0) {
		document.getElementById("photoCredit").innerHTML = "Photo by <b>Douglas Weathersby</b>";
	}
	else {
		document.getElementById("photoCredit").innerHTML = "Photo by <b>Christian Phillips</b>";
	}

	if ((imageName == 'bath1') || (imageName == 'bath2') || (imageName == 'bath3') || (imageName == 'kitchen2') || (imageName == 'living1') || (imageName == 'living2'))
	{
		document.getElementById("descText").innerHTML = "Interior Design, Painting";
	}
	else if (imageName.indexOf('ceiling') == 0)
	{
		document.getElementById("descText").innerHTML = "Custom-Painted Tin Ceiling";
	}
	else if (imageName.indexOf('14claflin') == 0)
	{
		document.getElementById("descText").innerHTML = "Ovilla Plaster Technique";
	}
	else
	{
		document.getElementById("descText").innerHTML = "Technique";
		switch (imageName)
		{
			case '10glaze':
				document.getElementById("detailText").innerHTML = "Custom Glaze";
				break;
			case '2':
				document.getElementById("detailText").innerHTML = "Damask Stencil";
				break;
			case '3':
				document.getElementById("detailText").innerHTML = "Metallic Damask Stencil";
				break;
			case '7imprint':
				document.getElementById("detailText").innerHTML = "Custom Imprint";
				break;
			case '9glaze-23':
				document.getElementById("detailText").innerHTML = "Contemporary Ovilla Plaster";
				break;
			case 'artnouveau':
				document.getElementById("detailText").innerHTML = "Art Nouveau";
				break;
			case 'needles':
				document.getElementById("detailText").innerHTML = "Trompe L\'Oeil Strie Weave";
				break;
			case 'sandstone':
				document.getElementById("detailText").innerHTML = "Sandstone";
				break;
			case 'ovilla2':
				document.getElementById("detailText").innerHTML = "Ovilla Plaster";
				break;
			case 'ovilla':
				document.getElementById("detailText").innerHTML = "Ovilla Plaster";
				break;
			default:
				break;
		}
	}

}