$(document).ready(function() {

    function OverSize()
    {
        var heightWindow = $( window ).height();
        var heightNavbar = $('.navbar-barmid').height();
        var heightTekst = $('.over-page-progress').height();

        var heightPageFree = parseInt(heightWindow) - parseInt(heightNavbar) - parseInt(heightTekst);
        var heightMargin = heightPageFree / 2;
        var heightTop = heightMargin + parseInt(heightNavbar);


        $('.over-page-progress').css({
            'top': heightTop + 'px'
        });
    }
	
    var percent = $('#percentage');
    var page = $('.content');
    // var bar = $('.bar');

    $('form').ajaxForm({
        beforeSend: function() 
        {
            page.empty();
            var percentVal = '0%';
            percent.html(percentVal);
            //bar.width(percentVal);
            
            $('.over-page').css({
                'display': 'block'
            });

            $('.over-page-progress').css({
                'display': 'block'
            });

            OverSize();

            $(".over-page").css('opacity','0.8');
            $(".over-page-progress").css('opacity','1');
        },
        uploadProgress: function(event, position, total, percentComplete) 
        {
            var percentVal = percentComplete + '%';
            percent.html(percentVal);
            //bar.width(percentVal);
        },
        complete: function(xhr) 
        {
            parser = new DOMParser();
            var doc = parser.parseFromString(xhr.responseText, "text/html");
            var content = doc.querySelector("div.content").innerHTML;

            //var parser = new DOMParser();
            //var xmlDoc = parser.parseFromString(xhr.responseText,"text/xml");
            //var content = xmlDoc.getElementsByClassName(".content");
            
            page.html(content);

            $(".over-page").css('opacity','0');
            $(".over-page-progress").css('opacity','0');

            $('.over-page').css({
                'display': 'none'
            });

            $('.over-page-progress').css({
                'display': 'none'
            });
        }
    });
});