jQuery( function()
{
    $('.tabs-nav li').click( function()
    {
        $('.tab-1').removeClass('tabs-selected');
        $('.tab-2').removeClass('tabs-selected');
        $('.tab-3').removeClass('tabs-selected');
        $('.tab-4').removeClass('tabs-selected');

        var $switch = $(this).attr('class');

        $('#tab-1').hide();
        $('#tab-2').hide();
        $('#tab-3').hide();
        $('#tab-4').hide();
        $('.first-1').hide();
        $('.first-2').hide();
        $('.first-3').hide();
        $('.first-4').hide();

        $('#' + $switch).show();
        $('.first-' + $switch.substr(4,1)).show();

        $(this).addClass('tabs-selected');
    });

    // Move vacatures
    if ($('#vacatures > #results').length > 0 && $('a[name=vacatures]').length > 0) {
        $('#vacatures > #results').insertAfter($('a[name=vacatures]'));
    }

    // Html vacatures clean up
    $('a[name=vacatures]').remove();
    $('#results').livequery( function() {
        $('#results table:first').prevAll().remove();
        $('#results table:last').remove();
    });

    // Add even class to table rows from vacature tables
    $('#results tr.lst-bg-j:even').addClass('even');

    // Add even class to other tables
    $('tr:even:not(#results tr)').addClass('even');

    // styling jobs
    //$('.applybutton a.buttonface').addClass('box');
    //$('.Lstspace').parent().remove();

    var val = $('.JD-FieldText').html();
    $('.JD-FieldText').html("<br />" + val);
    $('.bottompanebuttons').empty();

    $('.bottompanebuttons').append(
        '<tr class="even">' +
            '<td>' +
                '<table cellspacing="0" cellpadding="0" border="0">' +
                '<tbody><tr><td><a href="javascript:applyOnline();" class="box">Nu solliciteren</a></td></tr>' +
                '</tbody></table>' +
             '</td>' +
        '</tr>' +
        '<tr class="even">' +
            '<td>' +
                '<table cellspacing="0" cellpadding="0" border="0">' +
                '<tbody><tr class="even"><td><br /></td></tr>' +
                '</tbody></table>' +
            '</td>' +
        '</tr>'
    );

    $('.JD-FieldLabel').parent().prev('tr').remove();
    $('.titspacer').parent().remove();
    $('.lst-resnav1').remove();
    $('.lst-resnav').parent().remove();
    $('.descspacer').parent().remove();
    $('.JD-Tmaster tbody tr:first').remove();
    $('.LstA-T1 td').css('display', 'table-cell');
    $('.LstA-T1').append('<tr><td width="280"></td><td width="280"></td><td></td></tr>');

    // Flash available and carousel DIV in page ? -> embed flash, if not -> use JavaScript carousel and menu
    if ( swfobject.hasFlashPlayerVersion("9") === true && $( "#carousel" ).length > 0 )
    {
        var fv = {};
        if ( typeof( flashVars ) !== "undefined" )
        {
            var f = flashVars.split("&");
            for ( var i = 1; i < f.length; ++i )
            {
                var vars = f[i].split("=");
                fv[ vars[0] ] = vars[1];
            }
        }
		var params = {};
		params.wmode = "transparent";
        swfobject.embedSWF( "Header.swf", "carousel", "100%", "100%", "9", "expressinstall.swf", fv, params );
    } else {
        Carousel.init();
        Menu.init();
    }
    $( window ).resize( handleResize );
    handleResize();
});

