var topLayer = Class.create({
	bottomLayerId: 0,
	topLayerId: 0,
	
	// Create new layer
	initialize: function(content) {
		// Close any other layer
		this.close();
		
		// Create id for bottom and top layer
		this.bottomLayerId = "layer-" + Math.round((Math.random() * 999999));
		this.topLayerId = "layer-" + Math.round((Math.random() * 999999));
		
		// Create grey bottom layer
		var bottomLayer = new Element('div', {'class': 'bottomLayer', 'id': this.bottomLayerId});
		
		// Create top layer
		var topLayer = new Element('div', {'class': 'topLayer', 'id': this.topLayerId}).update('<div class="box"><div class="top"></div><div class="middle"><div class="content" style="overflow: hidden;">' + content + '</div><div class="clear"></div><div class="bottom"></div></div>');
		
		// Append bottom and top layer in body
		document.body.appendChild(bottomLayer);
		document.body.appendChild(topLayer);
		
		// Center top
		topLayer.setStyle({top: '20%',
						   marginTop: '-' + Math.round(topLayer.offsetHeight / 2) + 'px'});

		// Center left
		
		topLayer.setStyle({		   left: '50%',
						   marginLeft: '-' + Math.round(topLayer.offsetWidth / 2) + 'px'});
						   
		
		// Get height for body
		height = document.body.clientHeight + 30;
		
		if (!height > 0)
			height = '100%';
		else
			height = height + 'px';
			
		// Set full height on bottom layer
		bottomLayer.setStyle({height: height});
		
		// Set observe on bottom layer
		bottomLayer.observe('click', this.close.bind(this));
	},
	
	
	// Remove layer
	close: function() {
		// If bottom and top layer exists
		if ($(this.bottomLayerId) && $(this.topLayerId)) {
			// Remove bottom layer
			$(this.bottomLayerId).remove();
			
			// Remove top layer
			$(this.topLayerId).remove();
		}
	}
});

var topLayer2 = Class.create({
	bottomLayerId: 0,
	topLayerId: 0,
	
	// Create new layer
	initialize: function(content) {
		// Close any other layer
		this.close();
		
		// Create id for bottom and top layer
		this.bottomLayerId = "layer-" + Math.round((Math.random() * 999999));
		this.topLayerId = "layer-" + Math.round((Math.random() * 999999));
		
		// Create grey bottom layer
		var bottomLayer = new Element('div', {'class': 'bottomLayer', 'id': this.bottomLayerId});
		
		// Create top layer
		var topLayer = new Element('div', {'class': 'topLayer', 'id': this.topLayerId}).update('<div style="cursor: pointer;">' + content + '</div>');
		
		// Append bottom and top layer in body
		document.body.appendChild(bottomLayer);
		document.body.appendChild(topLayer);
		
		// Center left		
		topLayer.setStyle({ marginTop: "20px",
				    left: "50%",
				    marginLeft: "-330px"});
					
		// Set full height on bottom layer
		bottomLayer.setStyle({height: "1030px"});
		
		// Set observe on bottom layer
		bottomLayer.observe('click', this.close.bind(this));
		topLayer.observe('click', this.close.bind(this));
	},
	
	
	// Remove layer
	close: function() {
		// If bottom and top layer exists
		if ($(this.bottomLayerId) && $(this.topLayerId)) {
			// Remove bottom layer
			$(this.bottomLayerId).remove();
			
			// Remove top layer
			$(this.topLayerId).remove();
		}
	}
});
