var FadeManager = Class.create({
    initialize: function () {
        this.fadeLayer = new Element('div', { 'id': 'fadeLayer' });
        this.insertIntoBody();
        this.setStyle();
    },
	fadeSpecificArea: function () {
		var specificArea = $('specificFadeArea');
		
		if (specificArea == undefined) {
			specificArea = new Element('div', { 'id': 'specificFadeArea' });
			$$('body')[0].insert({ top: specificArea });
		}
		
		specificArea.setStyle({
                backgroundColor: '#000',
                width: '100%',
                height: '100%',
                top: 0,
                left: 0,
                opacity: 0,
                position: 'fixed',
                zIndex: 30,
                display: 'none'
            });
			
			
			
			specificArea.show();
        specificArea.fade({ duration: 0, from: 0, to: 0.5 });
	
	},
	unfadeSpecificArea: function () {
	var specificArea = $('specificFadeArea');
		specificArea.fade({ duration: 0, from: 0.5, to: 0 });
        specificArea.hide();
	
	},
    fadePage: function () {
        this.setStyle();
        this.fadeLayer.show();
        this.fadeLayer.fade({ duration: 0, from: 0, to: 0.5 });
    },
    unfadePage: function () {
        this.fadeLayer.fade({ duration: 0, from: 0.5, to: 0 });
        this.fadeLayer.hide();
    },
    insertIntoBody: function () {
        var body = $$('body')[0];
        var existFadeLayer = $('fadeLayer');
        if (existFadeLayer == null) {
            body.insert({ top: this.fadeLayer });
        }
    },
    setStyle: function () {

        Prototype.Browser.IE6 = Prototype.Browser.IE && parseInt(navigator.userAgent.substring(navigator.userAgent.indexOf("MSIE") + 5)) == 6;

        if (Prototype.Browser.IE6) {
            this.fadeLayer.setStyle({
                backgroundColor: '#000',
                width: $$('body')[0].getWidth() + 'px',
                height: document.documentElement.clientHeight + 'px',
                opacity: 0,
                position: 'absolute',
                top: 0,
                left: 0,
                zIndex: 19,
                display: 'none'
            });
        }
        else {
            this.fadeLayer.setStyle({
                backgroundColor: '#000',
                width: '100%',
                height: '100%',
                top: 0,
                left: 0,
                opacity: 0,
                position: 'fixed',
                zIndex: 19,
                display: 'none'
            });
        }
    }
});