function handleResize()
{
    // we have no media queries available in IE >=(
    if ( navigator.userAgent.toLowerCase().indexOf( "msie") > -1 )
    {
        if ( $( window ).width() >= 1200 )
        {
            $( "#side" ).css( { "position": "absolute", "left": "-214px", "border": "none" } );
            $( "#side.border" ).css( "border-right", "none" );
            $( "#main .column_middle" ).css( "width", "761px" );
        }
    }
    // keep the footer at the bottom when there's little content on a page...
//    if ( $( window ).height() >= $( document ).height() * .9 )
//    {
//        $( "#footer" ).css( { "position": "absolute", "bottom": "0", "left": ( $( window ).width() * .5 - 137 ) + "px" });
//    } else {
//        $( "#footer" ).css( { "position": "relative", "left": 0 });
//    }
}

function getNewHeight(array_items)
{
    var columnHeight = 0;
    for (var i = 0; i < array_items.length;i++ )
    {
        var ih = array_items[i];
        if ( ih > columnHeight ) {
            columnHeight = ih;
        }
    }

    return columnHeight;
}

function show360() {
    window.open('flash/panorama.html','pano','width=900,height=650,scrollbars=yes,resizable=yes').focus();
}

var Menu =
{
    timeout:    500,
    closetimer: 0,

    init: function()
    {
        $( "#menu > dl" ).bind( "mouseover", Menu.jsddm_open );
        //$( "#menu > dl" ).bind( "mouseout",  Menu.jsddm_timer );

        var ua = navigator.userAgent.toLowerCase();
        // close the menu on touch screen devices
        if ( ua.indexOf("ipad") === -1 && ua.indexOf("android") === -1 ) {
            document.onclick = Menu.jsddm_close;
        }
        var curUrl = document.location.href.split("http://" + document.domain + "/").join("").split("/");

        if ( curUrl.length > 1 ) {
            $( "#menu dt" ).each( function(i)
            {
                if ( $(this).text().toLowerCase() === curUrl[0] ) {
                    $( this ).addClass( "current" );
                }
            });
        }
    },
    jsddm_open: function()
    {
        var menu = $( this ).find( "ul" );
        if ( menu.hasClass( "opened" )) {
            return;
        }
        Menu.jsddm_close();
        Menu.jsddm_canceltimer();

        menu.addClass( "opened" );

        // target height, note the extra padding
        var height = $( this ).find( "ul" ).height() + 7;
        menu.parents().find( ".menu-background" ).css( "height", height + "px" );
        menu.parent().parent().animate({ top: "-" + height + "px"}, 750 );
    },
    jsddm_close: function()
    {
        $( ".opened" ).each( function(i)
        {
            $( this ).parent().parent().animate({ top: "0"}, 450 );
            $( this ).removeClass( "opened" );
        });
    },
    jsddm_timer: function()
    {
        Menu.closetimer = window.setTimeout( Menu.jsddm_close, Menu.timeout );
    },
    jsddm_canceltimer: function()
    {
        if( Menu.closetimer )
        {
           window.clearTimeout( Menu.closetimer );
           Menu.closetimer = 0;
        }
    }
};

