Event.observe(window, 'load', function() {
        createGalleryNav();
    } 
);

function createGalleryNav() {

    locale = $('portfolioID');
    ids = $w(locale.className);
    
    pfNumber = ids[0];
    pfImage = "pnav-"+pfNumber;
    piNumber = parseInt(ids[1]);
    totalImages = parseInt(ids[2]);
    //turn on correct portfolio number
    $(pfImage).src = "/images/buttons/"+ids[0]+"_on.gif";
    
    
    //turn on previous next images if appropriate and set link
    if (piNumber == 0) {
        $('image-number').innerHTML = "click on detail to view full image";
    } else {
        if (piNumber != 1){
            linkTarget = "portfolio"+pfNumber+"_"+(piNumber-1)+".html";
            $('previous').style.display = "block";
            $('previouslink').href = linkTarget;
        }

        if (piNumber != totalImages){
            linkTarget = "portfolio"+pfNumber+"_"+(piNumber+1)+".html";
            $('next').style.display = "block";
            $('nextlink').href = linkTarget;
        }            
    }    
    
    //create dot links
    dotLinks = $$('img.dots');
    if (dotLinks.length>0) {
        //assemble links
        for(i=0;i<totalImages;i++) {
            linkNum = i+1;        
            linkTarget = "portfolio"+pfNumber+"_"+linkNum+".html";
            link = "dotslink-"+linkNum;
            
            //set links, turn on correct dot
            $(link).href = linkTarget;
            if (linkNum == piNumber) {
                 dotLinks[i].src = "images/dot_on.gif";
            }
            
            //display link
            dotLinks[i].style.display = 'inline'
        }    
    }
    
}