﻿String.prototype.rwordtrim = function () {
    return this.replace(/[^a-z]+[a-z]+$/i, '');
}

function shortReviews(selector) {
    $(selector).each(function () {
        var a = $(this).find('a:first').clone();
        var p = $(this).find('a, br').remove().end().text();
        p = (p.length < 220) ? p : p.substr(0, 219).rwordtrim() + '&hellip;';
        $(this).html(p.replace(/[.]{3}/gi, '&hellip;') + '<br />').append(a);
    });
}

function menuWorker(element){
    var bikehighlight = $(element).find('li.bikehighlight');
    bikehighlight.parent('ul').addClass('bikehighlight');
    bikehighlight.find('a').text('').hide();
       
    $(element).find('li').hoverIntent({
        over: function(){
            //$(this).addClass('current');
            if($(this).children('ul').is('.bikehighlight')){
                $(this).children('ul').css('z-index','900').fadeIn('slow');
            } else {
                $(this).children('ul').css('z-index','900').slideDown('fast');
            } 
        }, 
        timeout: 150,  
        out: function(){
            //$(this).removeClass('current');
            if($(this).children('ul').is('.bikehighlight')){
                $(this).children('ul').css('z-index','1').hide();
            } else {
                $(this).children('ul').css('z-index','1').slideUp('fast');
            } 
        },
        sensitivity: 7,
        interval: 40
    });
}

//GLOBALS
var DoAnimateNews = true; //news sliden

var DoAnimateHeader = true; //headers vervangen

var timer1; //rotator timer
var timer2;

function makeTabs(element, menuelement, tabid, floatright){
    if(!tabid || undefined== tabid){
        var tabid = 0;
    }
    
    var menu = "";
    var total = element.children('div').size();
    
    element.children('hr').remove();
    element.children('div').each(function(index) {
        //voor de animatie moeten alle divjes binnen de #morecontent linksboven gepositioneerd zijn.
        var cssobject = {
            'position': 'absolute',
            'top': '0px',
            'left': '0px',
            'width': 'auto',
            'height': 'auto'
        };     
        $(this).css(cssobject);
        
        //ID ophalen en toevoegen aan de menustring
        var id = $(this).attr('id');
        menu += '<span id="menu_' + id + '" class="menutab' + index + '" >' + id.replace(/[_]/gi, ' ') + '</span>';
    });
    
    //menustring toepassen
    menuelement.html(menu);
    
    if(!floatright || undefined == floatright){
        var floatright = 0;
    } else if(floatright == 'all'){
        var floatright = total;
    }
    
    //over nieuwe menu wandelen en de laatste XX spans op rechts uit laten lijnen.
    for (var i = 0; i < total; i++) {
        if ($.browser.msie && $.browser.version < 9) {
             $('.menutab' + i).css('top','3px');
            }
        $('.menutab' + i).css('cursor', 'pointer');
        if (i >= (total -floatright)){
           // $('.menutab' + i).css("position", "absolute");
        
            var cssobject2 = {
                'float'  : 'right',
                'margin-left' : '15px',
                'margin-right' : '-2px'
            };
            $('.menutab' + i).css(cssobject2);
        }
    }

    //alle menuelementen binden
    menuelement.children('span').bind('click', function() {
        tabanim($(this), element, menuelement);
    });

    menuelement.children(':eq('+tabid+')').click(); //dit om het eerste tabje actief te maken.
}

function tabanim(clicked, element, menuelement) {
    //animeren van tab transitie: kader moet zich dmv slide aanpassen aan nieuwe tab, text moet faden. ID van tabkopje is gelijk aan ID van te tonen div, op de prepending menu_ na.
    menuelement.children('.active').removeClass('active');
    
    var id = clicked.attr('id');
    id = id.replace('menu_', '');
        
    element.children('div').fadeOut('fast');
    $('#' + id).parent().animate({ "height": $('#' + id).height() + 'px' }, '300', 'linear');
    $('#' + id).fadeIn('slow');
    clicked.addClass('active');
}

