var hpProductToggler = Class.create();

hpProductToggler.prototype = {
	
	productHeader: [],
	
	initialize: function() {
		this.products = $A($("content").getElementsByClassName("products"));
		this.products.each (function(item, index){
			this.productHeader[index] = $A(item.getElementsByTagName("h3"));
		}.bind(this));
		
		
		this.productHeader.each (function(item, index){
			item.each(function(item2, index2){
				Event.observe(item2, 'mouseover', function(){
					this.toggleProduct(index, item2);
				}.bind(this));
			}.bind(this));
		}.bind(this));
		
	},
	
	toggleProduct: function(index, header) {
		this.productActive = header.parentNode;
		this.product = $A(this.products[index].getElementsByClassName("product"));
		
		this.product.each (function(item, index){
			item.className = item.className.replace(' active', '')
		});
		this.productActive.className += ' active';
	}
}

Event.observe(window, 'load', function(){
	WhpProductToggler = new hpProductToggler();
});