window.addEvent('domready', function () {
	if ($('intro-gallery')) {
	    var slides = $$('#intro-gallery li');
	    slides.set('opacity', 0);
	    $$('#intro-gallery li a .description').set('opacity',0);
	    var lastIndex = 0;
	    var noob = new noobSlide({
		    box: $('intro-gallery'),
		    size: 240,
		    interval: 5000,
		    autoPlay: true,
		    items: slides,
		    addButtons: {
			previous: $('prev'),
			next: $('next')
		    },

		    onWalk: function(currentItem) {
			var id = this.currentIndex;
			if ((slides.length - 3) == id) {
			    this.walk(0);
			    return false;
			}
			if ((slides.length - 1) == id) {
			    this.walk(slides.length - 4);
			    return false;
			}
			if (lastIndex <= this.currentIndex) {
			    if ( this.currentIndex > 0 ) slides[this.currentIndex - 1 ].tween('opacity',0);
			    (function () {
				slides.set('opacity', 0);
				slides[id].set('opacity', 1);
				if (slides[id + 1]) {
				    slides[id + 1].set('opacity', 1);
				    slides[id + 2].set('opacity', 1);
				    slides[id + 3].tween('opacity',1);
				}
			    }).delay(500);
			} else {
			    slides[id + 4].tween('opacity',0);
			    (function () {
				slides.set('opacity', 0);
				slides[id + 3].set('opacity', 1);
				slides[id + 2].set('opacity', 1);
				slides[id + 1].set('opacity', 1);
				slides[id].tween('opacity',1);
			    }).delay(500);
			}
			lastIndex = this.currentIndex;
		    }
		});
	    $('intro-gallery-mask').addEvent('mouseenter', function () {
		    noob.stop();
		});
	    $('intro-gallery-mask').addEvent('mouseleave', function () {
		    noob.play(5000,'next',true);
		});
	    $$('#intro-gallery li a').each(function(item) {
		    var myFx = new Fx.Morph(item, {duration: 200});
		    var myFx2 = new Fx.Morph($(item.getElement('span')), {duration: 200});
		    item.addEvent('mouseenter', function() {
			    myFx.cancel();
			    myFx2.cancel();
			    myFx.start({
				    'padding': 12,
					'top': -32,
					'left': -23,
					'z-index': 110,
					'width': 262,
					'height': 380
					});
			    myFx2.start({'opacity':1});
			    item.setStyle('z-index', 200);
			    item.getParent().setStyle('z-index', 200);
			});
		    item.addEvent('mouseleave', function() {
			    myFx.cancel();
			    myFx2.cancel();
			    myFx.start({
				    'width': 234,
					'height': 339,
					'top': 0,
					'left': 3,
					'padding': 0,
					'z-index': 100
					});
			    myFx2.start({'opacity':0});
			    item.setStyle('z-index', 100);
			    item.getParent().setStyle('z-index', 100);
			});
		});
	}
    });