// provide setters for customization

var lb_overlay;
var lb_wrapper;
var tmp_scroll;

function draw_circle(rad, color, my_parent){
    var radius = rad/2;

    for(var i = radius; i > 0; i--){
        var line = document.createElement("div");
        my_parent.appendChild(line);
        line.style.backgroundColor = color;
        line.style.position = "relative";
        line.style.margin = "0 auto";
        line.style.width = 2*Math.sqrt(radius*radius - i*i) + "px";
        line.style.height = "1px";
    }
    
    for(var i = 1; i <= radius; i++){
        var line = document.createElement("div");
        my_parent.appendChild(line);
        line.style.backgroundColor = color;
        line.style.position = "relative";
        line.style.margin = "0 auto";
        line.style.width = 2*Math.sqrt(radius*radius - i*i) + "px";
        line.style.height = "1px";
    }
}

function hide_box(){
    lb_overlay.style.display = "none";
    lb_wrapper.style.display = "none";
    
    document.body.style.overflow = "";
    document.documentElement.style.overflow = "";
    
    // FF2 bug fix
    if(navigator.userAgent.indexOf("Firefox") != -1){
        if(navigator.userAgent.split("Firefox/")[1][0] == 2){
            document.body.style.top = "0px";
            document.body.style.position = "";
            window.scrollTo(0, tmp_scroll);
        }
    }
}

function show_box(win_id){
    if(window.pageYOffset > 0){
        lb_wrapper.style.top = window.pageYOffset + 120 + "px";
        tmp_scroll = window.pageYOffset;
    }else if(document.body.scrollTop > 0){
        lb_wrapper.style.top = document.body.scrollTop + 120 + "px";
        tmp_scroll = document.body.scrollTop;
    }else if(document.documentElement.scrollTop > 0){
        lb_wrapper.style.top = document.documentElement.scrollTop + 120 + "px";
        tmp_scroll = document.documentElement.scrollTop;
    }else{
        lb_wrapper.style.top = "120px";
    }
    
    lb_overlay.style.display = "";
    lb_wrapper.style.display = "";
    document.body.style.overflow = "hidden";
    document.documentElement.style.overflow = "hidden";
    
    // FF2 bug fix
    if(navigator.userAgent.indexOf("Firefox") != -1){
        if(navigator.userAgent.split("Firefox/")[1][0] == 2){
            document.body.style.position = "relative";
            document.body.style.top = "-" + tmp_scroll + "px";
        }
    }
}

function lightbox_load(){
    lb_overlay = document.createElement("div");
    document.body.appendChild(lb_overlay);
    lb_overlay.style.display = "none";
    lb_overlay.style.position = "absolute";
    lb_overlay.style.left = "0px";
    lb_overlay.style.top = "0px";
    lb_overlay.style.backgroundColor = "Black";
    lb_overlay.style.zIndex = "4998";
    lb_overlay.style.opacity = 0.6;
    lb_overlay.style.MozOpacity = 0.6;
    lb_overlay.style.KhtmlOpacity = 0.6;
    lb_overlay.style.filter = "alpha(opacity=60)";
    lb_overlay.style.width = "100%";
    lb_overlay.style.height = screen.height + 300 + "px";
    
    lb_wrapper = document.createElement("div");
    document.body.appendChild(lb_wrapper);
    lb_wrapper.style.display = "none";
    lb_wrapper.style.position = "absolute";
    lb_wrapper.style.left = "0px";
    lb_wrapper.style.top = "0px";
    lb_wrapper.style.width = "100%";
    lb_wrapper.style.zIndex = "4999";
    
    var my_win = document.getElementById("divLightbox");
    lb_wrapper.appendChild(my_win);
    my_win.style.position = "relative";
    my_win.style.margin = "0 auto";
    my_win.style.padding = "15px";
    my_win.style.width = "415px";
    my_win.style.height = "400px";
    my_win.style.border = "solid 3px #333";
    my_win.style.backgroundColor = "White";
    
    var circle1 = document.createElement("div");
    my_win.appendChild(circle1);
    circle1.style.position = "absolute";
    circle1.style.top = "-16px";
    circle1.style.left = "-16px";
    circle1.style.width = "34px";
    draw_circle(32, "Black", circle1);
    
    var circle2 = document.createElement("div");
    my_win.appendChild(circle2);
    circle2.style.position = "absolute";
    circle2.style.top = "-15px";
    circle2.style.left = "-15px";
    circle2.style.width = "32px";
    draw_circle(30, "White", circle2);
    
    var circle3 = document.createElement("div");
    my_win.appendChild(circle3);
    circle3.style.position = "absolute";
    circle3.style.top = "-14px";
    circle3.style.left = "-14px";
    circle3.style.width = "30px";
    draw_circle(28, "Black", circle3);
    
    var close = document.createElement("a");
    my_win.appendChild(close);
    close.onclick = function(){ hide_box(); return false;};
    close.href = "#";
    close.style.position = "absolute";
    close.style.top = "-17px";
    close.style.left = "-8px";
    close.style.font = "28px monospace";
    close.style.color = "White";
    close.style.textDecoration = "none";
    close.style.outline = "0";
    close.innerHTML = "x";
}

function append_functions(f1, f2){
    return function(){
        if(f1){ f1();}
        if(f2){ f2();}
    };
}

window.onload = append_functions(window.onload, lightbox_load);