photoGrid.enlargePhoto = function() {

    if (photoGrid.strImgCurr != this.id)
        document.getElementById(photoGrid.strImgCurr).style.borderColor = 'black'

    document.getElementById('imgBigPhoto').src = this.largeImageSrc

    photoGrid.strImgCurr = this.id
}

photoGrid.imgOnMouseOver = function() {
    this.style.borderColor = 'red'
}

photoGrid.imgOnMouseOut = function() {

    if (photoGrid.strImgCurr != this.id)
        this.style.borderColor = 'black'


}


function photoGrid(strContainerDivID,strFolderPathPhotosSmall,strFolderPathPhotosLarge, nNoPhotos) 
{
    var divContainer = document.getElementById(strContainerDivID)
    var br
    var div

    divContainer.style.textAlign = 'center'


    imgPhoto = new Image()
    imgPhoto.src = strFolderPathPhotosLarge + "/1.jpg"
    imgPhoto.id = 'imgBigPhoto'

    divContainer.appendChild(this.imgPhoto)

    br = document.createElement('br')
    br.style.clear = 'left'
    divContainer.appendChild(br)

    for (var nPhotoIndex = 1; nPhotoIndex <= nNoPhotos; nPhotoIndex++) {
        imgPhoto = new Image()


        imgPhoto.src = strFolderPathPhotosSmall + '/' + nPhotoIndex + '.jpg'
        imgPhoto.largeImageSrc = strFolderPathPhotosLarge + '/' + nPhotoIndex + '.jpg'
        imgPhoto.id = imgPhoto.src
        
        

        if (nPhotoIndex == 1) {
            photoGrid.strImgCurr = imgPhoto.id
            imgPhoto.style.borderColor = 'red'
        }

        imgPhoto.className = 'imgGrid'
        imgPhoto.onmouseover = photoGrid.imgOnMouseOver
        imgPhoto.onmouseout = photoGrid.imgOnMouseOut
        imgPhoto.onclick = photoGrid.enlargePhoto

        divContainer.appendChild(imgPhoto)


    }
}