(function ($) {
	$.widget("ui.infobox", {
		options: {
			title: "Information",
			className: "",
			expanded: false
		},

		_create: function () {
			var self = this;
			var options = this.options;

			var html = [];
			html.push("<div class='info-box'>");
			html.push("<a class='info-box-title' href='javascript:;'>");
			html.push("<span class='info-box-title-text'></span>");
			html.push(" ");
			html.push("<span class='info-box-title-click'></span>");
			html.push("</a>");
			html.push("<div class='info-box-body'></div>");
			html.push("</div>");

			var $container = $(html.join(''));
			var $title = $container.find(".info-box-title");
			var $text = $title.find(".info-box-title-text");
			var $click = $title.find(".info-box-title-click");
			var $body = $container.find(".info-box-body");

			$title.click(function () { toggle(!options.expanded); });
			$text.html(options.title);
			$container.addClass(options.className);

			this.element.before($container);
			$body.append(this.element);

			if (!options.expanded) $body.hide();
			toggle(options.expanded);

			function toggle(expand) {
				var func = function () {
					$click.html(expand ? "(click to hide)" : "(click for more info)");
					options.expanded = expand;
				}

				if (expand) $body.slideDown(150, func);
				else $body.slideUp(150, func);
			}
		}
	});
})(jQuery);