var myDropDownMenu = Class.create({

	// Properties
	delayBeforeShowingUp: 0.5,
	showingUpDuration: 0.3,
	hidingDuration: 0.1,
	hideDelay: 0,
	
	/// Rollover class
	id: "nav2",
	submenu_prefix: "submenu_",
	images: [],
	my_images: [],
	/// --
		
	initialize: function(){
		$$("a.menu_imgs").invoke('observe', 'mousemove', this.linkMouseOver.bind(this));
		$$("a.menu_imgs").invoke('observe', 'mouseout', this.linkMouseOut.bind(this));

		$$("div.submenu_div").invoke('observe', 'mouseenter', this.submenuMouseOver.bind(this));
		$$("div.submenu_div").invoke('observe', 'mouseleave', this.submenuMouseOut.bind(this));
		/// Rollover class
		this.setOptions();
		this.observeLinks();
		/// --
	},
	
	/// Rollover class
	setOptions: function() {
		this.options = {
		  rolloverSuffix: 'hover',
		  selectedSuffix: 'sel',
		  suffixSeperator: '_'
		};
	},
	 
	observeLinks: function() {

		this.links = $$('#' + this.id + ' a');
		for (i=0; i<this.links.length; i++) {
		  this.links[i].observe('mouseenter', this.rolloverImage);
		  this.links[i].observe('mouseout', this.rollbackImage);
		}
		
		var images1 = $$('#' + this.id + ' img');
		var images = [];
		for (j=0; j<images1.length; j++) {
		  if (images1[j].id == undefined || images1[j].id == "") continue; // skip elements with no id
		  images.push(images1[j]);
		}

		for (i=0; i<images.length; i++) {
		 
		  imageId = images[i].id;

		  if (!imageId) {
			imageId  = this.id + i;
			images[i].id = imageId;
		  }
		  $('printer').innerHTML += " i='"+i+"' imageId='"+imageId+"'";
		  this.my_images.push(imageId);
		  
	//	  $('printer').innerHTML += " Rollover="+this.parseRolloverImage(images[i]);
		  
		  images[imageId] = images[i].src;
		  
	       $(imageId).imageNormal = images[i].src;
	       $(imageId).imageRollover = this.parseRolloverImage(images[i]);
		
		  // preload rollover image
		  (new Image()).src = this.parseRolloverImage(images[i]);
		}
		 
	},

	rolloverImage: function(e) {
		image = Event.element(e);
	//	$('printer').innerHTML = "rolloverImage ";

		//corectif en cas de survol/puis/submenu/puis/retour au survol => eviter de REfaire Rollover sur un element deja hover
		var imgsrc = image.src;
		
		var d = imgsrc.lastIndexOf('.');
		var imgname = imgsrc.substring(imgsrc.lastIndexOf('/') + 1, d < 0 ? imgsrc.length : d);
		
		var last_chars5 = imgname.substring( imgname.length - 5 );
	
		$('printer').innerHTML = " [[last_chars5="+ last_chars5 +"]]";
		
		if (last_chars5 != "hover")  {
			$('printer').innerHTML += " => image.imageRollover = " + image.imageRollover;	

			if (image.imageRollover) {
			  image.src = image.imageRollover;
			}
			this.linkMouseOver(image);
		} else {
			$('printer').innerHTML += " (last_chars5 == SUFFIX) > " + last_chars5;	
		}
	},
	
	rollbackImage: function(e) {
		image = Event.element(e);
		if ( image.id[image.id.length-1] == "0")  image.src = image.imageNormal;
	},
	
	delayedRollbackImage: function(x) {
		
		var image2hide;
		$('printer').innerHTML += " delayedRollbackImage NOW " + x + " ((this.my_images.length="+this.my_images.length;
		//finds back the image to hide from returned x and Array my_images 
		for (i=0; i<this.my_images.length; i++) {
			$('printer').innerHTML += " ("+this.getLastChar(this.my_images[i])+")("+x+") / ";
			if ( this.getLastChar(this.my_images[i]) == x ) 
			{
				image2hide = $(this.my_images[i]);
				break;
			}
		}

		if (image2hide.imageNormal) {
		  image2hide.src = image2hide.imageNormal;
		  
		  var submenu = $( this.submenu_prefix + x );
	
	//	$('printer').innerHTML = "imageNormal .... (" + submenu.identify() + ") visible=" + submenu.visible() + " hasClassName=" + submenu.hasClassName('active');
	 
		  if (submenu && !submenu.visible()){
			Effect.Queues.get( submenu.identify() ).invoke('cancel'); //cancel kill queue on rollout before end of delay if visible
		  }
		}
		//linkMouseOut(img_to_hide);
	},
	
	parseRolloverImage: function(image) {
		ext = image.src.substr(image.src.lastIndexOf('.'));
		path = image.src.match(/(.*)\/(.*\.(png|gif|jpg))/)[1]
		filename = image.src.gsub(path, '')
		basename = this.parseBasename(filename);
		basename = this.parseBasename(basename, this.options.suffixSeperator + this.options.selectedSuffix);
		last_chars = basename.substr( basename.length - this.options.rolloverSuffix.length );
	//	$('printer').innerHTML += "parseRolloverImage basename (" + basename + ")  - ";
		// condition to avoir _hover_hover_hover.gif
		new_suffix = (last_chars != this.options.rolloverSuffix) ? this.options.suffixSeperator + this.options.rolloverSuffix : '';
		
		return path + basename + new_suffix + ext;
	},
	  
	parseBasename: function(name, seperator) {
		seperator = seperator || '.';
		found = name.lastIndexOf(seperator);
		if (found > 0) {
		  return name.substr(0, found);
		} else {
		  return name;
		}
	},
	/// end Rollover class -->


	// Mouse event handlers
	linkMouseOut: function(e){
	
		var el = e.element();
		if(!el) return;

	//	$('printer').innerHTML = "linkMouseOut id=" + el.id;
		
		var submenu = $( this.submenu_prefix + this.getLastChar(el.id) );
		if(!submenu){
			return;
		}
			
		if (submenu && submenu.hasClassName('active')){
			this.setDelayedHide(submenu);
		}

	},

	linkMouseOver: function(e){

		var el = e.element();
		if(!el) return;
		
		var submenu = $( this.submenu_prefix + this.getLastChar(el.id) );
		if(!submenu) return;
		
	//	$('printer').innerHTML = "linkMouseOver id=" + e.element().id + " submenu("+submenu.id+")---- classNames=" + e.element().classNames().inspect();
		
		if (!submenu.hasClassName('hidding')){
			submenu.removeClassName('waitingtohide');
		}
		if (!submenu.hasClassName('active')){
			submenu.addClassName('active');
			this.showUpEffect(submenu, this.showingUpDuration);
		}
	},
	
	// Default Effects
	// It's possible to set user's effects handlers
	// eg: myDropliciousInstance.showUpEffect = function(){ * user's effect * };
	showUpEffect: function(e, effectDuration){
		if(!e.visible()){
			$('printer').innerHTML = " e.identify()=" +e.identify();
		
			new Effect.BlindDown(e, {
				duration: effectDuration,
				delay: this.delayBeforeShowingUp,
				queue: {
					position: 'end',
					scope: e.identify(),
					limit: 2
				}
			});
		}
	},

	hidingEffect: function(e, effectDuration){
		new Effect.BlindUp(e, {
			duration: effectDuration,
			queue: {
				position: 'end',
				scope: e.identify(),
				limit: 2
			}
		});
	},

	submenuMouseOut: function(e){
	//	$('printer').innerHTML = "submenuMouseOut id=" + e.element().id;
		var el = e.element();
		if (el && el.hasClassName('active')){
			this.setDelayedHide(el);
		}
	},

	submenuMouseOver: function(e){
		var el = e.element();
	//	$('printer').innerHTML = "submenuMouseOver id=" + e.element().id + " (((((((((((((((((((((((((( classNames=" + e.element().classNames().inspect();
		if (el && !el.hasClassName('hidding')){
		//	$('printer').innerHTML += "\n removeClassName ( waitingtohide )";
			el.removeClassName('waitingtohide');
		}
	},

	// Delayed  methods, needed for smooth subMenu hiding
	setDelayedHide: function(e){
		e.addClassName('waitingtohide')
		if(!e.hasClassName('hidding')){
			if (!e.hasClassName('hiddingtimerset')){	
				e.addClassName('hiddingtimerset');
				(function(obj, e){ obj.delayedHide(e); }).delay(this.hideDelay, this, e);
			}
		}
	},

	delayedHide: function(e){
		e.removeClassName('hiddingtimerset');
		if (e.hasClassName('waitingtohide')){
			this.hidingEffect(e, this.hidingDuration);
			e.addClassName('hidding');
			var x = this.getLastChar(e.id);
			$('printer').innerHTML += "delayedRollbackImage go " + x;
			this.delayedRollbackImage(x);

			//Changed to Prototype's API manner
			(function(e){
				e.removeClassName('waitingtohide');
				e.removeClassName('hidding');
				e.removeClassName('active');
			}).delay(this.hidingDuration, e);
			
		}
	},

	getLastChar: function(str){
		return str[str.length-1];
	}
	
});

document.observe('dom:loaded', function() {
	new myDropDownMenu();
})