/* FX.Slide */
/* toggle window for the login section */
/* Works with mootools-release-1.2 */
/* more info at http://demos.mootools.net/Fx.Slide */

//var myTimer;

window.addEvent('domready', function(){
	
	//show_tips(".thisisatooltip");
	var menuText = $('menuText'), menuReflect = $('menuReflect');
	menuText.set('morph', {duration: 'long', transition: 'back:out'});
	//$('menubuttons').getElement('img').set('morph', {duration: '100'});
	menuText.fade('out');
	menuReflect.fade('out');
	if($('loginopen') != undefined){
		$('login').setStyle('height','auto');
		var mySlide = new Fx.Slide('login').hide();  //starts the panel in closed state  
		$('loginopen').addEvent('click', function(e){
			e = new Event(e);
			mySlide.toggle();
			e.stop();
			if(mySlide.open){$('top').fade('in');}
			else{$('top').fade('out');}

		});
	
		$('closeLogin').addEvent('click', function(e){
			e = new Event(e);
			mySlide.slideOut();
			e.stop();
			$('top').fade('in');
		});
	}
	$('menuContainer').getElements('div').each(function(item){
		//var myEffect = new Fx.Morph(item, {duration: 'long', transition: Fx.Transitions.Sine.easeOut})
//		item.get('morph', { duration: 500, transition: 'bounce:out' });
		item.setStyle('opacity', '.5');
		//item.getElement('img').reflect();
		//item.getElement('img').fade('in');
		//item.setStyle('position', 'block');
		
		item.addEvent('mouseenter', function(){
//			item.highlight('#ddf', '#ccc');
			//item.;
		//	var tag = item.get('title'); //Returns "div".
		//	$('menuText').set('text', tag);
		//	$('menuText').fade('in');
			//Fades "myElement" out.
		//	item.setStyle('marginTop', '30');
			//item.setStyle('position', 'fixed');
			menuReflect.fade('hide');
			item.fade('in');
//			setTimeout('alert(\'hello\')',1250);mouseEnter.delay(500, item.getElement('img'));
			item.morph({
				top: 20,
			});
			//$('menuText').set('text', 'a');
			var tag = item.get('buttontext');
			menuText.set('text', tag);
			
			var tagPos =  parseInt(item.getStyle('left'));
			var intWidth = parseInt(menuText.getStyle('width'));
			
			//if(48 >= intWidth){
			intWidth = (48-intWidth)/2;
			menuReflect.setStyle('left', tagPos);
			menuText.set('text', tag);
			
			menuText.morph({
				left: tagPos + intWidth,
			});
			item.getElement('img').reflect();
			//}else{
			//	intWidth = (intWidth - 48)/2;
			//	menuText.setStyle('left', (tagPos - intWidth));
			//	menuText.set('text', tag);
			//}
			
			
			menuText.fade('in');
			menuReflect.fade('in');
			
			
			//$('myElement').fade(0.7); //Fades "myElement" to 70% opacity.
			//myEffect.start({
//    'height': [10, 100], //Morphs the 'height' style from 10px to 100px.
  //  'width': [900, 300]  //Morphs the 'width' style from 900px to 300px.
	//});


		});
		item.addEvent('mouseleave', function(){
//			item.highlight('#ddf', '#ccc');
			item.fade(.5);
//			item.morph({
//				marginTop: 0,
//			});
//			item.fade('in');
			item.morph({
				top: 15,
			});
		//	item.getElement('img').unreflect();
			//$('menuText').set('text', '');
			menuText.fade('out');
			menuReflect.fade('out');
			//$('menuReflect').fade('out');
			item.getElement('img').unreflect();
		//	item.setStyle('marginTop', '0');
			//item.tween('margin', 0);
//			item.morph({
//				marginTop: 0,
//				color: '#FFF',
//				height: 48,
//			});
		});
	});
});

function show_tips(tip_class)
{
	if($$(tip_class).length > 0)
	{
		$$('a.' + tip_class).each(function(element,index) {  
         var content = element.get('title').split('::');  
         element.store('tip:title', content[0]); 
		 if(content[1] === undefined){content[1] = '';}
		element.store('tip:text', content[1]);
     });  
       
     //create the tooltips  
     var tipz = new Tips(tip_class,{
		className: 'thisisatooltipstyle',
         fixed: true,  
         hideDelay: 50,  
         showDelay: 50 ,
		 offset: {'x': 100, 'y': 16}
     }); 
  }
}