$(document).ready( function(){

	//alert( $('html').attr('class') )
	
	// scroll to page or serie
	if( !$('body').hasClass('mobile') ){
		$('#main_navi a').click( function(){
		
			var $this	= $(this);
			var href	= $this.attr('href')
			var $target	= $( href );
			
			// scroll to target
			$('#content_wrapper').scrollTo( $target, 1000, {offset: {top: -100, left: -400}} );	
			
			// toggle active
			$('#header .active, #main_navi .active').removeClass('active')
			$this.parent().addClass('active')
			
			return false;
		
		});
	}else{
		
		$('#main_navi li').click( function(){
		
			var $this	= $(this).find('a');
			var href	= $this.attr('href')
			var $target	= $( href );
			var offset	= $target.offset();
			
			$('body').scrollTo( $target, 1500 );	
			
			return false;
		
		});
	}
	
	// click h1 a > scroll to home (#page-about)
	if( !$('body').hasClass('mobile') ){
		$('#header a').click( function(){
		
			var $this	= $(this);
			var href	= '#page-about';
			var $target	= $( href );
			
			// scroll to target
			$('#content_wrapper').scrollTo( $target, 1000, {offset: {top: -100, left: -400}} );	
			
			// toggle active
			$('#header .active, #main_navi .active').removeClass('active')
			$this.addClass('active')		
			
			return false;
		
		});
	}	

	// erzeuge die einrückung in der länge der überschrift in der .story als span
	$('#content article').each( function(){
	
		var $this 			= $(this);
		var h2_width		= $this.find('header h2').width()
		var html			= '<span style="width: ' + h2_width + 'px;" class="spacer"></span>';
		$this.find('section.story').prepend( html )
	
	
	});
	
	// overflow scroll nur wenn height > max-height
	$('#content article').each( function(){
	
		var $this 			 = $(this);
		var story_max_height = parseInt( $this.find('.story').css('max-height') )
		$this.find('.story').css('max-height', '1000px') // extend max-height to get the real height
		var story_height	 = $this.find('.story').height()
		
		if( story_height > story_max_height ){
		
			$this.find('.story').css('overflow-y', 'scroll')
			$this.find('.story').css('max-height', story_max_height + 'px').addClass('has_overflow')
		
		}
	
	});		
	
	// bottom spacer abstand von oben
	$('#content article').each( function(){
	
		var $this 			= $(this);
		var story_height	= $this.find('.story').outerHeight()
		$this.find('.bottom_spacer').css('top', story_height)
	
	});
	
	// set height/width of the a fpr the open-gallery-overlay
	$('#content article.serie img').each( function(){
	
		var $this 			= $(this);
		var height			= $this.attr('height')
		var width			= $this.attr('width')
		
		$this.parent().height( height )
		$this.parent().width( width )
	
	});	
	
	
	// trash - scroll offset
	var $next_event_article			= $('article.in_future:last').addClass('is_next').css('outline', '0px solid red')
	var offset_top 					= ($(window).height() / 2 ) - $next_event_article.height();	
	offset_top						= 350;
	if( $next_event_article.size() > 0 ){
		$('body').scrollTo( $next_event_article, 600, {offset:-offset_top} );	
	}	

	
	// hole text vor bild
	$(".bottom_spacer, .top_spacer, .story, article header").hover(
		function () {
			$(this).parent().find('.story').css('z-index', '5');
			$(this).parent().find('.bottom_spacer').css('z-index', '5');
	}, 
		function () {
			$(this).parent().find('.story').css('z-index', '2');
			$(this).parent().find('.bottom_spacer').css('z-index', '4');			
		}
	);	
	
	// zeige open gallery overlay
	$("article .story_images").hover(
		function () {
			$(this).parents('article:first').addClass('hover')
	}, 
		function () {
			$(this).parents('article:first').removeClass('hover')
		}
	);		
	
	
	// contact form
	$('#page-contact form').each( function(){
	
		var $this_form = $(this);
		
		// Set default values from Labels
		$this_form.find('label').each( function(){
		
			var default_value = $(this).html()
			$(this).next().val( default_value ).attr('default_value', default_value )
		
		})
		
		// handle focus
		$this_form.find('input, textarea').focus( function(){
		
			$(this).removeClass('error')
			
			var default_value = $(this).attr('default_value')
			var current_value = jQuery.trim( $(this).val() ) 
			
			if( current_value == default_value ){
			
				$(this).val('')
				
			}		
		
		});
		
		// handle blur
		$this_form.find('input, textarea').blur( function(){
		
			var default_value = $(this).attr('default_value')
			var current_value = jQuery.trim( $(this).val() ) 
			
			if( !current_value ){
			
				$(this).val( default_value )
			
			}		
		
		});
		
		// handle submit
		$this_form.find('button[name=submit]').click( function(){
		
			var name_string  	= jQuery.trim( $this_form.find('input[name=name]').val() )
			var mail_string  	= jQuery.trim( $this_form.find('input[name=mail]').val() )
			var message_string	= jQuery.trim( $this_form.find('textarea[name=message]').val() )
			
			if( !name_string || name_string == $this_form.find('input[name=name]').attr('default_value') ){
				$this_form.find('input[name=name]').addClass('error')
				alert('Enter your Name, please.')	
				return false;				
			}			
			if( !is_valide_email(mail_string) ){
				$this_form.find('input[name=mail]').addClass('error')
				alert('Enter a valid E-Mail-Address, please.')
				return false;
			}
			if( !message_string || message_string == $this_form.find('textarea[name=message]').attr('default_value')){
				$this_form.find('textarea[name=message]').addClass('error')
				alert('Enter a message, please.')
				return false;
			}			
		
		});
		
		// handle cancel
		$this_form.find('button[name=cancel]').click( function(){
		
			$this_form.find('input, textarea').val('').removeClass('error')
			$this_form.find('input, textarea').trigger('blur')
			
			return false;		
		
		});
	
		// handle submit
		$this_form.submit( function(){
		
			var send_string = $this_form.serialize()
			
			$.ajax({
				url: 		template_directory + '/sendmail.php',
				method: 	'post',
				data : 		send_string,
				beforeSend: function( xhr ) {
					//xhr.overrideMimeType( 'text/plain; charset=x-user-defined' );
				},
				success: function( data ) {
					alert('response: ' + data)					
					$this_form.children().css('visibility', 'hidden')
					$this_form.find('button[name=new]').css('visibility', 'visible').show()
					$this_form.prev().show()
				}
			});			
			
			return false;
		
		});
	
		// handle 'compose new message'
		$this_form.find('button[name=new]').click( function(){
		
			$this_form.children().css('visibility', 'visible')
			$this_form.find('button[name=new]').css('visibility', 'hidden').hide()
			$this_form.prev().hide()
			
			$this_form.find('button[name=cancel]').trigger('click')
			
			return false;
		
		});
		
	});
	
	
	// lightbox
	if( !$('body').hasClass('mobile') ){
		$(".story_images a").each( function(){ // vergebe rel damit die bilder als galerie angezeigt werden
		
			var $this = $(this)
			var id = $this.parent().parent().attr('id')
		
			$this.attr('rel', id)
		
		});
		$(".story_images a").colorbox({
			'transition' : 'none',
			'width' : '100%',
			'height' : '100%',
			'innerWidth' : '100%',
			'opacity' : 0.9,
			'fixed' : true,
			'title' : $(this).find('a').attr('title'),
			'onOpen' : function(){
				
				//$('#cboxOverlay').css('background', 'red')
				//$('object, iframe').css('visibility', 'hidden')
			
			},
			'onClosed' : function(){
			
				//$('object, iframe').css('visibility', 'visible')
			
			}
		})	
	}
	
	
	// init Raphael Canvas
	if( !$('body').hasClass('mobile') && !$('html').hasClass('xxoldie') ){
		$paper_wrapper = $('<div id="paper"></div>').appendTo('#content_wrapper')
		$paper_wrapper
			.css('position', 'absolute')
			.css('top',  '0')
			.css('left', '0')
			.css('pointer-events', 'none')
		
		var paper_width		= $('#content').width()
		var paper_height	= $('#content').height()
		var paper 			= Raphael("paper", paper_width, paper_height);
		var offset			= 30;
		var color			= '#515151';
		
		
		// generiere verbindungslinien
		// verbinde alle article.serie mit allen article.serie und #about
		$all_series = $('#content article.serie, #page-about')
		$all_series.each( function(){
		
			var $this		= $(this);
			var this_top	= parseInt( $this.css('top') )  + offset
			var this_left	= parseInt( $this.css('left') ) + offset
			
			$all_series.each( function(){
			
				var $this		= $(this);
				var target_top	= parseInt( $this.css('top') )  + offset
				var target_left	= parseInt( $this.css('left') ) + offset
				
				paper.path("M "+this_left+" "+this_top+" L "+target_left+" "+target_top)
					.attr({'stroke': color})
					.attr({'stroke-width': 1})			
			
			});
			
		});
	}
	
	
	// generiere verbindungslinien
	// verbinde #about mit alle article.page
	if( !$('body').hasClass('mobile') && !$('html').hasClass('xxoldie') ){
		$('#page-about').each( function(){
		
			var $this		= $(this);
			var this_top	= parseInt( $this.css('top') )  + offset
			var this_left	= parseInt( $this.css('left') ) + offset

			$('#content article.page').each( function(){
			
				var $this		= $(this);
				var target_top	= parseInt( $this.css('top') )  + offset
				var target_left	= parseInt( $this.css('left') ) + offset
				
				paper.path("M "+this_left+" "+this_top+" L "+target_left+" "+target_top)
					.attr({'stroke': color})
					.attr({'stroke-width': 1})			
			
			});
		
		});
	}


	// click h1 a > scroll to home 
	$('#header a').trigger('click')

	
});

function is_valide_email( email ) {
    var reg = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
    return reg.test(email);
}