var Carousel =
{
    container: null,
    timer    : null,
    amount   : 0,
    width    : 0,
    index    : 0,
    delay    : 5000,
    speed    : 750,

    init: function() {
        // get images
        $.ajax({ type: "GET", url: "./xml/header.xml", dataType: "xml", success: function( xml )
        {
            if ( typeof( xml ) !== "undefined" )
            {
                $( xml ).find( "image" ).each( function()
                {
                    var item = {};

                    item.src  = "./upload/header/" + $( this ).find('src').text();
                    item.link = $( this ).find('link').text();
                    item.desc = $( this ).find('description').text();

                    var li = $( "<li/>" ).appendTo( "#carousel #items ul" );
                    var i  = new Image();
                    i.src  = item.src;
                    li.append( i );

                    if ( item.link !== null && item.link !== undefined && item.link !== "" )
                    {
                        $( li ).addClass( "clickable" );
                        $( li ).click( function( e ) {
                            e.preventDefault();
                            window.open( item.link );
                            return false;
                        });
                    }

                    if ( item.desc !== null && item.desc !== undefined && item.desc !== "" )
                    {
                        var d  = $( "<div/>", { "class":  "carousel-text" });
                        var bg = $( "<div/>", { "class": "text-background" }).appendTo( d );
                        var h3 = $( "<h3/>").html( item.desc );
                        li.append( d.append( h3 ));

                        $( bg ).css( "height", ( d.height() + 7 ) + "px" );
                        $( h3 ).css( "position", "absolute" );
                    }
                });

                // faux circular mode by simply inversing the comment order...
                if ( !$.isFunction( $.fn.reverseOrder ))
                {
                    $.fn.reverseOrder = function() {
                        return this.each( function() {
                            $( this ).prependTo( $( this ).parent());
                        });
                    };
                }
                Carousel.container = $( "#carousel #items" );
                Carousel.start();
            }
        }});
    },
    start: function()
    {
        // total amount of items in list
        this.amount = $( this.container ).find( "li" ).length;
        if ( this.amount === 0 ) {
            return;
        }
        // width of a single list item
        this.width = $( this.container ).find( "li" ).eq(0).outerWidth();
        $( Carousel.container ).find( "ul" ).css( "position", "absolute" ).css( "width", this.width * this.amount + "px" );

        // start index ( first item )
        this.index = 0;
        this.timer = setInterval( this.animate, this.delay );
    },
    stop: function()
    {
        Carousel.container = null;
        clearInterval( this.timer );
    },
    animate: function()
    {
        if ( Carousel.container === null ) {
            clearInterval( CommentCarousel.timer );
            return;
        }
        ++Carousel.index;
        // circular
        if ( Carousel.index >= Carousel.amount ) {
            $( Carousel.container ).find( "li" ).reverseOrder();
            $( Carousel.container ).find( "ul" ).css( "left", "0px" );
            Carousel.index = ( Carousel.amount > 1 ) ? 1 : 0;
        }
        $( Carousel.container ).find( "ul" ).animate({
            left: "-" + Carousel.index * Carousel.width
        }, Carousel.speed );
        //$( "#feed ul" ).css( "left", "-" + CommentCarousel.index * CommentCarousel.width + "px" );
    }
};

$( "document" ).ready( function() {

    // make all item containers containing hyperlinks clickable...
    /*$.each( $( ".main-home .news_item" ), function( i )
    {
        var links = $( this ).find( "a" );

       // URL found ? set cursor pointer
       if ( links.length > 0 )
       {
           $( this ).css( "cursor", "pointer" );
           $( this ).click( function( e )
           {
               var links = $( e.currentTarget ).find( "a" );
               // URL found
               if ( links.length > 0 ) {
                   var href = links.attr("href");
                   if ( href !== null ) {
                       window.location = href;
                   }
               }
               e.preventDefault();
               return false;
           });
       }
    });*/

    // Get the highest height of the first row of items
    var columnHeight = new Array();
    var columnHeightItems = new Array();
    $('#main .column.border').each(function(e) {
        columnHeightItems.push( $(this).children().height() );

        var heightItems = 0;
        $(this).children().each(function(i){
            heightItems += $(this).height();
        });

        //console.log(heightItems);
        columnHeight.push(heightItems);
    });

    // equalize column heights
    //console.log("TOTAL", columnHeight);
    // Set the value, so the columns has equal column height

    var newColumnHeightItems = getNewHeight(columnHeightItems);
    $('#main .column.border').each(function(e) {
        $(this).children().first().each(function() {
            $(this).height( newColumnHeightItems );
        });
    });

    if ( $( ".border" ).length > 0 )
    {
        var h = 0;
        $( ".border" ).each( function(i)
        {
            var ih = $( this ).height();
            if ( ih > h ) {
                h = ih;
            }
        });
        //var newColumnHeight = getNewHeight(columnHeight);
        $( ".border" ).css( "height", ( h - 30  ) + "px" );

    }

    // Add a span to a.box
    $('a.box').wrapInner( '<span></span>' );
});
