//
function showBox() {
    var browser = getBrowserDimensions();

    var layer = document.createElement('div');
    layer.style.zIndex = 100;
    layer.id = 'layer';
    layer.style.position = 'absolute';
    layer.style.top = '0px';
    layer.style.left = '0px';
    layer.style.height = browser.height + 'px';
    layer.style.width = browser.width + 'px';
    layer.style.backgroundColor = 'black';
    layer.style.opacity = '.6';
    layer.style.filter += ("progid:DXImageTransform.Microsoft.Alpha(opacity=60)");
    document.body.appendChild(layer);

    var div = document.getElementById('box');
    div.style.zIndex = 999;
    div.style.position = (navigator.userAgent.indexOf('MSIE 6') > -1) ? 'absolute' : 'fixed';
    div.style.top = (browser.height / 2) - (parseInt(div.style.height) / 2) + 'px';
    div.style.left = (browser.width / 2) - (parseInt(div.style.width) / 2) + 'px';
    div.style.display = '';

// Background
    var divBackground = document.getElementById('boxBackground');
    divBackground.style.zIndex = 990;
    divBackground.style.position = (navigator.userAgent.indexOf('MSIE 6') > -1) ? 'absolute' : 'fixed';
    divBackground.style.top = (browser.height / 2) - (parseInt(divBackground.style.height) / 2) + 'px';
    divBackground.style.left = (browser.width / 2) - (parseInt(divBackground.style.width) / 2) + 'px';
    divBackground.style.display = '';

    var a = document.getElementById('boxClose');
    a.href = 'javascript:void(0)';
    a.onclick = function() {
        document.body.removeChild(document.getElementById('layer'));
        div.style.display = 'none';
        divBackground.style.display = 'none';
        scrapbookPoupClose();
	window.onresize = function() { }
    };
    document.body.appendChild(divBackground);
    document.body.appendChild(div);

    //div.appendChild(a);

    window.onresize = function() { setLayerPosition(document.getElementById('box')); }
}

function setLayerPosition(elem) {
    var heightArray = new Array(document.documentElement.scrollHeight, document.body.scrollHeight, document.body.offsetHeight, window.innerHeight);
    var shadow = document.getElementById('layer');
    
    var browser = getBrowserDimensions();
    var intLeft, intTop;
    if (elem.offsetWidth == 0 && elem.trueWidth) {
        intLeft = (browser.width == 0) ? 20 : parseInt((browser.width - elem.trueWidth) / 2);
        intTop = (browser.height == 0) ? 20 : parseInt((browser.height - elem.trueHeight) / 2);
    }
    else {
        intLeft = (browser.width == 0) ? 20 : parseInt((browser.width - elem.offsetWidth) / 2); intTop = (browser.height == 0) ? 20 : parseInt((browser.height - elem.offsetHeight) / 2);
    }

    // shadow.style.height = maxArrayValue(heightArray) + 'px';
    shadow.style.height = browser.height + 'px';
    shadow.style.width = browser.width + 'px';
    
    elem.style.left = intLeft + 'px';
    elem.style.top = intTop + 'px';
    
    if (!elem.trueWidth) { elem.trueWidth = elem.offsetWidth; elem.trueHeight = elem.offsetHeight; }
    shadow, elem, browser, intLeft, intTop, heightArray = null;
}

function getBrowserDimensions() {
    var intH, intW = 0; if (self.innerHeight) { intH = window.innerHeight; intW = window.innerWidth; }
    else {
        if (document.documentElement && document.documentElement.clientHeight) { intH = document.documentElement.clientHeight; intW = document.documentElement.clientWidth; }
        else { if (document.body) { intH = document.body.clientHeight; intW = document.body.clientWidth; } } 
    }
    return { width: parseInt(intW), height: parseInt(intH) };
}

function maxArrayValue(arr) {
    var num = 0; if (arr.length > 0) {
        num = new Number(arr[0]); for (var i = 1; i < arr.length; i++) {
            if (arr[i] > num)
                num = new Number(arr[i]);
        } 
    }
    return num;
}