var MultiItemView = new Class({
  el:null,
	_cur:0,
	items:[],
	initialize:function(el) {
		this.el = el;
	},
	next:function() {
		if (this.atEnd()) {
	   this.go(0,'next');
    } else {
     this.go(this._cur + 1,'next');
    }
	  return this;
	},
	prev:function() {
		if (this.atBeginning()) {
	   this.go(this.size()-1,'prev');
    } else {
     this.go(this._cur - 1,'prev');
    }
	  return this;
	},
	go:function(i,dir) {
		if (this.canGo(i)) {
			this._doGo(i,dir);
		}
		return this;
	},
	atEnd:function() {
	  return this._cur === this.upper();
	},
	atBeginning:function() {
	  return this._cur === 0; 
	},
	upper:function() {
	  return this.items.length - 1;
	},
	canGo:function(i) {
		return i < this.items.length && i >= 0;
	},
	size:function() {
	  return this.items.length;
	},
	current:function() {
		return this.items[this._cur];
	}
});

var Slideshow = new Class({
  Extends:MultiItemView,
	Implements:[Chain,Events],
	itemSpans:[],
	continuous:true,
	orientation:'horizontal',
	toMeasure:'width',
	maxInView:3,
	autoPlay:false,
	pad:6,
	_curPos:0,
	_speed:3000,
	initialize:function(el,orientation,maxInView,autoPlay,dynamicSpeed,images) {
    this.parent(el);
    this.orientation = orientation;
    this.dynamicSpeed = dynamicSpeed || false;
    this.autoPlay = autoPlay || this.autoPlay;
    this.images = images || null;
    this.maxInView = maxInView;
    this.toMeasure = this.orientation === 'horizontal'?'width':'height';
    this.items = this.el.getElements('img');
	  var toload = [];
	  if (this.images) {
	    this.images.each(function(img) {
	      var src = this.items[0].get('src');
        var path = src.substring(0,src.lastIndexOf('/')+1);
        toload.push(path+img);
	    },this);
	    var imgs = new Asset.images(toload,{
  	    onComplete:function(i){
  	      this.initItems();
      		this.initAnim();
      		this.el.getParent().getElement('.loader').tween('opacity',[1,0]);
      		if (autoPlay) {
            this.initClick();
       		  this.play(); 
      		} 
  	    }.bind(this)
  	  });
  	  imgs.each(function(img) {
  	    this.items.push(img);
  	    this.el.adopt(img);
  	  },this);
	  } else {
	    this.initItems();
  		this.initAnim();
  		if (autoPlay) {
        this.initClick();
   		  this.play(); 
  		}
	  }
	  
		return this;
	},
	initClick:function() {
	  this.el.addEvent('click',function() {
	    if (this._paused) {
	      this.play();
	    } else {this.pause();}
	  }.bind(this));
	},
	initItems:function() {
	  var w = 0;
	  var len = this.size();
	  this.clones = {front:[],back:[]};
	  for (var i=0;i<this.maxInView;i++) {
	    this.clones.front.push(this.items[len-(i+1)].clone());
	    this.clones.front[i].inject(this.el,'top');
	    this.clones.back.push(this.items[i].clone());
	    this.clones.back[i].inject(this.el,'bottom');
	  }
	  var fw = 0;
	  this.clones.front.each(function(c) {
	    fw = fw + c.getStyle(this.toMeasure).toInt()+this.pad;
	  },this);
	  this._frontWidth = fw;
	  this._curPos = this._frontWidth*-1;
	  this._itemOffsets = [];
	  this._itemSpans = [];
	  var w = this._frontWidth;
	  this.items.each(function(item,index) {
	    this._itemSpans.push(item.getStyle(this.toMeasure).toInt()+this.pad);
	    this._itemOffsets.push(w);
	    w = w+this._itemSpans[index];
	  },this);
    this.reset(0);
	  return this; 
	},
	initAnim:function() {
	  this.anim = new Fx.Tween(this.el,{
	    transition:Fx.Transitions.Quad.easeInOut,
	    duration:900
	  });
	  return this;
	},
	_doGo:function(i,dir) {
    var l = 0;
    var percent = 0;
    if (dir === 'next') {
      l = this._curPos-this._itemSpans[this._cur];
      percent = this._itemSpans[this._cur]/911;
    } else {
      l = this._curPos + this._itemSpans[i];
      percent = this._itemSpans[i]/911;
    }
    this.anim.options.duration = this.dynamicSpeed?(600*percent):600;
	  this.anim.onComplete = function() {
	    if (this.atBeginning() && dir === 'prev') {
	      this.reset(i);
	    } else if (this.atEnd() && dir === 'next') {
	      this.reset(0);
	    } else {
        this._curPos = l;
	    }
      this._cur = i; 
	  }.bind(this);
	  if (this.orientation === 'horizontal') {
	    this.anim.start('left',l);
	  } else {
	    this.anim.start('top',l);
	  }
    
	},
	play:function() {
	  this._paused = false;  
	  this._player = setInterval(function() {
	    this.next();  
	  }.bind(this),this._speed);
	},
	pause:function() {
	  clearInterval(this._player); 
    this._paused = true;
	},
	reset:function(i) {
	  var l = this._itemOffsets[i]*-1;
	  if (this.orientation === 'horizontal') {
	    this.el.style.left = l+'px';
	  } else {
	    this.el.style.top = l+'px';
	  }
	  
	  this._curPos = l;
	  return this;
	}
});
