carterTip = {
	showTip: function(element, content) {
		carterTip._closeTimer.stop();
		
		if (!carterTip._initialised) {
			carterTip._initialise();
			carterTip._initialised = true;
		}

		
		carterTip._setContent(content);
		carterTip._moveToElement(element);
		if ($('carter_tip_container').visible()) {
			$('carter_tip_container').show();
			$('carter_tip_point').show();
		} else {
			trackAnim('carter-tip', new Effect.Parallel([
				new Effect.Appear('carter_tip_container', {sync:true}),
				new Effect.Appear('carter_tip_point', {sync:true})
			], {duration:0.25}) );
		}
	},
	
	hideTip: function(event) {
		carterTip._closeTimer.start();
	},
	
	_hideTip: function(event) {
		trackAnim('carter-tip', new Effect.Parallel([
			new Effect.Fade('carter_tip_container', {sync:true}),
			new Effect.Fade('carter_tip_point', {sync:true})
		], {duration:0.25}) );
	},
	
	_closeTimer: {
		timer: false,
		start: function() {
			carterTip._closeTimer.stop();
			carterTip._closeTimer.timer = setTimeout(carterTip._hideTip, 500);
		},
		stop: function() {
			clearTimeout(carterTip._closeTimer.timer);
			carterTip._closeTimer.timer = false;
		}
	},
	
	_initialised: false,
	_initialise: function() {
		var box = document.createElement("div");
		box.id = 'carter_tip_container';
		box.className = 'carter_tip_container';
		box.style.display = 'none';
		document.body.appendChild(box);
		
		var content = document.createElement("div");
		content.id = 'carter_tip_content';
		box.appendChild(content);
		
		var point = document.createElement("div");
		point.id = 'carter_tip_point';
		point.className = 'carter_tip_point';
		document.body.appendChild(point);
		
		Event.observe('carter_tip_container', 'mouseover', function() {
			carterTip._closeTimer.stop();
		});
		Event.observe('carter_tip_container', 'mouseout', function(e) {
			carterTip.hideTip();
		});
	},
	
	_moveToElement: function(element) {
		var elementOffset = element.cumulativeOffset();
		var elementHeight = element.getHeight();
		var elementWidth = element.getWidth();

		var pointerOffsetY = elementOffset.top + elementHeight;
		var pointerOffsetX = elementOffset.left + (elementWidth / 2);
		
		$('carter_tip_point').setStyle({
			'left':pointerOffsetX + 'px',
			'top':pointerOffsetY + 'px'
		});

		$('carter_tip_container').setStyle({
			'left':(pointerOffsetX - 100)+'px',
			'top':(pointerOffsetY + 8)+'px'
		});
	},
	
	_setContent: function(content) {
		$('carter_tip_content').innerHTML = content;
	}
};