/**
	Loading Message

	Shows a loading box with image and text
	-centers it on the page
	-re-centers when the window is resized or scrolled
	-transitions support (fades in/out, show/hide)

	-if the loading markup exists then the code will use that
	-markup and restyle and apply new events to it.

	-developed to ensure minmal impact on existing structure

	--background styles have been disabled to not override the
	--css that may already exists for the loading message

	Developed By: Duane A. Comeaux
	08-11-2011
	Version: 1.0

	syntax:
		params = {show:true}; // to show the loading message
		params = {show:false}; // to hide the loading message;
		//since the default value is false
		$(element).LoadingMessage(params);

		see defaults below for other parameters
*/

(function()
{
	$.fn.LoadingMessage = function($options)
	{
		;;; _debug();

		var $settings = $.extend({}, $.fn.LoadingMessage.defaults, $options);

		return this.each(function()
		{
			$this = $(this);
        	$.fn.LoadingMessage.options = $.meta ? $.extend({}, $settings, $this.data()) : $settings;
			$.fn.LoadingMessage.instid = Math.round(Math.random() * 1000000000);
			$.fn.initMessage($.fn.LoadingMessage.options);

			if( $.fn.LoadingMessage.options.show )
				$.fn.showMessage();
			else if( !$.fn.LoadingMessage.options.show || $.fn.LoadingMessage.options.show == undefined )
				$.fn.hideMessage();
        });
	};

	$.fn.initMessage= function($options)
	{
		var $container_name = $options.container;
		var $container = $($options.container);

		if( $container_name.match(/^\.|#/) )
		{
			$container_name = $container_name.substring(1, $container_name.length);
			$container = $('#'+ $container_name);
		}

		// If this already exists in the DOM
		if( $container.length )
		{
			// Grab all of the elements for styling purposes
			$.fn.LoadingMessage.container = $container;
			$.fn.LoadingMessage.content = $.fn.LoadingMessage.container.find('div:first');
			$.fn.LoadingMessage.image = $.fn.LoadingMessage.content.find('img:first').clone();
			$.fn.LoadingMessage.image.attr({width: $options.imageSize, height: $options.imageSize, alt:'loding...'}).css({float: 'left'});

			// Only do this if the styles have not been applied
			if( !$.fn.LoadingMessage.content.find('span#global-load-message-text').length )
			{
				$.fn.LoadingMessage.content.find('img:first').remove();
				var $$text = $.fn.LoadingMessage.content.html();
				$.fn.LoadingMessage.text = $('<span id="global-load-message-text"/>');
				$.fn.LoadingMessage.text.html($$text);

				$.fn.LoadingMessage.content
				.html($.fn.LoadingMessage.image)
				.append($.fn.LoadingMessage.text)
				.append('<div class="clearer"/>');

				// Add styles
				$.fn.styleMessageContainer($options, false);
				$.fn.styleMessageContent($options, false);
				$.fn.styleMessageText($options, false);
			}
		}
		else
		{
			var img = new Image();
			img.src = $options.image_path;
			$.fn.LoadingMessage.image = $('<img src="'+ img.src +'" alt="loading..." width="'+ $options.imageSize +'" height="'+ $options.imageSize +'"/>');
			$.fn.LoadingMessage.image.css({float: 'left'});
			$.fn.LoadingMessage.text = $('<span id="global-load-message-text"/>');

			// Text
			$.fn.styleMessageText($options, true);
			$.fn.LoadingMessage.text.html($options.text);

			// Container
			$.fn.LoadingMessage.container = $('<div id="'+ $container_name +'"/>');
			$.fn.styleMessageContainer($options, true);

			// Content
			$.fn.LoadingMessage.content = $('<div id="global-load-message"/>');
			$.fn.styleMessageContent($options, true);
			$.fn.LoadingMessage.content
			.html($.fn.LoadingMessage.image)
			.append($.fn.LoadingMessage.text)
			.append('<div class="clearer"/>');

			$.fn.LoadingMessage.container.append($.fn.LoadingMessage.content);
			$('body').prepend($.fn.LoadingMessage.container);
		}

		$.fn.LoadingMessage.container.unbind();
	};

	$.fn.styleMessageContainer = function($options, include_colors)
	{
		$.fn.LoadingMessage.container
		.css({
			//border: $options.borderWidth +'px solid '+ $options.color.border,
			//background: $options.color.outer,
			display: $options.display,
			padding: $options.padding.outer +'px',
			opacity: $options.opacity,
			position: 'absolute',
			zIndex: $options.zIndex,
			borderRadius: $options.borderRadius +'px'
		});

		if( include_colors )
		{
			$.fn.LoadingMessage.container
			.css({
				border: $options.borderWidth +'px solid '+ $options.color.border,
				background: $options.color.outer
			});
		}
	};

	$.fn.styleMessageContent = function($options, include_colors)
	{
		$.fn.LoadingMessage.content
		.css({
			//background: $options.color.inner,
			padding: $options.padding.inner +'px',
			borderRadius: ($options.borderRadius > 4 ?  ($options.borderRadius - 2) : 0) +'px'
		});

		if( include_colors )
		{
			$.fn.LoadingMessage.content
			.css({
				background: $options.color.inner
			});
		}
	};

	$.fn.styleMessageText = function($options, include_colors)
	{
		var $size = ($options.imageSize / 4);
		$.fn.LoadingMessage.text
		.css({
			display: 'block',
			float: 'left',
			height: ($options.imageSize - $size) +'px',
			paddingTop: $size +'px',
			marginLeft: '3px'
		});

		if( include_colors )
		{
			$.fn.LoadingMessage.text
			.css({
				color: $options.color.outer
			});
		}
	}

	$.fn.LoadingMessage.container = {};
	$.fn.LoadingMessage.content = {};
	$.fn.LoadingMessage.image = {};
	$.fn.LoadingMessage.text = {};

	$.fn.showMessage = function(effect, speed)
	{
		speed = (speed != undefined ? speed : $.fn.LoadingMessage.defaults.speed);
		$.fn.positionMessage();

		switch( effect )
		{
			case 'fade'	: $.fn.LoadingMessage.container.fadeIn(speed);	break;
			case 'show': $.fn.LoadingMessage.container.show(speed);		break;
			default		: $.fn.LoadingMessage.container.fadeIn();
		}
	};

	$.fn.positionMessage = function(speed)
	{
		speed = (speed != undefined ? speed : $.fn.LoadingMessage.defaults.speed);

		$.fn.LoadingMessage.container
		.animate({
			left: ($(window).width() - $.fn.LoadingMessage.container.width())/2 + 'px',
			top: (($(window).height() - $.fn.LoadingMessage.container.height())/2 + $(window).scrollTop()) +'px'
		}, speed)
		.dequeue();

		$(window)
		.bind('resize scroll', function()
		{
			$.fn.LoadingMessage.container
			.animate({
				left: ($(window).width() - $.fn.LoadingMessage.container.width())/2 + 'px',
				top: (($(window).height() - $.fn.LoadingMessage.container.height())/2 + $(window).scrollTop()) +'px'
			}, speed)
			.dequeue();
		});
	};

	$.fn.hideMessage = function(effect, speed)
	{
		speed = (speed != undefined ? speed : $.fn.LoadingMessage.defaults.speed);
		switch( effect )
		{
			case 'fade'	: $.fn.LoadingMessage.container.fadeOut(speed);	break;
			case 'hide'	: $.fn.LoadingMessage.container.hide(speed);		break;
			default		: $.fn.LoadingMessage.container.fadeOut();
		}
	};

	$.fn.LoadingMessage.defaults =
	{
		image_path	     	:       'skins/images/spinner.gif',
		container	    		:       '#global-load-message-wrapper',
		text						:		'working...',
		fontWeight				:		'bold',
		color						:		{inner: '#ffffff', outer: '#10335C', border: '#355B7D', text: '#10335C'},
		borderWidth			:		1,
		opacity					:		0.8,
		borderRadius			:		5,
		padding					:		{inner:8, outer:30},
		display					:		'none',
		zIndex					:		50000,
		speed					:		500,
		show						: 		false,
		imageSize				:		24
	};

	function _debug($obj)
    {
        if( console && console.log )
            console.log("Sending "+ $($obj).length +" requests.");
    };
})(jQuery);