function alignMenu(element, child) {
    //menu netjes uitlijnen: :last-child moet helemaal rechts, :first-child helemaal links. Ruimte tussen de kopjes moet ongeveer even groot zijn.
    var totalwidth = 0; //totale breedte
    var outerwidth = element.width(); //menu element breedte
    var count = element.children(child).size(); //hoeveelheid menukopjes
    var modifier = 1; //1.12366666;
    if ($.browser.msie && $.browser.version < 9 || true) {
        modifier = 1;
    }   

    element.children(child + ':first').prepend("<span style='visibility: hidden; margin-left: -4px;'></span>");
    
    element.children(child).each(function(index) {
        //en de margin meteen op 0 zetten. Dit om non-JS compatible browsers ook een normale margin via CSS te kunnen geven.
        $(this).css('margin', '0px');
        //breedte optellen van de menu child elements
        totalwidth += $(this).width() + 4;
        //$('.controls').append(' ' + $(this).width() + 'px - ')
    });

    //breedte van tussenruimte berekenen: count-1 is omdat er natuurlijk 1 tussenruimte minder is dan het aantal elementen.
    var newmargin = ((outerwidth - totalwidth) / (count - 1));
    
    //alle menu childelements krijgen een nieuwe margin-right die zo groot is als de tussenruimte dient te zijn. Dit behalve het laatste childelement, die moet 0px rechts staan.
    element.children(child + ':not(:last-child)').css('margin-right', Math.round(newmargin) + 'px');
       

    
    //.parent().append($(this).children('span').children('ul'));

    //voor het laatste kindje
    cssobject = { 'float': 'right', 'padding-right': '0px' };
    element.children(child + ':last').css(cssobject);
    element.children(child + ':last').children('ul').css('left','').css('right', '0px');
    element.children(child + ':last').children('ul').find('ul').css('left','-141px');
    //het op één na laatste kindje krijgt geen rechtermargin mee: de meest rechter (:last-child) heeft al float: right.
    element.children(child + ':nth-child(' + (count - 1) + ')').css('margin-right', '0px');
    element.find('div.bikehighlight').each(function(){
        $(this).bind('click', function(){
            window.location.href = $(this).find('a').attr('href');
        });
    }).css('cursor','pointer');
}

function expandMenu(element){
    //$('#menucontent_div').css('height', '0px');
    element.children('span').bind('mouseenter', function(){
        $(this).addClass('active');
        $(this).siblings('span').removeClass('active');
        $('#menucontent_div').show(0);
        //$('#menucontent_div').css('z-index', '850').css('height', 'auto').css('overflow','visible').css('outline','1px solid red');
        var id = $(this).attr('id').replace('header_','');
        var position = $(this).position().left + 'px';
        $('div#menucontent_div > #menu_'+ id + '').css({
            'position' : 'relative',
            'display' : 'inline-block',
            'left' : position,
            'z-index' : 900
        });
        $('div#menucontent_div > #menu_'+ id + '').siblings('ul').slideUp(0,function(){
            $('div#menucontent_div > #menu_'+ id + '').slideDown('fast');
        }).find('li.activeli').removeClass('activeli').children('ul').hide(0);    
        $('div#menucontent_div > ul:last').css({'float':'right', 'left':''});
        $('div#menucontent_div > ul:last > li > ul').css('margin-left', '-286px'); //$(this).css('left') + 'px'
        
        //$('li.bikehighlight').addClass('activeli');

    });        
    
    $('div#menucontent_div ul li a').each(function(index, anchor){
        $(this).closest('li').bind('click', function(event){
            window.location.href = $(anchor).attr('href');
            event.stopPropagation();
        });
    });
    
    $('div#menucontent_div > ul > li ul').parent('li').bind('mouseenter', function(){
        $(this).siblings('li').removeClass('activeli').children('ul').hide(0);
        $(this).children('ul').slideDown(0);
        $('#menucontent_div').css('height','489px');
        $(this).addClass('activeli');
    });
    
    $('div#menucontent_div > ul > li ul').parent('li').bind('mouseleave', function(event){
        $(this).children('ul').slideUp(0);
        $(this).removeClass('activeli');
        event.stopPropagation();
    });  
    
    $('div#menucontent_div > ul > li > ul').parent('li').bind('mouseleave', function(event){
        $('#menucontent_div').css('height','auto');
        event.stopPropagation();
    });
    
    $('#menucontent_div > ul').bind('mouseleave', function(){
        $(this).delay(300).slideUp('fast', function(){
            $('div.menu > span.active').removeClass('active');
            $('#menucontent_div').hide(0);
        });
    }); //.css('outline','1px solid red'); 

    $('#menucontent_div > ul li').bind('mouseout', function(event){
        event.stopPropagation();
    });
    
    $('#menucontent_div').bind('mouseleave', function(event){
        event.stopPropagation();
        $(this).children('ul').slideUp('fast', function(){
            $('div.menu > span.active').removeClass('active');
            $(this).hide(0);
        });
    });
}

