/* 
 * Copyright Lightdrawing.com Ltd 2010
 * @author  Martyn Procter
 * @version $Rev: 309 $ $Date: 2010-05-31 21:45:35 +0100 (Mon, 31 May 2010) $
 */

$(document).ready(function(){
    $('#td_row_mid_col_left').hide();
    $('#picture').hide();   // Don't hide the div or table for the picture, otherwise the image won't be loaded and resize_picture will never execute fully and show everything.
    $('#alt_picture').hide();
    $('#td_row_mid_col_right').hide();
    $('#td_row_bot_col_left').hide();
    $('#td_row_bot_col_middle').hide();
    $('#td_row_bot_col_right').hide();

    resize_picture();
});

function resize_picture()
{
    if($('#picture')[0].complete == false)
    {
        // Picture hasn't loaded yet, so run this function again in 100ms to see if it has by then.
        setTimeout('resize_picture()', 100);
        return;
    }

    if (navigator.appVersion.indexOf("MSIE 7.") != -1)
    {
        // If browser is IE7, have to read the height a couple of times before we get the correct value.
        var tmp = ("thisHeight = " + $(this).height());
        var tmp1 = ("thisHeight = " + $(this).height());
    }
    
    var minColWidth = 300;
    var leftColOffset = 233;

    var bodyPadding = 10;
    var picturePadding = 12;

    var bodyHeight = $(this).height() - bodyPadding;
    var bodyWidth = $(this).width() - bodyPadding + leftColOffset;
    if (navigator.appVersion.indexOf("MSIE 7.") != -1)
    {
        // If browser is IE7, the height is 8px too big, so have to take this off.
        bodyHeight -= 8;
    }
    if (jQuery.browser.msie)
    {
        $('#top_table').width(bodyWidth - leftColOffset);
        $('#bot_table').width(bodyWidth - leftColOffset);
    }

    var botRowHeightPadding = 10;
    var botRowHeight = 28;
    var botRowMiddleColumnWidth = 150;
    var botRowOuterColumnWidth = ((bodyWidth - botRowMiddleColumnWidth) / 2);

    var midRowHeight = bodyHeight - botRowHeight - botRowHeightPadding;
    $('#picture').width("auto");
    $('#picture').height(midRowHeight - picturePadding);
    var midRowPictureColumnWidth = $('#picture').width() + picturePadding;
    if (((bodyWidth - midRowPictureColumnWidth) / 2) < minColWidth)
    {
        midRowPictureColumnWidth = (bodyWidth - (minColWidth * 2)) + picturePadding;
        $('#picture').height("auto");
        $('#picture').width(midRowPictureColumnWidth - picturePadding);
        // It's possible that the picture is just too tall when resized for width, if so, reduce by another 1px
        while (($('#picture').height()) > (midRowHeight - picturePadding))
        {
            if ($('#picture').width() <= 0)
            {
                break;
            }
            $('#picture').width($('#picture').width() - 1);
        }
    }
    var midRowOuterColumnWidth = ((bodyWidth - midRowPictureColumnWidth) / 2);

    $('#td_row_mid_col_left').width(midRowOuterColumnWidth - leftColOffset);
    $('#td_row_mid_col_picture').width(midRowPictureColumnWidth);
    $('#td_row_mid_col_right').width(midRowOuterColumnWidth);
    $('#td_row_bot_col_left').width(botRowOuterColumnWidth - leftColOffset);
    $('#td_row_bot_col_middle').width(botRowMiddleColumnWidth);
    $('#td_row_bot_col_right').width(botRowOuterColumnWidth);

    $('#td_row_mid_col_left').height(midRowHeight);
    $('#td_row_mid_col_picture').height(midRowHeight);
    $('#td_row_mid_col_right').height(midRowHeight);
    $('#td_row_bot_col_left').height(botRowHeight);
    $('#td_row_bot_col_middle').height(botRowHeight);
    $('#td_row_bot_col_right').height(botRowHeight);

    $('#alt_picture').width(0);
    $('#alt_picture').height(0);

    $('#td_row_mid_col_left').show();
    $('#picture').show();
    $('#alt_picture').show();
    $('#td_row_mid_col_right').show();
    $('#td_row_bot_col_left').show();
    $('#td_row_bot_col_middle').show();
    $('#td_row_bot_col_right').show();

    var tdAltPicWidth;
    var tdAltPicHeight;
    if ($('#td_ecommerce').length == 0)
    {
        tdAltPicWidth = 248;
        tdAltPicHeight = midRowHeight - 50 - 75;
    }
    else
    {
        tdAltPicWidth = $('#td_ecommerce').width();
        tdAltPicHeight = midRowHeight - $('#td_ecommerce').height() - 50 - 75;
    }
    // We want the image to fit in a square with dimensions of the width, so if the td is higher than this, shorten it to match with width, i.e. make it square.
    if (tdAltPicHeight > tdAltPicWidth)
    {
        tdAltPicHeight = tdAltPicWidth;
    }
    $('#alt_picture').width(tdAltPicWidth);
    $('#alt_picture').height("auto");
    if ($('#alt_picture').height() > tdAltPicHeight)
    {
        $('#alt_picture').height(tdAltPicHeight);
        $('#alt_picture').width("auto");
        // It's possible that the picture is just too tall when risized for width, if so, reduce by another 1px
        while ($('#alt_picture').height() > tdAltPicHeight)
        {
            if ($('#alt_picture').width() <= 0)
            {
                break;
            }
            $('#alt_picture').width($('#alt_picture').width() - 1);
        }
    }
}
$(this).resize(resize_picture);