window.addEvent('domready', function() {
	$('news').addEvent('mouseenter', function(e) {
		$('news').set('tween', {
				duration: 200,
				transition: Fx.Transitions.linear 
			}).tween('height', '32px');
		e.stop();
	});
	$('news').addEvent('mouseleave', function(e) {
		$('news').set('tween', {
				duration: 100,
				transition: Fx.Transitions.Quad.easeInOut 
			}).tween('height', '30px');
		e.stop();
	});
	$('light').addEvent('mouseenter', function(e) {
		$('light').set('tween', {
				duration: 200,
				transition: Fx.Transitions.Quad.easeInOut 
			}).tween('height', '85px');
		e.stop();
	});
	$('light').addEvent('mouseleave', function(e) {
		$('light').set('tween', {
				duration: 100,
				transition: Fx.Transitions.Quad.easeInOut 
			}).tween('height', '30px');
		e.stop();
	});

	$('obj').addEvent('mouseenter', function(e) {
		$('obj').set('tween', {
				duration: 200,
				transition: Fx.Transitions.Quad.easeInOut 
			}).tween('height', '115px');
		e.stop();
	});
	$('obj').addEvent('mouseleave', function(e) {
		$('obj').set('tween', {
				duration: 100,
				transition: Fx.Transitions.Quad.easeInOut 
			}).tween('height', '30px');
		e.stop();
	});
	
	$('inst').addEvent('mouseenter', function(e) {
		$('inst').set('tween', {
				duration: 200,
				transition: Fx.Transitions.Quad.easeInOut 
			}).tween('height', '100px');
		e.stop();
	});
	$('inst').addEvent('mouseleave', function(e) {
		$('inst').set('tween', {
				duration: 100,
				transition: Fx.Transitions.Quad.easeInOut 
			}).tween('height', '30px');
		e.stop();
	});
	
	$('abt').addEvent('mouseenter', function(e) {
		$('abt').set('tween', {
				duration: 200,
				transition: Fx.Transitions.Quad.easeInOut 
			}).tween('height', '100px');
		e.stop();
	});
	$('abt').addEvent('mouseleave', function(e) {
		$('abt').set('tween', {
				duration: 100,
				transition: Fx.Transitions.Quad.easeInOut 
			}).tween('height', '30px');
		e.stop();
	});
});



/*  
JAVASCRIPT IMAGE GALLERY W/ mootools
Description: A easy, non destructive javascript image gala.
Version: 1.1
Author: Devin Ross
Author URI: http://tutorialdog.com
*/

/*
Release notes:
	1.1 - Adds loading animation, and properly fades in images when fully loaded
	1.1.1 - Fixes displaying description, Fades out current image, Works with Mootools 1.2
*/


window.addEvent('domready', function() {
		
		
		// CHANGE THIS !!
		var slides = 2;													   // NUMBER OF SLIDES IN SLIDESHOW, CHANGE ACCORDINGLY
		
		var pos = 0;
		var offset = 462;												 // HOW MUCH TO SLIDE WITH EACH CLICK
		var currentslide = 1;											// CURRENT SLIDE IS THE FIRST SLIDE
		var inspector = $('fullimg');								   // WHERE THE LARGE IMAGES WILL BE PLACE	
		var fx = new Fx.Morph(inspector, {duration: 120, transition: Fx.Transitions.Cubic.easeInOut});
 		var fx2 = new Fx.Morph(inspector, {duration: 120, transition: Fx.Transitions.Cubic.easeInOut});

				
		/* WHEN AN ITEM IS CLICKED, IT INSERTS THE IMAGE INTO THE FULL VIEW DIV */
		$$('.item').each(function(item){ 
			item.addEvent('click', function(e) { 
				e = new Event(e).stop();
				fx2.start({ 
					'opacity' : 0													
				}).chain(function(){
				
					inspector.empty();						// Empty Stage
					var loadimg = 'images/ajax-loader.gif';	   // Reference to load gif
					var load = new Element('img', { 'src': loadimg, 'class': 'loading' }).inject(inspector); 
					fx2.start({ 'opacity' : 1 });
					var largeImage = new Element('img', { 'src': item.href }); // create large image
					
					/* When the large image is loaded, fade out, fade in with new image */
					largeImage.onload = function(){ 
						fx.start({ 
							'opacity' : 0													
						}).chain(function(){
							inspector.empty();	           							// empty stage
							var description = item.getElement('span'); 			   // see if there is a description
							
							if(description)					   
								var des = new Element('p').set('text', description.get('text')).inject(inspector);
									
							largeImage.inject(inspector); // insert new image
							fx.start({'opacity': 1});	 // then bring opacity of elements back to visible				
						});
					};
					
				});
			});
		});

		// INSERT THE INITAL IMAGE - LIKE ABOVE
		inspector.empty();
		var description = $('first').getElement('span');
		if(description) var desc = new Element('p').setHTML(description.get('html')).inject(inspector);
		var largeImage = new Element('img', {'src': $('first').href}).inject(inspector);
	
});