var NavSprites = Behavior.create({
	initialize: function(parent, selectedPrefix, hoverSpeed, style) {
		element = this.element;
		this.parent = parent;
		this.selectedPrefix = selectedPrefix;
		this.hoverSpeed = hoverSpeed/1000;
		this.style = style;

		// throw the parent object's class into a variable
		var parentClass = element.readAttribute("class");

		// start a loop that cycles through each of the li elements inside the parent element
		element.childElements("li").each(function(subElement) {
			// create a few variables that we'll need during this function:
			// myClass = the class of the object we're currently inspecting
			// current = what the selected class should look like for the parent of the object we're currently inspecting
			var myClass = subElement.readAttribute("class");
			var current = parent + " " + selectedPrefix + myClass;

			// let's hide the CSS-defined background image, but only if this isn't the currently-selected item
			if (parentClass != current) {
				subElement.childElements("a").each(function(subSubElement){
					subSubElement.setStyle({backgroundImage:"none"});
				});
			}
		});
	},
	onmouseover: function(e) {
		var target = Event.element(e).up();
		var myClass = target.readAttribute("class");
		var parent = this.parent;
		var hoverSpeed = this.hoverSpeed;

		// create pseudo-link
		target.insert('<div id="ns" class="' + this.parent + '-' + myClass + ' " style="display:none"></div>');
		// either slide or fade, depending on the style value
		if (this.style == "slide") {
			// slide down the pseudo-link
			$$("div."+ this.parent + "-" + myClass).each(function(item){
				Effect.BlindDown(item, {duration: hoverSpeed});
			});
		} else {
			// fade in the pseudo-link
			$$("div."+ this.parent + "-" + myClass).each(function(item){
				Effect.Appear(item, {duration: hoverSpeed});
			});
		}
	},
	onmouseout: function(e) {
		var target = Event.element(e).up();
		var myClass = target.readAttribute("class");
		var parent = this.parent;
		var hoverSpeed = this.hoverSpeed;

		// either slide or fade, depending on the style value
		if (this.style == "slide") {
			// slide up & destroy pseudo-link
			$$("div."+ this.parent + "-" + myClass).each(function(item){
				Effect.BlindUp(item, {duration: hoverSpeed, afterFinish: function callback(obj) {item.remove();}});
			});
		} else {
			// fade out & destroy pseudo-link
			$$("div."+ this.parent + "-" + myClass).each(function(item){
				Effect.Fade(item, {duration: hoverSpeed, afterFinish: function callback(obj) {item.remove();}});
			});
		}
	},
	onmousedown: function(e) {
		var target = Event.element(e).up();
		var myClass = target.readAttribute("class");
		var parent = this.parent;

		$$("div."+ this.parent + "-" + myClass).each(function(item){
			item.writeAttribute("class", parent + "-" + myClass + "-click");
		});
	},
	onmouseup: function(e) {
		var target = Event.element(e).up();
		var myClass = target.readAttribute("class");
		var parent = this.parent;

		$$("div."+ this.parent + "-" + myClass + "-click").each(function(item){
			item.writeAttribute("class", parent + "-" + myClass);
		});
	}
});

// Edit Below

Event.addBehavior({
		'.nav': NavSprites('nav', 'current-', 150, 'slide')
	 });