/*
 * ImgCaption
 *
 * Licensed under the revised BSD License.
 * Copyright 2010 Ralf Bjarne Taraldset
 * All rights reserved.
 */

// see the default variable for options
// the image must be placed inside a div which it its reletive to, and does not alter the image's relative posistion when the window is resized

(function($){  
	 $.fn.caption = function(options) {  
 
	  var defaults = {  
	   'css': 'caption',  
	   'text': null,
	   'attr': 'alt',
	   'removeAttr': true,
	   'position': 'bottom', // 'below' or 'bottom'
	   'bgOpacity': 0.75,
	   'bgColor': '#ffffff'   
	  };
	  
		

	  var options = $.extend(defaults, options);  
	      
	  return this.each(function() {  
		  var obj = $(this);

		  // caption
		  var text = (options.text != null) ? options.text : obj.attr(options.attr);
		  var caption = $("<div class='" + options.css + "'>" + text + "</div>");
		  caption.css("position", "absolute");
		  
		  // caption missing -> stop
		  if (text.length < 1)
			  return;
		  		  
		  // remove attribute (prevent dobule caption - annoying!)
		  if(options.removeAttr)
			  obj.removeAttr(options.attr);
		  
		  // caption's background
		  var bg = $("<div></div>");
		  bg.css("background-color", options.bgColor);
		  bg.css("opacity", options.bgOpacity);
		  bg.css("position", "absolute");
		  
		  // find closest realtive parent - to pervent to become encapsualted by other tags (eg. a href)
		  var relativeParent = obj.parents().filter(function() { 
			  // reduce to only relative position or "body" elements
			  return $(this).is('body') || $(this).css('position') == 'relative';
		  }).slice(0,1); // grab only the "first"
		  
		  // add to dom
		  bg.appendTo(relativeParent);
		  caption.appendTo(relativeParent);
		  
		  // geometircs caption
		  caption.css('width', obj.width() - caption.padding().left - caption.padding().right ); //width
		  var top = obj.position().top + obj.padding().top + obj.height() + obj.margin().top + obj.border().top
		  if (options.position == "bottom") {
			  caption.css('top', top - caption.height() - caption.padding().top - caption.padding().bottom - caption.border().top); // top (bottom of image)
		  } else {
			  caption.css('top', top); // top (below image - default)
			  var captionPadding = caption.height() + caption.padding().top + caption.padding().bottom + caption.border().top + caption.border().bottom + caption.margin().top + caption.margin().bottom + obj.padding().bottom;  
			  obj.padding({bottom: captionPadding})  
		  }
		  caption.css('left', obj.position().left + obj.padding().left + obj.margin().left + obj.border().left); // left
		  		  
		  // geometrics caption background
		  bg.css('top', caption.position().top + caption.border().top);
		  bg.css('left', caption.position().left);
		  bg.css('width', caption.width() + caption.padding().left + caption.padding().right);
		  bg.css('height', caption.height() + caption.padding().top + caption.padding().bottom );		  
	  });
	  
     };  

})(jQuery);