/*!
 * labelauty jquery plugin
 *
 * @file: jquery-labelauty.js
 * @author: francisco neves (@fntneves)
 * @site: www.francisconeves.com
 * @license: mit license
 */

(function( $ ){

	$.fn.labelauty = function( options )
	{
		/*
		 * our default settings
		 * hope you don't need to change anything, with these settings
		 */
		var settings = $.extend(
		{
			// development mode
			// this will activate console debug messages
			development: false,

			// trigger class
			// this class will be used to apply styles
			class: "labelauty",

			// use text label ?
			// if false, then only an icon represents the input
			label: true,

			// separator between labels' messages
			// if you use this separator for anything, choose a new one
			separator: "|",

			// default checked message
			// this message will be visible when input is checked
			checked_label: "checked",

			// default unchecked message
			// this message will be visible when input is unchecked
			unchecked_label: "unchecked",

			// minimum label width
			// this value will be used to apply a minimum width to the text labels
			minimum_width: false,

			// use the greatest width between two text labels ?
			// if this has a true value, then label width will be the greatest between labels
			same_width: true
		}, options);

		/*
		 * let's create the core function
		 * it will try to cover all settings and mistakes of using
		 */
		return this.each(function()
		{
			var $object = $( this );
			var use_labels = true;
			var labels;
			var labels_object;
			var input_id;

			// test if object is a check input
			// don't mess me up, come on
			if( $object.is( ":checkbox" ) === false && $object.is( ":radio" ) === false )
				return this;

			// add "labelauty" class to all checkboxes
			// so you can apply some custom styles
			$object.addclass( settings.class );

			// get the value of "data-labelauty" attribute
			// then, we have the labels for each case (or not, as we will see)
			labels = $object.attr( "data-labelauty" );

			use_labels = settings.label;

			// it's time to check if it's going to the right way
			// null values, more labels than expected or no labels will be handled here
			if( use_labels === true )
			{
				if( labels == null || labels.length === 0 )
				{
					// if attribute has no label and we want to use, then use the default labels
					labels_object = new array();
					labels_object[0] = settings.unchecked_label;
					labels_object[1] = settings.checked_label;
				}
				else
				{
					// ok, ok, it's time to split checked and unchecked labels
					// we split, by the "settings.separator" option
					labels_object = labels.split( settings.separator );

					// now, let's check if exist _only_ two labels
					// if there's more than two, then we do not use labels :(
					// else, do some additional tests
					if( labels_object.length > 2 )
					{
						use_labels = false;
						debug( settings.development, "there's more than two labels. labelauty will not use labels." );
					}
					else
					{
						// if there's just one label (no split by "settings.separator"), it will be used for both cases
						// here, we have the possibility of use the same label for both cases
						if( labels_object.length === 1 )
							debug( settings.development, "there's just one label. labelauty will use this one for both cases." );
					}
				}
			}

			/*
			 * let's begin the beauty
			 */

			// start hiding ugly checkboxes
			// obviously, we don't need native checkboxes :o
			$object.css({ display : "none" });

			// we don't need more data-labelauty attributes!
			// ok, ok, it's just for beauty improvement
			$object.removeattr( "data-labelauty" );

			// now, grab checkbox id attribute for "label" tag use
			// if there's no id attribute, then generate a new one
			input_id = $object.attr( "id" );

			if( input_id == null )
			{
				var input_id_number = 1 + math.floor( math.random() * 1024000 );
				input_id = "labelauty-" + input_id_number;

				// is there any element with this random id ?
				// if exists, then increment until get an unused id
				while( $( input_id ).length !== 0 )
				{
					input_id_number++;
					input_id = "labelauty-" + input_id_number;
					debug( settings.development, "holy crap, between 1024 thousand numbers, one raised a conflict. trying again." );
				}

				$object.attr( "id", input_id );
			}

			// now, add necessary tags to make this work
			// here, we're going to test some control variables and act properly
			$object.after( create( input_id, labels_object, use_labels ) );

			// now, add "min-width" to label
			// let's say the truth, a fixed width is more beautiful than a variable width
			if( settings.minimum_width !== false )
				$object.next( "label[for=" + input_id + "]" ).css({ "min-width": settings.minimum_width });

			// now, add "min-width" to label
			// let's say the truth, a fixed width is more beautiful than a variable width
			if( settings.same_width != false && settings.label == true )
			{
				var label_object = $object.next( "label[for=" + input_id + "]" );
				var unchecked_width = getrealwidth(label_object.find( "span.labelauty-unchecked" ));
				var checked_width = getrealwidth(label_object.find( "span.labelauty-checked" ));

				if( unchecked_width > checked_width )
					label_object.find( "span.labelauty-checked" ).width( unchecked_width );
				else
					label_object.find( "span.labelauty-unchecked" ).width( checked_width );
			}
		});
	};

	/*
	 * tricky code to work with hidden elements, like tabs.
	 * note: this code is based on jquery.actual plugin.
	 * https://github.com/dreamerslab/jquery.actual
	 */
	function getrealwidth( element )
	{
		var width = 0;
		var $target = element;
		var style = 'position: absolute !important; top: -1000 !important; ';

		$target = $target.clone().attr('style', style).appendto('body');
		width = $target.width(true);
		$target.remove();

		return width;
	}

	function debug( debug, message )
	{
		if( debug && window.console && window.console.log )
			window.console.log( "jquery-labelauty: " + message );
	};

	function create( input_id, messages_object, label )
	{
		var block;
		var unchecked_message;
		var checked_message;

		if( messages_object == null )
			unchecked_message = checked_message = "";
		else
		{
			unchecked_message = messages_object[0];

			// if checked message is null, then put the same text of unchecked message
			if( messages_object[1] == null )
				checked_message = unchecked_message;
			else
				checked_message = messages_object[1];
		}

		if( label == true )
		{
			block = '<label for="' + input_id + '">' +
						'<span class="labelauty-unchecked-image"></span>' +
						'<span class="labelauty-unchecked">' + unchecked_message + '</span>' +
						'<span class="labelauty-checked-image"></span>' +
						'<span class="labelauty-checked">' + checked_message + '</span>' +
					'</label>';
		}
		else
		{
			block = '<label for="' + input_id + '">' +
						'<span class="labelauty-unchecked-image"></span>' +
						'<span class="labelauty-checked-image"></span>' +
					'</label>';
		}

		return block;
	};

}( jquery ));