var imagebox = new Class({
	Implements: [Options,Events],
	initialize: function(options) {
		this.setOptions(options);
		this.overlay = new Element('div').injectInside(document.body);
		this.overlay.set('id', 'imagebox_overlay');
		this.overlay.setStyles({display: 'none'});
		
		this.container = $('imagebox_container');
		if( !this.container ) {
			this.container = new Element('div').injectInside(document.body);
			this.container.setStyles({
				width: 800,
				height: 600,
				backgroundColor: '#FFF',
				'-moz-box-shadow':'3px 3px 5px #000',
				'-webkit-box-shadow':'2px 2px 8px #000',
				'-moz-border-radius':'14px 14px 14px 14px',
				'-webkit-border-radius':'14px 14px 14px 14px',
				position: 'absolute',
				left: 0,
				top: 0,
				border: '1px solid #000',
				padding: 10,
				overflow: 'hidden',
				display: 'none',
				zIndex: 3
			});
		}
		
		this.container.empty();
		this.containerInner = new Element('div');
		this.containerInner.set('id', 'imagebox_container');
		this.container.adopt(this.containerInner);
		this.containerInner.setStyles({
			width: 780,
			height: 550
		});
		
		var self = this;
		window.addEvent('resize', function(){
			self.resize();
		});
		
		this.elements = $$('a.imagebox');
		$each(this.elements, function(a, index){
			a.addEvent('click', function(e) {
				self.show();
				a.store('index', index);
				self.containerInner.load(a.rel);
				e.stop();
				return false;
			});
		});
		
		this.closebuttonRow = new Element('div');
		this.closebutton = new Element('img');
		this.closebutton.set('src', '/media/images/window-close.png');
		this.closebuttonRow.adopt(this.closebutton);
		this.container.adopt(this.closebuttonRow);
		this.closebuttonRow.setStyles({
			position:'absolute',
			right: 10,
			bottom: 10
		});
		
		this.closebutton.setStyles({cursor:'pointer'});
		this.closebutton.addEvent('click', function() {
			self.close();
		});
		
		self.resize();
		this.close();
	},
	resize: function() {
		var self = this;
		this.overlay.setStyles({
			position: 'absolute',
			left: 0,
			top: 0,
			backgroundColor: '#000',
			opacity: 0.7,
			width: window.getSize().x,
			height: window.getSize().y
		});
		
		this.container.setStyles({
			position: 'absolute',
			left: (window.getSize().x / 2) - self.container.getSize().x / 2,
			top: 100
		});
	},
	show: function() {
		var self = this;
		this.containerInner.empty();
		var db = document.getElementsByTagName("body")[0];
		var ht = document.getElementsByTagName("html")[0];
		db.style.overflow = "hidden";
		ht.style.overflow = "hidden";

		this.container.setStyles({
			'background-image':'none',
			display:'',
			position: 'absolute',
			left: (window.getSize().x / 2) - 400,
			top: 100
		});

		this.overlay.setStyles({display:''});
		self.container.setStyles({
			'background-image':'url(/media/images/ajax-loader.gif)',
			'background-repeat':'no-repeat',
			'background-position':'center center'
		});
	},
	close: function() {
		this.container.setStyles({display:'none'});
		this.overlay.setStyles({display:'none'});
		var db = document.getElementsByTagName("body")[0];
		var ht = document.getElementsByTagName("html")[0];
		db.style.overflow = "";
		ht.style.overflow = "";
	}
});

document.addEvent('domready', function() {
	new imagebox;
});