var NXC = NXC || {};
NXC.Gallery = new Class( {

	Implements: [Options, Events],

	options: {
		'startImageIndex'   : 0,
		'getCurrentImage'   : function( container ) { return container.getElement( 'img.gallery-current-image' ); },
		'getLoaderImage'    : function( container ) { return container.getElement( 'img.gallery-current-image-loader' ); },
		'getPreviews'       : function( container ) { return container.getElements( 'img.nxc-gallery-preview' ); },
		'slideShowTimeout'  : 3000,
		'previewsTween'     : {
			'duration' : 250,
			'opacity'  : 0.7
		},
		'onShowImage'       : function( imagesIndexToShow, currentImageIndex ) {

		}.bind( this )
	},

	container         : false,
	currentImage      : false,
	loaderImage       : false,
	previews          : [],
	downloadLinks     : {
		'original' : false,
		'small'    : false
	},
	imageInfoBlock    : false,
	currentImageIndex : 0,
	timer             : $empty,

	initialize: function( containerID, options ) {
		this.container = document.id( containerID );

		this.setOptions( options );
		this.currentImageIndex = this.options.startImageIndex;

		this.currentImage           = this.options.getCurrentImage( this.container );
		this.loaderImage            = this.options.getLoaderImage( this.container );
		this.previews               = this.options.getPreviews( this.container );
		this.previews.setStyle( 'opacity', this.options.previewsTween.opacity );
		this.showImage( this.currentImageIndex, false );

		this.installEvents();
		this.startSlideShow();
	},

	installEvents: function() {
		this.previews.each( function( preview, index ) {
			preview.addEvents( {
				'click'    : function() {
					this.showImage( index );
				}.bind( this ),
				'mouseover': function() {
					preview.get( 'tween', {
							'property' : 'opacity',
							'link'     : 'cancel',
							'duration' : this.options.previewsTween.duration
					} ).start( 1 );
					this.stopSlideShow();
				}.bind( this ),
				'mouseout' : function() {
					this.hidePreviews( this.currentImageIndex );
					this.startSlideShow();
				}.bind( this )
			} );
		}.bind( this ) );

		this.currentImage.addEvents( {
			'mouseover': function() {
				this.stopSlideShow();
			}.bind( this ),
			'mouseout' : function() {
				this.startSlideShow();
			}.bind( this )
		} );
	},

	hidePreviews: function( excludeIndex ) {
		this.previews.each( function( preview, index ) {
			if( ( excludeIndex !== false ) && ( index != excludeIndex ) ) {
				preview.get( 'tween', {
						'property' : 'opacity',
						'link'     : 'cancel',
						'duration' : this.options.previewsTween.duration
				} ).start( this.options.previewsTween.opacity );
			}
		}.bind( this ) );
	},

	startSlideShow: function() {
		if( this.options.slideShowTimeout.toInt() > 0 ) {
			this.timer = function() {
				this.showNextImage();
			}.periodical( this.options.slideShowTimeout, this );
		}
	},

	stopSlideShow: function() {
		$clear( this.timer );
	},

	showNextImage: function() {
		var indexToShow = ( this.currentImageIndex == this.previews.length - 1 ) ? 0 : this.currentImageIndex + 1;
		this.showImage( indexToShow );
	},

	showPreviousImage: function() {
		var indexToShow = ( this.currentImageIndex == 0 ) ? this.previews.length - 1 : this.currentImageIndex - 1;
		this.showImage( indexToShow );
	},

	showImage: function( index ) {
		var preview = this.previews[ index ];
		if( preview.retrieve( 'isLargeImageLoaded', false ) === false ) {
			this.currentImage.setStyle( 'display', 'none' );
			this.loaderImage.setStyle( 'display', 'block' );
			var image = new Asset.image(
				preview.get( 'rel' ), {
					'onload': function() {
						this.loaderImage.setStyle( 'display', 'none' );
						this.currentImage.setStyle( 'display', 'inline' ).set( 'src', image.get( 'src' ) );

						preview.store( 'isLargeImageLoaded', true );
					}.bind( this )
				}
			);
		} else {
			this.currentImage.set( 'src', preview.get( 'rel' ) );
		}

		var previousPreview = this.previews[ this.currentImage ];
		preview.get( 'tween', {
				'property' : 'opacity',
				'link'     : 'cancel',
				'duration' : this.options.previewsTween.duration
		} ).start( 1 );

		this.fireEvent( 'showImage', [ index, this.currentImage ] );

		this.currentImageIndex = index;
		this.hidePreviews( this.currentImageIndex );
		
		if ($chk(document.id('gallery_content'))) document.id('gallery_content').set('html', document.id(preview.get('id') + '_content').get('html'));
		
	}
} );

