/***
Filename:		productpage.js
Author:			Andrei Vais
Date:			12/10/2009
Description:	Javascript functionality for product page
***/
var ProductSampleLocation = "Static/Images/products/"
var ProductFullTileSampleLocation = "closeups/";
var ProductZoomedTileSampleLocation = "zoomed/";


function initialiseColours()
{
    //console.log('initialiseColours');
    if (!document.getElementById) return false;
	if (!document.getElementById("productcolours")) return false;
    
    var ProductColours = getElementsByClassName(document.getElementById("productcolours"), "a", "*");
    //console.log('ProductColours length: ', ProductColours.length);
    
    for (i = 0; i < ProductColours.length; i++)
    {
        if (ProductColours[i].getAttribute("title") && ProductColours[i].getAttribute("title") != "")
        {
            //console.log("add listener");
            ProductColours[i].onclick = function() {return swapColourPic(this.getAttribute("title"));}
        }
	 }
	    
    //setup product sample coordinating samples
    if (!document.getElementById("ToggleCoordinatingProducts")) return false;
    if (!document.getElementById("ProductCoordinatedColours")) return false;
    document.getElementById("ProductCoordinatedColours").style.display = "none";
    document.getElementById("ToggleCoordinatingProducts").style.display = "inline";
    //add this only when we pass the tests that there is a co-ordinated products div
    
    document.getElementById("ToggleCoordinatingProducts").firstChild.onclick = function()
    {
        //console.log("toggle the coordinated products div");
        Effect.toggle('ProductCoordinatedColours','blind');
        if (document.getElementById("ProductCoordinatedColours").style.display == "none")
        {
            document.getElementById("ToggleCoordinatingProducts").className = "hide";
        }
        else
        {
            document.getElementById("ToggleCoordinatingProducts").className = "show";
        }
        
        var temp = document.getElementById("ToggleCoordinatingProducts").firstChild.firstChild.nodeValue;
        document.getElementById("ToggleCoordinatingProducts").firstChild.firstChild.nodeValue = document.getElementById("ToggleCoordinatingProducts").firstChild.getAttribute("rel");
        document.getElementById("ToggleCoordinatingProducts").firstChild.setAttribute("rel", temp);
               
        return false;
    }
}

function initialiseColourSampleLinks()
{
    if (!document.getElementById) return false;
	if (!document.getElementById("ProductColourFullTile")) return false;
	//if (!document.getElementById("ProductColourZoomedTile")) return false;
	
	document.getElementById("ProductColourFullTile").firstChild.onclick = function()
    {
        return showColourSample(this);
    }
	
	if (document.getElementById("ProductColourZoomedTile"))
	{
	    if (document.getElementById("ProductColourZoomedTile").firstChild.getAttribute("href").indexOf("sampleimagenotfound.gif") != -1)
        {
            document.getElementById("ProductColourZoomedTile").style.visibility="hidden";
        }  
        else
        {
            document.getElementById("ProductColourZoomedTile").style.visibility="visible";
        }
	
	    document.getElementById("ProductColourZoomedTile").firstChild.onclick = function()
        {
            return showColourSample(this);
        }
    }
}

function showColourSample(pSelectedLink)
{
    var colourSampleImgHRef = pSelectedLink.getAttribute("href");
    //console.log(colourSampleImgHRef);
        
    if (!document.getElementById) return false;
	if (!document.getElementById("ProductColourImage")) return false;
	
	document.getElementById("ProductColourImage").setAttribute("src", colourSampleImgHRef)
	
	//remove the selected class from all the siblings the set the click style class
	for(var i = 0; i < pSelectedLink.parentNode.parentNode.childNodes.length; i++)
	{
	    if(pSelectedLink.parentNode.parentNode.childNodes[i].nodeType == 1)
	    {
	        pSelectedLink.parentNode.parentNode.childNodes[i].firstChild.className = "";
	    }
	}	
	pSelectedLink.className = "selected";	
	
    return false;
}


