var pptGallery = new Class({
  Implements: [Options, Events],

	options: {
		stage:           null,
		clickTargets:    null,
		images:          null,
		groupContainers: [],
		groups:          [],
		groupItemClass:  'gallery_item',
		repeat:          true,
		showStageTitle:  true,
		scrollToStage:   false
	},

	currentIndex: 0,
	groups:       new Hash(),
	stageTitle:   null,
	setupDone:    false,

	initialize: function(options) {
		var size, maxItemHeight, totalItemsWidth, container, containerCoords,
		    groupScrollLeftButton, groupScrollRightButton, groupScroller, groupCounter, groupId,
				pagesCount;

		this.setOptions(options);

		if (this.options.stage && this.options.clickTargets && this.options.images) {

			new Asset.images(this.options.images);
			this.options.clickTargets.each(function(galleryItem, index){
				galleryItem.addEvent('click', this.imageClick.bindWithEvent(this, index));
			}.bind(this));

			this.options.groupContainers.each(function(groupContainer){
				groupContainer.setStyle('overflow', 'hidden');
				groupContainer.setStyle('height', 77);
			});

			groupCounter = 0;
			this.options.groups.each(function(group){
				groupId = 'gallery_group_' + ++groupCounter;
				maxItemHeight = 0;
				totalItemsWidth = 0;
				container = group.getParent();
				containerCoords = container.getCoordinates(container.getOffsetParent());

				Array.each(group.getChildren(), function(item){
					size = item.getSize();
					maxItemHeight = Math.max(maxItemHeight, size.y);
					totalItemsWidth += size.x;
				});

				group.id = groupId;
				group.setStyles({
					height: maxItemHeight,
					left: 0,
					overflow: 'auto',
					position: 'absolute',
					top: 0,
					width: totalItemsWidth
				});

				groupScroller = undefined;
				groupScrollLeftButton = undefined;
				groupScrollRightButton = undefined;
				pagesCount = 1;

				if (totalItemsWidth > containerCoords.width) {
					pagesCount = Math.ceil(totalItemsWidth / containerCoords.width);
					groupScroller = new Fx.Tween(group, {link: 'cancel'});
					groupScrollLeftButton = new Element('div', {
						'class': 'gallery_group_scroll_left_button',
						'styles': {
							'position': 'absolute',
							'left': containerCoords.right + 4,
							'top': containerCoords.top + 22
						},
						'events': {
							'click': function(e) {
								e.preventDefault();
								this.groupScrollLeft(group.id);
							}.bind(this)
						}
					}).inject(container, 'after');
					groupScrollRightButton = new Element('div', {
						'class': 'gallery_group_scroll_right_button inactive',
						'styles': {
							'position': 'absolute',
							'left': containerCoords.left - 34,
							'top': containerCoords.top + 22
						},
						'events': {
							'click': function(e) {
								e.preventDefault();
								this.groupScrollRight(group.id);
							}.bind(this)
						}
					}).inject(container, 'after');
				}

				this.groups.set(groupId, {
					group: group,
					container: container,
					scrollLeftButton: groupScrollLeftButton,
					scrollRightButton: groupScrollRightButton,
					scroller: groupScroller,
					scrollCurrentPage: 1,
					scrollTotalPages: pagesCount
				});
			}.bind(this));

			this.fireEvent('init', [this]);
			return true;
		} else {
			return false;
		}
	},

	finalizeSetup: function() {
		this.options.stage.empty();

		this.stageTitle = new Element('div', {
			'class': 'gallery_stage_title'
		}).inject(this.options.stage);

		this.prevButton = new Element('div', {
			'class': 'gallery_prev_button',
			'events': {
				'click': this.prevImage.bind(this)
			}
		}).inject(this.options.stage);

		this.nextButton = new Element('div', {
			'class': 'gallery_next_button',
			'events': {
				'click': this.nextImage.bind(this)
			}
		}).inject(this.options.stage);
		
		this.setupDone = true;
		this.fireEvent('stageSetup', [this]);
	},

	manageControls: function() {
		if (this.options.repeat) {
			return;
		}
		if (this.currentIndex > 0) {
			this.prevButton.setStyle('visibility', 'visible');
		} else {
			this.prevButton.setStyle('visibility', 'hidden');
		}
		if (this.currentIndex < this.options.images.length - 1) {
			this.nextButton.setStyle('visibility', 'visible');
		} else {
			this.nextButton.setStyle('visibility', 'hidden');
		}
	},

	showImage: function() {
		if (!this.setupDone) {
			this.finalizeSetup();
		}
		this.manageControls();
		this.options.stage.setStyle('background-image', 'url(' + this.options.images[this.currentIndex] + ')');
		if (this.options.showStageTitle) {
			if (this.options.imageTitles[this.currentIndex]) {
				this.stageTitle.innerHTML = '<span class="gallery_stage_title_text">' + this.options.imageTitles[this.currentIndex] + '</span>';
				this.stageTitle.setStyle('display', '');
			} else {
				this.stageTitle.setStyle('display', 'none');
			}
		}
	},

	imageClick: function(evt, index) {
		evt.preventDefault();
		this.currentIndex = index;
		if (this.options.scrollToStage) {
			new Fx.Scroll(window).toElement(this.options.stage);
		}
		this.showImage();
	},

	nextImage: function() {
		this.currentIndex++;
		if (this.currentIndex >= this.options.images.length) {
			this.currentIndex = this.options.repeat ? 0 : this.options.images.length - 1;
		}
		this.showImage();
	},

	prevImage: function() {
		this.currentIndex--;
		if (this.currentIndex < 0) {
			this.currentIndex = this.options.repeat ? this.options.images.length - 1 : 0;
		}
		this.showImage();
	},

	groupScrollLeft: function(groupId) {
		var group, scrollWidth;

		group = this.groups.get(groupId);

		scrollWidth = group.container.getSize().x;

		group.scrollCurrentPage++;
		if (group.scrollCurrentPage <= group.scrollTotalPages) {
			group.scroller.start('left', -((group.scrollCurrentPage-1) * scrollWidth));
		} else {
			group.scrollCurrentPage = group.scrollTotalPages;
		}

		if (group.scrollCurrentPage == group.scrollTotalPages) {
			group.scrollLeftButton.addClass('inactive');
		} else {
			group.scrollLeftButton.removeClass('inactive');
		}
		if (group.scrollCurrentPage == 1) {
			group.scrollRightButton.addClass('inactive');
		} else {
			group.scrollRightButton.removeClass('inactive');
		}
	},

	groupScrollRight: function(groupId) {
		var group, scrollWidth;

		group = this.groups.get(groupId);

		scrollWidth = group.container.getSize().x;

		group.scrollCurrentPage--;
		if (group.scrollCurrentPage > 0) {
			group.scroller.start('left', -((group.scrollCurrentPage-1) * scrollWidth));
		} else {
			group.scrollCurrentPage = 1;
		}

		if (group.scrollCurrentPage == 1) {
			group.scrollRightButton.addClass('inactive');
		} else {
			group.scrollRightButton.removeClass('inactive');
		}
		if (group.scrollCurrentPage == group.scrollTotalPages) {
			group.scrollLeftButton.addClass('inactive');
		} else {
			group.scrollLeftButton.removeClass('inactive');
		}
	}

});

window.addEvent('domready', function(){
	this.gallery = new pptGallery({
		stage:           $('flash_content'),
		clickTargets:    $$('.gallery_item a'),
		images:          $$('.gallery_item a').get('href'),
		imageTitles:     $$('.gallery_item img').get('title'),
		groupContainers: $$('.gallery_group_container'),
		groups:          $$('.gallery_group'),
		groupItemClass:  'gallery_item',
		repeat:          false,
		showStageTitle:  true,
		scrollToStage:   true,
		onStageSetup:    function(){$$('#content h2:first-child')[0].setStyle('display', 'none');}
	});
});