var SlimSlide = new Class({
	
	options: {
			slimslideDisplay: $E('slimslide_display'),
			slimslideMenu: $E('slimslide_menu'),
			slideDelay: 2000,
			effectTime: 300

	},
	
	initialize: function(options) {
		this.setOptions(options);

		this.images_div=new Array();
		
		//this.options.slimslideDisplay.setStyles({'position':'relative','overflow':'hidden','border':'1px solid #f00','margin':'0px'});
		//this.ss_anchors =this.options.slimslideMenu.getElements('li');
		this.options.slimslideDisplay.empty();
		this.displayWidth=this.options.slimslideDisplay.getStyle('width').toInt();
		this.displayHeight=this.options.slimslideDisplay.getStyle('height').toInt();
		
		this.ss_lisMenu=$ES('li',this.options.slimslideMenu);
		this.imageAr=new Array();
		this.imageNu=0;
		this.zi=1+this.ss_lisMenu.length;

		this.max=this.ss_lisMenu.length;
		this.zTop=this.zi+1;
		this.ss_lisMenu.each(function(li,i){
			var im=li.getElement('img').clone();
			var theA=li.getElement('a');
			li.getElement('a').remove();
			//
			//theA.title+=". Klik om een grotere versie te zien";
			//
			var src = im.src;
			var src_ar=src.split('/');
			var image=src_ar.pop();
			var root_src=src_ar.join('/');
			var ext = image.split('.').pop();//.substr(src.length - 3);
			var slide_image_ar=image.split('_');
			slide_image_ar.pop();
			this.slide_image=root_src+"/"+slide_image_ar.join('_')+"."+ext;
			var imgEl=new Element('img');
			imgEl.src=this.slide_image;
			theA.empty();
			//imgEl.injectInside(theA);
			this.images_div[i]=new Element('div');

			this.options.slimslideDisplay.appendChild(this.images_div[i]);
      this.images_div[i].setStyles({'width':this.displayWidth,'height':this.displayHeight,'position':'absolute','z-index':this.zi,'left':0,'top':0,'overflow':'hidden'});
			if(i>0)this.images_div[i].setStyles({'opacity':0});
			this.images_div[i].setProperty('id','ss_img_'+i);
      imgEl.injectInside(this.images_div[i]);
			//theA.injectInside(this.images_div[i]);
			this.zi--;
	
			//
			//
			//theA.remove();
			//alert(li+" daarbinnen = a"+li.innerHTML);
			im.injectTop(li);
			li.setStyles({'cursor':'hand','cursor':'pointer'});
			li.addEvent(
				'click',function(event){ this._nextSlide(i);}.bind(this)
			);
		}.bind(this));
		this.num=0;
		
		
	},
	
	_nextSlide: function( number ){
		if(number!=this.imageNu){
			this.zTop++;
			//this.images_div[this.imageNu].setStyle('display','none');//effect('opacity',{duration: 300}).start(0);
			//alert(this.options.effectTime);
			this.images_div[this.imageNu].effects({duration: this.options.effectTime}).start({'opacity':0});
			//fadeOut.start({'opacity':[1.0,0]});
			this.imageNu=number;
			//this.images_div[this.imageNu].setStyles({'opacity':0,'display':'block','z-index':this.zTop});
			this.images_div[this.imageNu].effects({duration: this.options.effectTime}).start({'opacity':1});
		}
		//this.images_div[this.imageNu].effect('height', {duration: 1000, transition: Fx.Transitions.linear}).start(10,100);
		return false;
	}

	
});

SlimSlide.implement(new Events); // Implements addEvent(type, fn), fireEvent(type, [args], delay) and removeEvent(type, fn)
SlimSlide.implement(new Options);// Implements setOptions(defaults, options)