var FeaturePanel = new Class({

	//options
	options: {
		duration:6000,
		showControls: false,
		tocWidth: 20,
		tocClass: 'toc',
		tocActiveClass: 'toc-active',
		placePagingControls : null,
		pageMarker : null,
		pageMarkerCurrent: null
	},

	//implements
	Implements: [Options,Events],

	//initialization
	initialize: function(container, elements, options) {

		var self = this;

		//set options
		self.setOptions(options);

	
		self.container = $(container);
		self.elements = $$(elements); 
		self.currentIndex = 0;

		self.stagewidth = self.container.getWidth() + 14;

		self.controls = {};
		
		self.slidewidth = (self.elements[0].getWidth() * self.elements.length) + (self.elements.length);
		self.pageCount = Math.ceil(self.slidewidth / self.stagewidth);


		if(self.container) {

			if(self.options.showControls) {
				self.toc = []; 

				if(self.slidewidth > 874) {

					self.thumb_mover = $('slide-mover');
					
					self.thumb_mover.setStyles({
						'width' : self.slidewidth,
						'margin-left' : 0
						});
					self.thumb_mover.mover = new Fx.Tween(self.thumb_mover, { transition: Fx.Transitions.Quart.easeOut, duration: 500 });
					self.thumb_mover.pos = 7;
					
					//self.tocLinks.length
					
					self.thumb_mover.addEvents({
						'slide_right' : function() {
							if(!(self.currentIndex == (self.pageCount-1))) {
								this.fireEvent('reset');
								
								self.currentIndex = self.currentIndex+1;
								
								this.mover.start('margin-left', self.paging.markers[self.currentIndex].position);
								
								self.thumb_mover.prev.removeClass('disabled');
								
								if(self.currentIndex == (self.pageCount-1)){
									self.thumb_mover.next.addClass('disabled');
								}
								
								this.fireEvent('highlight');
								
							}
						},
						'slide_left' : function() {
							if(!(self.currentIndex == 0)) {
								this.fireEvent('reset');
								self.currentIndex = self.currentIndex-1;
								
								this.mover.start('margin-left', self.paging.markers[self.currentIndex].position);
								
								self.thumb_mover.next.removeClass('disabled');
								if (self.currentIndex == 0) {
									self.thumb_mover.prev.addClass('disabled');
								};
								this.fireEvent('highlight');
							}
						},
						'reset' : function() {
							self.paging.markers.each(function(img){ img.setAttribute('src', self.options.pageMarker); })
						},
						'highlight' : function() {
							self.paging.markers[self.currentIndex].setAttribute('src', self.options.pageMarkerCurrent)
						}
					})

					self.thumb_mover.prev = new Element('span',{
						'class': 'control previous disabled',
						events: {
							click: function(e) {
								if(e) e.stop();
								self.thumb_mover.fireEvent('slide_left');
							}
						}
					}).inject(self.options.placePagingControls);

					self.paging = new Element('span',{
						'class': 'paging'
					}).inject(self.options.placePagingControls);
					
					self.paging.markers = [];
					
					self.pageCount.each(function(key){
						var tmp = new Element('img', {
										'src' : (key == 0) ? self.options.pageMarkerCurrent : self.options.pageMarker
									}).inject(self.paging);
						
						tmp.position = (key * self.stagewidth) * -1;
	
						self.paging.markers.push(tmp);
					});
					
					self.thumb_mover.next = new Element('span',{
						'class': 'control next',
						events: {
							click: function(e) {
								if(e) e.stop();
								self.thumb_mover.fireEvent('slide_right');
							}
						}
					}).inject(self.options.placePagingControls);
				}
			}
		} else {
			throw new Error('No Feature Panel with id "'+ container +'" exists');
		}
		
	}
});