/**
 * Bobbles for jQuery
 * 
 * @author benjamin josefus <josefus@digitalagentur-mpm.de>
 * @version $Id$
 */
(function($) {
	$.fn.extend({
		mpm_bobbles: function(options) {
			var defaults = {
					corner_tl: 'bobbles-tl',
					corner_tr: 'bobbles-tr',
					corner_bl: 'bobbles-bl',
					corner_br: 'bobbles-br',
					backing: 'bobbles-background',
					captionClass: 'caption',
					caption: '',
					opacity: 0.5,
					background: '#fff',
					minWidth: 30,
					minHeight: 30,
					offset: 3,
					top: null,
					left: null,
					growCentered: true,
					captionLeft: 0,
					captionTop: 0,
					captionWidth: 300
					
			};
			var options =  $.extend(defaults, options);
			var pluginClass = 'mpm_bobbles';
			return this.each(function() { 
				var o = options; 
				
				$(this)
						.wrap('<div id="' + $(this).attr('id') + '-bobble" class="' + pluginClass + '"/>')
						.wrap('<div class="' + o.backing + '"/>')
						.wrap('<div class="' + o.corner_tl + '"/>')
						.wrap('<div class="' + o.corner_tr + '"/>')
						.wrap('<div class="' + o.corner_bl + '"/>')
						.wrap('<div class="' + o.corner_br + '"/>')
					    .wrap('<div class="bobbles-content"/>');
				
				
				$(this).parents('.bobbles-content').width($(this).width() + 2*o.offset);
				$(this).parents('.bobbles-content').height($(this).height() + 2*o.offset);
				$(this).parents('.bobbles-content').css('position', 'absolute').css('top', o.offset).css('left', o.offset);
				$(this).parents('.bobbles-content').hide();
				$(this).parents('.' + pluginClass).width(o.minWidth).height(o.minHeight);
				$(this).parents('.' + pluginClass).append($('<p>')
												  .addClass(o.captionClass)
												  .css('position', 'absolute')
												  .css('display', 'block')
												  .css('width', o.captionWidth)
												  .css('top', o.captionTop)
												  .css('left', o.captionLeft)
												  .html(o.caption));

				
				if (o.top != null || o.left != null) {
					$(this).parents('.' + pluginClass)
					.css('position', 'absolute')
								.css('top', parseInt(o.top, 10) + 'px')
								.css('left', parseInt(o.left, 10) + 'px'); 
				}
				 
				$(this).parents('.' + o.backing)
				.css('width', '100%').css('height', '100%')
				.bind('mouseenter', function() {
						$('.' + pluginClass).each(function(){
							$(this).css('z-index', 98);
							$(this).find('.bobbles-content').addClass('hidden');
						});
						$(this).parents('.' + pluginClass).css('z-index', 99);
						$(this).find('.bobbles-content').removeClass('hidden');
						
						$(this).siblings('.' + o.captionClass).hide();
						
						var t = o.top;
						var l = o.left;
						var h =  $(this).find('.bobbles-content').height();
						var w =  $(this).find('.bobbles-content').width()
						if (o.growCentered) {
							t -= h/2;
							l -= w/2;
						}
						$(this).parents('.' + pluginClass).animate({
									height: h,
									width: w,
									top: t,
									left: l
								}, 'fast', function(){$(this).find('.bobbles-content').fadeIn('fast')});
				})
				.bind('mouseleave', function() {
						$(this).parents('.' + pluginClass).css('z-index', 98);
						$(this).find('.bobbles-content').hide();
						$(this).find('.bobbles-content').addClass('hidden')
						$(this).parents('.' + pluginClass).height(o.minHeight)
							.width(o.minWidth)
							.css('top', o.top)
							.css('left', o.left);
						$(this).siblings('.' + o.captionClass).fadeIn();
				});
				
				$(this).bind('click', function(){
					if (!$(this).parents('.bobbles-content').hasClass('hidden')) {
						$(this).parents('.' + o.backing).mouseleave();
					}
				});
				
				
				$(this).parents('.' + o.backing).siblings('.' + o.captionClass)
				.css('cursor', 'pointer')
				.bind('click', function(){
					$(this).siblings('.' + o.backing).mouseenter();
				});
			});
		}
	});
	
})(jQuery);  

