jQuery.noConflict();
jQuery(document).ready(function() {
	jQuery('.teaser-con').hide();
	jQuery('.teaser-con:first').show();
    count = jQuery('.teaser-con').length;
	
    // paste after teaser a new class for teaser Navigation
    jQuery('.teaser').after('<div class="teaser-nav"/>');
    
    // show all click images
    var icon = '';
    for(var i=1;i<=count;i++){    	
    	 icon += '<span id="icon-' + i + '"><img src="fileadmin/template/images/click_icon_normal.png" /></span>';
    	 jQuery('.teaser-nav').html(icon);
    }
   
   toggleNavImages(0,0); 
   var toggleHeaderInterval = setInterval(function(){toggleHeader()}, 8000);
   
   listenClickHandler();
   
   // current div
   function currentDiv(){
	   $current = jQuery('.teaser-con:visible');
	   return $current;
   }
   
   // next div
   function currentDivNext(){
	   $next = currentDiv().next(); 
	   return $next;
   }
   
   function toggleHeader(){
	   // current div and next div
	   var $current = currentDiv();
	   var $next = currentDivNext();	   
	   
	   var current_position = $current.index(); //index of current active item 
	   var next_position = $next.index(); //index of next item
	   
	   if($next.length <= 0){		   
	     $next = jQuery('.teaser-con:first');
	     var next_position = 0;
	     
	   }	   
	   
	   toggleTeaser($current,$next);
	  
	   //toggle images in slide navigation
	   toggleNavImages(current_position, next_position);
   } 
   
   // current and nex show() and hide()
   function toggleTeaser($current,$next){
	   $current.hide();
	   $next.show();
   }

   //toogle images in image navigation 
   function toggleNavImages(current, next){
	   jQuery('div.teaser-nav span:eq('+ current +')').html('<img src="fileadmin/template/images/click_icon_normal.png">');
	   jQuery('div.teaser-nav span:eq('+ next +')').html('<img src="fileadmin/template/images/click_icon_active.png">');
   }

   function listenClickHandler(){
	   //clear by click
	   jQuery('div.teaser-nav span').click(function(){
		  clearInterval(toggleHeaderInterval);
		  
		  var $next = jQuery(this);
		  var $current = currentDiv();
		  
		  // show() current and hide last current by click
		  toggleTeaser($current, jQuery('.teaser-con:eq(' + jQuery(this).index() + ')'));
		  
		  // change images normal / active
		  toggleNavImages($current.index(), $next.index());
		  
		  
	   })
   }
   
  });