/**
 * @author Chris Cox
 */
window.onload=loadAll;
var ThumbWings = 0;

function loadAll(){
    setMenuImages("menu");
	//fixMenuSelect(0);
	setMenuRollover("on");
	getElem("rollover").src = headnav[0].pic;
	getElem("rollover").style.paddingTop = headnav[0].toppad;
}

//loads images and hrefs into main navigation menus. If show='disp' then also sets mouseover for display
function setMenuImages(menuID){
	
    var myMenu = getElem(menuID);
    var myPics = myMenu.getElementsByTagName("img");
    for (var i = 0; i < myPics.length; i++) {
		
        myPics[i].id = ("m" + (i + 1));
        myPics[i].src = headnav[i].source + ".gif";
		myPics[i].ImageOn = new Image();
		myPics[i].ImageOff = new Image();
		myPics[i].ImageOn.src = headnav[i].source + ".1.gif";
		myPics[i].ImageOff.src = headnav[i].source + ".gif";		
        myPics[i].className = "pic";
        myPics[i].alt = headnav[i].alt;
		myPics[i].onmouseout = displayOut;        
       	myPics[i].onmouseover = display;
        	
    } 
    var myAtags = myMenu.getElementsByTagName("a");
    for (var i = 0; i < myPics.length; i++) {
		myAtags[i].href="#"; //forces hand to show on mouseover
 		myAtags[i].id = ("a" + (i + 1));
		myAtags[i].onclick = checkpage;
    }
}

//called from the main menu onmouseclick
function checkpage(){
	//setMenuImages("menu");
	var PicID = (parseInt(this.id.substring(1, 3)) - 1);
	//fixMenuSelect(PicID);
	changepage(this.id);
};

//lock down menu mouseover display at position PicID
function fixMenuSelect(PicID){
	//var menuElem = getElem("m" + (PicID + 1))
	//menuElem.src = menuElem.ImageOn.src;
	//menuElem.onmouseout="";
};

//unpick full location string and return just the file name
//currently redundant
function getPageFromHref(strHref){
	var mybits = strHref.split("/");
	var len = mybits.length;
	return (mybits[len-1]);
};

//display main 3-way navigation images
function fixImagDivs(PicID, hNav){
	toggleImgDivs("visible");
	getElem("rollover").style.visibility = "hidden";

    getElem("imgWingsL").src = headnav[hNav].threeWay[0];
    getElem("imgWingsC").src = headnav[hNav].threeWay[1];
    getElem("imgWingsR").src = headnav[hNav].threeWay[2];
	
	getElem("imgWingsL").style.paddingTop = headnav[hNav].threeWayPadding[0];
    getElem("imgWingsC").style.paddingTop = headnav[hNav].threeWayPadding[1];
    getElem("imgWingsR").style.paddingTop = headnav[hNav].threeWayPadding[2];
	
	getElem("imgCapL").innerHTML = headnav[hNav].threeWayCaption[0];
    getElem("imgCapC").innerHTML = headnav[hNav].threeWayCaption[1];
    getElem("imgCapR").innerHTML = headnav[hNav].threeWayCaption[2];
	
    setDivIDs(PicID);
};

function fixImagDivsB(hNav){
	toggleImgDivs("hidden");
	getElem("rollover").style.visibility = "visible";
    getElem("rollover").src = headnav[hNav].pic;
}

function toggleImgDivs(show){
	getElem("ImgDivLeft").style.visibility = show;
    getElem("ImgDivRight").style.visibility = show;
	getElem("ImgDivCenter").style.visibility = show;	
}

function changepage(thisid){
    var PicID = (parseInt(thisid.substring(1, 3)) - 1);

	toggleImgDivs("hidden");
	
    getElem("titleImg").src = headnav[PicID].titleImg;
    getElem("picCaption").innerHTML = "";
	getElem("secondaryMenu").style.visibility = "hidden";
	getElem("contactText").style.visibility = "hidden";
	getElem("designText").style.visibility = "hidden";
	
	hideIframe();
	
    clearThumbs();
	

    switch (PicID) {
        case 0:            
			fixImagDivsB(0);
            break;
        case 1:
			fixImagDivs(PicID,1);			
            break;
        case 2:
			fixImagDivs(PicID,2);
			getElem("designText").style.visibility = "visible";	
            break;
        case 3:
			loadIframe(headnav[3].jgoto)
            break;
        case 4:
			fixImagDivsB(4);
			getElem("contactText").style.visibility = "visible";
            break;
        default:
    }
};

