var ProductInfoContainerTransition = new Class({
	initialize: function(infoImage, infoText) {
		var container;
		var showed = false;
		
		// get or add info container
		container = $('infoContainer');
		if(!$chk(container)) {
			container = new Element('div', {'id': 'infoContainer', 'styles': {
				'position': 'absolute',
				'top': '0',
				'left': '0',
				'visibility': 'hidden',
				'width': '220px',
				'border': '1px solid #eaeaea',
				'background-color': '#ffffff',
				'padding': '2px'
			}}).inject(document.body);
			container.setHTML(infoText);
		}
		
		// show info container
		function showInfoContainer(event){
			if (!showed) {
				new Fx.Style('infoContainer', 'opacity').start(0,1);
				container.setStyles({
					top: event.client.y,
					left: event.client.x
				});
				showed = true;
			}
		};
		
		// hide info container
		function hideInfoContainer(event){
			if (showed) {
				new Fx.Style('infoContainer', 'opacity').start(1,0);
				showed = false;
			}
		};
		
		// add events
		infoImage.addEvent('mouseover', showInfoContainer.bindWithEvent(infoImage));
		container.addEvent('mouseout', hideInfoContainer.bindWithEvent(container));
	}
});