//portfolio_class.js
var Portfolio = new Class({
	Implements: [Events, Options],
	options: {
		speed: 1000,
		delay: 5000,
		direction: 'left',
		
		onComplete: $empty,
		onStart: $empty
	},
	initialize: function(el,options){
		this.setOptions(options);
		this.el = $(el);
		this.items = this.el.getElements('li');
		this.timer = null;
		var w = 0;
		var h = 0;
		h = this.el.getCoordinates().height;
		this.items.each(function(li,index) {
				w += li.getCoordinates().width;
		});

		this.el.setStyles({
			position: 'absolute',
			top: 0,
			left: 0,
			width: w,
			height: h
		});
		
		this.fx = new Fx.Morph(this.el,{duration:this.options.speed,onComplete:function() {
			  var i = (this.current==0)?this.items.length:this.current;
			  this.items[i-1].inject(this.el,'inside');
			  this.el.setStyles({
				  left:0,
				  top:0
			  });
		}.bind(this)});
		this.current = 0; //causes problems when running again
	},
		
	left: function() {
		this.current++;

		this.current = (this.current >= this.items.length) ? this.current = 0 : this.current;
		//if (this.current >= this.items.length) this.current = 0;

		var pos = this.items[this.current];
		this.fx.start({
			//top: -pos.offsetTop, //for vertical
			left: -pos.offsetLeft
		});
		this.timer = this.left.bind(this).delay(this.options.delay+this.options.speed);
	},

	stop: function() {
		this.fx.cancel();
		$clear(this.timer);
		//window.status = 'Thumb_Index='+this.current;
	}
});
	
var hor = new Portfolio('PortfolioHorizontal',{speed:500,delay:2000,orientation:'horizontal'});

$('Left').addEvent('mouseenter',function() {
	hor.left();
});
$('Left').addEvent('mouseleave',function() {
	hor.stop();
});
/*
$('thumb1').addEvent('mouseenter',function() {
	setProperty('images/'+this.id, fullImg.src);
	//window.status = '2Position='+this.offsetLeft;
});
$('thumb2').addEvent('mouseenter',function() {
	window.status = '2Position='+this.offsetLeft;
});
$('thumb5').addEvent('mouseenter',function() {
	window.status = '5Position='+this.offsetLeft;
});*/