function initGallery(element, url){
    if(!url){url = '/resources/js_datasources/frontpage_gallery.txt';}
    $.ajax({
        url: url, 
        type: 'get',
        async: true,
        cache: true,
        dataType: 'json',
        success: function(data, textStatus, XMLHttpRequest){
			createGallery(element, data);
		},
        error: function(XMLHttpRequest, textStatus, errorThrown){
            element.replaceWith('<h2>Error</h2><p>' + textStatus +': '+ errorThrown + '</p>');
        }
    });
}

function createGallery(element, imagegroups){
    if(!element || !imagegroups){return;}
    
    var linklist   = '<span class="gallerytabs">';
    var imglist    = '<ul class="gallery">';
    var imgcounter = 0;
    var grpcounter = 0;
    var gtotalimgs = 0;
    var gcontainer = ''; //<div class="gallery">
    var imgwidth   = 176; //240;
    
    for (var group in imagegroups){
        linklist += '<a href="#" id="linkto_'+ imagegroups[group].name +'_0" class="gallerytab">'+ imagegroups[group].name +'</a>';
        grpcounter++;
        imgcounter = 0;
        for(var image in imagegroups[group].images){
            imglist += '<li id="pic_'+ imagegroups[group].name + '_' + imgcounter + '"><img class="imagegroup" src="/ImageHandler.ashx?image=' + imagegroups[group].images[image] + '&amp;width='+ imgwidth +'" alt="bike" onclick="window.location.href=\''+ imagegroups[group].link +'\'" style="cursor: pointer" /></li>';
            imgcounter++;
        }
    }
    
    gtotalimgs = grpcounter * imgcounter;
    //tags sluiten
    linklist += '</span>';
    imglist += '</ul>';
    
    gcontainer += '<img class="slideleft scrollbutton" src="resources/images/frontpage/slideleft.png" alt="more" />' + imglist + '<img class="slideright scrollbutton" src="resources/images/frontpage/slideright.png" alt="more" />' + linklist;
    element.append(gcontainer);
    element.children('.slideleft').bind('click', function(){ scrollGallery(element, 'left'); });
    element.children('.slideright').bind('click', function () { scrollGallery(element, 'right'); });
    element.find('.gallerytabs').children('a:first').addClass('tabsactive');   
    element.children('.gallerytabs').children('a').bind('click', function(event){
        event.preventDefault();
        $(this).addClass('tabsactive');
        $(this).siblings('a').removeClass('tabsactive');
        scrollGallery(element, 'right', $(this).attr('id'));
    });
    
    $('ul.gallery li:first').before($('ul.gallery li:last'));  
    $('ul.gallery li:first').before($('ul.gallery li:last'));  
}

function scrollGallery(element, direction, cat){
    if(!element){
        return;
    }
    
    var ul = element.find('ul.gallery');
    
    var step = 1;
    if(cat){
        var c1 = 0;
        var c2 = 0;
        step = ul.children('#'+cat.replace('linkto_','pic_')).index();
        if(step > 2){direction = 'right'; step = step -2;} else if(step < 2){ direction = 'left'; step = 2-step;} else{ step = 0; return;}
    }
    
    var steppx = step*(ul.children('li:eq(2)').width()+20);
    
    if(direction == 'right'){
        ul.not(':animated').animate({'left' : 0-steppx }, steppx/1.2,function(){    
            for(var i = 0 ; i < step ; i++){
                ul.children('li:last').after(ul.children('li:first')); 
            }
            ul.css('left', '0px');
            element.children('.gallerytabs').children('a#' + ul.children('li:eq(2)').attr('id').replace('pic_', 'linkto_').replace(/_\d+/gi, '') + '_0').addClass('tabsactive').siblings('a').removeClass('tabsactive');
        });
        
    }
    
    if(direction == 'left'){
        ul.not(':animated').animate({'left' : steppx }, steppx/1.2,function(){  
            for(var i = 0 ; i < step ; i++){
                ul.children('li:first').before(ul.children('li:last')); 
            }
            ul.css('left', '0px');
            element.children('.gallerytabs').children('a#' + ul.children('li:eq(2)').attr('id').replace('pic_', 'linkto_').replace(/_\d+/gi, '') + '_0').addClass('tabsactive').siblings('a').removeClass('tabsactive');
        });
    }    
}

