jQuery(function($)
{
    // only on splash page
    $('body#splash').each(function()
    {
        var config = {
            bgFadeDuration: 1500, //ms. Time for fade-in of full-screen background
            initialDelay: 1500,   //ms. Time until fade-in of bottom layer starts
            fadeDuration: 1500,   //ms. Time for bottom layer fade-in animation
            stayDuration: 2800    //ms. Time after finishing fade-in until redirecting to home page. false for no automatic redirect
        }

        var resizeDelayTimeout;
        
        function redirectToHome()
        {
            $(window).unbind('click');
            window.location = $('a').attr('href'); // attr() reads first found a tag
        }

        function centerFooter()
        {
            var targetWidth = Math.min($backgroundImage.width(), $(window).width());
            $clickableFooter.stop(true, false).animate({
                width:      targetWidth + 'px',
                left:       '50%',
                marginLeft: - Math.round(targetWidth / 2) + 'px'
            }, 250);
        }

        // hide fade layer (ALWAYS 1st action, to prevent flashing)
        $('#fading-layer').hide();

        // find some DOM elements
        var $backgroundImage = $('#bg-preloader');
        var $clickableFooter = $('#clickable-footer');

        // show loading indicator (until background image has been loaded)
        $('html').css('background', 'url(/fileadmin/layouts/gfx/splash/splash-loading.gif) #000 center no-repeat');

        // smooth fade in of "skip intro" link
        $('#skip-intro').hide().fadeIn('slow');

        // make whole window clickable
        $(window).bind('click', redirectToHome);
        $('html').css({cursor: 'pointer'});

        // wait for loading of background image and fade in this image,
        // then wait for loading of images of fade-in layer and fade in this layer
        $backgroundImage.imagesLoaded(function()
        {
            $backgroundImage.addClass('loaded');

            // center footer, logic depends on background image dimensions
            // (we do this after adding class "loaded" to background image, because without this class,
            // CSS forces the image to 1x1px dimensions)
            $clickableFooter.css({
                width:      $clickableFooter.width() + 'px',
                left:       '0%',
                marginLeft: '0px'
            });
            centerFooter();

            $(window).bind('resize', function()
            {
                if (resizeDelayTimeout)
                {
                    clearTimeout(resizeDelayTimeout);
                }
                resizeDelayTimeout = setTimeout(centerFooter, 500);
            });

            $backgroundImage.fadeIn(config.bgFadeDuration, function()
            {
                $('.hidden-image-preloader').imagesLoaded(function()
                {
                    setTimeout(function()
                    {
                        $('#fading-layer').fadeIn(config.fadeDuration, function()
                        {
                            if (config.stayDuration)
                            {
                                setTimeout(redirectToHome, config.stayDuration);
                            }
                        });
                    }, config.initialDelay);
                });
            });
        });
    })
});