var iSlider = Class.create({

	mainDiv: null,
	prevLink: null,
	nextLink: null,
	containerDiv: null,
	innerDiv: null,
	items: null,
	itembuttons: null,
	active: 0,	
	
	initialize : function ( div ) {
		this.mainDiv = div;
		
		this.containerDiv	= this.mainDiv.down('.islider-container');
		this.innerDiv		= this.containerDiv.down('.islider-inner');
		this.items			= this.innerDiv.immediateDescendants();
		this.itembuttons	= this.mainDiv.down('.isliderdirect').immediateDescendants();
		
		var width			= 0;
		for( var i = 0 ; i < this.items.length ; i++ )
			width 			+= this.items[i].getWidth();
		
		width = width+1;
		
		this.innerDiv.setStyle({ width: width + 'px' });
		
		this.addObservers ();
	} ,

	addObservers : function () {
		this.prevLink	= this.mainDiv.down('.islider-previous');
		if ( this.prevLink ) 
			this.prevLink.observe( 'click' , this.previous.bind(this) );
		this.nextLink	= this.mainDiv.down('.islider-next');
		if ( this.nextLink ) 
			this.nextLink.observe( 'click' , this.next.bind(this) );
		
		this.itembuttons.each( function(itembtn, index) {
			itembtn.observe( 'click', this.gotoIndex.bind(this, index));
		}.bind(this));
	} ,
	
	previous : function ( event ) {
		event.stop();
		this.gotoIndex( this.active - 1 );
	} , 
	
	next : function ( event ) {
		event.stop();
		this.gotoIndex( this.active + 1 );
	} ,
	
	gotoIndex : function( index ) {
		if(index >= this.items.length-1) {
			this.active = this.items.length-1;
		} else if (index < 0) {
			this.active = 0;
		} else {
			this.active = index;
		}
		
		var left	= 0;
		for( var i = 0 ; i < this.active ; i++ )
			left	-= this.items[i].getWidth();
		
		this.innerDiv.morph('margin-left: ' + left + 'px;');
	}
	
});