//VN style bannerscroller
var DoAnimateHeader = true; //headers vervangen

//HEADER ANIM
function initimagerotator(element, url, contentid, languageid){
    if (!url){ url = '/resources/src/frontpage_banners.txt'}
    $.ajax({
        url: url, 
        type: 'POST',
        async: true,
        cache: true,
        data: "{contentid :'" + contentid + "', languageid: '" + languageid + "'}",
        contentType: "application/json; charset=utf-8",
        dataType: 'json',
        success: function(data, textStatus, XMLHttpRequest){
                imagerotator(element, data.d); //data.split(/\s+/)
            },
        error: function(XMLHttpRequest, textStatus, errorThrown){
            element.replaceWith('<h2>error</h2><p>' + textStatus +': '+ errorThrown + '</p>');
        }
    });
}

//HEADER ANIM
function imagerotator(element, imagearr){
    var height = '406';
    var overlay = '<img src="/resources/img/buttons/play.png" alt="play" id="headeroverlay" style="position: absolute; left: 0px; top: 0px; z-index: 80; width: 100%; height: 100%;" />';
    $('body').append('<div id="preloader">' + overlay + '</div>');
    $('body > #preloader').css({'width': '1px', 'display' : 'none' }).remove();

    element.addClass('rotator');
    var container = element;
    container.append('<div class="headercontrol" />');
    var control = container.children('div.headercontrol');
    for (var image in imagearr){
        var thisimage = imagearr[image].src
        var thisdec   = imagearr[image].altattr;
        var thislink  = imagearr[image].link;
        if(thisimage.indexOf('.flv') > 1){
            container.append('<img src="/ImageHandler.ashx?height='+height+'&image=' + thisimage.replace('.flv', '.jpg') + '" alt="play flash" id="header' + image + '" class="flashholder banner" flashlink='+thisimage+' />');
        } else {
            container.append('<img src="/ImageHandler.ashx?height='+height+'&image=' + thisimage + '" alt="'+thisdec+'" id="header' + image + '" class="banner" onclick="window.location.href=\''+ thislink +'\'" style="cursor: pointer;"/>');
        }
        control.append('<span class="headercontrol" id="goto_header'+ image +'">&#8226;</span>');
    }
    
    //container.css({'height' : container.children('img:first').height() + 'px' });
    container.children('img.banner').hide();
        
    control.children('span.headercontrol').bind('click', function(){
        if (container.children('.FLASHPLAYER').size() > 0){
            var src = container.children('.FLASHPLAYER').attr('orig');
            var id = container.children('.FLASHPLAYER').attr('id');
            var classes = container.children('.FLASHPLAYER').attr('class').replace('FLASHPLAYER','');
            var flashlink = container.children('.FLASHPLAYER').attr('flashlink');
            container.children('.FLASHPLAYER').children('object').remove();
            container.children('.FLASHPLAYER').replaceWith('<img src="'+src+'" id="'+ id +'" class="' + classes + '" flashlink="'+flashlink+'"/>')
        }
        
        var id = $(this).attr('id').replace('goto_', '');
        container.children('img:not(#'+id+')').fadeOut('slow').removeClass('visibleheader');;
        //container.animate({ "height": container.children('img#'+id).height() + 'px' }, '300', 'linear');
        container.children('img#'+id).fadeIn('slow').addClass('visibleheader');
        //$('div.container > div.controls').text(container.children('img#'+id).attr('class').indexOf('flashholder'));
        if (container.children('img#'+id).attr('class').indexOf('flashholder') > -1){
            container.append(overlay).fadeIn('slow');
        } else {
            container.children('#headeroverlay').remove();
        }
        $(this).siblings('span').removeClass('activeheader');
        $(this).addClass('activeheader');
    });
    
    $('#headeroverlay').live('click', function(){
        $('.visibleheader').click();
        $(this).hide();
    })
    
    $('img.flashholder').live('click',function(){
        DoAnimateHeader = false;      
        
        var href = $(this).attr('flashlink');//.replace(/^\/ImageHandler\.ashx\?height=\d+&image=/i,'').replace('.jpg','.swf');
        var id = $(this).attr('id');
        var classes = $(this).attr('class');
        
        control.children('#goto_'+id).addClass('activeheader');
        control.children('#goto_'+id).siblings('span').removeClass('activeheader')
        
        $(this).fadeOut('fast', function(){
            $(this).replaceWith('<div id="'+ id +'" class="' + classes + ' FLASHPLAYER" orig="'+$(this).attr('src')+'" flashlink="'+href+'" style="width: 100%; height: 100%;"/>')
            $('#'+id).css('height', '100%').fadeIn('fast', function(){
                //$('#'+id).flashembed({src: "/resources/flowplayer/flowplayer-3.2.5.swf", wmode: 'opaque', url: href});               
                container.siblings('.borders').hide();
                flowplayer(id, { src: "/resources/flash/flowplayer-3.2.5-0.swf", wmode: 'opaque', version: [9, 115] },{
                        clip: {
                            url: href,
                            autoPlay: true,
                            autoBuffering: true,
                            accelerated: true,
                            fadeInSpeed: 100,
                            fadeOutSpeed: 100,
                            scaling: 'scale',
                            borderRadius: 12
                        },
                        canvas: {
                            backgroundColor:'#e3f318',
                        },
                        screen: {
                            borderRadius: 12
                        },
                        plugins: {
	                        controls: {
		                        top: 379,
		                        opacity: 1,
		                        tooltips: {
    			                    buttons: true
			                    },
			                autoHide: {
			                    enabled:false,
			                    hideDelay: 1500,
			                    mouseOutDelay: 1500,
			                    hideStyle: "fade",
			                    hideDuration: 1000,
			                    fullscreenOnly: false
			                    }
		                    }
		                }                   
                });
            });
        });       
    });
    
   
    control.children('span:first').click();
    
    var timer1 = window.setTimeout("window.setInterval('animateHeader()', 4000)", 1000);
}

function animateHeader(){
    if(!DoAnimateHeader){
        return;
    }
    var control = $('#banner > div.headercontrol');
    var counter = control.children('.activeheader').index();
    counter += 1;

    if(counter > control.children(':last').index()){
        counter = 0;
    }    
    control.children('#goto_header'+counter).click();
    $('#banner').siblings('.borders').show();
}