/*www.webcore.ro*/

var wbcSlider = new Class({
            Implements: [Options, Events],
            options: {
				slItems:null,
				startIndex:0,
				nextbtn:$('slider-go_right'),
				prevbtn:$('slider-go_left'),
				controls:$('slider-controls'),
				SlideTime:5000
            },
            initialize: function(el,options){
			el.setStyles({'position':'relative','overflow':'hidden'});
			this.setOptions(options);
			
			this.options.slItems.each(function(slider,index) {
				
				slider.setStyle('position', "absolute");
				var secControlls = slider.getElement('div.slider-secondary-controls');
				var SliderBigPicture = slider.getElement('div.pic-ct');
				
				var sliderH = el.getSize().y;
				var sliderW = el.getSize().x;
				(index!=this.options.startIndex)?slider.setStyle('left', (-1 * sliderW)):'';
				//alert(this.options.controls);
				if(this.options.controls!=null)
				{
					var li = new Element('li',
					{
						'id':'sl_'+index,
						'class': (this.options.startIndex==index)?'selected':''
						
					}).inject(this.options.controls.getElement('ul'));
					
					new Element('a',
					{
						
						'events': {
							'click':function(){
								this.slide(index);	
								if(this.options.intervalID)	{
									this.stop();
								}
														
							}.bind(this)
						}
					}).inject(li);
				}
				
				if(secControlls!=null) {
					secControlls.getElements('li').each(function(pict,index) {
						Asset.image(pict.getElement('img').src.replace('thumb_','slider_'));
						pict.addEvent('click',function() {	
							if(this.options.intervalID)	{
									this.stop();
								}					
							var newImgSrc = pict.getElement('img').src.replace('thumb_','slider_');
							var curentImg =SliderBigPicture.getElement('img').setStyles({'position':'absolute','z-index':1});
							var newImg =  new Element('img',{src:newImgSrc,styles:{'position':'absolute','z-index':0,'width':370,'height':370,'margin-left':'5px'}}).inject(SliderBigPicture);
							myEffect = new Fx.Morph(curentImg, {
								duration: 'long',
								transition: Fx.Transitions.Sine.easeOut,
								'link':'cancel'
							});							
							myEffect.start({
								'width':'570px',
								'height':'570px',
								'top':[0,-100],
								'left':[0,-100],
								'opacity':0
								}).chain(function(){ curentImg.destroy();});
							
							secControlls.getElements('li').each(function(li,index) {
								if(li!=pict) { li.removeClass('selected'); }
								else
								{
									li.addClass('selected');
								}
							})
							
						}.bind(this));	 
					}.bind(this))				 
				}
			
			
			}.bind(this)) ;  
			 this.options.curent = this.options.startIndex;
			 var nextbtn = this.options.nextbtn;
			 var prevbtn = this.options.prevbtn;
			 if(nextbtn!=null)nextbtn.addEvent('click',function() { this.next(); }.bind(this));
		     if(prevbtn!=null)prevbtn.addEvent('click',function() { this.prev(); }.bind(this));
			 
				
			},
			slide:function(slider) {
				
				var curentID = this.options.curent;
				var curentSlider =  this.options.slItems[curentID];
				var left = curentSlider.getSize().x;
				var newSlider	= this.options.slItems[slider];
				if(this.options.controls!=null)	{
					$('sl_'+curentID).removeClass('selected');
					$('sl_'+slider).addClass('selected');
				}
				var dont=false;
				if( slider==0 && curentID==(this.options.slItems.length-1))
				{
					var durIn = 1100;
					var durOut= 1100
					var goIn = [left,0];
					var goOut =[0,(-1*left)];
					
				}
				else if(curentID<slider) {
					var durIn = 1100;
					var durOut= 1100
					var goIn = [left,0];
					var goOut =[0,(-1*left)];
				}
				else if (curentID>slider)
				{
					var durIn = 1100;
					var durOut= 1100;
					var goIn = [(-1*left),0];
					var goOut =[0,left];
				}
				else
				{
					 dont= true;
				}
				
				this.options.slide_out = new Fx.Morph(curentSlider, {
				     duration: durOut, 
				     transition: 'cubic:out',
				     link: 'ignore'
				});
				this.options.slide_in = new Fx.Morph(newSlider, {
				     duration: durIn, 
				     transition: 'cubic:out',
				     link: 'ignore'
				});
				
				
				if(!dont) {
					this.options.slide_out.start({
						
						'left':goOut,
						'opacity':0
						
						});
					this.options.slide_in.start({
						
						'left':goIn,
						'opacity':1
						
						}).chain(function() { this.fireEvent('slideEnd',[curentSlider,newSlider]) }.bind(this) );
					this.fireEvent('slideStart',[curentSlider,newSlider]);
				
				
				this.options.curent = slider;
				}
				
				
			},
			next:function() {
				
				((this.options.curent+1)>(this.options.slItems.length-1))?this.slide(0):this.slide((this.options.curent+1));
			},
			prev:function() {
				((this.options.curent-1)<0)?this.slide((this.options.slItems.length-1)):this.slide((this.options.curent-1));
			},
			pause:function() {
				//alert(this.options.slide_out);
				this.options.slide_out.pause();
				this.options.slide_in.pause();
				//alert('pause');
			},
			resume:function() {
				//alert(this.options.slide_out);
				this.options.slide_out.resume();
				this.options.slide_in.resume();
				//alert('pause');
			},
			play:function() {
				this.options.intervalID = this.next.periodical(this.options.SlideTime,this);		
			},
			stop:function(){
				clearInterval(this.options.intervalID);				
			}
			
});