var fullframe = {}
fullframe.height = 0;
fullframe.width = 0;
fullframe.ratio = 0;
fullframe.window_height = 0;
fullframe.window_width = 0;
fullframe.window_ratio = 0;

$(document).ready(function() {
    // init
})

$(window).load(function() {
    fullframe.height = $('#fullframe').height();
    fullframe.width = $('#fullframe').width();
    fullframe.ratio = fullframe.width / fullframe.height;
    resize_fullframe();
    $('#fullframe').fadeIn();
});

$(window).resize(function() {
    resize_fullframe();
});

function resize_fullframe() {
    var new_width = 0;
    var new_height = 0;
    var new_left = 0;
    var new_top = 0;

    fullframe.window_width = $(window).width();
    fullframe.window_height = $(window).height();
    fullframe.window_ratio = fullframe.window_width / fullframe.window_height;

    if(fullframe.ratio > fullframe.window_ratio) {
        new_height = fullframe.window_height;
        new_width = Math.ceil((new_height * fullframe.width) / fullframe.height);

        new_top = 0;
        new_left = Math.floor((fullframe.window_width - new_width) / 2);
    }
    else {
        new_width = fullframe.window_width;
        new_height = Math.ceil((new_width * fullframe.height) / fullframe.width);

        new_left = 0;
        new_top = Math.floor((fullframe.window_height - new_height) / 2);
    }

    $('#fullframe').width(new_width);
    $('#fullframe').height(new_height);
    $('#fullframe').css({'top': new_top, 'left': new_left});
}