var slideShow = new Class({
    	Implements: [Options, Events],
	
		container:null,
		slogan_container:null,
		timer:null,
		status:'playing',
		elements:[],
		slogan_elements:[],
		path:null,
		slider:null,
		buttons:null,
		path:null,
		s_slider:null,
		total:0,
		cur:0,
		prev:0,
	
		initialize: function(container, slogan_container, images, slogans, path, buttons){
    	    this.container = $(container);
			this.slogan_container = $(slogan_container);
			this.path = path;
			images.each(function(item,index){
					
					var cElement = new Element('div',{
						'styles':{
						
									'position':'absolute',
									'top':'0',
									'left':'0',
									'backgroundImage':'url('+path+'/'+item+')',
									'height':'235px',
									'width':'485px',
									'opacity':'0'
									
								}
					
					})
					
			
			

				
				cElement.inject(this.container);
				this.elements.extend([cElement]);
				this.total++;
				
				
			}, this);
			
			slogans.each(function(item,index){
								  
								var sElement = new Element('div', {
									'styles':{
											   
											   'position':'absolute',
											   'top':'0',
											   'left':'0',
											   'font-size':'14px',
									           'opacity':'0'

										   },
									'html':item
										   
							   })							  
								  
								  
					sElement.inject(this.slogan_container);	  
					this.slogan_elements.extend([sElement]);
								  
			}, this)
			
				this.elements[0].setStyle('opacity','100');
				this.cur = 0;
				this.slogan_elements[0].setStyle('opacity','100');
				this.buttons = $(buttons).getElements('a');
				
				
				/*this.buttons.each(function(item,index){
									  
									  item.addEvent('click', function(index){
										this.moveToSlide(this,index);
										  
										}, this);


									  
									  
									  },this)*/
				

	    },
	
		startShow: function(){
				var els = this.container.getElements('div');
				var s_els = this.slogan_container.getElements('div');
				var slide = function(){
				
					if (this.cur == this.total) this.cur = 0;
					if (this.cur == 0) this.prev = this.total - 1; else this.prev = this.cur - 1;
					els[this.prev].fade('out');		
					els[this.cur].fade('in');
					s_els[this.prev].fade('out');
					s_els[this.cur].fade('in');
					this.buttons[this.prev].setStyle('background','url('+this.path+'/images/navigateBg.jpg) no-repeat 0 0');
					this.buttons[this.cur].setStyle('background','url('+this.path+'/images/navigateBgAct.jpg) no-repeat 0 0');
					this.cur++;
					
					
					
					
				}
			slide.bind(this);
			this.slider = slide.periodical(3000,this);
			
			
				

		},
		
		moveToSlide:function(obj, move_to){
			alert('Hello');
				 var els = $(container).getElements('div');
			var s_els = $(slogan_container).getElements('div');
				els[obj.prev].fade('out');		
				els[move_to].fade('in');
				s_els[obj.prev].fade('out');
				s_els[move_to].fade('in');
				obj.cur = move_to;
				
			},
	
		stopShow:function(){
						
			this.slider = $clear(this.slider);	
			this.s_slider = $clear(this.s_slider);	
	
		},
		
		moveToSlide:function(slide_id){
			
			
			},
		
		log:function(){
		
			console.log(this.container);
			console.log(this.images);		
		}
	
		
	
	});
	
function init(container, slogan_container,slides, slogans, path, buttons){

	var show = new slideShow(container, slogan_container, slides, slogans, path, buttons);

/*$('play-stop').addEvent('click',function(){if (show.status == 'stoped'){show.startShow();show.status = 'playing';this.setStyle('background', 'url('+path+'/'+stop_but+') no-repeat top left');	} else if (show.status == 'playing'){show.stopShow();show.status = 'stoped';this.setStyle('background', 'url('+path+'/'+play_but+') no-repeat top left');}});*/

	show.startShow();

}