function helloworld(name, path) {
    var divcontent = "<img src=\"" + path + "\" style=\"width:120px; height:200px;\" />";
    document.getElementById(name).innerHTML = divcontent;
}

function showmaps(currimgid, imgid) {
    document.getElementById(currimgid).style.display = 'none';
    document.getElementById(imgid).style.display = 'block';
}

function showmap(name, path) {
    var divcontent = "<img src=\"" + path + "\" />";
    document.getElementById(name).innerHTML = divcontent;
}
function loadImage(name, path) {
    var divcontent = "<img src=\"" + path + "\" style=\"width:150px; height:200px;\" />";
    document.getElementById(name).innerHTML = divcontent;
}

function loadImage1(name, path) {
    var divcontent = "<img src=\"" + path + "\" style=\"width:150px; height:250px;\" />";
    document.getElementById(name).innerHTML = divcontent;
}


function ShowImageGallery(Xwidth, Yheight, divid, content) {
    // First, determine how much the visitor has scrolled
    var scrolledX, scrolledY;
    if (self.pageYOffset) {
        scrolledX = self.pageXOffset;
        scrolledY = self.pageYOffset;
    } else if (document.documentElement && document.documentElement.scrollTop) {
        scrolledX = document.documentElement.scrollLeft;
        scrolledY = document.documentElement.scrollTop;
    } else if (document.body) {
        scrolledX = document.body.scrollLeft;
        scrolledY = document.body.scrollTop;
    }

    // Next, determine the coordinates of the center of browser's window
    
    var centerX, centerY;
    if (self.innerHeight) {
        centerX = self.innerWidth;
        centerY = self.innerHeight;
    } else if (document.documentElement && document.documentElement.clientHeight) {
        centerX = document.documentElement.clientWidth;
        centerY = document.documentElement.clientHeight;
    } else if (document.body) {
        centerX = document.body.clientWidth;
        centerY = document.body.clientHeight;
    }
    
    // Xwidth is the width of the div, Yheight is the height of the 
    // div passed as arguments to the function: 
    var leftOffset = scrolledX + (centerX - Xwidth) / 2;
    var topOffset = scrolledY + (centerY - Yheight) / 2;
    // The initial width and height of the div can be set in the 
    // style sheet with display:none; divid is passed as an argument to // the function

    var array = content.split("|");

    var images = new Array();
    for (var i = 0; i < array.length; i++) {
        if (array[i] != "") {
            images[i] = "<img src='";
            images[i] += array[i];
            images[i] += "' width='75px' height='125px' />";
        }
    }




    var a = "<div id=\"closebutton\" onclick=\"closediv()\"></div>";
    a += "<div id=\"SIGSectionOne\">";
    
    for (var j = 0; j < images.length; j++) {
        a += "<div class=\"SIGImage\" onmouseover=\"loadImage1('SIGDisplayImage','" + array[j] +"')\">" + images[j] + "</div>";
    }
    a += "</div>";
    a += "<div id=\"SIGSectionTwo\"><div id=\"SIGDisplayImage\"><img src='" + array[0] + "'width=\"150px\" height=\"250px\"/></div></div>";

    document.getElementById(divid).innerHTML = a;   

    document.getElementById(divid).style.position = 'absolute';
    document.getElementById(divid).style.top = topOffset + 'px';
    document.getElementById(divid).style.left = leftOffset + 'px';
    document.getElementById(divid).style.display = 'block';
    
}

function closediv() {
    document.getElementById("SylexImageGallery1").style.display = 'none';
}