//activate or deactivate main rollover functionality from main menu
function setMenuRollover(type){
    var myMenu = getElem("menu");
    var myPics = myMenu.getElementsByTagName("img");
    for (var i = 0; i < myPics.length; i++) {
        myPics[i].onmouseover = (type == "off") ? "" : display;
    }
};

//give each A tag in Div id="images" a unique tag to allow selection of correct img divs
//and set the onclick function
function setDivIDs(PicID){
    var myDiv = getElem("images");
    var myAtags = myDiv.getElementsByTagName("a");
    for (var i = 0; i < myAtags.length; i++) {
        myAtags[i].href = "#";
        myAtags[i].onclick = selectClickAction;
        myAtags[i].id = "I" + PicID + i;
    }
}

function setSecondaryMenus(PicID){
    var myDiv = getElem("secondaryMenu");
    var myAtags = myDiv.getElementsByTagName("a");
    
    for (var i = 0; i < myAtags.length; i++) {
        myAtags[i].innerHTML = ""; //clear existing ones first
        myDisplay = headnav[PicID].PicArraysDisplay[i];
        if (myDisplay) {
            myAtags[i].innerHTML = myDisplay
        };
        myAtags[i].href = "#";
        myAtags[i].onclick = fillThumbsFromSecondary;
        myAtags[i].id = "I" + PicID + i;
    }
}

function fillThumbsFromSecondary(){
    mainMenuID = parseInt(this.id.substring(1, 2))
    if (mainMenuID == 1) {
        fillThumbs(this.id);
    }
    else {
        Headnav2ndID = parseInt(this.id.substring(2, 3));
        setIframeSource(2, Headnav2ndID);
    }
}

//called from setDivIDs
function selectClickAction(){
    var HeadnavMainID = (parseInt(this.id.substring(1, 2)));
    setSecondaryMenus(HeadnavMainID);
    if (HeadnavMainID == 1) {
        fillThumbs(this.id);
        getElem("secondaryMenu").style.visibility = "visible";
    }
    if (HeadnavMainID == 2) {
        var Headnav2ndID = (parseInt(this.id.substring(2, 3)));
        setIframeSource(2, Headnav2ndID);
    }
}

function setIframeSource(headnavMain, headnavSecond){
    var iFrameSrc = headnav[headnavMain].threeWayHTML[headnavSecond];
    getElem("secondaryMenu").style.visibility = "visible";
    loadIframe(iFrameSrc);
}

function loadIframe(iFrameSrc){
	getElem("ifrm").src=iFrameSrc
	getElem("imageContainer").style.visibility = "hidden";
	getElem("ifrm").style.visibility = "visible";
}
function hideIframe(){
	getElem("ifrm").style.visibility = "hidden";
	getElem("imageContainer").style.visibility = "visible";
	getElem("ifrm").src="";
}

function clearThumbs(){
	
	getElem("PhotoCommentHeader").style.visibility = "hidden";
	getElem("PhotoComment").style.visibility = "hidden";
	
	ThumbWings = 0;
    for (var i = 1; i <= 4; i++) {
        var myDiv = getElem("tnd" + i);
        while (myDiv.hasChildNodes()) 
            myDiv.removeChild(myDiv.childNodes.item(0));
    }	
 }
 
