// JavaScript Document

///////////////////////
//
// align form tables
//
///////////////////////

//// DEPRECIATED
$.fn.alignFormTable = function() {
	tdlabels = jQuery.makeArray($(this).children("tr td:even"));
	$.each(tdlabels,function() {
		$(this).css({ "textAlign":"right","verticalAlign":"top" });
	});	
}
//// DEPRECIATED ^^^

$.fn.alignTable = function(properties) {
	
	// use css from arguments or default (default is aligned right and valigned top)
	if (arguments.length) {
		cssProperties = arguments[0];
	} else {
		cssProperties = { "textAlign":"right","verticalAlign":"top","paddingRight":"5px" };
	}
	
	var tdlabels = jQuery.makeArray($(this).children("tr td:even"));
	$.each(tdlabels,function() {
		$(this).css(cssProperties);
	});	
}


///////////////////////////
//
// Smart Password - password fields preview last letter typed
//
///////////////////////////

$.fn.smartPassword = function() {
	$(this).after("<span style='padding-left:6px; position:absolute;'></span>");
	var t;
	$(this).keypress(function(e) {  
		clearTimeout(t);
		var lastLetter = String.fromCharCode(e.which);
		var thisSpan = $(this).next("span");
		thisSpan.stop().text(lastLetter).fadeTo(0,1);
		t = setTimeout(function() {
			thisSpan.fadeOut();				
		}, 500);
	});
}

///////////////////////////
//
// Smart Input - input clears on first click and reverts to original value if blank when blurred
//
///////////////////////////

$.fn.smartInput = function() {
	$(this).each(function() {
		var originalValue = $(this).val();
		$(this).focus(function() {
			if ($(this).val() == originalValue) {
				$(this).val("");
			}
		}).blur(function() {
			if ($(this).val() == "") {
				$(this).val(originalValue);	
			}
		});
	});
}

///////////////////////////
//
// validate email in real time
//
///////////////////////////

// works with one email field in the form

$.fn.emailValidate = function(message) {
	
	// default invalid email message is !
	if (!arguments.length) {
		message = "!";	
	} else {
		message = arguments[0];
	}
	
	
	var thisInputName = $(this).attr("name");
	var emailValidate = false;
	
	$(this).after("<span class='emailValidate' style='padding-left:6px'></span>");
	var emailValidateColor = $(this).next("span.emailValidate").css("color");
	
	$(this).keyup(function(e) {  
		
		// test value and give user the feedback
		var thisVal = $(this).val();
		if (thisVal.indexOf("@") > 0 && thisVal.indexOf(".") > 0) {
			$(this).next("span.emailValidate").text("");
			emailValidate = true;
		} else {
			$(this).next("span.emailValidate").text(message);
			emailValidate = false;
		}
		
	});
	
	$(this).closest("form").submit(function() {
		if (!emailValidate) {
			$(this).children("input[name="+thisInputName+"]").css("border","1px solid "+emailValidateColor).next("span.emailValidate").text(message);;
			return false;
		}
	});
	
}


///////////////////////
//
// Pop Up - Dim screen (cover with semi transparent full screen div) and fade in target div with 'data' as content
//
///////////////////////

// this works best to call in an ajax function... for example the success function could be $(element.popup).popUp(data);

$.fn.popUp = function(data,callback) {
	
	var thisPopUp = $(this);
	$(".browserDimmer").fadeIn(function() {
		thisPopUp.html(data);
		thisWidth = thisPopUp.width();
		
		scrollVal = $(window).scrollTop()+40;
		
		thisPopUp.css({"marginLeft":"-"+thisWidth/2+"px","top":scrollVal+"px"}).fadeIn(function() {
			// callback
			if (typeof callback == 'function') {
				callback.call(this, data);
			}																							  
		});						
	});
}

///////////////////////
//
// Smart Button - make an element move to the mouse when the mouse gets near it
// * This works well for elements that have links within them or other clickable children... for single clickable elements, Smart Button 2 is nicer because it always centers the button on the mouse *
//
////////////////////////

