var RegioMask = new Class({

	Implements: [Events, Options],
	Extends: Regio,

	options: {
		fade: {
			enabled: true,
			value: 0.5
		},
		styles: {
			'background': '#000000',
			'position': 'absolute',
			'left': '0px',
			'top': '0px',
			'width': '100%',
			'zIndex': '999'
		}
	},

	initialize : function(element,options){
		/**
		 * Merge global class specified options.
		 * The global data are set in the file: js/%client%/frontent.js
		 */
		if( $type(document.blankoweb_client_settings) !== false ) {
			if( $type(document.blankoweb_client_settings.RegioMask) !== false ) {
				this.options = $merge(this.options,document.blankoweb_client_settings.RegioMask);
			}
		}

		this.setOptions(options);

		if( $type(element) === false ) {
			this.element = document.getElement('body');
		}

		this.destroy();
		this.add();
	},

	add: function () {

		this.Mask = new Element('div', {
			'id': 'RegioMask',
			'class': 'RegioMask overlayer',
			'styles': this.options.styles
		});

		this.Mask.setStyle('height',document.getScrollSize().y);

		if( this.options.fade.enabled === true ) {
			this.Mask.fade(this.options.fade.value);
		}

		this.Mask.inject(this.element);

	},
	
	destroy: function () {
		
		if( $chk($('RegioMask')) ) {
			$('RegioMask').destroy();
		}
		
	}


});