/**
 * 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: '23px',
			caption_color: 'white',
			caption_bold: true,
			caption_default: "Click for screenshots."
		}		
	}

    $.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');
				};


				width = '160px';
				height = '84px';
				var marginBottom = '0px';

				if($image.parents('.single_page_comingsoon').length) {
					width = '100px';
					height = '320px';
					marginBottom = '22px';
				}
				if($image.parents('.single_page_collections').length) {
					width = '325px';
					height = '190px';
					marginBottom = '2px';
				}
				if($image.parents('.single_page_nowshowing').length) {
					width = '100px';
					height = '330px';
					marginBottom = '22px';
				}
				
					if($image.parents('.single_page_contact').length) {
					width = '540px';
					height = '312px';
					marginBottom = '2px';
				}
				
				
			if($image.parents('.single_page_news').length) {
				width = '165px';
				height = '95px';
					marginBottom = '0px';
				}
                // add necessary html and css
				$image
					.css({
						'z-index': '1', 
						'position': 'relative'
					})
	       			.wrap('<div>')
	       			.parent()
					.css({ 
						'position': 'relative', 
						'float': 'left',
						'margin-bottom': marginBottom
					})
	                .append('<h5>&nbsp;</h5>')
	                .find('h5')
					.addClass('hover_caption_caption') // use this hook for additional styling
					.css({
						'padding': caption_padding,
						'color': config.caption_color, 
						'font-size': config.caption_font_size, 
						'position': 'absolute',
						'z-index': '999',
						'width': width,
						'height': height,
						'text-align': 'center',
						'margin': '0',
						'top': '0',
						'left': '0'
					});
	               // .hide();

				if (config.caption_bold) { $image.css('font-weight', 'bold') };
				
                // add hover event to toggle message
                $image.parent().hover(function() {
					$(this).addClass('hover_caption').find('h5').addClass('hover');
                },
                function() {
                    $(this).removeClass('hover_caption').find('h5').removeClass('hover');
                });
            })
        }
    })

})(jQuery);