$(document).ready(function () { 

/*
		$('#sliding-pages .page h2 a').each(function(){
		    var $div = $('#'+this.hash.substr(1));
		    var height = $('#sliding-pages').height();
 		    $div.animate({ height: 0 }, { duration: 0, complete: function () {
                $div.hide();
            } });
		});
*/

	/* ################################ */
	/* slide animation for sections */

	var currentPage;
	var height = $('#sliding-pages').height();

	$('#sliding-pages .page h2 a').click(function(){
    	currentPage = this.hash.substr(1);
	    var $div = $('#'+currentPage);
	    var height = $('#sliding-pages').height();
		var ContainerHeight = $('#sliding-pages').height();
		newContainerHeight =  ContainerHeight + height;
		
		
		
        if ($div.is(':visible')) {
			$('.activeH2-scroll').each(function(){
				$(this).removeClass('activeH2-scroll');
			});
						
			$div.animate({ height: 0 }, { duration: 300, complete: function () {
                $div.hide().css({ height : 0 });
               	($('#container')).animate({ height: ContainerHeight+126	}, { duration: 300 }); // + 126 to keep the orig height
				$('.activeH2').each(function(){
					$(this).removeClass('activeH2');
				});
            }
		});
        } else {
			$div.css({ height: 0, opacity: 0 });
			minimazePages();
           	($('#container')).animate({ height: newContainerHeight+20}, { duration: 300 });
			// set div heigth
			$div.animate({ height : height}, { duration: 300, complete:function(){
						//on complete
						// adding border to h2-top and .page-bottom
						$($div).addClass('active-page');
						$($($div).siblings()[0]).addClass('activeH2');
						
						// create subpages
							createSubpages(currentPage);
							$('ul.navigation a:first').click(); // navigates back to the first panel
							
						//CUSTOM SCROLLBAR
						if ($($div).find('.scroll-pane').length > 0) {
							$($div).addClass('active-page-scroll'); // remove right margin to make scrollbarr visible
							$($($div).siblings()[0]).addClass('activeH2-scroll');
						}

							$($div).find('.scroll-pane').jScrollPane({
								scrollbarWidth: 5
							});
					}
				}).animate({opacity: 1}, { duration: 200 }); // fade in content
        }
    	return false;
	});

	function minimazePages() {
		if (jQuery.browser.msie){
			$('#team .scroll-pane').jScrollPaneRemove(); // remo scrollpane object from the div so it won't be shown in IE7 furing animation
			//$('#team').hide();
			//$('#kunden').hide();
		}
		
		$('.activeH2').each(function(){
			$(this).removeClass('activeH2');
		});

		$('.activeH2-scroll').each(function(){
			$(this).removeClass('activeH2-scroll');
		});
		
		$('#sliding-pages .page h2 a').each(function(){
		    var $div = $('#'+this.hash.substr(1));
				if ($div.is(':visible')) {
					$div.animate({ height: 0, opacity: 0 }, { duration: 300, complete: function () {
						$div.hide().css({ height : 0 });
						//($('#container')).animate({ height: ContainerHeight + 100}, { duration: 300 }); // + 100 because of the padding
					} });
				}
		});
	}

	/* ################################ */
	/* coda slider for submenus */

	function createSubpages(currentPage) {
	 	var vertical = false; // siding direction
	 	var $panels = $('#'+currentPage +' .scrollContainer > div'); // subpages
	    var $container = $('#'+currentPage +' .scrollContainer'); // subpage container
	 	
	 	if ($panels[0]) { // if submenus are exists
			// subpage creation
			if (vertical) {
		        $panels.css({
		            'float' : 'left',
		            'position' : 'relative' // IE fix to ensure overflow is hidden
		        });
		    }
		    // calculate a new width for the container (so it holds all panels)
        	$container.css('width', $panels[0].offsetWidth * $panels.length);

		    // collect the scroll object, at the same time apply the hidden overflow
		    // to remove the default scrollbars that will appear			
			var $scroll = $('#'+currentPage +' .scroll').css('overflow', 'hidden');
			
		    // handle nav selection
		    function selectNav() {
		        $(this)
		            .parents('ul:first')
		                .find('a')
		                    .removeClass('selected')
		                .end()
		            .end()
		            .addClass('selected');
		    }
			
		    $('#'+currentPage +' .navigation').find('a').click(selectNav);

		    // go find the navigation link that has this target and select the nav
		    function trigger(data) {
		        var el = $('#'+currentPage +' .navigation').find('a[href$="' + data.id + '"]').get(0);
		        selectNav.call(el);
		        
		        // load content only if the div has the style "panel loading"
				if (data.id && $('#'+data.id).get(0).className == "panel loading") {
					loadContent(data.id);
				}
		    }
		
		    if (window.location.hash) {
		        trigger({ id : window.location.hash.substr(1) });
		    } else {
		        $('ul.navigation a:first').click();
		    }

		    // offset is used to move to *exactly* the right place, since I'm using
		    // padding on my example, I need to subtract the amount of padding to
		    // the offset.  Try removing this to get a good idea of the effect
		    var offset = parseInt($container.css('paddingLeft') || 0) * -1;
    
		    var scrollOptions = {
		        target: $scroll, // the element that has the overflow
		
		        // can be a selector which will be relative to the target
		        items: $panels,
		
		        navigation: '.navigation a',
		
		        // selectors are NOT relative to document, i.e. make sure they're unique
		        // prev: 'img.left', 
		        // next: 'img.right',
		
		        // allow the scroll effect to run both directions
		        axis: 'xy',
		
		        onAfter: trigger, // our final callback
		
		        offset: offset,
		
		        // duration of the sliding effect
		        duration: 500,
		
		        // easing - can be used with the easing plugin: 
		        // http://gsgd.co.uk/sandbox/jquery/easing/
		        easing: 'swing'
		    };

		    // apply serialScroll to the slider - we chose this plugin because it 
		    // supports// the indexed next and previous scroll along with hooking 
		    // in to our navigation.
		    $('#slider').serialScroll(scrollOptions);
		
		    // now apply localScroll to hook any other arbitrary links to trigger 
		    // the effect
		    $.localScroll(scrollOptions);
		
		    // finally, if the URL has a hash, move the slider in to position, 
		    // setting the duration to 1 because I don't want it to scroll in the
		    // very first page load.  We don't always need this, but it ensures
		    // the positioning is absolutely spot on when the pages loads.
		    scrollOptions.duration = 1;
		    $.localScroll.hash(scrollOptions);
		 }
	}
	
	
	/* ################################ */
	/* data loader */
	
	function loadContent(placeholder){ // placeholder is the id of the diven element
		$dynamicDiv = $('#'+placeholder);

		$dynamicDiv.each(function(){
			$(this).load('loadcontent.php?content='+placeholder, function(){ 
				$(this).removeClass('loading');
				$(this).hide();
				$(this).fadeIn(500) });
			return false;
		});
	}


});