squareSpinner = function(elm, text)
{
	var _id = Math.floor(Math.random()*100)
	var w = elm[0].offsetWidth
	var h = elm[0].offsetHeight
	var x = elm.offset().left
	var y = elm.offset().top
	var theClass = "squareSpinner"+_id
	var square = '<div class="spinner '+theClass+'"><p>'+ text +'</p></div>'
	$("body").append(square)
	$("."+theClass+" p").css({
		height : h+"px",
		lineHeight : h-20+"px"
	})
	$("."+theClass).css({
		width : w+"px",
		height : h+"px",
		left : x+"px",
		top : y+"px",
		display : "block",
		backgroundPosition : "center "+(h/2)+"px"
	})
	console.log("spawned spinner #"+_id)	
	return _id
}
closeSquareSpinner = function(id)
{
	console.log("close spinner #"+id)
	$(".squareSpinner"+id).fadeOut(function(){
		$(this).remove()
	})
}
errorSquareSpinner = function(id, text)
{
	$(".squareSpinner"+id).addClass("error").find("p").html(text)
	setTimeout("closeSquareSpinner("+id+")", 5000);
}

simpleLoader = function(elm)
{
	var _id = Math.floor(Math.random()*100)
	
	var theClass = "simpleLoader"+_id
	var loader = '<div class="loader '+theClass+'">&bull;</div>'
	var w = elm[0].offsetWidth
	var h = elm[0].offsetHeight
	var x = elm.offset().left
	var y = elm.offset().top
	
	$("body").append(loader)
	$("."+theClass).css({
		position : 'absolute',
		top : y + "px",
		left : x + "px"
	})
	simpleLoaderAnim(_id)
	console.log("spawned simple loader #"+_id)
	return _id
}
simpleLoaderAnim = function(id)
{
	$(".simpleLoader"+id).fadeOut(function(){
		$(this).fadeIn(function(){simpleLoaderAnim(id)})
	})
}
simpleLoaderDone = function(id, error)
{
	var timeout = 0
	if(error)
	{
		timeout = 3000
		$(".simpleLoader"+id).addClass("error").fadeIn(function(){$(this).stop()})
	} else {
		timeout = 1000
		$(".simpleLoader"+id).addClass("done").fadeIn(function(){$(this).stop()})
	}
	setTimeout('closeSimpleLoader('+id+')', timeout)
}
closeSimpleLoader = function(id)
{
	$(".simpleLoader"+id).fadeOut(function(){
		$(this).remove()
	})
}