var TT_Overlay = Class.create();
TT_Overlay.prototype = {
    initialize: function (options) {
        this.style = {};
        this.isEffect =  false;
        this.afterFinish = new Function;
        Object.extend(this, options);
        this.tt_create();
    },
    
    tt_create: function () {
        var style = '';
        style += 'top: 0;';
        style += 'left: 0;';
        style += 'width: 100%;';
        style += 'height: 100%;';
        style += 'opacity: 0.5;';
        style += 'display: none;';
        style += 'z-Index: 10000;';
        style += 'position: fixed;';
        style += 'background-color: #B6CDDD;';
        this.overlay = new Element('div',{'style':style});
        Object.extend(this.overlay.style, this.style);
        document.body.appendChild(this.overlay);
    },
    
    tt_show: function () {
        this.overlay.show();
        if (this.isEffect) {
    		new Effect.Fade(this.overlay, {
				from: 0, to: .5, 
				duration: .50,
				afterFinish: this.afterFinish
    		});
        }
		return this.overlay;
    },

    tt_close: function () {
        if (!this.overlay) return;
        if (this.isEffect) {
    		new Effect.Fade(this.overlay, {
				from: .5, to: 0, 
				duration: .50,
				afterFinish: function () {
				    if (!this.overlay) return;
				    this.overlay.remove();
				    this.overlay = undefined;
				}.bind(this)
    		});
        } else { 
            this.overlay.remove();
    	    this.overlay = undefined;
        }
    }    
}

Waitting = {
    tt_show: function () {
        var imgWaitting = new Element('img', {
            'src'   : ANTIKGUIDE_PATH+'img/spinner.gif',
            'style' : 'position: absolute'
        }); 
        var opt = {isEffect: true};
        this.Overlay = new TT_Overlay(opt);
        var divOverlay = this.Overlay.tt_show();       
        divOverlay.appendChild(imgWaitting);     
        var w = document.viewport.getWidth();
        var h = document.viewport.getHeight();
        imgWaitting.style['left'] = w/2 + 'px';
        imgWaitting.style['top'] = h/2 + 'px';
    },

    tt_close: function () {
        try {this.Overlay.tt_close();
        } catch (e) {}
    }
}

Shadow = {
    tt_create: function (element) {
        var att = {id: element.id + '_shadow'};
        this.shadow = new Element('div', att);
        this.shadow.style['zIndex'] = '1';
        this.shadow.style['opacity'] = 0.5;
        this.shadow.style['position'] = 'fixed';
        this.shadow.style['margin'] = '3px 0 0 3px';
        this.shadow.style['top'] = element.style['top'];
        this.shadow.style['left'] = element.style['left'];
        this.shadow.style['width'] = element.getWidth() + 'px';
        this.shadow.style['height'] = element.clientHeight + 'px';
        this.shadow.style['backgroundColor'] = '#666';
        var htmlBody=document.body;
        htmlBody.appendChild(this.shadow);
        return this.shadow;
    },
    
    tt_update: function (element) {
        this.shadow.style['width'] = element.getWidth() + 'px';
        this.shadow.style['height'] = element.clientHeight + 'px';
    }
}