PackageNavigator = Class.create();

PackageNavigator.prototype = {

	over: function(e) {

		Event.stop(e);
		var current_parent = arguments[1];
		
		this.subpackages.invoke('addClassName', 'grayed');
		current_parent.subpackages.invoke('removeClassName', 'grayed');
		
		Event.stopObserving(current_parent, 'mouseover', current_parent.over_observer);

		current_parent.out_observer = this.out.bindAsEventListener(this, current_parent);
		Event.observe(current_parent, 'mouseout', current_parent.out_observer);
	},

	out: function(e) {

		Event.stop(e);
		var current_parent = arguments[1];
		
		this.subpackages.invoke('removeClassName', 'grayed');
		
		Event.stopObserving(current_parent, 'mouseout', current_parent.out_observer);

		current_parent.over_observer = this.over.bindAsEventListener(this, current_parent);
		Event.observe(current_parent, 'mouseover', current_parent.over_observer);
	},

	initialize: function(main_packages) {
		this.main_packages = main_packages;
		this.subpackages = document.getElementsByClassName('packSmall');
		this.main_packages.each(function(parent) {
			parent.subpackage_class = parent.id;
			parent.subpackages = document.getElementsByClassName(parent.subpackage_class);
			
			parent.over_observer = this.over.bindAsEventListener(this, parent);
			Event.observe(parent, 'mouseover', parent.over_observer);
		}.bind(this));
		
	}
}

function initPackageNavigators() {
	var main_packages = document.getElementsByClassName('packBig');
	if (main_packages) {
		var obj = new PackageNavigator(main_packages);
	}
}

Event.observe(window, 'load', initPackageNavigators, false);