navFloat = {

	navDefault : 0,
	anim : null,

	init : function() {
	
        // only floating layouts
        
	        if ($('stage').getStyle('width') < 750) {
	            return;
	        }
	
		// settings/defaults
	
			navFloat.timeOut = false;
			var navChildren = $('nav1').getChildren('a');
			var counter = 1;
		
		// add the html of the nav float to the page
		
			var myFloatTrack = new Element('div', {
				'id' : 'nav_track'
			});
			var myFloatShuttle = new Element('div', {
				'id' : 'nav_shuttle'
			});
			myFloatShuttle.inject(myFloatTrack);
			myFloatTrack.inject($('nav1'),'after');
		
		// set up the fx for the slide
		
			if (!Modernizr.csstransitions) {
				this.anim = new Fx.Morph($('nav_shuttle'),{
					'duration' : 800
				});
			}
		
		// set up the default nav position
		
			var thisKey = counter;
			$each(navChildren, function(el) {
				if (el.hasClass('active')) {
					navFloat.navDefault = counter;
					$('nav_shuttle').className = ('nav_shuttle' + counter);
				}
				counter++;
			})
			
		// fade up the track
		
			setTimeout(function() {				
				if (Modernizr.csstransitions) {
					$('nav_track').addClass('ready');
				} else {
					new Fx.Morph($('nav_track'),{
						'duration' : 500
					}).start({
						'opacity':1,
						'height':88
					});
				}
			},1000);
		
		// set up events
		
			var counter = 1;
			$each(navChildren, function(el) {
				var thisKey = counter;
				// set up events
				el.addEvents({
					'mouseout':
					function() {
						navFloat.timeOut = setTimeout(function() {
							navFloat.floatTo(navFloat.navDefault);
						},300)
					},
					'mouseover':
					(function() {
					
						// only floating layouts
				        if ($('stage').getStyle('width') < 750) {
				            return;
				        }
				        
						clearTimeout(navFloat.timeOut);
						navFloat.floatTo(thisKey);
					})
				});
				counter++;
			})
	},
	
	floatTo : function(key) {
	
		if (Modernizr.csstransitions) {
		
			$('nav_shuttle').className = ('nav_shuttle' + key);
			
		} else {
		
			var newLeft = (key-1) * 98;
			this.anim.cancel();
			this.anim.start({
				'left': newLeft
			})
			
		}
	
	}

}
window.addEvent('domready', function() {
	navFloat.init();
})
