var loaderimg = 'static/img/copperplate.jpg';  
var pimg=new Image();
pimg.src = loaderimg;


jQuery(document).ready(function(){
	
	jQuery('#submit').click(function(){
		jQuery('#loader').show();							
	});
	
	// de photos rond laten faden
	jQuery('#blendme').cycle({ 
		fx:     'fade',  
		timeout: 5000,
		speed: 1000,
		random: 1
	});

	// na 2 seconden de pane laten uitklappen, dit is voor de homepage
	setTimeout(expand_home, 2000);
	// de animatie starten van de photo's op de achtergrond
	animate_photos(); // deze kan je uitzetten
	setInterval(animate_photos, 5000);
	
	
	// zorgen dat de pane in en uitklapt als hier op wordt geklikt
	jQuery('#toggle_expand').click(function(){
		var current_class = jQuery(this).hasClass('minus');
		if(current_class == true){
			jQuery(this).removeClass('minus').addClass('plus');
			animate_expand('in');
		}
		else{
			jQuery(this).removeClass('plus').addClass('minus');
			animate_expand('out');
		}
	});
	
});

// de scrollbar aanmaken
document.observe('dom:loaded',function(){	
	var scrollbar = new Control.ScrollBar('scrollbar_content','scrollbar_track');
});

// expand pane na 2 seconden
function expand_home(){
	jQuery('#toggle_expand').removeClass('plus').addClass('minus');
	animate_expand('out');	
}

// klapt pane in en uit
function animate_expand(direction){
	var speed = 1200;
	
	if(direction == "in"){
		jQuery('#expanding').animate({
			marginLeft: "-412px",
			opacity: '0.9'
		}, speed );
	}
	else{
		jQuery('#expanding').animate({
			marginLeft: "0px",
			opacity: '1.0'
		}, speed );
	}	
}

var panim = 1;
function animate_photos(){
var anim_speed = 4500;
	if(panim == 5){ panim = 1; }
	
	if(panim == 1){
		jQuery('#blendme').animate({
			marginLeft:"-200px",
			marginTop:"-100px"
		}, anim_speed);
	}
	else if(panim == 2){
		jQuery('#blendme').animate({
			marginTop:"0px"
		}, anim_speed);
	}
	else if(panim == 3){
		jQuery('#blendme').animate({
			marginLeft:"0px",
			marginTop:"-100px"
		}, anim_speed);
	}
	else if(panim == 4){
		jQuery('#blendme').animate({
			marginTop:"0px"						  
		}, anim_speed);
	}
	panim++;
}
