﻿
function picNavigator(pnWhichDivID,pnTopOrBottom,pnSelectPic)
{
    if(!pnWhichDivID)
    {
        return false;
    }
    
    if(!pnTopOrBottom)
    {
        pnTopOrBottom = "top";
    }
    
    if(!pnSelectPic)
    {
        pnCopyThenDeleteNodes(pnWhichDivID);
        pnSelectPic = 0;
    }    
    
    
    var pnMasterDiv = document.getElementById(pnWhichDivID);
    var pnContentArray = pnMasterDiv.data;
    
    while(pnMasterDiv.childNodes.length > 0)
    {
        pnMasterDiv.removeChild(pnMasterDiv.childNodes[0]);
    }
    
             
    var pnNav = document.createElement("div");
    pnNav.id = "picNavigatorNav";
    
            
    for(x=0; x < pnContentArray.length; x++)
    {             
       var pnTempNumberSpan = document.createElement("span");
                          
       if(x == pnSelectPic)
       {            
            pnMasterDiv.appendChild(pnContentArray[x]);
            pnTempNumberSpan.className = "picNavigatorNavLinkSpanOn";            
       }
       else
       {
            pnTempNumberSpan.className = "picNavigatorNavLinkSpanOff";
       }       
              
       var pnTempNumberAnchor = document.createElement("a");
       pnTempNumberAnchor.href = "javascript:picNavigator('" + pnWhichDivID + "','" + pnTopOrBottom+ "','" + x + "')";       
       
       pnTempNumberAnchor.appendChild(document.createTextNode(x+1));
       pnTempNumberSpan.appendChild(pnTempNumberAnchor);
       pnNav.appendChild(pnTempNumberSpan);
       
       if(x < (pnContentArray.length - 1))
       {
            var pnTempDividerSpan = document.createElement("span");
            pnTempDividerSpan.className = "picNavigatorNavDividerSpan";
            pnTempDividerSpan.appendChild(document.createTextNode('|'));
            pnNav.appendChild(pnTempDividerSpan);
       }     
    }
    
    if(pnTopOrBottom.toLowerCase() == "bottom")
    {
        pnMasterDiv.appendChild(pnNav);
    }
    else
    {
        pnMasterDiv.insertBefore(pnNav,pnMasterDiv.childNodes[0]);    
    }
    
    
    
}



function pnCopyThenDeleteNodes(pnWhichDivID)
{    
    if(!pnWhichDivID)
    {
        return false;
    }
    
    var pnModSquad = new Array();
    var pnMasterDiv = document.getElementById(pnWhichDivID);
    
    
    for(x=0; x < pnMasterDiv.childNodes.length; x++)
    {
        if(pnMasterDiv.childNodes[x].nodeType == 1)
        {                       
            var pnTempNode = pnMasterDiv.childNodes[x].cloneNode(true);
            pnTempNode.className = "picNavigatorImageBox";
            pnModSquad.push(pnTempNode);    
        }
    }
    
    pnMasterDiv.data = pnModSquad; 
       
}