function ToggleableTips () {
/*
- makes plan description toggle-able with slide effects
- works with this html structure (allows multiple instances)
	<div class="toggleable open"><!--- className "open" (or "close") is optional, used as initial open/close state when this.initialState eq 'auto' --->
		<a href="#" class="open">Open Text</a>
		<a href="#" class="close">Close Text</a>
		<div class="display">plan description text...</div>
	</div>
	- where class name "toggleable", "open", "close" & "display" is defined as property in this just class
	- the a.open and a.close tags are the toggle control
	- the div.display contains html for toggle display
	- "collapse" and "expand" icons are automatically appended into the open and close <a> tags.  See this.iconOpen and this.iconClose below.

- remember to start() on page ready:
	var objToggleableTips = new ToggleableTips();
	$(document).ready(objToggleableTips.start);

*/

	var me = this;
	this.clsToggleable = '.toggleable';
	this.clsOpen = '.open';
	this.clsClose = '.close';
	this.clsDisplay = '.display';
	this.initialState = 'auto'; // ['open'|'close'|'auto'] for 'auto, read the state from the class name "open" or "close" of the dom.toggleable object
	this.slideSpeed = 'normal';
	this.iconOpen = '<img src="/images/icon-expand.gif" class="toggleable-tips-handle">';
	this.iconClose = '<img src="/images/icon-collapse.gif" class="toggleable-tips-handle">';

	this.start = function() {
		// get all div.toggleable
		$(me.clsToggleable).each(function(ii) {
			// patch onclick function to immediate <a> children
			$(this).find(me.clsOpen+','+me.clsClose).click(function(event) {
				event.preventDefault();
				var parent = $(this).parents(me.clsToggleable);
				parent.find(me.clsDisplay).slideToggle(me.slideSpeed);
				parent.find(me.clsOpen).toggle();
				parent.find(me.clsClose).toggle();
			});
			
			// insert icon into <a>
			$(this).find(me.clsOpen).append(me.iconOpen);
			$(this).find(me.clsClose).append(me.iconClose);

			var displayState = 'close';
			if (me.initialState == 'auto') {
				if ($(this).hasClass('open')) {
					displayState = 'open';
				} else if ($(this).hasClass('close')) {
					displayState = 'close';
				}
			} else {
				displayState = me.initialState;
			}
			
			// set display initial state
			switch (displayState) {
				case 'open':
					$(this).find(me.clsDisplay).show();
					$(this).find(me.clsOpen).hide();
					$(this).find(me.clsClose).show();
				break;
				case 'close':
					$(this).find(me.clsDisplay).hide();
					$(this).find(me.clsOpen).show();
					$(this).find(me.clsClose).hide();
				break;
			}
		});
	}

}