var jvSlide = {	

	extend: $extend,
	
	preset: {
		selector	: 'jvslide',
		delay		: 3000,
		duration	: 500,
		trans		: Fx.Transitions.linear,
		event		: 'mouseover',
		handler		: 'create',
		effects		: {
			'opacity'	: ['0.9', '1']
		
		},
		styleintro	: {
			'bottom'	: ['200%', '0'],
			'color'		: '#d5d5f3'			
		},
		autoplay	: true,
		begin		: 0,
		itemstyle	: true,
		usetext		: true
		
	},
	
	initialize: function(opt)
	{			
		if (this.options) return this;
		this.preset = $merge(this.preset, opt)
		this.setOptions(this.preset);
		
		if (!this.options.selector) return this;
		
		this.els	= $ES('.item', this.options.selector);
		
		if(!this.els.length) return this;
		
		this.slide = $E('.show-item', this.options.selector)
		
		if(!this.slide){
			this['createSlide'].call(this);
		}
		
		this['setEvent'].call(this);
		
		this.cur	= this.options.begin;
		
		this.styleItem();
		
		this['build'][this.options.handler].call(this, {el: this.els[this.options.begin]});
		
		if(this.options.autoplay){
			$clear(this.timer);			
			this.timer = this.auto.periodical(this.options.delay, this);
			
		}
		
		return this;
	},
	
	createSlide: function(){
		this.slide	= new Element('div', {
			'class'		: 'show-item',
			'styles'	: {
				'height'	: 100,
				'width'		: 100
			}
		});
		
		$$(this.options.selector).each(function(el){
			el.adopt(this.slide);
		}, this);
	},
	
	auto: function(){		
	
		this.cur++;
		
		if(this.cur == this.els.length){			
				this.cur = 0;
		}
		
		
		this['build'][this.options.handler].call(this, {el: this.els[this.cur]});
		
		this.styleItem();
		
		
		
	},
	
	styleItem: function(index){
		if(this.options.itemstyle){
		
			if(index >= 0){				
				this.els[index].setStyle('opacity', '1');
			}
			
			if(this.cur)
			{
				this.els[(this.cur-1)].setStyle('opacity', '1');
				
			}else{
				this.els[(this.els.length-1)].setStyle('opacity', '1');
			}
			
			this.els[this.cur].setStyle('opacity', '0.9');	
		}
	},
	
	setEvent	: function(){
		this.els.each(function(el, i){
			el.addEvent(this.options.event, function(e){
			
				$clear(this.timer);
				
				this.pause  = 1;
				
				var ev = new Event(e);
				
				var j		= this.cur;
				
				this.cur	= i;
				
				this.styleItem(j);
				
				this['build'][this.options.handler].call(this, {el: el});
				
				ev.stop();
				
			}.bind(this));
			
		}, this);
	},
	
	applySlide: function(content, introtext){	
		if(this.wating) return this;
		
		this.wating 	= 1;
		
		this.slide.empty().adopt(content, introtext);
				
		this.fx.start(this.options.effects);	
		
		this.fx2.start(this.options.styleintro);	
		
		this.fx.addEvent('onComplete', function(){
			this.wating = 0;
			if(this.pause)
			{
				this.timer = this.auto.periodical(this.options.delay, this);
				this.pause = 0;
			}
		}.bind(this));
	},
	
	build: {
	
		create: function(el){		
		
			this.image = new Image();
			
			var title = new Element('h4').setHTML("<a href=" + el.el.getProperty('rel') + ">" + el.el.getProperty('name') + "</a>");
			
			this.introtext = new Element('div', {
				'class' 	: 'introtext',
				'styles'	: {
					'display'	: 'block',
					'overflow'	: 'hidden',					
					'position'	: 'absolute'
				}
			}).empty().adopt(title).appendText(el.el.getProperty('alt'));
		
		
			var events = {
				loaded: function() {
					
					if (window.webkit419) 
						this.image = new Element('img', {'src': this.image.src});
					else $(this.image);
					
					var w	= parseInt( this.slide.getStyle('width'));
					var h	= parseInt(this.slide.getStyle('height'));
									
						
					for (var i = 0; i < 2; i++)
						if (this.image.width > w) {
							this.image.height *= w / this.image.width;
							this.image.width   = w;
						} else if (this.image.height > h) {
							this.image.width *= h / this.image.height;
							this.image.height = h;
						}
					
					this.image.setStyles({
						'width': w,
						'height': 'auto',
						'position': 'absolute'
					});  
					
					this.fx = new Fx.Styles(this.image, {
						duration: this.options.duration,				
						wait: true,
						fps: 30,
						transition: this.options.trans						
					});
					
					this.fx2 = new Fx.Styles(this.introtext, {
						duration: this.options.duration,				
						wait: true,
						fps: 30,
						transition: this.options.trans						
					});
					
					this.applySlide(this.image, this.options.usetext ? this.introtext : '');
					
					
				}.bind(this),
				failed: function(){
				}
			};
		
			(function() {
				this.src = el.el.getProperty('href');
			}).delay(30, this.image);
		
			this.image.onload = events.loaded;
			this.image.onerror = this.image.onabort = events.failed;
		},
		
		iframe: function(e){
		},
		
		clone: function(e){
			
		}
	}

};

jvSlide.extend(Events.prototype);
jvSlide.extend(Options.prototype);
//jvSlide.extend(Hash.prototype);