// JavaScript Document


function init_profile_comments(){ 
	// user clicked in comment_textbox; initialise the form to post comment:
	$(".comment_textbox").click(function(){
		var prof_viewer = $("#profile_viewer").attr("value"), parent = $(this).parent(), original_html = parent.html();
		$.get("profile_comment.php?action=post&author=" + prof_viewer, function(data) {
			$(parent).html(data);
		});
		// user has clicked off the comment area:
		$("div").not(".comment_addtext").click(function(){
			parent.html(original_html); // revert to original html;
			init_profile_comments(); // refire the listender:
		});
		setTimeout( function() { $(".comment_addtext").focus(); } , 750); // delay focus to profile comment box (mainly for IE purpose):
	});
}
	
	
function init_profile_buttons() {

	$(".spcn_default_button").mousedown(function() {
		var imageUrl = "images/button-s-down.png";
		$(this).css("background-image", 'url("' + imageUrl + '")'); // pushdown img:
	}).mouseup(function() {
		var imageUrl = "images/button-s.png";
		$(this).css("background-image", 'url("' + imageUrl + '")'); // push up img:
	});
	
	
	$(".back2profile").click(function() {
		var element_id = "#" + $("#profile_container_videos").children(":eq(1)").attr("id");
		$(element_id).slideUp(500, function() {
			var prof_owner = $("#profile_owner").attr("value"); // reload (show) the videos:
			$.get("profile_video.php?action=show&user=" + prof_owner, function(data) {
				// need to refresh the element var, as its ID changes to that of the youtube video:	
				var new_top_parent = "#" + $("#profile_container_videos").children(":eq(1)").attr("id");
				$(new_top_parent).html(data);
				$(new_top_parent).slideDown(500, function() {
					$("div").addClass($("#profile_container").attr("class"));
					//init_profile_buttons();
				});
			});
		});
	});
	
	
	$("#profile_add_video").click(function() {
		// i found this to be the easiest way of referencing the element to work with since its ID
		// changes to the youTube video ID webing viewed:
		var element_id = "#" + $("#profile_container_videos").children(":eq(1)").attr("id");
		$(element_id).slideUp(500, function() {
			// Animation complete.
			$(element_id).load("profile_video.php?action=add", function() {
				$(element_id).slideDown(500, function() {
					$("div").addClass($("#profile_container").attr("class"));
				});
				init_profile_buttons();
			});
		});
	});

	
	
	$("#profile_remove_video").click(function() {	
		var video_id = $("#profile_container_videos").children(":eq(1)").attr("id");
		// only go forward if theres a video loaded, if no video loaded the div's id is 'profile_videos'
		if (video_id !== "profile_videos") {
			var element_id = "#" + video_id;
			$(element_id).slideUp(500, function() {
				$(element_id).load("profile_video.php?action=delete&video="+video_id, function() {
					$(element_id).slideDown(500, function() {
						$("div").addClass($("#profile_container").attr("class"));
					});
					init_profile_buttons();
				});
			});
		}
	});

			
			
	$("#profile_get_video").click(function() {
		var video_id = $("#video_id").val(); // get video input value:
		if (video_id == "") { alert("No video URL entered!"); return; } // no input, return error!
		else {
			// i found this to be the easiest way of referencing the element to work with since its ID
			// changes to the youTube video ID webing viewed:
			var element_id = "#" + $("#profile_container_videos").children(":eq(1)").attr("id");
			$(element_id).slideUp(500, function() {
				$.post("profile_video.php?action=get", { video_id: video_id }, function(validate){
					if (validate == "1") {
						var prof_owner = $("#profile_owner").attr("value"); // reload (show) the videos:
						$.get("profile_video.php?action=show&user=" + prof_owner, function(data) {
							var top_parent = "#" + $("#profile_container_videos").children(":eq(1)").attr("id");
							$(top_parent).html(data);
							//init_profile_buttons();
						});
					}	
					else { 
						$(element_id).html(validate);
						$(element_id).slideDown(500, function() {
							$("div").addClass($("#profile_container").attr("class"));
							init_profile_buttons();
						});
					}
				});
			});
		}
	});
		
}
	

	
$(document).ready(function() {

	// add toggly thing to the album visibility;
	$('#album_toggle').click(function() { 
		$('#user_album').toggle(500); 
	});

	// get the user ID (hexnick) of the profile being viewed:
	var prof_owner = $("#profile_owner").attr("value");
	
	// load in profile videos:
	$.get("profile_video.php?action=show&user=" + prof_owner, function(data) {
		var element = $("#profile_container_videos").children(":eq(1)");
		var element_id = "#" + $(element).attr("id");
		$(element_id).html(data);
		$(element_id).fadeIn(1500);
	});
	
	// load in profile comments:
	$.get("profile_comment.php?action=show&user=" + prof_owner, function(data) {
		$("#profile_comments").html(data);
		$("#profile_comments").fadeIn(1500);
		init_profile_comments();
	});
	
	
	
	
	init_profile_buttons();
	
	
	
	
	
	
	
	$("#album_upload_item").click(function() {
		$(".album_file_select").click();// programatically click the file selector:
	});	
		
		
	$(".album_delete_item").click(function() {
		var album_item_id = $(this).parents().eq(3).attr("id"); // get the album item's ID:
		var delete_item_url = "edit_album.php?action=delete&item="+album_item_id; // create URL var:
		var item_count = $(".album_item_count").html(), item_count = parseFloat(item_count); // before delete count number of album items:
		// Post info:
		$.post(delete_item_url, function(data) {
			//  if edit_album.php returns '1' this means success!
			if (data == 1) { 
				item_count--; // decrease album item count:
				// fade out the album item:
				$("#"+album_item_id).fadeOut(200, function() {
					$("#"+album_item_id).remove(); // remove the album item:
					$(".album_item_count").html(item_count); // display new album item count:
				});
			}
			//  edit_album.php didnt '1' this means fail!
			else { alert("Oops, something went wrong..."); return; }
		});
	});
	
	$("#friend_check").click(function() {
		var prof_owner = $("#profile_owner").attr("value");
		$.get("friends_check.php?chatnick=" + prof_owner, function(data) {
			// elseif's for simplicty of reading!
			if (data == 'Y') { alert ("This person is already one of your friends.") }
			if (data == 'N') { alert ("This person already has an invitation from you.") }
			if (data == 'S') { alert ("A friend invitation has been sent on your behalf.") }
			if (data == '404') { alert ("Error: That nickname was not found.") }
			if (data == '403') { alert ("Error: You cannot add yourself as a friend.") }
			if (data == 'ERR') { alert ("Error: Not signed in") }
		});
	});	
	
	
	
	
	

	
	
	
	
	// edit album item:
	// change title, description:
	$('.edit').editable('edit_album.php?action=update', {
		indicator: '<img src="images/loader.gif" class="loadingimg">',
		type: 'text', //
		name  : 'title'
	 });
	$('.edit_area').editable('edit_album.php?action=update', { 
		indicator: '<img src="images/loader.gif" class="loadingimg">',
		type: 'textarea',
		submit: 'OK',
		name  : 'description'
	});
	
	
	
	
	
	
	
});



// make an html element invisible
function hideElement(elementId) {
    var element;
    if (document.all)
    element = document.all[elementId];
    else if (document.getElementById)
    element = document.getElementById(elementId);
    if (element && element.style)
    element.style.display = 'none';
}