﻿Mask = Class.create({
	initialize: function(area, color, opacity) {
		this.color = (color) ? color : 'black';
		this.opacity = (opacity) ? opacity : 0.25;
		this.area = $(area);
		this.isHidden = true;
	  return this;
	},
	
	getPageSize: function() {
	    var xScroll, yScroll;
		
		if (window.innerHeight && window.scrollMaxY) {	
			xScroll = window.innerWidth + window.scrollMaxX;
			yScroll = window.innerHeight + window.scrollMaxY;
		} else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
			xScroll = document.body.scrollWidth;
			yScroll = document.body.scrollHeight;
		} else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
			xScroll = document.body.offsetWidth;
			yScroll = document.body.offsetHeight;
		}
		
		var windowWidth, windowHeight;
		
		if (self.innerHeight) {	// all except Explorer
			if(document.documentElement.clientWidth){
				windowWidth = document.documentElement.clientWidth; 
			} else {
				windowWidth = self.innerWidth;
			}
			windowHeight = self.innerHeight;
		} else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
			windowWidth = document.documentElement.clientWidth;
			windowHeight = document.documentElement.clientHeight;
		} else if (document.body) { // other Explorers
			windowWidth = document.body.clientWidth;
			windowHeight = document.body.clientHeight;
		}	
		
		// for small pages with total height less then height of the viewport
		if(yScroll < windowHeight){
			pageHeight = windowHeight;
		} else { 
			pageHeight = yScroll;
		}
		
		// for small pages with total width less then width of the viewport
		if(xScroll < windowWidth){	
			pageWidth = xScroll;		
		} else {
			pageWidth = windowWidth;
		}
		
		return {width: pageWidth, height: pageHeight};
	},
	
	show: function() {
		 if (this.isHidden) {
			  if (this.area == $(document.body)) {
				this.top = 0;
				this.left = 0;
				this.width = this.getPageSize().width;
				this.height = this.getPageSize().height;
			} else {
				this.top = this.area.viewportOffset().top;
				this.left = this.area.viewportOffset().left;
				this.width = this.area.getWidth();
				this.height = this.area.getHeight();
			}
			
			this.element = new Element('div', {id: 'mask_' + this.color}).setStyle({
				position: 'absolute',
				display: 'none',
				background: this.color,
				zIndex: 100,
				top: this.top + 'px',
				left: this.left + 'px',
				width: this.width + 'px',
				height: this.height + 'px'
			}).setOpacity(this.opacity);
			
			$(document.body).insert(this.element);
			
			Effect.Appear(this.element, {
				from: 0,
				to: this.opacity,
				duration: 0.35
			});
			this.isHidden = false;
		}
		return this;
	},

	hide: function() {
		 if (!this.isHidden) {
			  Effect.Appear(this.element, {
				from: this.opacity,
				to: 0,
				duration: 0.35,
				afterFinish: function() {
					this.element.remove();
					this.element = null;
				}.bind(this)
			});
			this.isHidden = true;
		}
	}
});

Lightbox = Class.create({
	initialize: function(obj) {
		this.id = obj.id;
		this.classes = 'lightbox';
		
		if (obj.classes) {
			this.classes = this.classes + ' ' + (obj.classes.length > 0 ? obj.classes.join(' ') : '');
		}
		
		this.width = obj.width;
		this.headerTxt = obj.header;
		this.contentEl = obj.content;
		
		this.closeClick = this.close.bindAsEventListener(this);
		
		this.closeButton = new Element('div', {
			'class': 'close'
		}).observe('click', this.closeClick);
		
		this.header = new Element('div', {
			'class': 'header'
		}).insert(this.closeButton).insert(this.headerTxt);
		
		this.content = new Element('div', {
			'class': 'content'
		}).insert(this.contentEl);
		
		this.element = new Element('div', {id: this.id, 'class': this.classes}).setStyle({
			width: this.width + 'px',
			position: 'absolute',
			top: document.viewport.getScrollOffsets().top + 200 + 'px',
			left: (document.viewport.getWidth() / 2) - (this.width / 2) + 'px',
			display: 'none'
		}).insert(this.header).insert(this.content);
		
		$(document.body).insert(this.element);
		
		new Draggable(this.id, {handle: this.header, starteffect: false, endeffect: false})
		
		this.open();
	},
	
	open: function() {
		this.mask = new Mask($(document.body), 'black', 0.25).show();
		
		Effect.Appear(this.element, {
			duration: 0.35,
			from: 0,
			to: 1.0,
			afterFinish: function() {
				this.element.show();
			}.bind(this)
		});
	},
	
	close: function() {
		this.mask.hide();
		
		Effect.Appear(this.element, {
			duration: 0.35,
			from: 1.0,
			to: 0,
			afterFinish: function() {
				this.element.remove();
			}.bind(this)
		});
	}
});

function donateLightbox() {
	var contentTxt = '<p>Dăruieşte pentru copiii României! Redirecţionează acum 2% din impozitul tău anual!</p>';
	contentTxt += '<p><a href="cererea_230_MCI.pdf">Descarcă formularul 230 pentru persoane fizice.</a></p>';
	contentTxt += '<p><a href="declaratia_200.pdf">Descarcă formularul 200 pentru persoane fizice autorizate, profesii liberale.</a></p>';
	
	new Lightbox({
		id: 'donateLightbox',
		width: 400,
		header: 'DONAŢI 2%',
		content: contentTxt
	});
}
