/*

Author :Irving Dela Cruz

Description : tagline animation, fadein, 

use with cycle.js

Usage:

$("#slideshowContainer").fadein({
taglines:"yes",
pos :"right",
timebetimagesinsecs:1,
taglinedelayinsecs:1,
animationspeedinsecs:2.5
});
	  
	  
	  
<div id="slideshowContainer">
 <div>
   <img src="images/1.jpg" width="711" height="492" title="Tag 1" />
   <img src="images/2.jpg" width="711" height="492" title="Tag 2" />
   <img src="images/3.jpg" width="711" height="492" title="Tag 3" />
   <img src="images/4.jpg" width="711" height="492" title="Tag 4" />
   <img src="images/5.jpg" width="711" height="492" title="Tag 5" />
   <img src="images/6.jpg" width="711" height="492" title="Tag 6" />
   <img src="images/7.jpg" width="711" height="492" title="Tag 7" />
 </div>
</div>


*/


(function( $ ){

  $.fn.fadein = function( options ) {  

    var settings = {
		taglines:"no",
		pos:"left",
		timebetimagesinsecs:2,
		taglinedelayinsecs:2,
		animationspeedinsecs:2
    };

    return this.each(function() {
	
      if ( options ) 
	  { 
        $.extend( settings, options );
      }
	  
	  
	  $tagline = $("<div class='tagline'/>");
	  $tagline.animate({
		  opacity:.7
	  });
	  
	  $root = $(this).find("div");
	  
	  
	  $root.cycle({
	 	before:onBefore
	  });
	  
	  function onBefore(){
		
		$root.cycle("pause");
		 
		if(settings.taglines == "yes")
		{
		  if(settings.pos=="left")
		  {
			  $tagline.animate({
				  left: '0',
				  opacity:.7
				}, settings.animationspeedinsecs*1000, function() {
					setTimeout (pause,settings.timebetimagesinsecs*1000);
			   });
		    }	 
		  }
		  if(settings.pos=="right")
		  {
			 $tagline.animate({
				  right: '0',
				  opacity:.7
				}, settings.animationspeedinsecs*1000, function() {
					setTimeout (pause,settings.timebetimagesinsecs*1000);
			   });
		  }		
		  $root.parent().append($tagline);
		  $tagline.html(this.title);
		  $tagline.fancyletter({commonClass: 'fancy'});
	  	  $root.css({
		    "background-image":"url("+this.src+")"
		  });
		  
	  }
	  
	  function pause()
	  {
		  if(settings.pos=="left")
		  {
		     $tagline.delay(settings.taglinedelayinsecs*1000).animate({
			    left: '-=1024',
			    opacity:0
		      }, settings.animationspeedinsecs*1000, function() {setTimeout (play,settings.timebetimagesinsecs*1000);}); 
		  }
		  if(settings.pos=="right")
		  {
		     $tagline.delay(settings.taglinedelayinsecs*1000).animate({
			    right: '-=1024',
			    opacity:0
		      }, settings.animationspeedinsecs*1000, function() {setTimeout (play,settings.timebetimagesinsecs*1000);}); 
		  }		 
	  }
	  
	  function play(){
		  $root.cycle("resume");
	  }
	  
	  
	  
    });
  };
})( jQuery );




