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

	Implements: [Options, Events],

	options:{
		'overlayOpacity' : 0.5,
		'topPosition'    : 50,
		'bgColor'        : '2A2A2A',
		'shadow'         : true,
		'outerCloser'    : true,
		'closer'         : true,
		'onOpen'         : $empty,
		'onSetContent'   : function( el ) { el.setStyle( 'display', 'block' ) },
		'onClose'        : $empty
	},

	opened       : false,
	contentBlock : new Element( 'div' ),

	initialize: function( options ) {
		this.setOptions( options );
		this.prepareHTML();
	},

	prepareHTML: function() {
		this.overlay = new Element( 'div', {
			'class': 'nxc-lightbox-overlay',
			'styles': {
				'opacity'          : 0,
				'visibility'       : 'visible',
				'height'           : 0,
				'overflow'         : 'hidden',
				'background-color' : '#' + this.options.bgColor
			}
		} ).inject( document.id( document.body ) );
		this.overlay.get( 'tween' ).addEvent( 'onComplete', function() {
			if( this.overlay.getStyle( 'opacity' ) == 0 ) {
				this.overlay.setStyles( {
					'height': 0,
					'top': ''
				} );
			};
		}.bindWithEvent( this ) );
		window.addEvent( 'resize', function() {
			if( this.overlay.getStyle( 'opacity' ) != 0 ) {
				var scrollSize = document.id( window ).getScrollSize().y;
				var scrollTop = document.id( window ).getScroll().y;
				this.overlay.setStyles( {
					'height': scrollSize + scrollTop,
					'top': -scrollTop
				} );
			}
		}.bindWithEvent(this));

		this.center = new Element( 'div', {
			'class': 'nxc-lightbox-center',
			'styles': {
				'opacity': 0
			}
		} ).inject( document.id( document.body ) );

		if( this.options.shadow ) {
			if( !Browser.Engine.trident4 ) {
				var shadow = new Element( 'div', { 'class': 'nxc-lightbox-bg-wrap' } ).inject( this.center );
				['n', 'ne', 'e', 'se', 's', 'sw', 'w', 'nw'].each( function( dir ) {
					new Element( 'div', { 'class': 'nxc-lightbox-bg nxc-lightbox-bg-' + dir } ).inject( shadow );
				} );
			}
		}

		if( this.options.closer ) {
			var closer = new Element('a', {
				'class': 'nxc-lightbox-btn-close',
				'events': { 'click': this.close.bind( this ) }
			} ).inject( this.center );
		}

		if( this.options.outerCloser ) {
			this.overlay.addEvent( 'click', function() {
				this.close();
			}.bind( this ) );
		}

	},

	setContent: function( el, clone ) {
		el = document.id( el );
		if( el === false ) {
			return false;
		}

		if( clone === undefined ) {
			clone = true;
		}

		this.contentBlock.destroy();
		if( clone ) {
			this.contentBlock = el.clone( true, true ).cloneEvents( el );
		} else {
			this.contentBlock = el;
		}
		this.contentBlock.inject( this.center );

		this.fireEvent( 'setContent', this.contentBlock );

		this.setCenterPosition();
	},

	setCenterPosition: function() {
		var width  = this.contentBlock.getStyle( 'width' ).toInt() + this.contentBlock.getStyle( 'padding-left' ).toInt() + this.contentBlock.getStyle( 'padding-right' ).toInt();
		this.center.setStyles( {
			'width': width,
			'margin-left': -1 * ( width / 2 ).toInt()
		} );
	},

	open: function() {
		this.opened = true;

		this.fireEvent( 'open', this.contentBlock );

		this.overlay.setStyles( {
			'top': -document.id( window ).getScroll().y,
			'height': document.id( window ).getScrollSize().y + document.id( window ).getScroll().y
		} );
		this.center.setStyle( 'top', document.id( window ).getScroll().y + this.options.topPosition );
		this.center.setStyle( 'opacity', 1 );

		this.overlay.setStyle( 'z-index', 99 ).tween( 'opacity', this.options.overlayOpacity );
	},

	close: function() {
		this.opened = false;

		this.fireEvent( 'close', this.contentBlock );

		this.center.setStyle( 'opacity', 0 );
		this.overlay.tween( 'opacity', 0 );
	}
} );