//fill thumbnailDivs with thumbnails. Called from selectClickAction
function fillThumbs(thisID){	

    clearThumbs(); //clear old ones first  
    
	ThumbWings = 1;
    var HeadnavMainID = (parseInt(thisID.substring(1, 2)));
    var ThreewayID = (parseInt(thisID.substring(2, 3)));	
	
	var arrElem = headnav[HeadnavMainID].PhotoComment[ThreewayID];
	var elem = getElem("PhotoCommentHeader");
	elem.style.visibility = "visible";
	elem.style.top = arrElem.topPos;
	elem.innerHTML = arrElem.commentheader;
	elem = getElem("PhotoComment");
	getElem("PhotoComment").style.visibility = "visible";
	elem.style.top = arrElem.topPos;
	elem.innerHTML = arrElem.comment;	
		
	toggleImgDivs("hidden");
	getElem("rollover").style.visibility = "visible";

    tArray = headnav[HeadnavMainID].PicArrays[ThreewayID];
	var arrayLen = tArray.length
	var thumbSplit = (arrayLen>12)?9:7;
	thumbSplit = (arrayLen==8)?9:thumbSplit;
	var j = 0
    for (var i = 1; i <= arrayLen; i++) {
        j++;
        if (i < thumbSplit) { //for the first 8, spread among first 2 divs
            if (j == 3) {
                j = 1
            };
        }
        else { //for the rest, spread among next 2 divs
            if (j == 5) {
                j = 3
            };
        };
        imgDiv = getElem("tnd" + j);
        var imgsource = tArray[i - 1].thumb;
        if (imgsource) {
            var IDCalc = ("T" + i + " " + thisID);
            newImg = document.createElement("img");
            newImg.setAttribute("src", imgsource);
            newImg.setAttribute("id", IDCalc);
            newImg.setAttribute((document.all ? 'className' : 'class'), (i == 1) ? 'thumbover' : 'thumbout');
            imgDiv.appendChild(newImg);
        }		
    }
	//initialise rollover
	getElem("rollover").src=tArray[0].pic;
	getElem("picCaption").innerHTML=tArray[0].caption;
	getElem("rollover").style.paddingTop = (tArray[0].toppad)?tArray[0].toppad:"0px";
	//getElem("rollover").style.paddingTop = tArray[0].toppad;
	
		//load main pictures into thumbnails after thumbnails have loaded
	//use ID reference as setting onmouseover flakey using setAttribute()in IE
	for (var i = 1; i <= arrayLen; i++) {
		var ThumbID = "T" + i + " " + thisID		
		getElem(ThumbID).clickImage = new Image();
		getElem(ThumbID).clickImage.src = tArray[i - 1].pic;
		getElem(ThumbID).captionText = tArray[i - 1].caption;
		getElem(ThumbID).padding = tArray[i - 1].toppad;
		getElem(ThumbID).onmouseover = displayFromThumb;
	}
}

function displayFromThumb(){
    clearImgClass();
    getElem("rollover").src = getElem(this.id).clickImage.src;
	if (getElem(this.id).padding) {
		getElem("rollover").style.paddingTop = getElem(this.id).padding;}
    getElem("picCaption").innerHTML = getElem(this.id).captionText;
    getElem(this.id).className = "thumbover";	
}

//reset the class of all thumbnail images to thumbout
function clearImgClass(){
	getElem("rollover").style.paddingTop = "0px";
    for (var i = 0; i < document.images.length; i++) {
        var im = document.images[i];
        im.className = (im.className == "thumbover") ? "thumbout" : im.className;
    }
}

//show appropriate main picture and caption from main menu images. Called from onmouseover event
//extract integer from the id of 'this' event with some text manipulation...
function display(){	
    var PicID = (parseInt(this.id.substring(1, 3)) - 1);
	getElem(this.id).src=getElem(this.id).ImageOn.src;	
	if (ThumbWings==0){ //ie don't mess with rollover image from menu in this mode
		getElem("rollover").src = headnav[PicID].pic;
		getElem("rollover").style.paddingTop = headnav[PicID].toppad;
    	getElem("picCaption").innerHTML = headnav[PicID].caption};
	}
function displayOut(){
	getElem(this.id).src=getElem(this.id).ImageOff.src
}

//deals with IE and FF syntax for element references
function getElem(elemID){
    var elem
    if (document.getElementById) {
        elem = document.getElementById(elemID);
    }
    else {
        if (document.all) {
            elem = document.all[elemID];
        } else { null;}
    }
    return elem;
}