Type.registerNamespace( 'ControlTests' );

/// <summary>
/// RichUILoader constructor.
/// </summary>

ControlTests.RichUILoader = function( element ) {
    
    ControlTests.RichUILoader.initializeBase( this, [element] );
    
    this._opacity = 0;
    this._isWorking = false;
    this._fadeCancelValue = null;
    this._funcCancelValue = null;
    this._parentElement = null;
    this._fadeStep = 25;
    this._text = null;
    this._loadingTextPanel = null;
    
}

/// <summary>
/// RichUILoader prototype.
/// </summary>

ControlTests.RichUILoader.prototype = {

    /// <summary>
    /// Initializes this object.
    /// </summary>

    initialize : function() {
    
        ControlTests.RichUILoader.callBaseMethod( this, 'initialize' );
        
    },
    
    /// <summary>
    /// Gets the parent element.
    /// </summary>

    get_parentElement : function() {
        return this._parentElement;    
    },
    
    /// <summary>
    /// Sets the parent element.
    /// </summary>
    /// <param name="value">The parent element.</param>

    set_parentElement : function( value ) {
        
        if ( this._parentElement !== value ) {
        
            this._parentElement = value;
            this.raisePropertyChanged( 'parentElement' );
            
            $addHandlers( this._parentElement, { 'resize' : this._parentElementResize }, this );
        
        }
    
    },
    
    /// <summary>
    /// Gets the text panel element that is used to store the loading text.
    /// </summary>

    get_loadingTextPanel : function() {
        return this._loadingTextPanel;
    },
    
    /// <summary>
    /// Sets the text panel element that is used to store the loading text.
    /// </summary>
    /// <param name="value">The new loadingTextPanel element.</param>

    set_loadingTextPanel : function( value ) {
   
        if ( this._loadingTextPanel !== value ) {
            
            this._loadingTextPanel = value;
            this.raisePropertyChanged( 'loadingTextPanel' );
            
        }
    
    },
    
    /// <summary>
    /// Gets the text that will be displayed when the loader is visible.
    /// </summary>

    get_text : function() {
        return this._text;
    },
    
    /// <summary>
    /// Sets the text that will be displayed when the loader is visible.
    /// </summary>
    /// <param name="value">The new text.</param>
    
    set_text : function( value ) {
    
        if ( this._text !== value ) {
            
            this._text = value;
            if( this._loadingTextPanel ) {
                this._loadingTextPanel.innerHTML = value;
            }
            
            this.raisePropertyChanged( 'text' );
            
        }
    
    },
    
    /// <summary>
    /// Gets the fade step value.
    /// </summary>

    get_fadeStep : function() {
        return this._fadeStep;
    },
    
    /// <summary>
    /// Sets the fade step value.
    /// </summary>
    /// <param name="value">The fade step value.</summary>
    
    set_fadeStep : function( value ) {
    
        if ( this._fadeStep !== value ) {
            
            this._fadeStep = value;
            this.raisePropertyChanged( 'fadeStep' );
            
        }
    
    },
    
    /// <summary>
    /// Handles the resize event raised by the parent element. Stretches the 
    /// loader to fit the real estate of the parent.
    /// </summary>
    
    _parentElementResize : function() {
        
        this.get_element().style.width = this._parentElement.offsetWidth + 'px';
        this.get_element().style.height = this._parentElement.offsetHeight + 'px';
        
        this._repositionContents();

    },
    
    /// <summary>
    /// Repositions the contents of the panel.
    /// </summary>
    
    _repositionContents : function() {
    
        var loader = this.get_element().childNodes[ 0 ];
        loader.style.position = 'absolute';
        loader.style.left = ( ( this.get_element().offsetWidth / 2 ) - ( loader.offsetWidth / 2 ) ) + 'px';
        loader.style.top = ( ( this.get_element().offsetHeight / 2 ) - ( loader.offsetHeight / 2 ) ) + 'px';
    
    },
    
    /// <summary>
    /// Cancels the fading operation.
    /// </summary>

    cancelFade : function() {
    
        if ( this._fadeCancelValue ) {
            clearTimeout( this._fadeCancelValue );
        }
        
        if ( this._funcCancelValue ) {
            clearTimeout( this._funcCancelValue );
        }

        this._fadeCancelValue = null;
        this._isWorking = false;
    
    },
    
    /// <summary>
    /// Fades in the current object.
    /// </summary>
    /// <param name="func">The function that is to be invoked once the fade 
    /// process has completed.</param>
    
    fadeIn : function( func ) {
                
        if ( !this._isWorking ) {
            
            this._repositionContents();            
            this.get_element().style.visibility = 'visible';
            var delay = 1000 - ( 100 * ( this._opacity / 10 ) );
            
            if ( delay == 0 ) {
                
                if ( func ) {
                    eval( func );
                } 
                
            } else {

                this._isWorking = true;
                this._fadeInElement();
                
                if ( func ) {
                    this._funcCancelValue = setTimeout( func, delay );
                }
                
            }
            
        }
        
    },
    
    /// <summary>
    /// Fades out the current object.
    /// </summary>

    fadeOut : function() {

//        if ( this._isWorking ) {
            this.cancelFade();        
//        } 

        this._isWorking = true;
        this._fadeOutElement();

    },
    
    /// <summary>
    /// Helper function that recursively fades in the current object.
    /// </summary>

    _fadeInElement : function() {

        var nextOpacity = this._opacity + this._fadeStep;
       
        if ( nextOpacity >= 100 ) {

            this._opacity = 100;
            this.get_element().style.opacity = 1;
            this.get_element().style.filter = "alpha( opacity=100 );";  
      
            this._isWorking = false;
            return;

        } else {

            this._opacity = nextOpacity;
            this.get_element().style.opacity = this._opacity / 100;
            this.get_element().style.filter = "alpha( opacity=" + this._opacity + " );";
            
            this._fadeCancelValue = setTimeout( Function.createDelegate( this, this._fadeInElement ), 100 );

        }

    },
    
    /// <summary>
    /// Helper function that recursively fades out the current object.
    /// </summary>

    _fadeOutElement : function() {

        var nextOpacity = this._opacity - this._fadeStep;
        
        if ( nextOpacity < 0 ) {

            this._opacity = 0;
            this.get_element().style.opacity = 0.0;
            this.get_element().style.filter = "alpha( opacity = 0 );";        
            this.get_element().style.visibility = 'hidden';
            
            this._isWorking = false;
            return;

        } else {

            this._opacity = nextOpacity;
            this.get_element().style.opacity = ( this._opacity / 100 );
            this.get_element().style.filter = "alpha( opacity=" + this._opacity + " );";

            this._fadeCancelValue = setTimeout( Function.createDelegate( this, this._fadeOutElement ), 100 ); 

        }
   
    },
    
    /// <summary>
    /// Release resources before the control is disposed.
    /// </summary>
    
    dispose : function() {

        if ( this._parentElement ) {        
            $clearHandlers( this._parentElement );
        }
        
        ControlTests.RichUILoader.callBaseMethod( this, 'dispose' );
        
    }
                
} // ControlTests.RichUILoader.prototype

ControlTests.RichUILoader.registerClass( 'ControlTests.RichUILoader', Sys.UI.Control );

if ( typeof( Sys ) != 'undefined' ) Sys.Application.notifyScriptLoaded();


if(typeof(Sys)!=='undefined')Sys.Application.notifyScriptLoaded();