$(function(){
	
	var $gid = $.data(document.body, "ajax").gid;
	var $accid = $.data(document.body, "ajax").accid;
	var lastPage = 0;
	
	$msgContainer = $('#msgContainer');
	$postsContainer = $('#posts');
	
	var html = '<a class="bigBtn light ui-corner-all" href="#">Post new message</a>';
	$newPostBtn = $(html);
	$msgContainer.prepend($newPostBtn);
	$newPostBtn.bind('click', function(ev){
		ev.preventDefault();
		$newPostBtn.slideUp('slow');
		$.ajax({
			type: "POST", url: 'ajax_group.php?get_post_users', dataType: 'json', 
			data: "gid=" + $gid + "&accid=" + $accid,
			success : function (json) {
				if (json.error)
					$msgContainer.prepend('<p>' + json.error + '</p>');
				else {
					var posters = '<form><select id="dropDownSelect" name="userid" style="width:200px;">';
					var ava = {};
					$.each(json, function(i, user){
						posters = posters + '<option value="' + user.id + '">' + user.rights + ' - ' + user.username + '</option>';
						ava[user.id] = user.avatar;
					});
					posters = posters +'</select></form>';
					
					var html = '\n<div class="postContainer norm"><div class="msgInnerContainer">\n'
					+ '		<div class="avaContainer norm"><div class="avaInnerContainer">'
					+ '			<img src="avatar/th_" style="width:75px;" />'
					+ '		</div></div>'
					+ '		<div class="msgText">'+posters+'</div><div class="replies" />'
					+ '\n</div></div>\n';
					var $reply = $(html).insertAfter( $newPostBtn ).hide().fadeIn();
					var html = '<input type="checkbox" name="alert" value="1" /><span class="light">Alert</span>';
					var $alert = $(html).insertAfter( $reply.find('select') );
					
					if( json[0].rights < 2 ){
						$alert.hide();
					}
					$reply.find('img').attr( 'src', 'avatar/th_'+ava[ $reply.find('select').val() ] );					
					$reply.find('select').change(function(ev) {
						$reply.find('img').attr( 'src', 'avatar/th_'+ava[ $(this).val() ] );
						if( json[ev.target.selectedIndex].rights >= 3 ){
							$alert.show();
						}
						else{
							$alert.attr('checked', false);
							$alert.hide();
						}
					});
					
					var $textarea = $('<textarea>Insert message here.</textarea').width( ($reply.width() - 8) ).height( 50 );
					var $buttons = $('<div><input type="button" value="SAVE" class="saveButton" /> / <input type="button" value="CANCEL" class="cancelButton"/></div>');
					$textarea.appendTo( $reply.find('.msgText') );
					$buttons.appendTo( $reply.find('.msgText') );
					
					var $saveBtn = $buttons.find('.saveButton');
					var $cancelBtn = $buttons.find('.cancelButton');
					
					$saveBtn.bind('click', function(){
						var alert = 0;
						if( $alert.is(':checked') )
							alert = 1;
						var userid = $reply.find('select').val();
						var msg = $textarea.val();
						$.ajax({
							type: "POST", url: 'ajax_group.php?postmsg='+$gid, dataType: 'json',
							data: "userid=" + userid + "&alert=" + alert + "&msg="+ encodeURIComponent(msg),
							success: function(json){								
								$textarea.remove();
								$buttons.remove();
								$alert.remove();
								$reply.find('.norm').removeClass('norm').addClass('alert');
								
								var msg = json.msg.text;
								msg = msg.replace(/\n/g, "<br />");
								$('<p>'+msg+'</p>').appendTo( $reply.find('.msgText') );
								var headerhtml = '<div class="msgHeader"><a name="msg'+json.msg.id+'"></a><a href="/profile.php?user='+json.poster.name+'" class="name">'+json.poster.name+'</a>&nbsp;<a href="group.php?id='+$gid+'#msg'+json.msg.id+'">Permalink</a><span class="date"> '+json.msg.date+'</span></div>';
								$reply.find('.avaInnerContainer').prepend(headerhtml);
								$reply.find('select').remove();
								$reply.find('.msgHeader').width( ( $reply.find('.msgText').outerWidth() + 75 ) );
								$newPostBtn.slideDown();
							}
						});
					});
					$cancelBtn.bind('click', function(){
						$reply.remove();
						$newPostBtn.fadeIn();
					});
				}
			}
		});
	});
	var timer = 0,
		delay = 100;
	var loadMsgs = function() {
		timer = 0;
		$page = $('<div class="page" />').appendTo($postsContainer);
		$.ajax({
			type: "POST", url: 'ajax_group.php?get_msgs', dataType: 'json', 
			data: "gid=" + $gid + "&accid=" + $accid + "&page=" + lastPage,
			success : function(json) {
				if( lastPage == json.page )
					return;
				lastPage = json.page;
				$.each(json.msgs, function(i, e){
					var msg = e.msg.text;
					if(msg)
						msg = msg.replace(/\n/g, "<br />");	
					var date = e.msg.date;
					var type = e.msg.alert == 0 ? 'norm' : 'alert';
					if( e.msg.orig != null ){
						date = 'Edited: ' + e.msg.date + ' <a href="#" class="tooltip" title="'+e.msg.orig+'">Original</a>'
					}
						
					var html = '\n<div class="postContainer '+type+'" id="'+e.msg.id+'"><div class="msgInnerContainer">\n'
					+ '		<div class="avaContainer '+type+'"><div class="avaInnerContainer">'
					+ '			<div class="msgHeader">'
					+ '				<a name="msg'+e.msg.id+'"></a><a href="/profile.php?user='+e.poster.name+'" class="name">'+e.poster.name+'</a>'
					+ '				&nbsp;<a href="group.php?id='+$gid+'#msg'+e.msg.id+'">Permalink</a><span class="date"> '+date+'</span>'
					+ '			</div>'
					+ '			<a href="/profile.php?user='+e.poster.name+'"><img src="avatar/th_'+e.poster.avatar+'" style="width:75px;" /></a>'
					+ '		</div></div>'
					+ '		<div class="msgText"><p>'+ msg +'</p></div><div class="replies" />'
					+ '\n</div></div>\n';
						
					var $msg = $(html);
					if( e.msg.replyto == null )
						$page.prepend($msg);
					else 
						$('#'+e.msg.replyto).find('.replies:first').prepend($msg);
					
					if( e.msg.deleted != false ){
						$msg.find('.msgText > p').after('<p class="delete-note">Message has been deleted by ' + e.msg.deleted + '</p>');
						$msg.css('opacity', '0.6');
					}
						
					$msg.find('.msgHeader').width( ( $msg.find('.msgText').outerWidth() + 75 ) );
					
					var html = '<div class="msgMenu" />';
					var $menu = $(html);
					$msg.find('.msgInnerContainer').append($menu);
					
					var $msgText = $msg.find('.msgText > p');
					
					var buttonsList = [];
					buttonsList.push('Reply');
					if(e.msg.editable === true)
						buttonsList.push('Edit');
					if(e.msg.deletable === true)
						buttonsList.push('Delete');
					if(e.msg.restorable === true)
						buttonsList.push('Restore');
					
					var buttonAction = function(action){
						switch (action) {
							case "Reply":{
								$.ajax({
									type: "POST", url: 'ajax_group.php?get_post_users', dataType: 'json', 
									data: "gid=" + $gid + "&accid=" + $accid,
									success : function (json) {
										if (json.error) 
											$('.msgContainer').prepend('<p>' + json.error + '</p>');
										else {
											var posters = '<select id="dropDownSelect" name="userid" style="width:200px;">';
											var ava = {};
											$.each(json, function(i, user){
												posters = posters + '<option value="' + user.id + '">' + user.rights + ' - ' + user.username + '</option>';
												ava[user.id] = user.avatar;
											});
											posters = posters +'</select>';
											
											var html = '\n<div class="postContainer norm"><div class="msgInnerContainer">\n'
											+ '		<div class="avaContainer norm"><div class="avaInnerContainer">'
											+ '			<img src="avatar/th_'+e.poster.avatar+'" style="width:75px;" />'
											+ '		</div></div>'
											+ '		<div class="msgText">'+posters+'</div><div class="replies" />'
											+ '\n</div></div>\n'
											var $reply = $(html).prependTo( $msg.find('.replies:first') ).hide().fadeIn();
											
											$reply.find('img').attr( 'src', 'avatar/th_'+ava[ $reply.find('select').val() ] );					
											$reply.find('select').change(function() {
												$reply.find('img').attr( 'src', 'avatar/th_'+ava[ $(this).val() ] );
											});
											
											var $textarea = $('<textarea>Insert message here.</textarea').width( ($reply.width() - 8) ).height( 50 );
											var $buttons = $('<div><input type="button" value="SAVE" class="saveButton" /> / <input type="button" value="CANCEL" class="cancelButton"/></div>');
											$textarea.appendTo( $reply.find('.msgText') );
											$buttons.appendTo( $reply.find('.msgText') );
											
											var $saveBtn = $buttons.find('.saveButton');
											var $cancelBtn = $buttons.find('.cancelButton');
											
											$saveBtn.bind('click', function(){
												var msg = $textarea.val();
												var userid = $reply.find('select').val();
												$.ajax({
													type: "POST", url: 'ajax_group.php?postmsg='+$gid, dataType: 'json',
													data: "userid=" + userid + "&alert=" + 0 + "&msg="+ encodeURIComponent(msg) +"&reply_to=" + e.msg.id,
													success: function(json){
														$textarea.remove();
														$buttons.remove();
														
														var msg = json.msg.text;
														msg = msg.replace(/\n/g, "<br />");
														$('<p>'+msg+'</p>').appendTo( $reply.find('.msgText') );
														var headerhtml = '<div class="msgHeader"><a name="msg'+json.msg.id+'"></a><a href="/profile.php?user='+json.poster.name+'" class="name">'+json.poster.name+'</a>&nbsp;<a href="group.php?id='+$gid+'#msg'+json.msg.id+'">Permalink</a><span class="date"> '+json.msg.date+'</span></div>';
														$reply.find('.avaInnerContainer').prepend(headerhtml);
														$reply.find('select').remove();
														$reply.find('.msgHeader').width( ( $reply.find('.msgText').outerWidth() + 75 ) );
													}
												});
											});
											$cancelBtn.bind('click', function(){
												$reply.remove();
											});
										}
									}
								});
								break;
							}
							case "Edit":{
								var $textarea = $('<textarea>' + $msgText.html().replace(/\n/g, "").replace(/<br>/g, "\n") + '</textarea>').width( ($msgText.width() - 8) ).height( ($msgText.height() + 14) );
								var $buttons = $('<div><input type="button" value="SAVE" class="saveButton" /> / <input type="button" value="CANCEL" class="cancelButton"/></div>');
								
								$msgText.hide();
								$textarea.insertAfter($msgText);
								$buttons.insertAfter($textarea);
								
								var $saveBtn = $buttons.find('.saveButton');
								var $cancelBtn = $buttons.find('.cancelButton');
								
								$saveBtn.bind('click', function(){
									//"<img src='images/ajax-loading.gif'>" // loading gif..
									$textarea.remove();
									$buttons.remove();
									$msgText.show();
									
									var msg = $textarea.val();								
									$.ajax({
										type: "POST", url: 'ajax_group.php?edit_post', dataType: 'json',
										data: "newPost=" + encodeURIComponent(msg) + "&msgid=" + e.msg.id,
										success: function(json){										
											var msg = json.msg.text;
											msg = msg.replace(/\n/g, "<br />");
											$msgText.html( msg );
											$msg.find('.postDate').find('.date').html(' Edited: ' + json.msg.date + ' <a href="#" class="tooltip" title="'+json.msg.orig+'">Original</a>');
										}
									});
								});
								$cancelBtn.bind('click', function(){
									$msgText.show();
									$textarea.remove();
									$buttons.remove();
								});
								
								break;
							}
							case "Delete":{							
								var deleteMsg = function(msgid, userid, $el){
									$.ajax({
										type: "POST", url: 'ajax_group.php?delete_msg', dataType: 'json',
										data: "deleter=" + userid + "&msgid=" + msgid + "&gid=" + $gid,
										success: function(json){
											$msg.fadeTo('fast', 0.6);
											$('<span class="error">Message Deleted</span>').insertBefore($msgText);
											//$el.remove();
										}
									});
								};
								
								$.ajax({
									type: "POST", url: 'ajax_group.php?get_msg_accessers', dataType: 'json',
									data: "gid=" + $gid + "&msgid=" + e.msg.id,
									success: function(json){
										if( json.length == 1 ) {
											deleteMsg(e.msg.id, json[0].id);
										}
										else if( json.length > 1 ) {
											var html = '<span class="light">Select name to delete message as: </span><select id="deleterSelect" name="userid" style="width:200px;">';
											$.each(json, function(i, user){
												html = html + '<option value="' + user.id + '">' + user.name + '</option>';
											});
											html = html +'</select><button type="button">Confirm</button>';
											$el = $(html);
											$el.insertBefore($msgText);
											$el.filter('button').click(function(){
												var userid = $el.filter('select').val();
												deleteMsg(e.msg.id, userid, $el);
											});
										}
									}
								});
								
								break;
							}
							case "Restore":{
								$.ajax({
									type: "POST", url: 'ajax_group.php?restore_msg', dataType: 'json',
									data: "msgid=" + e.msg.id + "&gid=" + $gid,
									success: function(json){
										$msg.find('.delete-note').remove();
										$msg.fadeTo('fast', 1);
									}
								});
									
								break;
							}
						}
					}
					$.each(buttonsList, function(i, tag){
						var buttonhtml = '<a>' + tag + '</a>';
						$this = $(buttonhtml).bind("click", function(){
							buttonAction(tag);
						})
							.appendTo($menu);
						
						if( tag == 'Delete' )
							$this.addClass('error');
						else
							$this.addClass('light');
					});
					
					$msg.hover(function(ev){
						//ev.stopPropagation();
						$menu.slideDown('fast');
					}, function(){
						$menu.slideUp('fast');
					});
				});
			}
		});
	};
	
	$(window).scroll(function(){
		if( $(window).scrollTop() >= ( $(document).height() - 100 ) - $(window).height() ){
			if (timer) {
		        clearTimeout(timer);
		        timer = 0;
		    }
		    timer = setTimeout(loadMsgs, delay);
		}
	});
	
	if( $('#msgContainer')[0] )
		loadMsgs();
	//$pagetabs = $("#group-tabs");
	//$('#msgContainer').hide();	
	/*$pagetabs.find('li').click(function(ev){
		$this = $(this);
		$pagetabs.find('li').removeClass('active');
		$this.addClass('active');
		if( $this.is(':contains(Main)') ){
			$('#editArea').show();
			$('#groupListContainer').show();
			$('#msgContainer').hide();
		}
		else if( $this.is(':contains(Messages)') ){
			$('#editArea').hide();
			$('#groupListContainer').hide();
			$('#msgContainer').show();
			if( $('#posts').is(":empty") )
				loadMsgs();
		}
	});*/
	
});