(function($) {
		  
$(document).ready(function() {
			
			
	// Togglebutton erstellen
	$('#header2').append('<div id="headerToggle"><a href="#">###############</a></div>');



	var headerCookieName = 'headerPanelState';
	
	// the div that will be hidden/shown
	var panel = $('#header_sec');
	
	//the button that will toggle the panel
	var button = $('#headerToggle a');
	
	// do you want the panel to start off collapsed or expanded?
	var initialState = 'expanded'; // 'expanded' OR 'collapsed'
	
	// the class added when the panel is hidden
	var activeClass = 'headerToggleOpen';
	
	// the text of the button when the panel's expanded
	var visibleText = '<img src="typo3conf/ext/t3v_secondheader/res/images/mediaToggleClose.png" id="imageHeaderToggleClose" class="imageHeaderToggleClose" width="31px" height="9px"  >';
	// the text of the button when the panel's collapsed
	var hiddenText = '<img src="typo3conf/ext/t3v_secondheader/res/images/mediaToggleOpen.png"  id="imageHeaderToggleOpen" class="imageHeaderToggleOpen" width="31px" height="9px" >';
	
	// ausblenden Text
	var showState = 'Header einblenden';
	// einblenden text
	var hideState = 'Header ausblenden';
		
	var slideSpeed = 500;
	//---------------------------
	// don't    edit    below    this    line,
	// unless you really know what you're doing
	//---------------------------
			
	if($.cookie(headerCookieName) == undefined) {
		$.cookie(headerCookieName, initialState);
	} 
			
	var state = $.cookie(headerCookieName);
	
	
			
	if(state == 'collapsed') {
		panel.hide();
		button.html(hiddenText);
		button.addClass(activeClass);
		// link attribute alt
		$('#headerToggle a').attr('alt', showState);
		// link attribute title
		$('#headerToggle a').attr('title', showState);
		
	} else {
		
		// visible button code
		button.html(visibleText);
		button.removeClass(activeClass);
		// link attribute alt
		$('#headerToggle a').attr('alt', hideState);
		// link attribute title
		$('#headerToggle a').attr('title', hideState);

	}
		   
	button.click(function(){
						  
		


						  	
		if($.cookie(headerCookieName) == 'expanded') {
			$.cookie(headerCookieName, 'collapsed');
			// hidden button code
			button.html(hiddenText);
			button.addClass(activeClass);
			// link attribute alt
			$('#headerToggle a').attr('alt', showState);
			// link attribute title
			$('#headerToggle a').attr('title', showState);
			opacityState = '0';
		} else {
			$.cookie(headerCookieName, 'expanded');
			// visible button code
			button.html(visibleText);
			button.removeClass(activeClass);
			// link attribute alt
			$('#headerToggle a').attr('alt', hideState);
			// link attribute title
			$('#headerToggle a').attr('title', hideState);
			opacityState = '1'; 
		}
		
		//panel.slideToggle('slow');

		// animate verbindet toggle und fade
		panel.animate({
			opacity: opacityState, 	// fade
			height: 'toggle'	// slide
			}, slideSpeed);		// speed
		
		return false;
	});
});

})(jQuery);

