var Panorama = Class.create();
Panorama.prototype = {
	images: [],
	container: null,
	effect: null,
	speed: 20,
	initialize: function (container, images) {
		this.container = $(container);
		images.each(function (src, i) {
			image = $(new Image());
			this.container.appendChild(image);
			this.images.push(image)
			if (!i) {
				image.onload = function () {
					image.onload = function () {};
					this.start();
				}.bind(this);
			}
			image.src = src;
			image.style.display = 'none';
		}.bind(this));				
	},
	start: function () {				
		new Effect.Appear(this.images.first(), {
			afterFinish: this.move.bind(this)
		})	
	},
	next: function () {
		this.images.push(this.images.shift());
		this.images.first().setStyle({left: '0px'})
		new Effect.Parallel([
			new Effect.Fade(this.images.last()),
			new Effect.Appear(this.images.first())
		], {
				afterFinish: this.move.bind(this)
		});
	},
	move: function () {
		var x = this.images.first().getWidth() + parseInt(this.images.first().getStyle('left') || 0) - this.container.getWidth();
		var duration = x / this.speed;				
		new Effect.Move(this.images.first(), {
			x: -x,
			duration: duration,
			transition: Effect.Transitions.linear,
			afterFinish: this.next.bind(this)
		});
	}
}