(function($) {

	$.fn.tagit_header = function(options) {

		var el_header = this;

		var BACKSPACE		= 8;
		var ENTER			= 13;
		var SPACE			= 32;
		var COMMA			= 44;

		// add the tagit CSS class.
		el_header.addClass("tagit");

		// create the input field.
		var html_input_field = "<li class=\"tagit-new\"><input class=\"tagit-input\" type=\"text\" style=\"background-color:#06677a; border:1px solid #06677a;\" /></li>\n";
		el_header.html (html_input_field);

		tag_input_header		= el_header.children(".tagit-new").children(".tagit-input");
		tag_input_header.val("Ingrese un tag");

		$(this).click(function(e){
			if (e.target.tagName == 'A') {
				// Removes a tag when the little 'x' is clicked.
				// Event is binded to the UL, otherwise a new tag (LI > A) wouldn't have this event attached to it.
				$(e.target).parent().remove();
				
					el_header.html (html_input_field);			
					tag_input_header = el_header.children(".tagit-new").children(".tagit-input");				
				
					tag_input_header.keypress(function(event){
						if (event.which == BACKSPACE) {
							if (tag_input_header.val() == "") {
								// When backspace is pressed, the last tag is deleted.
								$(el_header).children(".tagit-choice:last").remove();
							}
						}
						// Comma/Space/Enter are all valid delimiters for new tags.
						else if (event.which == COMMA || event.which == ENTER) {
							event.preventDefault();
			
							var typed = tag_input_header.val();
							typed = typed.replace(/,+$/,"");
							typed = typed.trim();
			
							if (typed != "") {
								if (is_new (typed)) {
									//create_choice (typed);
								}
								// Cleaning the input.
								tag_input_header.val("");
							}
						}
					});
			
			
					tag_input_header.blur(function(event){
						 tag_input_header.val("");
					})
			
					tag_input_header.autocomplete({
						source: options.availableTags, 
						select: function(event,ui){
							if (is_new (ui.item.value)) {
								create_choice (ui.item.value, ui.item.id );
							}
							// Cleaning the input.
							tag_input_header.val("");
							// para que no agregue otro input
							tag_input_header.remove();
			
							// Preventing the tag input to be update with the chosen value.
							return false;
						}
					});
				
				
			}else {
				// Sets the focus() to the input field, if the user clicks anywhere inside the UL.
				// This is needed because the input field needs to be of a small size.
				tag_input_header.focus();
			}
		});

		tag_input_header.keypress(function(event){
			if (event.which == BACKSPACE) {
				if (tag_input_header.val() == "") {
					// When backspace is pressed, the last tag is deleted.
					$(el_header).children(".tagit-choice:last").remove();
				}
			}
			// Comma/Space/Enter are all valid delimiters for new tags.
			else if (event.which == COMMA || event.which == ENTER) {
				event.preventDefault();

				var typed = tag_input_header.val();
				typed = typed.replace(/,+$/,"");
				typed = typed.trim();

				if (typed != "") {
					if (is_new (typed)) {
						//create_choice (typed);
					}
					// Cleaning the input.
					tag_input_header.val("");
				}
			}
		});

		tag_input_header.focus(function(event){
			 tag_input_header.val("");
		})
		
		tag_input_header.blur(function(event){
			 tag_input_header.val("Ingrese un tag");			 
		})

		tag_input_header.autocomplete({
			source: options.availableTags, 
			select: function(event,ui){
				if (is_new (ui.item.value)) {
					create_choice (ui.item.value, ui.item.id );
				}
				// Cleaning the input.
				tag_input_header.val("");
				// para que no agregue otro input
				tag_input_header.remove();

				// Preventing the tag input to be update with the chosen value.
				return false;
			}
		});
		
		//FUNCION CREADA POR JM
		/*function contarTags(){
			var cant = 0;
			var rta;
			tag_input_area.parents("ul").children(".tagit-choice").each(function(i){
				cant ++;
			})
			
			if(cant < 1){ rta = true;}else{ rta = false;}
			
			return rta;
		}*/		

		function is_new (value){
			var is_new = true;
			this.tag_input_header.parents("ul").children(".tagit-choice").each(function(i){
				n = $(this).children("input").val();
				if (value == n) {
					is_new = false;
				}
			})
			return is_new;
		}
		
		function create_choice (value, id){
			var el = "";
			el  = "<li class=\"tagit-choice\">\n";
			el += value + "\n";
			el += '<a class=\"close\" title="Eliminar este tag y cargar uno nuevo">x</a>\n';
			el += "<input type=\"hidden\" style=\"display:none;\" value=\""+id+"\" name=\"item_tag[ids][]\">\n";			
			el += "<input type=\"hidden\" style=\"display:none;\" value=\""+value+"\" name=\"item_tag[tags][]\">\n";
			el += "</li>\n";
			var li_search_tags = this.tag_input_header.parent();
			$(el).insertBefore (li_search_tags);
			this.tag_input_header.val("");		
		}
	};

	String.prototype.trim = function() {
		return this.replace(/^\s+|\s+$/g,"");
	};

})(jQuery);

