var Gallery = Class.create();

Gallery.prototype = {
	options: {},
	container: null,
	imagelist: [],
	prevstack: [],
	nextstack: [],
	imagewidth: null,
	imageheight: null,
	containerwidth: null,
	loadedimages: 0,
	initialize: function(element, imagelist, options)
	{
		this.options = Object.extend({
			autoplay: true,
			autoplaydelay: 5,
			autoplayeffectlength: 4,
			effectlength: 0.4
		}, (options || {}));
		this.imagelist = $A(imagelist);
		this.nextstack = $A(imagelist);
		this.options = Object.extend(this.options, window.galleryOptions || {});
		var d = new Date();
		var images = new Element('div').addClassName('gallery-images');
		images.insert(new Element('img', {'src':this.imagelist.last()}));
		this.imagelist.each(function(img) {
			images.insert(new Element('img', {'src':img}));
		}, this);
		var gallery = new Element('div', {'id':$(element).id}).addClassName('content-gallery').insert(
			new Element('div').addClassName('gallery-image-wrap').insert(images)
		)
		if (this.imagelist.length > 1) {
			gallery.insert(
				new Element('div').addClassName('gallery-prev')
			).insert(
				new Element('div').addClassName('gallery-next')
			);
		}
		old = $(element).replace(gallery).identify();
		this.container = $(old);
		this.container.hide();
		this.imagelist.each(function(img) {
			var i = new Image();
			i.onload = function() {
				this.loadedimages++;
				if (this.loadedimages == this.imagelist.length) this.start();
			}.bind(this);
			i.src = img;
		}, this);
	},
	start: function()
	{
		this.container.show();
		this.imagecont = this.container.down('.gallery-images');
		if (this.imagelist.length > 1) {
			this.container.down('.gallery-next').observe('click', this.next.bindAsEventListener(this));
			this.container.down('.gallery-prev').observe('click', this.previous.bindAsEventListener(this));
		}
		this.containerwidth = 0;
		this.imagecont.select('img').each(function(img) {
			this.imagewidth = img.getWidth();
			this.imageheight = img.getHeight();
			this.containerwidth += this.imagewidth;
		}, this);
		//this.containerwidth += this.imagewidth;
		this.imagecont.setStyle({'width':this.containerwidth+'px','height':this.imageheight+'px','left':-this.imagewidth+'px'});
		this.prevstack.push(this.nextstack.shift());
		if (this.options.autoplay) this.autoplay = this.next.bind(this).delay(this.options.autoplaydelay);
		
	},
	next: function(e)
	{
		if (this.moving) return;
		if (!this.nextstack.last()) {
			this.imagecont.setStyle({'left':'0'});
			this.nextstack = $A(this.imagelist);
			this.prevstack = $A();
		}
		this.moving = true;
		new Effect.Move(this.imagecont, {
			duration: (e ? this.options.effectlength : this.options.autoplayeffectlength),
			x:-1*this.imagewidth, 
			mode: 'relative',
			transition: Effect.Transitions.sinoidal,
			afterFinish: this.afterNextComplete.bind(this)
		});
		if (this.options.autoplay) {
			window.clearTimeout(this.autoplay);
			this.autoplay = this.next.bind(this).delay(this.options.autoplaydelay+this.options.autoplayeffectlength);
		}
	},
	previous: function()
	{
		if (this.moving) return;
		if (!this.prevstack.last()) {
			this.imagecont.setStyle({'left':-this.containerwidth+this.imagewidth+'px'});
			this.prevstack = $A(this.nextstack);
			this.nextstack = $A();
		}
		this.moving = true;
		new Effect.Move(this.imagecont, {
			duration: this.options.effectlength,
			x:this.imagewidth, 
			mode: 'relative',
			transition: Effect.Transitions.sinoidal,
			afterFinish: this.afterPreviousComplete.bind(this)
		});
		if (this.options.autoplay) {
			window.clearTimeout(this.autoplay);
			this.autoplay = this.next.bind(this).delay(this.options.autoplaydelay+this.options.autoplayeffectlength);
		}
	},
	afterNextComplete: function()
	{
		this.prevstack.push(this.nextstack.shift());
		this.moving = false;
	},
	afterPreviousComplete: function()
	{
		this.nextstack.push(this.prevstack.shift());
		this.moving = false;
	}
};


var ThumbGallery = {
	isRight: false,
	isLeft: true,
	moving: false,
	left: function(container)
	{
		if (this.isLeft) return;
		if (this.moving) return;

		var c = $(container);
		
		new Effect.Move(c, {
			duration: 0.5,
			x:(c.getWidth()/2), 
			mode: 'relative',
			transition: Effect.Transitions.sinoidal,
			afterFinish: function() { this.moving = false; this.isLeft = true; this.isRight = false; }.bind(this)
		});
		this.moving = true;
	},
	right: function(container)
	{
		if (this.isRight) return;
		if (this.moving) return;

		var c = $(container);
		
		new Effect.Move(c, {
			duration: 0.5,
			x:-(c.getWidth()/2), 
			mode: 'relative',
			transition: Effect.Transitions.sinoidal,
			afterFinish: function() { this.moving = false; this.isRight = true; this.isLeft = false;}.bind(this)
		});
		this.moving = true;
	}
};