function MessageBox()
{
	user_name = "";
	user_id = 0;
	cursor = this;
	
	this.setupProfile = function(user_name, user_id)
	{
		cursor.user_name = user_name;
		cursor.user_id = user_id;
	}
	
	this.initiate = function(){
		$(".the-pizdezh-box .pizdezh").css({height: $(".the-pizdezh-box").height() + "px" });
		$(".enter-message-box input").keyup(function(e){
			
			if (e.keyCode == 13)
			{
				var active_tab_id = $(".chat-main-container .user-bar-tab .conversation-active").attr("name").match(/^user(\d{1,11})$/)[1];				
				cursor.addMessage( cursor.user_name, cursor.user_id, $(this).val(), active_tab_id, true );
				$(this).val("");
			}
		})
		
		$(".enter-message-box input").keydown(function(e){
			if (e.ctrlKey && e.keyCode >= 48 && e.keyCode <= 57)
			{
				var number  = e.keyCode - 48;
				cursor.switch_key_tab( number );
			}
		})
	}
	
	this.switch_key_tab = function( number )
	{
		//console.log(number);
		var tab = $(".chat-main-container .user-bar-tab div").eq(number-1);
		if ( tab.html() )
		{
			var uname = tab.html();
			var uid = tab.attr("name").match(/^user(\d{1,11})$/)[1];
			cursor.addConversationTab(uid, uname, true);
		}
	}
	
	this.correctMessageBox = function(template){
		template.css({height: $(".the-pizdezh-box").height() + "px" });
		
	}
	
	this.addConversationTab = function( conversation_user_id, conversation_user_name, make_active )
	{
		var object = $(".chat-main-container .user-bar-tab"); 
		var tab = object.find( 'div[name=user' + conversation_user_id + "]" );
		if (!tab.html() ){
			var template = $(document.createElement("div"));
			template.addClass("conversation");
			template.html(conversation_user_name)
			template.attr("name", "user" + conversation_user_id);
			template.appendTo(object);
			if (make_active) {
				object.find("div").removeClass("conversation-active");
				template.addClass("conversation-active");
			}
			template.click(function(){				
				cursor.addConversationTab(conversation_user_id, conversation_user_name, true);
				$(".enter-message-box input").focus();
			});
			
		} else {
			if (make_active) {
				
				if (!tab.hasClass("conversation-active")){					
					
					object.find("div").removeClass("conversation-active");
					tab.addClass("conversation-active");
					
				}
			}
		}
		cursor.addPizdezhBox( conversation_user_id, make_active );
	}
	
	this.addPizdezhBox = function( for_user_id, make_active )
	{
		var pizdezh_box = $(".the-pizdezh-box").find("#" + "pizdezh-" + for_user_id);
		if (!pizdezh_box.attr("id"))
		{
			var template = $(document.createElement("div"));
			template.addClass("pizdezh").attr("id", "pizdezh-" + for_user_id );
			template.appendTo(".the-pizdezh-box");
			if ( make_active )
			{
				$(".the-pizdezh-box .pizdezh").hide();
				template.show();
				
			} else {
				template.hide();
			}
			cursor.correctMessageBox(template);
		} else {
			if (make_active)
			{
				$(".the-pizdezh-box .pizdezh").hide();
				pizdezh_box.show();
			}
		}
	}
	
	this.reciever = function( json ){
		
		cursor.addConversationTab(json.id, json.name, true);
		cursor.addMessage(json.name, json.id, json.body, json.id, false);
	}
	
	this.addMessage = function( user, user_id, message, to_user, mymessage)
	{
		if (!message)
			return;
		var template = $(document.createElement("div"));
		template.addClass("message");
		
		var user_name = $(document.createElement("b"));	
		if (mymessage) {
			user_name.addClass("my");
		}else {
			user_name.addClass("nmy");
		}
		user_name.attr("user_id", user_id);	
		user_name.html(user);
		template.append(user_name);
		
		
		var message_date = $(document.createElement("i"));
		message_date.html("15:33");
		template.append(message_date);
		
		var br = $(document.createElement("br"));
		template.append(br);
		
		
		var body = $(document.createElement("span"));
		body.html(message);
		template.append(body);
		
		var pizdezh_box = "pizdezh-" + to_user;
		
		
		
		template.appendTo("#" + pizdezh_box);
		
		if (!to_user)
			to_user_id = 0;
		else {
			to_user_id = to_user;
		}
		
		var objDiv = document.getElementById(pizdezh_box);
		objDiv.scrollTop = objDiv.scrollHeight;
		if (mymessage) {
			$.post("/message/add_message", {
				message: message,
				user_id: to_user
			}, function(){
			
				template.animate({
					backgroundColor: "#fbd5b8",
				}, {
					queue: true,
					duration: 500
				}).animate({
					backgroundColor: "#fffcfb",
				}, {
					queue: true,
					duration: 500
				})
				
			});
		} else {
			
			template.animate({
					backgroundColor: "#D7A8FF",
				}, {
					queue: true,
					duration: 500
				}).animate({
					backgroundColor: "#fffcfb",
				}, {
					queue: true,
					duration: 500
				})
			
		}
				
		
	}
}
