var currentObj = null;
var fail = '';
jQuery(document).ready(function() {
	attach_handler();
});
/*
Name: attach_handler
Usage: use when the element first initialize
Parameter: 	NONE
Description: this method attach event handler to each element
*/
function attach_handler()
{
	$('.box').click(function(){
		currentObj = this;
		$('#body').css({"position":"absolute", "z-index": "1", "top":0,"left":0,"overflow":"hidden","background":"#000"}).animate({opacity: 0.3},500, function(){$('#navbox').css("display", "block");});
		window.scrollTo(0,0);
	});
}
/*
Name: cancel
Usage: use when want to cancel button is clicked
Parameter: 	NONE
Description: this method hide all boxes and grey effect
*/
function cancel()
{
	hideAllBox();
	appear();
}
/*
Name: appear
Usage: use when want to clear away the grey effect
Parameter: 	NONE
Description: this method hide the grey effect
*/
function appear()
{
	$('#body').css({"overflow":"visible", "position":"absolute", "z-index": "0", "background":"#FFF"}).animate({"opacity": 1},1000);
}
/*
Name: renameBox
Usage: use when rename button is clicked
Parameter: 	NONE
Description: this method display the rename box pop out
*/
function renameBox()
{
	hideAllBox();
	$('#renamebox').css("display", "block");
}
/*
Name: messagebox
Usage: use when remove button is clicked
Parameter: 	NONE
Description: this method display the remove box pop out
*/
function deleteBox()
{
	hideAllBox();
	$('#deletebox').css("display", "block");
}
/*
Name: messagebox
Usage: use when certain action is completed
Parameter: 	NONE
Description: this method display the message box pop out
*/
function messagebox()
{
	hideAllBox();
	$('#messagebox').css("display", "block");
}
/*
Name: okbox
Usage: use when certain action is completed
Parameter: 	NONE
Description: this method display the ok button pop out
*/
function okbox()
{
	hideAllBox();
	$('#okbox').css("display", "block");
}
/*
Name: getSelectedFileName
Usage: get the name located in the soure
Parameter: 	NONE
Description: this initial rename and do validation checking
*/
function getSelectedFileName()
{
	oldname =  $(currentObj).children('img')[0];
	oldname = $(oldname).attr('title');
		return oldname;
}
/*
Name: rename_confirm
Usage: use when the user clicked rename button
Parameter: 	NONE
Description: this initial rename and do validation checking
*/
function rename_confirm()
{
	var available = true;
	var newname = $('#input_rename').attr("value");
	var rename = document.getElementById('input_rename');
	if(isAllowedName(rename,"Found Invalid Character! Rename Failed. Only symbol '-' or '_' allowed"))
	{
		$('#body').contents().find('img').each(function(){
		oldname = $(this).attr('title').split(".");

		if((oldname[0]).toLowerCase() == newname.toLowerCase())
		{
			available=false;
			return;
		}
		});
		if(available)
		{
			oldname = getSelectedFileName();
			ajaxCall('R', oldname,newname);
		}
		else
			alert("The name has been taken. Please choose another name");
	}
}
/*
Name: delete_confirm
Usage: use when the user clicked remove button
Parameter: 	NONE
Description: this initial delete
*/
function delete_confirm()
{
	filename = getSelectedFileName();
	ajaxCall('D', filename,'');
	
}
/*
Name: retry
Usage: use when the user clicked retry button
Parameter: 	NONE
Description: this check what failed previously and call the appropriate method again
*/
function retry()
{
	fail == 'D'?delete_confirm():rename_confirm();
}
/*
Name: ajaxCall
Usage: use to call the server scripts
Parameter: 	calller: determine who are the caller
			nameold: the old file name
			namenew: the new file name
Description: all the server with client operation is done in this small method
*/
function ajaxCall(caller, nameold, namenew)
{
	$.post("hpt_operate.php", { op: caller, oldname: nameold, newname: namenew }, function(data){
		if(caller=='D')
		{
			if(data == "1")
			{
				
				$("#okmsg").html("Delete Successful");
				$(currentObj).remove();
				okbox();
				
			}
			else
			{
				fail = 'D';
				$("#errormsg").html("Delete has fail, Please try again later or contact <a href='clay@hungred.com'>Clay</a>");
				messagebox();
			}
		}
		else if(caller=='R')
		{
			data = data.split("||");
			if(data[1] == "1")
			{
				$("#okmsg").html("Rename Successful");
				var domain = 'http://' + window.location.hostname + '/wp-content/demo/jQuery-file-management-system-how-to/random/'+data[0];
				$(currentObj).parent().append("<div class='box'><img title='"+data[0]+"' src='"+domain+"'/></div>");
				$('#input_rename').attr('value','');
				$(currentObj).attr('title', namenew);
				$(currentObj).remove();
				attach_handler();
				okbox();
				
			}
			else
			{
				fail = 'R';
				$("#errormsg").html(data);
				messagebox();
			}
		}
  });
}
/*
Name: hideAllBox
Usage: use to hide all the element
Parameter: 	NONE
Description: use to hide all the pop out box from appearing
*/
function hideAllBox()
{
	$('#renamebox').css("display", "none");
	$('#deletebox').css("display", "none");
	$('#messagebox').css("display", "none");
	$('#navbox').css("display", "none");
	$('#okbox').css("display", "none");
}
/*
Name: confirm_cancel
Usage: when user click confirm cancel
Parameter: 	NONE
Description: this is call when user clicked cancel
*/
function confirm_cancel()
{
	hideAllBox();
	$('#navbox').css("display", "block");
}

/*
Name: isAllowedName
Usage: use to validate space color and space border color text box
Parameter: 	elem: the DOM object of each element
			helperMsg: the pop out box message
Description: This is a simple method to check whether a given text box string contains 
			 all type of characters except symbols excluding '#'
*/
function isAllowedName(elem, helperMsg){
	var alphaExp = /^[-_0-9a-zA-Z]+$/;
	if(elem.value.toLowerCase().match(alphaExp)){
		return true;
	}else{
		alert(helperMsg);
		elem.focus();
		return false;
	}
}