/**
 * Hover Caption - jQuery plugin to add a simple hover effect
 * and caption to images.
 * 
 * Source Code: https://github.com/coryschires/hover-caption
 * 
 * Copyright (c) 2011 Cory Schires (coryschires.com)
 * Dual licensed under the MIT and GPL licenses:
 * http://www.opensource.org/licenses/mit-license.php
 * http://www.gnu.org/licenses/gpl.html
 *
 * Version: 0.1.0
 */


(function($) {

	$.hover_caption = {
		defaults: {
         caption_font_size: '20px',
         caption_color: 'white',
         caption_bold: true,
         caption_default: "Pas disponible"
		}		
	}

    $.fn.extend({
        hover_caption: function(config) {	
			var config = $.extend({}, $.hover_caption.defaults, config);
			
            return this.each(function() {

                // cache this for selector performance
                var $image = $(this);
				
				// set variable for wrapper div
				var width = $image.width();
				var height = $image.height();   
				// variables for caption
				var caption_padding = width * .07; // dynamic margin depending on img width
				
				
				//  set caption to title attr if set 
				if ($image.attr('title') == "") {
					var caption = config.caption_default;					
				} else {
					var caption = $image.attr('title');
				};

                // add necessary html and css
				$image
					.css({
						'z-index': '1', 
						'position': 'relative'
					})
	       			.wrap('<div>')
	       			.parent()
					.css({ 
						'width': 100, //$('.mag-thumb').width(), 
						'height': 100 //$('.mag-thumb').height()
					})
                  .prepend('<h3>'+ caption +'</h3>')
                  .find('h3')
					.addClass('hover_caption_caption') // use this hook for additional styling
					.css({
						//'padding': caption_padding,
						'color': config.caption_color, 
						'width': width, 
                  'font-size': config.caption_font_size
						//'position': 'absolute',
						//'margin': 0                  
					})
	                .hide();

				if (config.caption_bold) { $image.css('font-weight', 'bold') };
				
                // add hover event to toggle message
                $image.parent().hover(function() {
                  $image.css({'z-index': '-1'});
                  $(this).addClass('hover_caption').find('h3').show();
                  
                },
                function() {
                  $image.css({'z-index': '0'});
                  $(this).removeClass('hover_caption').find('h3').hide();                  
                });
            })
        }
    })

})(jQuery);