window.addEvent('domready', function() {

	var gallery = $('promotiongallery');

	$extend(gallery, {
		nextArrow: gallery.getElement('div.next'),
		prevArrow: gallery.getElement('div.prev'),
		images: promotion_gallery,
		inner: gallery.getElement('.inner'),
		current: 0,
		blocked: false,
		interval: 4000,
		timer: null,
		autostart: true,

		init: function() {
			this.initArrow(this.nextArrow, this.next);
			this.initArrow(this.prevArrow, this.prev);
			this.setCurrent(this.current);

			if (this.images.length > 1 && this.autostart) {
				this.nextArrow.enable();
				this.prevArrow.enable();
				this.start();
				this.addEvent('mouseover', this.stop.bind(this));
				this.addEvent('mouseout', this.start.bind(this));
			}
		},

		initArrow: function(arrow, callback) {
			$extend(arrow, {
				enable: function() { this.setStyle('display', 'block') },
				disable: function() { this.setStyle('display', '') },
				setTitle: function(title) { this.setProperty('title', title) }
			});
			arrow.addEvent('click', callback.bind(this));
		},

		setCurrent: function(index) {
			this.nextArrow.setTitle(this.images[this.nextIndex(index)].title);
			this.prevArrow.setTitle(this.images[this.prevIndex(index)].title);
			this.current = index;
		},

		block: function() {
			this.blocked = true;
			this.stop();
		},

		unblock: function() {
			this.blocked = false;
			this.start();
		},

		nextIndex: function(index) {
			return ++index == this.images.length ? 0 : index;
		},

		prevIndex: function(index) {
			return index ? index-1 : this.images.length-1;
		},

		getImageBlock: function(index) {
			var img = this.images[index];
			var block = this.getElement('.photo');
			var clon = block.clone();
			block.addClass('original');

			clon.getElement('img').setProperty('title', img.title);
			clon.getElement('img').setProperty('src', img.photo);
			return clon;
		},

		next: function() {
			if (this.blocked) return;
			this.block();

			var index = this.nextIndex(this.current);
			var block = this.getImageBlock(index);
			this.inner.appendChild(block);

			var i = 0;
			block.getElement('img').addEvent('load', function() {
				if (++i != 1) return;
				new Fx.Tween(this.inner, { duration: 'long' }).start('left', 0, -this.getWidth()).addEvent('complete', function() {
					this.getElement('.original').destroy();
					this.inner.setStyle('left', 0);
					this.setCurrent(index);
					this.unblock();
				}.bind(this));
			}.bind(this));
		},

		prev: function() {
			if (this.blocked) return;
			this.block();

			var index = this.prevIndex(this.current);
			var block = this.getImageBlock(index);
			this.inner.grab(block, 'top');
			this.inner.setStyle('left', -this.getWidth());

			var i = 0;
			block.getElement('img').addEvent('load', function() {
				if (++i != 1) return;
				new Fx.Tween(this.inner, { duration: 'long' }).start('left', -this.getWidth(), 0).addEvent('complete', function() {
					this.getElement('.original').destroy();
					this.inner.setStyle('left', 0);
					this.setCurrent(index);
					this.unblock();
				}.bind(this));
			}.bind(this));
		},

		start: function() {
			if (this.timer) this.stop();
			this.timer = setInterval(this.next.bind(this), this.interval);
		},

		stop: function() {
			if (!this.timer) return;
			clearInterval(this.timer);
			this.timer = null;
		}
	});

	gallery.init();

});