// JScript File
var projectTypeIndex = 0;
var projectsArray = new Array();
var largeImages;
var thumbImages;
var selectedIndex = 0;
compileXML = function(){
    var queryVars = parseIDFromQS();
    var nameVal = queryVars.split(/\_/);
    var projectTypeIndex = nameVal[0];
    var projectIndex = nameVal[1];
    var id = nameVal[1];
    var projectTypes = xmlDoc.getElementsByTagName('projecttype');
    var projectType = projectTypes[projectTypeIndex];
    var projects = projectType.getElementsByTagName('project');
    var selectedProject;
    for(var i = 0; i<projects.length; i++){
        if(projects[i].getAttribute("id") == id){
            selectedProject = projects[i];
            break;
        }
    }
    if(selectedProject==null){
        selectedProject = projects[0];
    }
    //var selectedProject = projects[projectIndex];
    largeImages = selectedProject.getElementsByTagName('largeimage');
    thumbImages = selectedProject.getElementsByTagName('thumbimage');
    document.getElementById("detailLocationHeader").className = "locationHeaderBar" + projectTypeIndex;
    
    preloadImages(thumbImages);
    preloadImages(largeImages);
    document.getElementById("lblName").innerHTML = selectedProject.getAttribute('name');
    document.getElementById("lblLocation").innerHTML = selectedProject.getAttribute('location');
    //document.getElementById("lblLocationHeader").innerHTML = "PROJECTS: " + projectTypes[projectTypeIndex].getAttribute('name').toUpperCase() + ": " + selectedProject.getAttribute('name').toUpperCase();
     var newLink = document.createElement('a');
     newLink.href = "Index.shtml";
     newLink.className = "locationBar";
     newLink.appendChild(document.createTextNode("Runberg Architecture Group PLLC"));
     document.getElementById("lblLocationHeader").appendChild(newLink);
     document.getElementById("lblLocationHeader").appendChild(document.createTextNode(" > "));
     var newLink2 = document.createElement('a');
     newLink2.href = "OurWork.shtml";
     newLink2.appendChild(document.createTextNode("Our Work"));
     newLink2.className = "locationBar";
     document.getElementById("lblLocationHeader").appendChild(newLink2);
     document.getElementById("lblLocationHeader").appendChild(document.createTextNode(" > "));
     var newLink3 = document.createElement('a');
     newLink3.href = "Projects.shtml?id=" + projectTypeIndex;
     newLink3.appendChild(document.createTextNode(projectTypes[projectTypeIndex].getAttribute('name')));
     newLink3.className = "locationBar";
     document.getElementById("lblLocationHeader").appendChild(newLink3);
     document.getElementById("lblLocationHeader").appendChild(document.createTextNode(" > "));
     document.getElementById("lblLocationHeader").appendChild(document.createTextNode(selectedProject.getAttribute('name')));   
        
    var imagename = "";
    //alert(projects[0].getAttribute("name"));
    for(var i=0; i < thumbImages.length; i++){
       //alert(thumbImages[i].getAttribute('imagename'));
        //alert(imagename);
        document.getElementById("divProject" + i).style.backgroundImage = "url(./Images/" + thumbImages[i].getAttribute('imagename') +")";
    }
    //blank thumbImage div
    for(var i=thumbImages.length; i < 5; i++){
        
        document.getElementById("divProject" + i).removeAttribute("onmouseover");
        document.getElementById("divProject" + i).removeAttribute("onmouseout");
        document.getElementById("divProject" + i).removeAttribute("onclick");
        document.getElementById("divProject" + i).removeAttribute("className");
         document.getElementById("divProject" + i).removeAttribute("class");
    }
    
    var paragraphs = selectedProject.getElementsByTagName('description')[0].getElementsByTagName('paragraph');
    
    //display the description paragraphs
    for (var i=0; i < paragraphs.length; i++){
        var newParagraph = document.createElement('p');
        newParagraph.innerHTML = paragraphs[i].childNodes[0].nodeValue;
        document.getElementById('detailLeftContainer').appendChild(newParagraph);
    }
    
    //display default main image
    detailThumbImage_mouseover(document.getElementById("divProject0"));
    document.getElementById('imgMain').src = "./Images/" + largeImages[0].getAttribute('imagename');
    
}
function detailThumbImage_mouseover(div){
    var currTabElem = div; 

    currTabElem.setAttribute("class", "detailThumbImageContainerMouseOver"); 
    currTabElem.setAttribute("className", "detailThumbImageContainerMouseOver"); 

}

function detailThumbImage_mouseout(div){
    var currTabElem = div; 
    
    if (parseInt(getIndexFromDivID(div.getAttribute("id"))) != selectedIndex){
        currTabElem.setAttribute("class", "detailThumbImageContainer"); 
        currTabElem.setAttribute("className", "detailThumbImageContainer"); 
    }
}

function getIndexFromDivID(divID){
    var index = divID.substring(divID.length-1, divID.length);
    return index;
}

function detailThumbImage_click(div){
    var index = 0;
    var oldIndex = selectedIndex;
    var divID = div.getAttribute("id");
    index = getIndexFromDivID(divID);
    selectedIndex = parseInt(index);
    detailThumbImage_mouseout(document.getElementById("divProject" + oldIndex));
    detailThumbImage_mouseover(document.getElementById(divID));
    
    
    document.getElementById('imgMain').src = "./Images/" + largeImages[index].getAttribute('imagename');
}