function initHighlights(element, url){
    if(!url){url = '/resources/js_datasources/frontpage_highlights.aspx';}
    $.ajax({
        url: url, 
        type: 'get',
        async: true,
        cache: true,
        dataType: 'json',
        success: function(data, textStatus, XMLHttpRequest){
			createHighlights(element, data);
		},
        error: function(XMLHttpRequest, textStatus, errorThrown){
            element.replaceWith('<h2>Error</h2><p>' + textStatus +': '+ errorThrown + '</p>');
        }
    });
}

function createHighlights(element, highlights){
if(!highlights){return false;}
//highlights (vierkante blokjes met nieuws oid op de voorpagina plaatsen.
    for (var highlight in highlights){
        var name = highlights[highlight].name.replace(' ','');
        element.append('<div class="highlight" id="'+name+'" style="background: white url(/ImageHandler.ashx?height=175&width=219&image='+highlights[highlight].image+') no-repeat 50% 50%; cursor: pointer" onclick="window.location.href = \''+ highlights[highlight].link+'\'" ></div>');
    }
}

function initHighlight(element, url){
    if(!url){url = '/resources/js_datasources/frontpage_highlights.aspx';}
    $.ajax({
        url: url, 
        type: 'get',
        async: true,
        cache: false,
        dataType: 'json',
        success: function(data, textStatus, XMLHttpRequest){
			createHighlight(element, data);
		},
        error: function(XMLHttpRequest, textStatus, errorThrown){
            element.replaceWith('<h2>Error</h2><p>' + textStatus +': '+ errorThrown + '</p>');
        }
    });
}

function createHighlight(element, highlights){
if(!highlights || highlights.length < 1){ return;}
    //highlights (vierkante blokjes met nieuws oid op de voorpagina plaatsen.
    var bgimg;
    var header;
    for(var i in highlights){
        var innerbox = $(element).children('.slideup');
            innerbox.append('<h4>' + highlights[i].name + '</h4>');
        if(undefined != highlights[i].text){
           innerbox.append('<p>' + highlights[i].text + '</p>');
        } else {
            innerbox.append('<p>Click here to read the complete story.</p>');
        }
        if(undefined != highlights[i].image){
            bgimg = 'url(/ImageHandler.ashx?width=306&image=' + highlights[i].image+ ')'
        } else {
            bgimg = 'url(/ImageHandler.ashx?height=169&image=/resources/repository/Image/headers/hdr_default.jpg)'
        }
        if(undefined != highlights[i].header && highlights[i].header != "NULL"){
            header = highlights[i].header;
        } else {
            header = 'Featured';
        }
        $(element).parent('div').siblings('h3').text(header)
        
        $(element).css('background-image', bgimg);
        if(undefined != highlights[i].link){
            $(element).bind('click', function(){
                window.location.href = highlights[i].link;
            }).css('cursor','pointer');
        }
        break;
    }
}



function initNews2(element, url, langid){
    if(!url){url = '/resources/js_datasources/frontpage_news.aspx';}
    $.ajax({
        url: url, 
        type: 'get',
        async: true,
        cache: true,
        dataType: 'json',
        success: function(data, textStatus, XMLHttpRequest){
            createNews2(element, data);           
		},
        error: function(XMLHttpRequest, textStatus, errorThrown){
            element.replaceWith('<div style="padding: 10px;"><h5>Error</h5><p>' + textStatus +': '+ errorThrown + '</p></div>');
        }
    });
}

