//  true when a header is currently being resized
var _isResizing;
//  a reference to the header column that is being resized
var _element;
//  an array of all of the tables header cells
var _ths;

var _PostbackEle;

function GridPageLoad(_table, _gridTable, _GridToolbarDiv, args){
/*  ---------       PAGE LOAD statements required for displaying LOADING-MESSAGE  ---------   */
    
    if(_table != null)
    {
        //  create the div that we will position over the table
        //  during postbacks
        _backgroundDiv = document.createElement('div');
        _backgroundDiv.style.display = 'none';
        _backgroundDiv.style.zIndex = 100000;
        _backgroundDiv.className = 'grid-background';
        
        //  add the element to the DOM
        _table.parentNode.appendChild(_backgroundDiv);
    /*  ---------       PAGE LOAD statements required for displaying LOADING-MESSAGE  ---------   */
        
        if((_gridTable != null) && (_GridToolbarDiv != null))
        {
            if(_table.rows.length <= 1)
            {   _GridToolbarDiv.style.display='none';
                _gridTable.className='pg-grid-table-nobg';}
            else
            {   _GridToolbarDiv.style.display='block';
                _gridTable.className='pg-grid-table';}
        }
        
        
    /*  ---------       PAGE LOAD statements required for COLUMN-RESIZING  ---------   */
        
        //  get all of the th elements from the gridview
        _ths = _table.getElementsByTagName('TH');
        
        //  if the grid has at least one th element
        if(_ths.length > 1){
        
            for(i = 0; i < _ths.length; i++){
                //  determine the widths
                _ths[i].style.width = Sys.UI.DomElement.getBounds(_ths[i]).width + 'px';
            
                //  attach the mousemove and mousedown events
                if(i < _ths.length - 1){
                    $addHandler(_ths[i], 'mousemove', _onMouseMove);
                    $addHandler(_ths[i], 'mousedown', _onMouseDown);
                }
            }

            //  add a global mouseup handler            
            $addHandler(document, 'mouseup', _onMouseUp);
            //  add a global selectstart handler
            $addHandler(document, 'selectstart', _onSelectStart);
        }       
    /*  ---------       PAGE LOAD statements required for COLUMN-RESIZING  ---------   */
    }
    else
    {
        _updateProgressDiv.style.display = 'none';
        _backgroundDiv.style.display = 'none';
    }   
}      

/*  ---------       'beginRequest' required for displaying LOADING-MESSAGE  ---------   */
function GridBeginRequest(_table, _backgroundDiv, _updateProgressDiv, sender, args, _refreshButton, _pagingDropdown){
    _PostbackEle = args.get_postBackElement(); 
    
    if (_refreshButton == null)
    {_refreshButton = 'id';}
    
    if (_pagingDropdown == null)
    {_pagingDropdown = 'id';}
    
    if (_PostbackEle == null)
    {_PostbackEle = 'id';}
    /*else
    {alert(_PostbackEle.id);}*/
    
   // alert('GridBeginRequest :: _PostbackEle = ' + _PostbackEle.id + '   ,   _refreshButton = ' + _refreshButton.id);
    
    if((_table.id == _PostbackEle.id) || (_refreshButton.id == _PostbackEle.id) || (_pagingDropdown.id == _PostbackEle.id))
    //if(_PostbackEle.id ==  _table.id)
    {
        if(_table != null)
        {
            // get the bounds of both the table and the progress div
            var tableBounds = Sys.UI.DomElement.getBounds(_table);
            var updateProgressDivBounds = Sys.UI.DomElement.getBounds(_updateProgressDiv);
                       
            //  center of gridview
            var x = tableBounds.x + Math.round(tableBounds.width / 2) - Math.round(updateProgressDivBounds.width / 2);
            var y = tableBounds.y + Math.round(tableBounds.height / 2) - Math.round(updateProgressDivBounds.height / 2);	    
            var z = tableBounds.y + Math.round(tableBounds.height / 2) - Math.round(updateProgressDivBounds.height / 2);	        //tableBounds.y;
            
            if ((+tableBounds.height) > 500)
            {z = (+tableBounds.y) + 150;}
            if ((+tableBounds.height) < 100)
            {z = tableBounds.y;}
            //  set the dimensions of the background div to the same as the table
            _backgroundDiv.style.width = tableBounds.width + 'px';
            _backgroundDiv.style.height = tableBounds.height + 'px';             
            
            //	set the progress element to this position
            Sys.UI.DomElement.setLocation(_updateProgressDiv, x, z);   
            //  place the div over the table
            Sys.UI.DomElement.setLocation(_backgroundDiv, tableBounds.x, tableBounds.y); 
            
            // make it visible
            _updateProgressDiv.style.display = '';
            _backgroundDiv.style.display = '';
        } 
        else
        {
            _updateProgressDiv.style.display = 'none';
            _backgroundDiv.style.display = 'none';
        }
    }
}

