﻿/*
Javascript web overlay control serving as modal dialogue panel
*/

var WebOverlay = Class.create();

WebOverlay.prototype =
{
    // Constructor
    initialize : function()
    {
        this.adaptPositionEventHandler;
        
        // Declare variable holding the current opacity setting
        this.Opacity;
        
        // Declare variable holding the element
        this._htmlContainer;
        
        // Call Build function
        this.Build();
    },
    
    Build : function()
    {
        try
        {
            // Create overlay element
            this._htmlContainer = Builder.node('div', { id: 'WEBOVERLAY', style: 'left:0px;margin:0px;z-index:100;position:absolute;background-color:#999999;display:none;' });               
        }
        catch(e)
        {
            Logs.WriteException('EXCEPTION_GENERAL', 'Build', arguments, 'WEBOVERLAY', null, e, false)
        }
    },
    
    Show : function(piOpacity)
    {
        if(piOpacity != null)
        {
            this.Opacity = piOpacity;
        }
        else
        {
            this.Opacity = 1.0;
        }
        
        if($('WEBOVERLAY') != null)
        {
            return;
        }
        
        // Get the size of the browser window
        var winSize = Helpers.GetWindowSize();
        // Get the window's scroll offset
        var scrollOffset = Helpers.GetWindowScrollOffset();
        // Calculate width and height of the overlay element
        var overlayWidth = winSize.width;
        var overlayHeight = winSize.height;
            
        this._htmlContainer.style.top =  + scrollOffset.top + 'px';
        this._htmlContainer.style.width = overlayWidth + 'px';
        this._htmlContainer.style.height = overlayHeight + 'px';
        
        // Set window event handler
        this.adaptPositionEventHandler = this.AdaptPosition.bindAsEventListener(this);
        Event.observe(window, 'scroll', this.adaptPositionEventHandler);
        
        // Append the overlay element to the document body
        document.body.appendChild(this._htmlContainer);
        // Create appear effect for the overlay
        Effect.Appear(this._htmlContainer, { duration: 0.8, to: this.Opacity });
    },
    
    Hide : function()
    {
        if($('WEBOVERLAY') == null)
        {
            return;
            
        }
        
        Event.stopObserving(window, 'scroll', this.adaptPositionEventHandler);
        // Create appear effect for the overlay
        Effect.Fade(this._htmlContainer, { duration: 0.8, from: this.Opacity, to: 0.0 });
        // Remove overlay element from the document body
        window.setTimeout(function(){ if($('WEBOVERLAY') != null){ $('WEBOVERLAY').style.display = 'none'; $('WEBOVERLAY').parentNode.removeChild($('WEBOVERLAY')); } }, 900);
    },
    
    AdaptPosition : function(piEvent)
    {
        // Get the window's scroll offset
        var scrollOffset = Helpers.GetWindowScrollOffset();
        
        // Set style property top of the overlay
        this._htmlContainer.style.top = scrollOffset.top + 'px';
    }
}