$.fn.smartButton = function() {
	
	// set hit area size... only if argument passed is a number
	if (arguments[0] == parseInt(arguments[0])) {
		var padding = arguments[0];
	} else {
		var padding = 100;	
	}
	
	// create a dummy to maintain page positioning of other elements
	if ($(this).css("position") != "absolute" && $(this).css("position") != "fixed") {
		
		// method 1... clone div and remove all visual styles
		$(this).clone().css({ "background":"none","border":"none" }).html("").insertAfter($(this));
		
		// method 2... create new div with same width and height
		/*var thisWidth = $(this).width();
		var thisHeight = $(this).height();
		$(this).after("<div style='width:"+thisWidth+"px; height:"+thisHeight+"px'></div>");*/
	}
	
	// wrap element in hit area and style hit area appropriately
	$(this).wrap("<div style='position:absolute; padding:"+padding+"px; margin-left:-"+padding+"px; margin-top:-"+padding+"px;'></div>");
	$(this).css("position","relative");
	
	
	// set variable to call this button
	var thisSmartButton = $(this);
	
	// move to position when mouse is over hit area
	$(this).parent("div").mousemove(function(e) {
		
		// calculate offset values each time
		var offset = thisSmartButton.offset();
		offset.right = offset.left+thisSmartButton.width();
		offset.bottom = offset.top+thisSmartButton.height();
		
		// left side
		if (e.pageX < offset.left) {
			$(this).animate({"paddingLeft":"-=1"},0);
		}
		// right side
		if (e.pageX > offset.right) {
			$(this).animate({"paddingLeft":"+=1","paddingRight":"-=1"},0);
		}
		// top side
		if (e.pageY < offset.top) {
			$(this).animate({"paddingTop":"-=1"},0);
		}
		// bottom side
		if (e.pageY > offset.bottom) {
			$(this).animate({"paddingTop":"+=1","paddingBottom":"-=1"},0);
		}
	});
	
	// return to position on mouse leave
	$(this).parent("div").mouseleave(function() {
		$(this).stop().animate({"paddingLeft":padding+"px","paddingRight":padding+"px","paddingTop":padding+"px","paddingBottom":padding+"px"},500);
	});

}

///////////////////////
//
// Smart Button 2 - make an element move to the mouse when the mouse gets near it
// * This works best for a single clickable element, because it always centered the element on the mouse *
//
////////////////////////

$.fn.smartButton2 = function() {
	
	// set hit area size... only if argument passed is a number
	if (arguments[0] == parseInt(arguments[0])) {
		var padding = arguments[0];
	} else {
		var padding = 100;	
	}
	
	// clone element and create a dummy to maintain page positioning of other elements
	if ($(this).css("position") != "absolute" && $(this).css("position") != "fixed") {
		
		// method 1... clone div and remove all visual styles
		$(this).clone().css({ "background":"none","border":"none" }).html("").insertAfter($(this));
		
		// method 2... create new div with same width and height
		/*var thisWidth = $(this).width();
		var thisHeight = $(this).height();
		$(this).after("<div style='width:"+thisWidth+"px; height:"+thisHeight+"px'></div>");*/
	}
	
	// wrap element in hit area and style hit area appropriately
	$(this).wrap("<div style='position:absolute; padding:"+padding+"px; margin-left:-"+padding+"px; margin-top:-"+padding+"px;'></div>");
	$(this).css("position","relative");
	
	
	// set variable to call this button
	var thisSmartButton = $(this);
	
	// move to position when mouse is over hit area
	$(this).parent("div").mousemove(function(e) {
		
		// calculate offset values each time
		var offset = thisSmartButton.offset();
		offset.left = offset.left+thisSmartButton.width()/2;
		offset.top = offset.top+thisSmartButton.height()/2;
		
		// left side
		if (e.pageX < offset.left) {
			$(this).animate({"paddingLeft":"-=1"},0);
		}
		// right side
		if (e.pageX > offset.left) {
			$(this).animate({"paddingLeft":"+=1","paddingRight":"-=1"},0);
		}
		// top side
		if (e.pageY < offset.top) {
			$(this).animate({"paddingTop":"-=1"},0);
		}
		// bottom side
		if (e.pageY > offset.top) {
			$(this).animate({"paddingTop":"+=1","paddingBottom":"-=1"},0);
		}
	});
	
	// return to position on mouse leave
	$(this).parent("div").mouseleave(function() {
		$(this).stop().animate({"paddingLeft":padding+"px","paddingRight":padding+"px","paddingTop":padding+"px","paddingBottom":padding+"px"},500);
	});

}

///////////////////////
//
// Character Count
// set length limit, 'ok' message, and 'too many' message
//
////////////////////////

// update character count
$.fn.charCount = function(count) {
	$(this).after("<span id='charcount' style='padding-left:6px'></span>");
	$(this).keyup(function() {
		var textcopy = $(this).val();
		var textcopyCount = textcopy.length;
		$("#charcount").text(textcopyCount+"/"+count);
		if (textcopyCount > count) {
			$("#charcount").css({"color":"#990000"});
		} else {
			$("#charcount").css({"color":"#000"});
		}
	});
}
