jQuery(document).ready(function($)
{
    
    /* INITIALISATION
       -------------- */
       
    var cache = [];
    var autoRotation = true;
    var autoRotationTimeout;
    var currentProject;
    var $dynamicProject = $('#dynamicProject');

    
    /* HELPER FUNCTIONS
       ---------------- */
      
    function renderProjectHtml(project)
    {
        return '<a class="name" href="' + project.url + '">' + project.name + ''
             + '<span class="stars"><img src="fileadmin/template/img/' + project.stars + 'stars.gif" alt=""></span></a>'
             + '<a class="image" href="' + project.url + '">' + project.image + '</a>'
             + '<div class="text">' + project.text + '</div>'
             + '<a class="more important" href="' + project.url + '">&raquo; weiterlesen</a>';
    }
    
    function stopAutoRotation()
    {
        autoRotation = false;
        if (autoRotationTimeout)
        {
            clearTimeout(autoRotationTimeout);
        }
    }

    
    /* ------------------ */
    
    $dynamicProject.css({
        position: 'relative' // act as anchor for absolute positioned loading div
    });
    
    // idee: div schon direkt einblenden, aber loadinganim erst nach einer gewissen zeit
    var $loadingDiv = $('<div class="project-sidebar-loading"></div>').css({
        display: 'none',
        position: 'absolute',
        left: 0,
        top: 0,
        width: '100%',
        height: '100%',
        opacity: 0.7,
        border: 0,
        padding: 0,
        margin: 0
    }).bind('click', function(ev)
    {
        ev.preventDefault();
        ev.stopImmediatePropagation();
    });
    $loadingDiv.appendTo($dynamicProject);
    
    var showLoadingDivTimeout;
    function showLoadingDiv()
    {
        if (showLoadingDivTimeout)
        {
            clearTimeout(showLoadingDivTimeout);
        }
        $loadingDiv.css({
            display: 'block',
            background: '#fff'
        });
        showLoadingDivTimeout = setTimeout(function()
        {
            $loadingDiv.css('background', 'url(' + tx_projectnews_pi4_jsOptions.resourceBaseUrl + 'ajax-spinner.gif) no-repeat 50% white');
        }, tx_projectnews_pi4_jsOptions['loadingSpinnerTimeout']);
    }
    showLoadingDiv();
    
    function processProject(project)
    {
        // mark current project (important for prev/next buttons and auto-rotation)
        currentProject = project;
        
        // prev/next buttons (with same event handler)
        var $buttonsHtml = $('<div class="buttons"></div>');
        $('<a class="prev" href="#">zur&uuml;ck </a>')
            .add($('<a class="next" href="#">weiter</a>'))
            .bind('click', function(ev)
            {
                stopAutoRotation();
                ev.preventDefault();
                ev.stopImmediatePropagation();
                
                loadProject(this.className == 'prev' ? currentProject.uid_prev : currentProject.uid_next);
            })
            .appendTo($buttonsHtml);
        
            
        /* CONSTRUCT PROJECT HTML
           ---------------------- */
          
        var $projectHtml = $('<div class="project" id="project_' + project.uid + '"></div>');
        $projectHtml.html(renderProjectHtml(project));

        // clear container and insert final html
        $dynamicProject.children().not($loadingDiv).remove();
        $buttonsHtml.appendTo($dynamicProject);
        $projectHtml.appendTo($dynamicProject);

        // always stop autorotation for every clicked link
        $dynamicProject.find('a').bind('click', function()
        {
            stopAutoRotation();
        })
        
        if (autoRotation)
        {
            autoRotationTimeout = setTimeout(function()
            {
                loadProject(currentProject.uid_next);
            }, tx_projectnews_pi4_jsOptions['autoRotationTimeout']);
        }
    }

    function loadProject(projectUid)
    {
        // fetch project from cache array if already loaded
        if (projectUid)
        {
            if (cache[projectUid])
            {
                processProject(cache[projectUid]);
                return;
            }
        }

        if (tx_projectnews_pi4_jsOptions['showLoadingIndicatorForAutoRotation'] || !autoRotation)
        {
            showLoadingDiv();
        }
        
        $.ajax(
        {
            type: 'GET',
            url: tx_projectnews_pi4_jsOptions['requestUrl'] + '&imgsize=' + tx_projectnews_pi4_jsOptions['imgsize'] + (projectUid ? '&uid=' + projectUid : ''),
            dataType: 'json',
            success: function(project, status)
            {
                $loadingDiv.fadeOut(175);
                if (project && project.uid)
                {
                    cache[project.uid] = project;
                }
                processProject(project);
            },
            error: function(request, status, error) // always called when request finishes (even in case of error)
            {
                $loadingDiv.fadeOut(175);
            }
        });
    };
    
    loadProject();
});