/*
---
description: Simple overlay class for MooTools.

license: MIT-style

authors:
- Christopher Pitt

requires:
- core/1.2.4: Class.Extras
- core/1.2.4: Fx.Morph

provides: [Overlay]

...
*/

var Overlay = new Class({
    'Implements': [Options, Events],
    
    'options': {
        'color': '#000',
		'opacity': 0.7,
		'z-index': 1,
		'container': document.body,
        'duration': 100
    },
    
    'initialize': function(options)
    {
        this.setOptions(options);
        
        var self = this,
            container = document.id(self.options['container']),
            
            wrapper = new Element('div', {
                'styles': {
                    'position': 'absolute',
        			'left': 0,
        			'top': 0,
        			'visibility': 'hidden',
        			'overflow': 'hidden',
        			'z-index': self.options['z-index'] + 1
                }
            }).inject(container),
            
            iframe = new Element('iframe', {
    			'src': 'about:blank',
    			'frameborder': 1,
    			'scrolling': 'no',
                'styles': {
                    'position': 'absolute',
        			'top': 0,
        			'left': 0,
        			'width': '100%',
        			'height': '100%',
        			'filter': 'progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0)',
        			'opacity': 0,
        			'z-index': self.options['z-index'] + 2
                }
            }).inject(wrapper),
            
            overlay = new Element('div', {
                'styles': {
                    'position': 'absolute',
        			'left': 0,
        			'top': 0,
        			'width': '100%',
        			'height': '100%',
        			'background-color': self.options['color'],
        			'z-index': self.options['z-index'] + 3
                }
            }).inject(wrapper),
            
            morph = new Fx.Morph(wrapper, {
                'duration': self.options['duration']
            });
            
        self.container = wrapper;
        self.wrapper = wrapper;
        self.iframe = iframe;
        self.overlay = overlay;
        self.morph = morph;
		self.position();
		
		container.addEvents({
            'resize': self.position.bind(self),
            'scroll': self.position.bind(self)
        });
    },
	
	'position': function()
    {
        var self = this;        
		if(self.options.container == document.body)
        {
            var size = document.id(document.body).getScrollSize();
            
			self.wrapper.setStyles({
                'width': size.x,
                'height': size.y
            });
		}
        else
        {
			self.wrapper.setStyles(self.container.getCoordinates());
		}
	},
    
    'show': function()
    {     
		this.morph.start({
            'opacity': [0, this.options['opacity']]
        });
	},
	
	'hide': function()
    {      
		this.morph.start({
            'opacity': [this.options['opacity'], 0]
        });
	}
});