/*  ---------       'endRequest' required for displaying LOADING-MESSAGE  ---------   */
function GridEndRequest(_table, _backgroundDiv, _updateProgressDiv, _gridTable, _GridToolbarDiv, sender, args, _refreshButton, _pagingDropdown) {
    if(_table != null)
    {
        if (_refreshButton == null)
        {_refreshButton = 'id';}
        
        if (_pagingDropdown == null)
        {_pagingDropdown = 'id';}
        
        if (_PostbackEle == null)
        {_PostbackEle = 'id';}

        //alert('GridEndRequest :: _PostbackEle = ' + _PostbackEle.id + '   ,   _refreshButton = ' + _refreshButton.id);

        if((_PostbackEle.id ==  _table.id) || (_PostbackEle.id ==  _refreshButton.id) || (_PostbackEle.id ==  _pagingDropdown.id))
        //if(_PostbackEle.id ==  _table.id)
        {
            // make it invisible
            _updateProgressDiv.style.display = 'none';
            _backgroundDiv.style.display = 'none';
        }
        
        if((_gridTable != null) && (_GridToolbarDiv != null))
        {
            if(_table.rows.length <= 1)
            {   _GridToolbarDiv.style.display='none';
                _gridTable.className='pg-grid-table-nobg';}
            else
            {   _GridToolbarDiv.style.display='block';
                _gridTable.className='pg-grid-table';}
        }
    }
}



/*  ---------       '_onMouseMove' required for COLUMN-RESIZING  ---------   */
function _onMouseMove(args){    
    if(_isResizing){
        
        //  determine the new width of the header
        var bounds = Sys.UI.DomElement.getBounds(_element); 
        var width = args.clientX - bounds.x;
        
        //  we set the minimum width to 1 px, so make
        //  sure it is at least this before bothering to
        //  calculate the new width
        if(width > 1){
        
            //  get the next th element so we can adjust its size as well
            var nextColumn = _element.nextSibling;
            var nextColumnWidth;
            if(width < _toNumber(_element.style.width)){
                //  make the next column bigger
                nextColumnWidth = _toNumber(nextColumn.style.width) + _toNumber(_element.style.width) - width;
            }
            else if(width > _toNumber(_element.style.width)){
                //  make the next column smaller
                nextColumnWidth = _toNumber(nextColumn.style.width) - (width - _toNumber(_element.style.width));
            }   
            
            //  we also don't want to shrink this width to less than one pixel,
            //  so make sure of this before resizing ...
            if(nextColumnWidth > 1){
                _element.style.width = width + 'px';
                nextColumn.style.width = nextColumnWidth + 'px';
            }
        }
    }   
    else{
        //  get the bounds of the element.  If the mouse cursor is within
        //  2px of the border, display the e-cursor -> cursor:e-resize
        var bounds = Sys.UI.DomElement.getBounds(args.target);
        if(Math.abs((bounds.x + bounds.width) - (args.clientX)) <= 2) {
            args.target.style.cursor = 'e-resize';
        }  
        else{
            args.target.style.cursor = '';
        }          
    }         
}

/*  ---------       '_onMouseDown' required for COLUMN-RESIZING  ---------   */
function _onMouseDown(args){
    //  if the user clicks the mouse button while
    //  the cursor is in the resize position, it means
    //  they want to start resizing.  Set _isResizing to true
    //  and grab the th element that is being resized
    if(args.target.style.cursor == 'e-resize') {
        _isResizing = true;
        _element = args.target;               
    }                    
} 
        
/*  ---------       '_onMouseUp' required for COLUMN-RESIZING  ---------   */
function _onMouseUp(args){
    //  the user let go of the mouse - so
    //  they are done resizing the header.  Reset
    //  everything back
    if(_isResizing){
        
        //  set back to default values
        _isResizing = false;
        _element = null;
        
        //  make sure the cursor is set back to default
        for(i = 0; i < _ths.length; i++){   
            _ths[i].style.cursor = '';
        }
    }
} 

/*  ---------       '_onSelectStart' required for COLUMN-RESIZING  ---------   */
function _onSelectStart(args){
    // Don't allow selection during drag
    if(_isResizing){
        args.preventDefault();
        return false;
    }
}       

/*  ---------       '_toNumber' required for COLUMN-RESIZING  ---------   */
function _toNumber(m) {
    //  helper function to peel the px off of the widths
    return new Number(m.replace('px', ''));
}