function createNews2(element, news){
    if(!news){return false;}
    var toAppend = '<ul class="newslist">';
    var controls = '<div class="nwscontrols">';
    var count = 0;
    var title = "";
    
    for(var nw in news){
        title = news[nw].header.substr(0,26);
        toAppend += '<li style="background-image: url(/ImageHandler.ashx?height=169&image='+news[nw].image+')" onclick="'+ news[nw].link +';" id="item_'+count+'"><div class="slideup"><h4>'+ news[nw].header.substr(0,26) +'</h4><p>'+news[nw].html+'</p></div></li>';
        controls += '<span class="itemcontrol" id="goto_'+ count +'">&#8226;</span>';
        count ++;
    }
    toAppend += '</ul>' + controls + '</div>';
    $(element).append(toAppend);
    $(element).find('span.itemcontrol').bind('click', function(){
           $(this).addClass('active').siblings().removeClass('active');
           var toShow = $(element).find('#' + $(this).attr('id').replace('goto_', 'item_'));
           toShow.siblings().fadeOut('fast',function(){
                toShow.fadeIn('slow');
       });
    }).css('cursor', 'pointer').filter(':eq(0)').click();
    var timer2 = window.setTimeout("window.setInterval('animateNews()', 4000)", 1000);
    
}

//HEADER ANIM
function initimagerotator(element, url){
    if (!url){ url = '/resources/js_datasources/frontpage_banners.aspx'}
    $.ajax({
        url: url, 
        type: 'get',
        async: true,
        cache: true,
        dataType: 'json',
        success: function(data, textStatus, XMLHttpRequest){
                imagerotator(element, data); //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 = '489';
    var overlay = '<img src="/resources/images/play_overlay.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>');
    }

    control.append('<span class="pause" id="pause">||</span>');
    
    //container.css({'height' : container.children('img:first').height() + 'px' });
    container.children('img').hide();
        
    animateHeader();

    control.children('span.pause').bind('click', function () {
        if (DoAnimateHeader == true) {
            DoAnimateHeader = false;
            $(this).addClass('activeheader');
        }
        else {
            DoAnimateHeader = true;
            $(this).removeClass('activeheader');

            clearTimeout(timer1);
            timer1 = window.setTimeout(animateHeader, 4000);
        }           
    });

    control.children('span.headercontrol').bind('click', function () {
        

        clearTimeout(timer1);
        timer1 = window.setTimeout(animateHeader, 4000);

        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});               
                flowplayer(id, { src: "/resources/flowplayer/flowplayer-3.2.5-1.swf", wmode: 'opaque', version: [9, 115] },{
                        clip: {
                            url: href,
                            autoPlay: true,
                            autoBuffering: true,
                            accelerated: true,
                            fadeInSpeed: 100,
                            fadeOutSpeed: 100,
                            scaling: 'scale'
                        },
                        plugins: {
	                        controls: {
		                        top: 462,
		                        opacity: 1,
                                buttonColor: "rgba(254,162,2,0.7)",
		                        tooltips: {
    			                    buttons: true
			                    },
			                tooltipTextColor: "#fea202",
			                autoHide: {
			                    enabled:true,
			                    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+1) > control.children(':last').index()) {
        counter = 0;
    }
    control.children('#goto_headerbanner'+(counter)).click();
}

function animateNews(){
    if(!DoAnimateNews){
        return;
    }
    
    var control = $('#newnewscontainer > div.nwscontrols');
    var counter = control.children('.active').index();
    if(control.children().length < 2){
        control.children().remove();
        DoAnimateNews = false;
    }
    counter += 1;

    if(counter > control.children(':last').index()){
        counter = 0;
    }
    control.children('#goto_'+counter).click();
}

function listeffect(selector){
    $(selector + ' ul li').bind('mouseenter mouseleave', function(){
        $(this).parent('ul').children('li:first-child').toggleClass('smactiveli');
        //$(this).parent('ul').children('li:first-child').toggleClass('smtopli');
        //$('div.controls').text($(this).text());
    });
}

function createBikeGallery(selector){
    selector.children('.thumbs').children('.thumbsele').bind('mouseover', function(){
        var src = $(this).css('background-image').replace('height=44', 'height=440').replace('width=57', 'width=687');
        selector.css({'background-image' : src});
    });
    if ($.browser.msie && $.browser.version < 9) {
    //IE bugt vaak op de corner plugin en deze is niet persé nodig voor de werking: dus niks doen als er IE is.
    } else {
        selector.children('.thumbs').children('div').corner('2px');
        selector.corner('2px');
    }
//    var randnr = Math.floor(Math.random()*selector.children('.thumbs').children('img').length)
//    selector.children('.thumbs').children('img:eq('+randnr+')').mouseover();
    selector.children('.thumbs').children('div:eq(0)').mouseover();
    
    selector.bind('click', function(event){
		window.open($(this).css('background-image').substr(3).replace(/[()"']/gi,'').replace(/&height=\d+/gi,''));
	}).css('cursor', 'pointer');
}

function addbikes(element, target, url, header, openbike){
    var toAppend = '';
    var counter = 0;
    var childwidth = '230';
    if(!header){var header = '#headercontainer'}
    $.ajax({
        url: url, 
        type: 'get',
        async: true,
        cache: true,
        dataType: 'html',
        success: function(data, textStatus, XMLHttpRequest){
            target.html($(data));
            $(data).each(function(index, el){
                if($(el).text().length > 10){
                    var src = $(el).children('img:first').attr('src');
                    var title = $(el).children('h2:first').text();
                    var id = $(el).attr('id');
                    var cat = $(el).children('img:first').attr('alt').replace('category_','');
                    var onclick = "$(this).children('h2').css('color', '#fea202').parent().siblings('div').children('h2').css('color', 'black'); $('#" + target.attr('id') + " #" + id + "').show().siblings().hide(); $('"+header+"').removeClass().addClass('"+cat+"').addClass('headercontainer'); $('"+header+"').children('div').children('."+ cat +"').show().siblings('p').hide();";
                    element.append('<div id="linkto_'+id+'" class="scroll-content-item ui-widget-header" onclick="'+onclick+'" style="cursor: pointer; background: transparent url('+src+') no-repeat 50% 20px; z-index: 15"><h2>'+title+'</h2></div>');
                    if(!openbike){
                        element.children('div.scroll-content-item:eq(0)').click();
                    } else {
                        element.children('div#linkto'+openbike).click();
                    }
                    counter ++;
                }
			});
			if(counter * childwidth < 933){
			    $('.scroll-bar-wrap').hide();
			    $('#btnright, #btnleft').hide();
			}
			//element.append(toAppend);
			element.css('width', (counter * childwidth) + 'px');
		},
        error: function(XMLHttpRequest, textStatus, errorThrown){
            element.parent().replaceWith('<h2>' + textStatus +': '+ errorThrown + '</h2>');
            //Cufon.refresh();
        }
    });
    
}

function showLightBox(id){
    //lightbox popup venster tonen
    if ($.browser.msie && $.browser.version < 9) {
        $('body').children('#' + id).css({
            'background': 'transparent url(/resources/images/lightbox/bg_lightbox.png)',
            'display': 'block'
        });
        $('body').children('#' + id).children('div.lightbox').show();
    } else {
        $('body').children('#' + id).fadeIn('fast', function() {
            $(this).children('div.lightbox').fadeIn('fast');
        });
    }
}

function hideLightBox(id) {
    if ($.browser.msie && $.browser.version < 9) {
        $('body').children('#' + id).find('div.lightbox').fadeOut('fast', function() {
            $('body').children('#' + id).css({
                'background': 'transparent url(/resources/images/lightbox/bg_lightbox.png)',
                'display': 'none'
            });
        });
    } else {
        $('body').children('#' + id).find('div.lightbox').fadeOut('fast', function() {
            $(this).parent('#' + id).fadeOut('fast');
        });
    }
}

function initLightBox(triggerelement, id, sourcepage) { 
    /* 
    deze functie laadt gegevens in om te weergeven in de lightbox,
    maakt de lightbox klaar om weer te geven en zorgt voor de 
    binding.
    */

    if(id==undefined || id=='lightbox'){
        id = 'lightbox_container_element';
    }

    if (sourcepage == undefined) {
        var sourcepage = "/resources/js_datasources/lightbox.aspx #lightbox1"
    }

    
    $('body').append('<div class="lightboxcontainer" id="'+ id +'"></div>');
    var container = $('body > div#' + id);
    //gegevens inladen
    container.load(sourcepage);
    
    //trigger binden: show
    triggerelement.data('toDisplay', id);
    triggerelement.bind('click', function(event) {
    event.preventDefault()
        var expand = $(this).data('toDisplay');
        showLightBox(expand);
    });

    //trigger binden: close
    $('body #'+id+' .lightboxclose').live('click', function(event) {
        event.preventDefault();
        hideLightBox(container.attr('id'));
    });

    //preloading
    var sources = ['/resources/images/lightbox/shadowtop.png', '/resources/images/lightbox/shadowbottom.png', '/resources/images/lightbox/bg_lightbox.png', '/resources/images/lightbox/shadowsides.png'];
    for (var x in sources) {
        $('body').append('<img src=' + sources[x] + ' alt="preloading.." style="visibility: hidden; display: block; width: 1px height: 1px; position: absolute; bottom: 0px; right: 0px;">');
    }
}

function doTooltip(elementarr) {
    $('body > .tooltipcontainer').remove();  
    elementarr.each(function(index) {
        if ($(this).attr('title')) {
            $(this).data('tooltiptext', $(this).attr('title'));
        } 
        $(this).data('tooltipbind', index);
        $(this).removeAttr('title');
        $(this).removeAttr('alt');
        $('body').append('<div class="tooltipcontainer" style="background-color: white;"><div id="tooltip' + index + '" class="tooltipdiv"></div></div>');
        var selector = 'body > div.tooltipcontainer > #tooltip' + index;
        $(selector).html($(this).data('tooltiptext'));
        //$(selector).offset({ 'top': pos.top - 17, 'left': pos.left + 20 });
        //$(selector).corner('4px');
    });

    elementarr.bind('mouseover', function(index) {
        var selector = 'body > div.tooltipcontainer > #tooltip' + $(this).data('tooltipbind');
        var pos = $(this).offset();
        $(selector).css({ 'position': 'absolute', 'left': (pos.left + 0) + 'px', 'top': (pos.top - 10 - $(selector).height()) + 'px', 'display': 'none' });
        $(selector).stop();
        $(selector).fadeTo('fast', 1.0);
    });
    
    elementarr.bind('mouseleave', function() {
    var selector = 'body > div.tooltipcontainer > #tooltip' + $(this).data('tooltipbind');
        $(selector).fadeOut('slow');
    });
}

function shroud(){
    var info = '<div id="shroudloader" style="margin: 0px auto; text-align: center; display: none;"><h2 style="color: white; font-size: 35px;">Loading</h2><!--<img src="/resources/images/loading/loading3.gif" />--></div>';
    info = '<div style="width: 40%; height: 70%; padding: 15% 30%; text-align: justify;">'+info+'</div>';
    $('body').append('<div id="shroudingdiv" style="position: fixed; top: 0px; left: 0px; background: #000 url(/resources/images/logo.png) no-repeat center 30px; width: 100%; height: 100%; z-index: 999; color: white; text-align: center;">'+info+'</div>');
    
    blink('#shroudloader');
   
    $(document).trigger('customevent');
    function blink(element){
        $(element).delay(200).fadeOut('slow', function(){
            $(this).delay(200).fadeIn('slow', function(){ blink($(this)) });
        })
    }
}

function unshroud(){
    $('body > #shroudingdiv:not(.prevented)').children('').css('display','none').remove();
    $('body > #shroudingdiv:not(.prevented)').fadeOut('slow', function(){
        $(this).remove();
    });
}

function expandFAQ(element, expandthis){
    element.children('div.antwoord').css('display', 'none').data('show', false);
    element.addClass('FAQholder');
    element.children('h4').bind('click', function() {
        $(this).removeClass('expanded');
        $(this).siblings('h4').removeClass('expanded');
        var id = $(this).attr('id').replace('vraag', 'antwoord');
        if ($(this).siblings('div#' + id).data('show')) {
            //als de juiste div al wordt weergegeven: allen verbergen
            $(this).siblings('div').slideUp('fast');
            $(this).siblings('div').data('show', false); 
        } else {
            //zo niet: deze verbergen
            $(this).siblings('div').slideUp('fast');
            $(this).siblings('div').data('show', false);
            $(this).siblings('div#' + id).slideDown('fast');
            $(this).siblings('div#' + id).data('show', true);
            $(this).addClass('expanded');
        }        
    });

    if (expandthis) {
        element.children('#vraag' + (expandthis)).click();     
	}
}
