/**
 * functions for scaling document elements
 */

// print to debug element
function debugPrint(string)
{
    document.getElementById('debug').innerHTML += string;
}

// get browser client area
function getBrowserWidthHeight()
{
    var widthHeight = new Array(0, 0);
    if( typeof( window.innerWidth ) == 'number' )
    {
        //Non-IE
        widthHeight[0] = window.innerWidth;
        widthHeight[1] = window.innerHeight;
    }
    else if( document.documentElement && (
             document.documentElement.clientWidth ||
             document.documentElement.clientHeight ) )
    {
        //IE 6+ in 'standards compliant mode'
        widthHeight[0] = document.documentElement.clientWidth;
        widthHeight[1] = document.documentElement.clientHeight;
    }
    else if( document.body && (
             document.body.clientWidth ||
             document.body.clientHeight ) )
    {
        //IE 4 compatible
        widthHeight[0] = document.body.clientWidth;
        widthHeight[1] = document.body.clientHeight;
    }

    return widthHeight;
}

// translate width / height to pixels
function translateWidthHeight(widthHeight, viewWidthHeight)
{
    for (var i = 0; i < 2; i ++)
    {
        if (widthHeight[i])
        {
            if (String(widthHeight[i]).search("%") != -1)
                widthHeight[i] = (parseFloat(
                        widthHeight[i].replace("%", "")) / 100) *
                    viewWidthHeight[i];
        }
        else
        {
            widthHeight[i] = viewWidthHeight[i];
        }
    }
    return widthHeight;
}

// scale a document element
function scaleWidthHeight(currentWidthHeight, widthHeight, viewWidthHeight)
{
    // if size is valid
    widthHeight = translateWidthHeight(widthHeight, viewWidthHeight);
    if (widthHeight[0] > 0 && widthHeight[1] > 0)
    {
        var elementWidthHeight = translateWidthHeight(
                                    currentWidthHeight, viewWidthHeight);
        var scalex = widthHeight[0] / elementWidthHeight[0];
        var scaley = widthHeight[1] / elementWidthHeight[1];
        var scale  = scalex < scaley ? scalex : scaley;
        currentWidthHeight = new Array(elementWidthHeight[0] * scale,
                                       elementWidthHeight[1] * scale);
    }
    return currentWidthHeight;
}

// get width and height of element
function elementGetWidthHeight(el)
{
    var w = 0, h = 0;
    if (typeof el.width != "undefined")
    {
        w = el.width;
        h = el.height;
    }
    else if (typeof el.style.width != "undefined")
    {
        w = el.style.width;
        h = el.style.height;
        w = w.replace(';',  '');
        w = w.replace('px', '');
        h = h.replace(';',  '');
        h = h.replace('px', '');
    }
    return new Array(w, h);
}

// set width and height of element
function elementSetWidthHeight(el, wh)
{
    if (typeof el.width != "undefined")
    {
        el.width  = wh[0];
        el.height = wh[1];
    }
    else if (typeof el.style.width != "undefined")
    {
        var w = wh[0];
        var h = wh[1];

        if (String(wh[0]).search("%") == -1)
            w = parseInt(w) + "px";
        if (String(wh[1]).search("%") == -1)
            h = parseInt(h) + "px";

        el.style.width  = w;
        el.style.height = h;
    }
    return el;
}

// obtain elements and their initial sizes
function collateElementsAndSizes(elementTags, elementClass)
{
    var numScaleEls  = 0;
    var elementInfos = new Array();
    for (var i = 0; i < elementTags.length; i ++)
    {
        var elms = document.getElementsByTagName(elementTags[i]);
        for (var j = 0; j < elms.length; j ++)
        {
            var el = elms[j];
            if (el.className.search(elementClass) != -1)
            {
                var elementInfo           = new Array();
                elementInfo[0]            = el;
                elementInfo[1]            = elementGetWidthHeight(el);
                elementInfos[numScaleEls] = elementInfo;
                numScaleEls ++;
            }
        }
    }
    return elementInfos;
}

// scale specified elements
function resizeElements(elementInfos, width, height)
{
    var wh       = getBrowserWidthHeight();
    var targetWh = new Array(width, height);
    for (var i = 0; i < elementInfos.length; i ++)
    {
        var elementInfo = elementInfos[i];
        elementSetWidthHeight(elementInfo[0],
            scaleWidthHeight(elementInfo[1],
                translateWidthHeight(targetWh, wh), wh));
    }
    return elementInfos;
}