//include common.js
//document.write("<script src=\"" + "common.js" + "\" type=\"text/javascript\"></script>");

(function ($) {
    $.fn.hintableSelect = function (/*{color: "", text: ""}*/ hintObj) {
		var $select = this.data({
			hintColor: hintObj.color ? hintObj.color : this.css("color"),
			hintText: hintObj.text
		});
			
		// private member
		var hintValue = "_hint";
		
		$.extend($select, {
			appendHint: function (/* String */ hintText) {
				hintText = hintText || $select.data("hintText");
				return $select
					.prepend($("<option></option>")
						.attr({
							disabled: "disabled",
							selected: "selected",
							value: hintValue
						})
						.text(hintText)
					).attr("selectedIndex", 0);
			},
			
			selectedText: function (/* String */ text) {
				if (text) {
					// TODO: set
				} 
				else {
					// get
					return $("option", $select).filter(function () { return this.value == $select.val() }).text();
				}
			},
			
			isChanged: function () {
				return $select.attr("selectedIndex") != 0
					&& $select.attr("selectedIndex") != -1;
			}
		});
		
		return $select;
	};

	$.fn.hintableInput = function (/*{color: "", text: ""}*/ hintObj) {
		$("<span>", {display: "none"}).css("color", hintObj.color).insertAfter(this);
		hintObj.color = this.next("span").css("color");
		this.next("span").remove();
		
		var $input = this
			.data("initColor", this.css("color"))
			.data("hintColor", hintObj.color)
			.data("hintText", hintObj.text);
		
		$input.css("color", hintObj.color).val(hintObj.text)
		.focus(function () {
			var $this = $(this);
			if ($this.css("color") == hintObj.color && $this.val() == hintObj.text) {
				$this.css("color", $this.data("initColor")).val("");
			}
		})
		.blur(function () {
			var $this = $(this);
			if ($this.val() == "") {
				$this.css("color", hintObj.color).val(hintObj.text);
			}
		});
		
		$input.val = function (value) {
			if (value) {
				return $.fn.val.apply($input, value);				
			}
			else {
				return $.fn.val.apply($input) == $input.data("hintText") 
					&& $input.css("color") == $input.data("hintColor") ? "" : $.fn.val.apply($input);
			}
		}
		
		return $input;
	};
	
	$.fn.hint = function (hintObj, delay) {
		var $div = this.data(hintObj);
		var defaultDelay = delay || 2000;
		
		$div.visible = false;
		
		$div.show = function (key) {
			if (key) {
				var text = $div.data(key) ? $div.data(key) : key;
				$.fn.show.apply($div.text(text));
				$div.visible = true;
				setTimeout(function () {$div.fadeOut('fast')}, defaultDelay);
			}
			else {
				$div.visible = true;
				$.fn.show.apply($div);
			}
		}
		
		$div.hide = function () {
			$div.fadeOut('fast');
			$div.visible = false;
		}
		return $div;
	};
})(jQuery);