var frameBorders = {
    top: 0,
    left: 0,
    right: 0,
    bottom: 0
};

var libOptionsVisible = true;
var libOptionsCollapsed = false;

var libOptionsOriginalHeight;

$(function () {
    setHeight(false);
    $('#lib-options-toggle').click(function () {
        toggleLibOptions();
        this.blur();
        return false;
    });
    $('a#toggle').click(function () {
        scriptToggleLibOptions();
        this.blur();
        return false;
    });
    libOptionsOriginalHeight = currentLibOptionsHeight();
});

$(window).resize(function () {
    setHeight(true);
    updateClientProperties();
});

// Calculate the needed margins for the ViewPoint area based on header and footer elements
function setHeight(refresh) {
    // Let's store the used elements in vars, so they're easier to change
    var header = $('#header');
    var categories = $('#categories');
    var footer = $('#functions');
    var contentArea = $('#planner-area');
    var planner = $('#planner-frame');
    var info = $('#info');
    var library = $('#library');
    var libraryContents = $('#library-contents');
    var libraryOptions = $('#library-options');

    // Some initial calculations: window height, frames, borders, etc
    var topHeight = elementOuterDimensions(header).height + elementOuterDimensions(categories).height;
    var bottomHeight = elementOuterDimensions(footer).height;
    var windowHeight = $(window).height();

    // And calculations based on the above calculations
    /*var calculatedFrameHeight = windowHeight - frameOffset;
    var floatingFrameHeight = calculatedFrameHeight - frameBorders.top - frameBorders.bottom;
    var calculatedVmpHeight = floatingFrameHeight - guiToolsHeight;
    var libraryHeight = floatingFrameHeight - parseInt(library.css('margin-bottom')) - parseInt(library.css('padding-top'));
    var flashWidth = framedArea.width() - frameBorders.left - frameBorders.left - library.width();*/

    // Size and position the ViewPoint area correctly
    contentArea.height(windowHeight - topHeight - bottomHeight);
    planner.height(contentArea.height() - elementOuterDimensions(info).height);
    library.height(contentArea.height() - parseInt(library.css('padding-top')) - parseInt(library.css('padding-bottom')) - parseInt(library.css('margin-top')) - parseInt(library.css('margin-bottom')));

    if (designNeedsResize || inDesign) {
        $('#FlashArea').height(planner.height());
        $('#FlashArea').width(planner.width());
        designNeedsResize = false;
    }
    else {
        $('#FlashArea').height(1);
        $('#FlashArea').width(1);
    }

    $('#ViewpointArea').width(planner.width());

    if (libOptionsVisible)
        libraryContents.height(library.height() - $('#library-options').outerHeight() - parseInt($('#library-options').css('margin-top')) - parseInt($('#library-options').css('margin-bottom')) - parseInt(libraryContents.css('padding-top')) - parseInt(libraryContents.css('padding-bottom')));
    else
        libraryContents.height(library.height() - parseInt(libraryContents.css('padding-top')) - parseInt(libraryContents.css('padding-bottom')));
}

function elementOuterDimensions(element) {
    var dimensions = { height: 0, width: 0 };
    var bordersWidth = 0, bordersHeight = 0;
    if (parseInt(element.css("border-top-width")) > 0)
        bordersHeight += parseInt(element.css("border-top-width"));
    if (parseInt(element.css("border-bottom-width")) > 0)
        bordersHeight += parseInt(element.css("border-bottom-width"));
    if (parseInt(element.css("border-left-width")) > 0)
        bordersWidth += parseInt(element.css("border-left-width"));
    if (parseInt(element.css("border-right-width")) > 0)
        bordersWidth += parseInt(element.css("border-right-width"));
    dimensions.height = parseInt(element.css('margin-top')) + parseInt(element.css('padding-top')) + element.height() + parseInt(element.css('padding-bottom')) + parseInt(element.css('margin-bottom')) + bordersHeight;
    dimensions.width = parseInt(element.css('margin-left')) + parseInt(element.css('padding-left')) + element.width() + parseInt(element.css('padding-right')) + parseInt(element.css('margin-right')) + bordersWidth;
    return dimensions;
}

function currentLibOptionsHeight() {
    var totalLOHeight = $('#library-options').height() + parseInt($('#library-options').css('margin-top')) + parseInt($('#library-options').css('margin-bottom')) + parseInt($('#library-options').css('padding-top')) + parseInt($('#library-options').css('padding-bottom')) + parseInt($('#library-options').css('border-top-width')) + parseInt($('#library-options').css('border-bottom-width'));
    return totalLOHeight;
}

function scriptToggleLibOptions() {
    $('#library-options').toggle(100, function () { libOptionsVisible = !libOptionsVisible; setHeight(true); });
}

function showLibraryOptions() {
    $('#library-options').show(100, function () { libOptionsVisible = true; setHeight(true); });
}

function hideLibraryOptions() {
    $('#library-options').hide(100, function () { libOptionsVisible = false; setHeight(true); });
}

function toggleLibOptions() {
    var hiddenHeight = $('a#lib-options-toggle').height() - (parseInt($('#library-options').css('margin-top')) + parseInt($('#library-options').css('margin-bottom')) + parseInt($('#library-options').css('padding-top')) + parseInt($('#library-options').css('padding-bottom')) + parseInt($('#library-options').css('border-top-width')) + parseInt($('#library-options').css('border-bottom-width')));
    var shownHeight = libOptionsOriginalHeight - (parseInt($('#library-options').css('margin-top')) + parseInt($('#library-options').css('margin-bottom')) + parseInt($('#library-options').css('padding-top')) + parseInt($('#library-options').css('padding-bottom')) + parseInt($('#library-options').css('border-top-width')) + parseInt($('#library-options').css('border-bottom-width')));

    if (!libOptionsCollapsed) {
        $('#library-options').animate({
            height: hiddenHeight
        }, 400, null, function () { setHeight(true); });
    }
    else {
        $('#library-options').animate({
            height: shownHeight
        }, 400, null, function () { setHeight(true); });
    }

    libOptionsCollapsed = !libOptionsCollapsed;
}

/*function adjustLibContentsHeight(difference) 
{
alert(difference);
$('#library-contents').animate({ 
height: $('#library-contents').height() + difference
}, 100 );
setHeight(true);
}*/