var Lightbox = {
	lbox : null,
	target : null,
	body : null,
	html : null,
	overflow : null,
	position: null,
	height : null,
	margin: null,
	scrollTop : null,
	params : null,
	
	_unbox : null,
	_move : null,
	
	box : function(id, params) {
		this.params = params || {}
		this._unbox = this._unbox || this.unbox.bindAsEventListener(this);
		this._move = this._move || this.move.bindAsEventListener(this);
		this.target = $(id);
		this.body = this.body || $(document.body);
		this.html = this.html || $(this.body.parentNode);
		
		if (!this.lbox) {
			this.lbox = $(document.createElement('div'));
			this.body.appendChild(this.lbox);
			this.html.setStyle({height: '100%'});
		}
		this.overflow = this.overflow || this.body.getStyle('overflow');
		this.position = this.position || this.body.getStyle('position');    
		this.height = this.height || this.body.getStyle('height');
		this.margin = this.body.getStyle('margin');
		this.scrollTop = document.viewport.getScrollOffsets()[1];

		window.scrollTo(0,0);
		
		this.lbox.setStyle({
			backgroundColor: this.params.color || '#000000',
			opacity: this.params.opacity || .8,
			position: 'absolute',
			top: 0,
			left: 0,
			height: '100%',
			width: '100%',
			zIndex: this.target.getStyle('z-index')-1,
			cursor: 'pointer'
		});

		Event.observe(this.lbox, 'click', this._unbox);

		if (this.params.left || this.params.top) {
			Event.observe(window, 'resize', this._move);
		}

		this.body.setStyle({
			overflow: 'hidden',
			position: 'relative',
			height: '100%',
			margin: 0
		});
		this.move();
		this.target.show();
		this.lbox.show();
	},

	unbox : function() {
		this.body.setStyle({
			overflow: this.overflow || '',
			position: this.position || '',
			height: this.height || '',
			margin: this.margin || ''
		});
		this.lbox.hide();
		this.target.hide();
		window.scrollTo(0, this.scrollTop);
	},

	move : function() {
		var center = this.getCenter();
		var left = this.params.left == 'center' ? center.left : this.params.left;
		var top = this.params.top == 'center' ? center.top : this.params.top;

		this.target.setStyle({
			left: left + 'px',
			top: top + 'px'
		})
	},

	getCenter : function() {
		var l = this.lbox.getWidth()/2 - this.target.getWidth()/2;
		var t = this.lbox.getHeight()/2 - this.target.getHeight()/2;
		return {left: l, top: t}
	}
}