//DIV Content Overlay script- by JavaScript Kit (www.javascriptkit.com)
//Created: April 27th, 2011


jQuery.noConflict();

//see: http://gsgd.co.uk/sandbox/jquery/easing/
jQuery.extend(jQuery.easing, {
		easeOutExpo:function (x, t, b, c, d) {
			return (t==d) ? b+c : c * (-Math.pow(2, -10 * t/d) + 1) + b;
		},
		easeInQuad: function (x, t, b, c, d) {
			return c*(t/=d)*t + b;
		},
		easeInOutQuad: function (x, t, b, c, d) {
			if ((t/=d/2) < 1) return c/2*t*t + b;
			return -c/2 * ((--t)*(t-2) - 1) + b;
		}
});

(function($){
  $.fn.overlaycontent=function(options) {  
    var setting={id:'', dir:'up', speed:200, opacity:1, initial_opacity:0, easing:'easeInOutQuad', initial_percent_position:100 }
    return this.each(function(){
		
      $.extend(setting, options, (this.getAttribute('data-overlayid'))? {id:this.getAttribute('data-overlayid')} : {})
		
			var $target=$(this).css({position:'relative', overflow:'hidden'}) //set anchor DIV position to relative
			var $overlay=$('#'+(setting.id)) //reference overlay DIV box
			var my_initial_percent_position = $target.outerHeight() * (setting.initial_percent_position / 100);
			
			
			$overlay.wrapInner('<div class="text_wrapper" />');
			var $overlay_textwrapper = $overlay.find('.text_wrapper');
			
			var startpoint={};
			var startpoint_textwrapper={};
			
			if (setting.dir=="up" || setting.dir=="down"){ //set initial position of overlay box (either "top" or "left" property affected)
				//startpoint={top:$target.outerHeight()* (setting.dir=="down"? -1 : 1), opacity:setting.initial_opacity}
				//startpoint={top:my_initial_percent_position * (setting.dir=="down"? -1 : 1), opacity:setting.initial_opacity}
				startpoint_textwrapper={top:my_initial_percent_position * (setting.dir=="down"? -1 : 1), opacity:1};
			}
			else if(setting.dir=="left" || setting.dir=="right"){
				//startpoint={left:$target.outerWidth()* (setting.dir=="right"? -1 : 1), opacity:setting.initial_opacity}
				startpoint_textwrapper={left:$target.outerWidth()* (setting.dir=="right"? -1 : 1), opacity:1};
			}
			else{
				//startpoint={left:0, top:0, opacity:setting.initial_opacity}
				startpoint_textwrapper={top:my_initial_percent_position * (setting.dir=="down"? -1 : 1), opacity:1};
			}
				startpoint={left:0, top:0, opacity:setting.initial_opacity}
			
			var overlaydimenions={
					w:$target.outerWidth()-($overlay.outerWidth()-$overlay.width()), 
					h:$target.outerHeight()-($overlay.outerHeight()-$overlay.height())
					}
			
			$overlay.css($.extend({position:'absolute', zIndex:'1000', width:overlaydimenions.w, height:overlaydimenions.h, left:0, top:0, visibility:'visible', opacity:setting.initial_opacity}, startpoint)).appendTo($target)
			$overlay_textwrapper.css($.extend({position:'absolute', left:0, top:0, height:'100%', width:'100%'}, startpoint_textwrapper));
			
			//if (setting.opacity<1)
				//$overlay.css({opacity:setting.opacity})
			$target.hover(
				function(){
					$overlay.dequeue().animate({opacity:setting.opacity}, setting.speed, setting.easing);
					$overlay_textwrapper.dequeue().animate((setting.dir=="up" || setting.dir=="down")? {top:0} : {left:0}, setting.speed, setting.easing);
				},
				function(){
					$overlay.dequeue().animate({opacity:setting.initial_opacity}, setting.speed);
					$overlay_textwrapper.dequeue().animate(startpoint_textwrapper, setting.speed);
				}
			) //end hover
  	})
  }
})(jQuery);