Slide = new Class({
	config: {
		"className": 'slide',
		"titleDelay": 500,
		"slideDelay": 5000,
		"animationLength": 2500,
		"displayText": false,
		"displayTitle": false,
		"displayNavigation": false,
		"theme": 'laySlide00x1',
		"size": {
			"width": 'inherit',
			"height": 'inherit'
		},
		"imgPlugIn": ''
	},
	
	initialize: function(cfg){
		for(var item in cfg){ // set configuration
			this.config[item] = cfg[item];
		}
		$$('.'+this.config.className).forEach(function(o){
			if(o.getElements('li').length > 1)
				this.DOMinit(o);		
		},this);
	},
	
	objs: [],
	
	DOMinit: function(obj){
		var main = new Element('div',{ // main layer
			'class': this.config.theme,
			'events': {
				'click': function(event){
					if(event) event.stop();
					if(this.url)
						location.href = this.url;
				}
			}	
		});
		if(this.config.size.width != 'inherit') main.setStyle('width',this.config.size.width);
		if(this.config.size.height != 'inherit') main.setStyle('height',this.config.size.height);
		var menu = new Element('div',{ // menu layer
			'class': 'nav',
			'html': '<div class="desc"></div>'
		});
		if(!this.config.displayNavigation) menu.setStyle('display','none');
		main.wraps(obj,'top');
		menu.inject(main,'top');
		if(this.config.displayText){
			var text = new Element('div',{ // text layer
				'class': 'text'
			});
			text.setStyle('opacity',0.8);
			text.inject(main);
			this.resize();
			textresize = this;
			this.objs[this.objs.length] = main;
			window.addEvent('resize',function(){
				textresize.resize();
			});
		}
		
		obj.getElements('li').each(function(o,i){
			link = new Element('a',{ // creating link to the navigation
				'events': {
			        'click': function(event){
			            if(event) event.stop();
			            if(!this.hasClass('active'))
		            		this.info.slide.load(this.info.main,this.info.id,true);
			        },
			        'mouseover': function(){
			        	if(this.info.slide.config.displayTitle){
				        	func = function(){
				        		a = this.info.main.getElement('.desc');
				        		a.set('text',this.info.title);
				        		a.setStyle('display', 'block');
				        	}
				            this.info.main.timer1 = func.delay(this.info.slide.config.titleDelay, this);
			        	}
			        },
			        'mouseout': function(){
			        	$clear(this.info.main.timer1);
			        	this.info.main.getElement('.desc').setStyle('display','none');
			        }
			    }
			});
			link.info = {
				"slide": this,
				"id": i,
				"main": main,
				"title": ((o.getElement('h3'))?o.getElement('h3').get('text'):'')
			};
			link.inject(menu,'top');
			img = new Element('img',{ // creating image
				'src': this.config.imgPlugIn+o.getElement('img').get('src'),
				'alt': '',
				'class': 'img'
			});
			img.info = {
				"slide": this,
				"id": i,
				"main": main,
				"title": ((o.getElement('h3'))?o.getElement('h3').get('html'):''),
				"desc": ((o.getElement('span'))?o.getElement('span').get('html'):''),
				"url": o.getElement('a').get('href')
			};
			if(i == 0) img.addClass('top');
			if(this.config.size.width != 'inherit') img.setStyle('width',this.config.size.width);
			if(this.config.size.height != 'inherit') img.setStyle('height',this.config.size.height);
			main.adopt(img);
			obj.dispose();
			img.fx = new Fx.Tween(img,{
				'duration': this.config.animationLength,
				'link': 'cancel',
				'transition': Fx.Transitions.Quad.easeIn,
				'onComplete': function(el){
					el.info.slide.animation = false;
					el.info.slide.show(el.info.main);
				}
			});
		},this);
		
		this.load(main,0,false);
	},
	
	resize: function(){
		this.objs.each(function(obj){
			size = obj.getSize();
			position = obj.getPosition();
			t = obj.getElement('.text');
			position.y = position.y + size.y - t.getSize().y;
			t.setStyle('width', size.x-(t.getStyle('padding-left').toInt()+t.getStyle('padding-right').toInt()));
			t.setPosition(position);
		});	
	},
	
	loading: function(obj,mode){
		if(mode == true){
			func = function(){
				this.addClass('loading');
			}
			obj.timer2 = func.delay(1,obj);
			obj.url = '';
		} else {
			$clear(obj.timer2);
			obj.removeClass('loading');
		}
	},
	
	animation: false,
	
	load: function(obj,id,animation){
		$clear(obj.timer3);
		if(this.animation) return false;
		this.loading(obj,true);
		this.animation = true;
		
		img = new Image();
		img.onload = function(){
			this.img.info.slide.loading(this.img.info.main,false);
			this.img.info.slide.play(this.img,this.img.info.main,this.img.info.id,this.img.info.animation);	
		};
		
		var newNext,newPrev;
		obj.getElements('.img').each(function(o,i){
			o.removeClass('last');
			if(o.hasClass('top')){ // lat on the top
				newPrev = o;
				o.removeClass('top');
				o.addClass('last');
			}
			if(o.info.id == id){ // the new one
				newNext = o;
				img.img = o;
				img.img.info.animation = animation;
				img.src = o.src;
				if(animation)
					o.setStyle('opacity',0);
			}
		},this);
		
		if(newPrev != newNext){
			newNext = newNext.dispose();
			newNext.inject(newNext.info.main,'bottom');
		}
			
		newNext.addClass('top');
		if(newPrev != newNext)
		{
			newPrev.setStyle('margin-bottom',-newPrev.getSize().y);
		}
	},
	
	play: function(img,obj,id,animation){
		//animation = false;
		obj.url = img.info.url;
		obj.getElements('.nav a').each(function(o,i){
			o.removeClass('active');
			if(o.info.id == id)
				o.addClass('active');
		},this);
		if(this.config.displayText){
			obj.getElement('.text').set('html',img.info.desc);
			this.resize();
		}
		if(!animation){
			img.setStyle('opacity',1);
			this.animation = false;
			this.show(obj);
		} else {
			img.fx.start('opacity',0,1);
		}
	},
	
	show: function(obj){
		if(obj.getElement('.top'))
			id = obj.getElement('.top').info.id;
		else 
			id = 0;
		if(id == undefined) id = 0;
		id++;
		if(id >= $$('.img').length) id = 0;		
		
		obj.info = {
			'slide': this,
			'id': id	
		};
		func = function(){
			obj.info.slide.load(obj,obj.info.id,true);
		}	
		obj.timer3 = func.delay(this.config.slideDelay,obj);
	}
	
});