function swapColourPic(pSelectedLink)
{
    //console.log(pSelectedLink);
    if (!document.getElementById) return false;
	if (!document.getElementById("ProductColourImage")) return false;
	if (!document.getElementById("ProductColourName")) return false;
	if (!document.getElementById("ProductColourFullTile")) return false;
	if (!document.getElementById("ProductColourZoomedTile")) return false;
    
    
    //console.log("test: ", ProductSamplesDictionary[pSelectedLink].sampleName);
    document.getElementById("ProductColourName").firstChild.nodeValue = ProductSamplesDictionary[pSelectedLink].sampleName;
	
	//need to decide whether the existing sample is a full tile sample image or a close up sample image
	if (document.getElementById("ProductColourImage").getAttribute("src").indexOf(ProductFullTileSampleLocation) != -1)
	{
	    document.getElementById("ProductColourImage").setAttribute("src", ProductSampleLocation + ProductFullTileSampleLocation + ProductSamplesDictionary[pSelectedLink].sampleFullTileImage);
	}
	else if (document.getElementById("ProductColourImage").getAttribute("src").indexOf(ProductZoomedTileSampleLocation) != -1)
	{
	    document.getElementById("ProductColourImage").setAttribute("src", ProductSampleLocation + ProductZoomedTileSampleLocation + ProductSamplesDictionary[pSelectedLink].sampleZoomTileImage);
	}
	else
	{
	    document.getElementById("ProductColourImage").setAttribute("src", "../Images/sampleimagenotfound.gif")	    
	}
	
	document.getElementById("ProductColourImage").setAttribute("alt", ProductSamplesDictionary[pSelectedLink].sampleName);
	
	document.getElementById("ProductColourFullTile").firstChild.setAttribute("href", ProductSampleLocation + ProductFullTileSampleLocation + ProductSamplesDictionary[pSelectedLink].sampleFullTileImage);
	document.getElementById("ProductColourZoomedTile").firstChild.setAttribute("href", ProductSampleLocation + ProductZoomedTileSampleLocation + ProductSamplesDictionary[pSelectedLink].sampleZoomTileImage);
	
	//hide link if zoomed tile image not found
	if (document.getElementById("ProductColourZoomedTile").firstChild.getAttribute("href").indexOf("sampleimagenotfound.gif") != -1)
	{
	    document.getElementById("ProductColourZoomedTile").style.visibility="hidden";
	}  
	else
	{
	    document.getElementById("ProductColourZoomedTile").style.visibility="visible";
	}
    
    return swapCoordinatingColourPic(pSelectedLink);    
    return false;
}

function swapCoordinatingColourPic(pSelectedLink)
{
    //console.log(pSelectedLink);
    if (!document.getElementById) return false;    
	if (!document.getElementById("ProductCoordinatedColours")) return false;
    
    var ArrCoordProductNames = getElementsByClassName(document.getElementById("ProductCoordinatedColours"), "h4", "*");
    var ArrCoordColoursImages = getElementsByClassName(document.getElementById("ProductCoordinatedColours"), "img", "*");
    var ArrCoordColoursNames = getElementsByClassName(document.getElementById("ProductCoordinatedColours"), "span", "*");
    var ArrCoordColoursLinks = getElementsByClassName(document.getElementById("ProductCoordinatedColours"), "a", "*");
    
    for (var i = 0; i < ArrCoordProductNames.length; i++)
    {
        ArrCoordProductNames[i].firstChild.nodeValue = ProductSamplesDictionary[pSelectedLink].coordinatedSamples[i].productName;
    }
    
    for (var i = 0; i < ArrCoordColoursNames.length; i++)
    {
        //first remove all children of the colour names
        while(ArrCoordColoursNames[i].hasChildNodes()) {ArrCoordColoursNames[i].removeChild(ArrCoordColoursNames[i].firstChild);}
        
        //now we rebuild the element        
        var sampleCode = document.createTextNode(ProductSamplesDictionary[pSelectedLink].coordinatedSamples[i].sampleCode);
        var sampleName = document.createTextNode(ProductSamplesDictionary[pSelectedLink].coordinatedSamples[i].sampleName);
        var theBR = document.createElement('br');

        ArrCoordColoursNames[i].appendChild(sampleCode);
        if (!((ProductSamplesDictionary[pSelectedLink].coordinatedSamples[i].sampleCode.toLowerCase() == 'null') || (ProductSamplesDictionary[pSelectedLink].coordinatedSamples[i].sampleCode.length == 0 && ProductSamplesDictionary[pSelectedLink].coordinatedSamples[i].sampleName.length == 0)))
        {
            ArrCoordColoursNames[i].appendChild(theBR);
        }
        ArrCoordColoursNames[i].appendChild(sampleName);
        
    }
    
    for (var i = 0; i < ArrCoordColoursImages.length; i++)
    {
        ArrCoordColoursImages[i].setAttribute("src", ArrCoordColoursImages[i].src.substr(0, ArrCoordColoursImages[i].src.lastIndexOf("/") + 1) + ProductSamplesDictionary[pSelectedLink].coordinatedSamples[i].sampleFullTileImage);
        ArrCoordColoursImages[i].setAttribute("alt", ProductSamplesDictionary[pSelectedLink].coordinatedSamples[i].productName);
    }
    
    for (var i = 0; i < ArrCoordColoursLinks.length; i++)
    {
        ArrCoordColoursLinks[i].setAttribute("href", ProductSamplesDictionary[pSelectedLink].coordinatedSamples[i].sampleLink);
    }    
    
    return false;
}

addLoadEvent(initialiseColourSampleLinks);
addLoadEvent(initialiseColours);