$(document).ready(function() {
	// deactivate fx on IE 7 and below
    $.fx.off = (jQuery.browser.msie && jQuery.browser.version <= 7);

    // let the sponsors fade
	$('#sponsors').cycle({
        fx:         'fade',
        pause:      1,
        speed:      1000,
        timeout:    7000,
        slideExpr:  'div',
        random:     1
    });

	// add menu functionality
	var activeDropdownMenuID = -1;

    $('#header>ul>li').hoverIntent({
    	over: 	function() {
    				// show dropdown
    				$(this).children('ul').fadeIn(150);

    				// make active menu header inactive
    				$('#header>ul>li>a.active').removeClass('active').addClass('inactive');
    				activeDropdownMenuID = $('#header>ul>li').index(this);
    			}, 
    	out:	function() {
    				// hide dropdown
    				$(this).children('ul').fadeOut(300);

    				// make active menu header inactive
    				if ( activeDropdownMenuID == $('#header>ul>li').index(this) ) {
    					$('#header>ul>li>a.inactive').removeClass('inactive').addClass('active');
    				}
    			},
    	timeout: 300
    });

    // split dropdown submenu's
	$('#header>ul>li>ul>li').each(function(i, e) {
    	if ( $(this).find('li').length > 8 ) {
    		var order = false;
    		// make dropdown level 1 twice the normal width
    		$(e).find('ul').css({
				'width'		:	'310px',
			});

    		// give each second element an extra margin
    		$(this).find('li').each(function(index) {
    			if ( index % 2 == 1 && !order ) {
    				$(this).css({
    					'margin-left'	:	'10px',
    				});
    			}
    			if ( index > ($(e).find('li').length / 2) && order) {
    				$(this).css({
    					'position'		:	'relative',
    					'top'			:	'-' + ( ($(e).find('li').length / 2) * 23 ) + 3 +'px',
    					'left'			:	'160px'
    				});
    			}
    		});
    	}
    });

	// let the carousel (sc)roll!
	var speed = 1400;
	var timeout = 10000;
	$('#carousel').cycle({
        fx:         'scrollHorz',
        pause:      1,
        speed:      speed,
        timeout:    timeout,
        slideExpr:  'div.container', 
        pager:      '#carousel .nav',
        before:		function(currSlideElement, nextSlideElement, options, forwardFlag) {
						if ( currSlideElement != nextSlideElement && !$.fx.off ) {
							if ( forwardFlag ) {
								$(nextSlideElement).find('.image').each(function(index, element) {
									$(element).css({left: (480*(index+1)) + 'px'});
								});
								$(currSlideElement).find('.image').each(function(index, element) {
									$(element).delay((0.4+(0.05*index))*speed).animate({left: (-480*(0+1)) + 'px'}, 0.6*speed);
								});
							}
							else {
								$(nextSlideElement).find('.image').each(function(index, element) {
									$(element).css({left: -(480*(index+1)) + 'px'});
								});
								$(currSlideElement).find('.image').each(function(index, element) {
									$(element).delay((0.4+(0.05*index))*speed).animate({left: (480*(0+1)) + 'px'}, 0.6*speed);
								});
							}
							$(nextSlideElement).find('.image').each(function(index, element) {
								$(element).delay((0.4+(0.05*index))*speed).animate({left: '0px'}, 0.6*speed);
							});
						}
					},
		after:		function(currSlideElement, nextSlideElement, options, forwardFlag) {
						$(currSlideElement).find('.image').css({left: '0px'});
					}
    });

	// let the login field shine (and hide)
	var login_speed = 600;
	$('#login_button').click(function() {
		$('#login').animate({
			height:	'72px',
			width:	'247px'
		}, login_speed);
		$('#login p').fadeOut(login_speed/2);
		$('#login_form').delay(login_speed).fadeIn(login_speed/2);
	});
	$('#login_button, #login_form').click(function(e) {
		e.stopPropagation();
	});
	$('body.cg_logged_out').click(function() {
		$('#login_form').fadeOut(login_speed/2);
		$('#login').delay(login_speed/2).animate({
			height:	'20px',
			width:	'72px'
		}, login_speed);
		$('#login p').delay(login_speed+40).fadeIn(login_speed/2);
	});

    // make the search field grow when you select it, and vice versa
	$('#cg_search_field').focus(function() {
		$('#cg_search_field').addClass('active', 500);
		$('#cg_search_field').select();
	}).blur(function() {
		$('#cg_search_field').removeClass('active', 500);
	});

	// show more photo's
	$('.cg_foto_more').toggle(function() {
		$('.cg_foto_item.cg_foto_hide').each(function(index, element) {
			$(this).show(600);
		});
		$('.cg_foto_item img.cg_foto_hide').each(function(index, element) {
			$(this).delay(600+index*150).fadeIn(300);
		});
		$('.cg_foto_more').addClass('cg_foto_less');
	}, function() {
		$($('.cg_foto_item img.cg_foto_hide').get().reverse()).each(function(index, element) {
			$(this).delay(index*50).fadeOut(100);
		});
		$('.cg_foto_item.cg_foto_hide').delay($('.cg_foto_item img.cg_foto_hide').length*50).hide(300);
		$('.cg_foto_more').removeClass('cg_foto_less');
	});
	
	// make the shoutbox do some funny things (because Tim likes it and Melvin is the boss)
	$('.shoutbox_form textarea').focus(function() {
		$('.shout_extra').slideDown(300);
		$('.shoutbox_form textarea').removeClass('cg_corner_bottom');
	});
	$('.shoutbox_form').click(function(e) {
		e.stopPropagation();
	});
	$('body').click(function() {
		$('.shout_extra').fadeOut(500);
		$('.shoutbox_form textarea').addClass('cg_corner_bottom');
	});
});
