var _updateProgressDiv;
 var _backgroundDiv;
 var _updatePanel;
 var flag = 0;

 function pageLoad(sender, args){  
     //  register for our events
     if (flag == 0)
     {
  Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(beginRequest);
  Sys.WebForms.PageRequestManager.getInstance().add_endRequest(endRequest); 
     }      
 }
 function beginRequest(sender, args){ 
     if (Number(document.getElementById('ctl00_hf_rank').value) > 0)
     {   
  //  get the updateprogressdiv
  _updateProgressDiv = $get('updateProgressDiv' + document.getElementById('ctl00_hf_rank').value);
  //  fetch the updatepanel
  _updatePanel = $get('updatePanelArea' + document.getElementById('ctl00_hf_rank').value);
  
  //  create the div that we will position over the updatepanel
  //  during postbacks
  _backgroundDiv = document.createElement('div');
  _backgroundDiv.style.display = 'none';
  _backgroundDiv.style.zIndex = 10000;
  _backgroundDiv.className = 'updateBackground';
  
  //  add the element to the DOM
  _updatePanel.parentNode.appendChild(_backgroundDiv);
     
  // make it visible
  _updateProgressDiv.style.display = '';	  
  _backgroundDiv.style.display = '';
  
  // get the bounds of both the updatepanel and the progress div
  var updatePanelBounds = Sys.UI.DomElement.getBounds(_updatePanel);
  var updateProgressDivBounds = Sys.UI.DomElement.getBounds(_updateProgressDiv);
      
  //  center of gridview
  var x = updatePanelBounds.x + Math.round(updatePanelBounds.width / 2) - Math.round(updateProgressDivBounds.width / 2);
  var y = updatePanelBounds.y + Math.round(updatePanelBounds.height / 2) - Math.round(updateProgressDivBounds.height / 2);	    
  
  //  set the dimensions of the background div to the same as the gridview
  _backgroundDiv.style.width = updatePanelBounds.width + 'px';
  _backgroundDiv.style.height = updatePanelBounds.height + 'px';      

  //	set the progress element to this position
  Sys.UI.DomElement.setLocation(_updateProgressDiv, x, y);     
  //  place the div over the gridview
  Sys.UI.DomElement.setLocation(_backgroundDiv, updatePanelBounds.x, updatePanelBounds.y);  
  flag = 1;
     } 
     else if (Number(document.getElementById('ctl00_hf_rank').value) < 0)
     {   
  //  get the updateprogressdiv
  _updateProgressDiv = $get('updateProgressDiv' + document.getElementById('ctl00_hf_rank').value);
  //  fetch the updatepanel
  _updatePanel = $get('updatePanelArea' + document.getElementById('ctl00_hf_rank').value);
  
  //  create the div that we will position over the updatepanel
  //  during postbacks
  _backgroundDiv = document.createElement('div');
  _backgroundDiv.style.display = 'none';
  _backgroundDiv.style.zIndex = 10000;
  _backgroundDiv.className = 'updateBackground';
  
  //  add the element to the DOM
  _updatePanel.parentNode.appendChild(_backgroundDiv);
     
  // make it visible
  _updateProgressDiv.style.display = '';	  
  _backgroundDiv.style.display = '';
  
  // get the bounds of both the updatepanel and the progress div
  var updatePanelBounds = Sys.UI.DomElement.getBounds(_updatePanel);
  var updateProgressDivBounds = Sys.UI.DomElement.getBounds(_updateProgressDiv);
      
  //  center of gridview
  var x = updatePanelBounds.x + Math.round(updatePanelBounds.width / 2) - Math.round(updateProgressDivBounds.width / 2);
  var y = updatePanelBounds.y + Math.round(updatePanelBounds.height / 2) - Math.round(updateProgressDivBounds.height / 2);	    
  
  //  set the dimensions of the background div to the same as the gridview
  var widthBackground = Number(updatePanelBounds.width) + 15;
  var heightBackground = Number(updatePanelBounds.height) + 10;
  _backgroundDiv.style.width = widthBackground + 'px';
  _backgroundDiv.style.height = heightBackground + 'px';      

  //	set the progress element to this position
  Sys.UI.DomElement.setLocation(_updateProgressDiv, x, y);     
  //  place the div over the gridview
  Sys.UI.DomElement.setLocation(_backgroundDiv, 0, 0); 
  flag = 1; 
     }    
 }

 function endRequest(sender, args) {
     if (document.getElementById('ctl00_hf_rank').value != '0')
     {   
  // make it invisible
  _updateProgressDiv.style.display = 'none';
  _backgroundDiv.style.display = 'none';
     }
 }