$(document).ready(function() {
	$("#body-background").ezBgResize();
	$(window).bind("resize", function(){$("#body-background").ezBgResize();});
	
	// init color dark or light
	$('#navigation h2, #header, #header a, .col2, .sub').removeClass('dark light').addClass('dark');
	
	$("#navigation").accordion({ collapsible: true, active: false, autoHeight: false, header: 'div.header' });
		
	$(".tweet").tweet({
        username: "heijmerikx",
        join_text: "auto",
        avatar_size: null,
        count: 2,
        auto_join_text_default: "zei ik,",
        auto_join_text_ed: "ik",
        auto_join_text_ing: "ik was",
        auto_join_text_reply: "reageerde ik op",
        auto_join_text_url: "checkte ik",
        loading_text: "laden van tweets..."
    });
    
    $('#cycle').cycle({ 
        fx:     'fade', 
        speed:  'fast', 
        timeout: 0, 
        next:   '#next', 
        prev:   '#prev' 
    });
	 
	$('.bgchange').bind('click', function(){
		// give the element the classname of the corresponding image id name
		// ie; <a href="#" class="imagename bgchange" /> => <img src="" id="imagename" />
		// when using multiple classes, make sure to use the first classname.
		var afbeelding = $('#'+$(this).attr('class').split(" ")[0]).attr('src');
		var kleur = $('#'+$(this).attr('class').split(" ")[0]).attr('alt');
	
 		$('#body-background img').attr('src', afbeelding);
 		//$('#navigation h2, #header, #header a, #twitter, .sub').animate({color: '#'+kleur}, 400);
		$('#navigation h2, #header, #header a, .col2, .sub').removeClass('dark light').addClass(kleur);
	 	
	 });
     
     $("#cftr").toggle(function () {
       		$("#footer").animate({height: 40}, 100);
       		$("#navigation").accordion("activate", -1);
       	}, function () {
       		$("#footer").animate({height: 0}, 100);
       		$("#navigation").accordion("activate", -1);
       	}
     );
     
     // main menu logic
     $('#navigation ul li').bind('click', function(){
     	//alert('d');
     	$('#navigation ul li ul').fadeOut(200);
     	$(this).children().fadeIn(200);
     });

     $('#togglebutton').click(function() {clients();});
   



     

});


Shadowbox.init({
	skipSetup: false,
	adapter: 'jquery',
    players:  ['img', 'html', 'iframe'],
	overlayColor: '#000',
	continuous: true,
	animateFade: true,
	animate: true,
	overlayOpacity: 0.8,
	enableKeys: false
});

function clients(){
    Shadowbox.open({
        player:     'html',
        content:    $("#portfolio").html(),
        height:		452,
        width:		640
    });
}