function DataGrid( id )
{
  this.id = id;
  this.fieldTitleMap = new Object();
  this.fieldSequence = new Array();
  this.contentList = new Array();
  this.showingWaiting = false;
}
DataGrid.prototype.DataGrid = DataGrid;

DataGrid.prototype.setContent = function(contentList)
{
  this.contentList = contentList;
}
DataGrid.prototype.setFields = function(fieldTitleMap, fieldSequence)
{
  this.fieldTitleMap = fieldTitleMap;
  this.fieldSequence = fieldSequence;
}
DataGrid.prototype.getFieldTitleMap = function()
{
  return this.fieldTitleMap;
}
DataGrid.prototype.getFieldSequence = function()
{
  return this.fieldSequence;
}
DataGrid.prototype.getContentItem = function(id)
{
  return this.contentList[id];
}
DataGrid.prototype.getContentValue = function(id, field)
{
  if (this.contentList[ id ] && this.contentList[ id ][ field ])
    return this.contentList[ id ][ field ];
  return "";
}
DataGrid.prototype.getLength = function()
{
  return this.contentList.length;
}
DataGrid.prototype.getId = function()
{
  return this.id;
}
DataGrid.prototype.addColumn = function(field, text, position)
{
  this.fieldTitleMap[field] = text;
  if (position && position<this.fieldSequence.length)
  {
    var start = this.fieldSequence.slice(0, position)
    start[start.length] = field;
    var end = this.fieldSequence.slice(position);
    this.fieldSequence = start.concat(end);
  }
  else
  {
    this.fieldSequence.push(field);
  }
}
DataGrid.prototype.removeColumn = function(field, text)
{
  delete this.fieldTitleMap[field];
   
  for (var i=0; i<this.fieldSequence.length; i++)
  {
    if (this.fieldSequence[i] == field)
    {
      this.fieldSequence.splice(i, 1);
      break;
    }
  }
}
DataGrid.prototype.moveColumnToStart = function(field)
{
  for (var i=0; i<this.fieldSequence.length; i++)
  {
    if (this.fieldSequence[i] == field)
    {
      this.fieldSequence.splice(i, 1);
      this.fieldSequence.unshift(field);
      break;
    }
  }
}

DataGrid.prototype.moveColumn = function(field, beforeField)
{
  if (field == beforeField)
    return;
    
  var i=0;
  for (i=0; i<this.fieldSequence.length; i++)
  {
    if (this.fieldSequence[i] == field)
    {
      this.fieldSequence.splice(i, 1);
      break;
    }
  }
  
  for (i=0; i<this.fieldSequence.length; i++)
  {
    if (this.fieldSequence[i] == beforeField)
    {
      break;
    }
  }

  var start = this.fieldSequence.slice(0, i)
  start[start.length] = field;
  var end = this.fieldSequence.slice(i);
  this.fieldSequence = start.concat(end);
  
  return i;
}

DataGrid.prototype.attach = function( e )
{
  var div = document.createElement( "div" );
  div.id = RegisterControl.statics.encodeId(this, "waitingDisplay");
  div.className = 'waitingDisplay';
  div.style.zIndex = '100';
  div.style.display = 'none';
  e.appendChild( div );

  var iFrame = document.createElement('iframe');
  iFrame.id = RegisterControl.statics.encodeId(this, "waitingDisplayIFrame");
  iFrame.src = 'javascript:false;';
  iFrame.style.border = '0px';
  iFrame.style.zIndex = '50';
  iFrame.style.position = 'absolute';
  iFrame.style.display = 'none';
  e.appendChild( iFrame );

  var dataGridHeader = document.createElement( "div" );
  dataGridHeader.id = RegisterControl.statics.encodeId(this, "dataGridHeader");
  e.appendChild( dataGridHeader );

  var table = document.createElement( "table" );
  table.cellSpacing = '0';
  table.className = 'dataGrid';
  var thead = document.createElement( "thead" );
  thead.id = RegisterControl.statics.encodeId(this, "thead");
  table.appendChild( thead );
  dataGridHeader.appendChild( table );
  
  var dataGridBody = document.createElement( "div" );
  dataGridBody.id = RegisterControl.statics.encodeId(this, "dataGridBody");
  e.appendChild( dataGridBody );

  table = document.createElement( "table" );
  table.cellSpacing = '0';
  table.className = 'dataGrid';
  var tbody = document.createElement( "tbody" );
  tbody.id = RegisterControl.statics.encodeId(this, "tbody");
  table.appendChild( tbody );
  dataGridBody.appendChild( table );

  var noRecordsMessage = document.createElement( "div" );
  noRecordsMessage.id = RegisterControl.statics.encodeId(this, "noRecordsMessage");
  noRecordsMessage.style.display = 'none';
  noRecordsMessage.className = 'noRecordsMessage';
  dataGridBody.appendChild( noRecordsMessage );
  
  this.refresh();
}

DataGrid.prototype.refresh = function()
{
  var thead = document.getElementById(RegisterControl.statics.encodeId(this, "thead"));
  var tbody = document.getElementById(RegisterControl.statics.encodeId(this, "tbody"));
  this.hideNoRecordsMessage();
  
  thead.parentNode.style.width = 'auto';
  tbody.parentNode.style.width = 'auto';
  
  for (var i=thead.childNodes.length-1; i>=0; i--)
    thead.removeChild(thead.childNodes[i]);
  for (var i=tbody.childNodes.length-1; i>=0; i--)
    tbody.removeChild(tbody.childNodes[i]);
  
  if(0<this.contentList.length)
  {
    var tr = document.createElement( "tr" );
    thead.appendChild(tr);

    this.renderTitleRow( tr );
  
    for (var i=0; i<this.fieldSequence.length; i++)
    {
      var th = document.createElement( "th" );
      tr.appendChild( th );

      var field = this.fieldSequence[ i ];
      var content = this.fieldTitleMap[ field ];

      this.renderTitleCell( th, field, content, i );
    }

    for (var i=0; i<this.contentList.length && i < 10000; i++)
    {
      var tr = document.createElement( "tr" );
      tbody.appendChild(tr);

      this.renderRow( tr, i );

      for (var j=0; j<this.fieldSequence.length; j++)
      {
        var td = document.createElement( "td" );
        tr.appendChild( td );

        var field = this.fieldSequence[ j ];
        var content = this.getContentValue( i, field );
        
        var disabled = 0;
        if ( field == 'Name' )
            disabled = this.getContentValue( i, 'Disabled' );
        
        this.renderCell( td, i, field, content, j, disabled );
      }
    }

    this.syncColumnWidth();
  }
  else
  {
    this.showNoRecordsMessage('No Records Found.');
  }
}

DataGrid.prototype.syncColumnWidth = function()
{
  var thead = document.getElementById(RegisterControl.statics.encodeId(this, "thead"));
  var tbody = document.getElementById(RegisterControl.statics.encodeId(this, "tbody"));
  var headerRow = thead.rows[0];
  var dataRow = tbody.rows[0];
  
  if (dataRow)
  {
    var totalWidth = 0;
    for (var i=0; i<dataRow.cells.length; i++)
	{
      var headerCell = headerRow.cells[i];
      var dataCell = dataRow.cells[i];

      var headerCellPadding = this.calculatePadding(headerCell);
      var dataCellPadding = this.calculatePadding(dataCell);

      var cellPadding = headerCellPadding;
      if (headerCell.offsetWidth < dataCell.offsetWidth)
        cellWidth = dataCell.offsetWidth + dataCellPadding;
      else
        cellWidth = headerCell.offsetWidth + headerCellPadding;
      
      totalWidth += cellWidth + 1; // border width
      headerCell.style.width = (cellWidth - headerCellPadding) + 'px';
      dataCell.style.width = (cellWidth - dataCellPadding) + 'px';
    }
    
    totalWidth -= 1;
    thead.parentNode.style.width = this.adjustHeaderRowWidth(totalWidth) + 'px';
    var dataRowWidth = this.adjustDataRowWidth(totalWidth);
    tbody.parentNode.style.width = dataRowWidth + 'px';
  }
}

DataGrid.prototype.calculatePadding = function( node )
{
  var objStyle = node.currentStyle;
  if (!objStyle)
    objStyle = document.defaultView.getComputedStyle(node,'');
  return (parseInt(objStyle.paddingLeft) + parseInt(objStyle.paddingRight));
}

DataGrid.prototype.adjustHeaderRowWidth = function( w )
{
  return w;
}

DataGrid.prototype.adjustDataRowWidth = function( w )
{
  return w;
}

DataGrid.prototype.renderTitleRow = function( tr )
{
}

DataGrid.prototype.renderRow = function( tr, id )
{
}

DataGrid.prototype.renderTitleCell = function( cell, field, content, index )
{
  if (this.fieldSequence.length-1 == index)
    cell.className += ' lastCell';
  if (!content || !content.length)
    cell.innerHTML = '&nbsp;';
  else
    cell.innerHTML = content;
}

DataGrid.prototype.renderCell = function( cell, id, field, content, index, disabled )
{
  if (this.fieldSequence.length-1 == index)
    cell.className = 'lastCell';
  if (!content || !content.length)
    cell.innerHTML = '&nbsp;';
  else
  {
    cell.innerHTML = content;
    if ( disabled == 1 ) {
        cell.className += ' disabled';
        cell.innerHTML += " (Disabled)";
    }
  }
}

DataGrid.prototype.displayWaiting = function( message )
{
  this.showingWaiting = true;
  var waitingDisplay = document.getElementById(RegisterControl.statics.encodeId(this, "waitingDisplay"));
  var waitingDisplayIFrame = document.getElementById(RegisterControl.statics.encodeId(this, "waitingDisplayIFrame"));
  waitingDisplay.innerHTML = message;
  waitingDisplay.style.display = 'block';
  waitingDisplayIFrame.style.display = 'block';
  waitingDisplayIFrame.style.top = waitingDisplay.offsetTop + 'px';
  waitingDisplayIFrame.style.left = waitingDisplay.offsetLeft + 'px';
  waitingDisplayIFrame.style.height = waitingDisplay.offsetHeight + 'px';
  waitingDisplayIFrame.style.width = waitingDisplay.offsetWidth + 'px';
}
DataGrid.prototype.hideWaiting = function( message )
{
  var waitingDisplay = document.getElementById(RegisterControl.statics.encodeId(this, "waitingDisplay"));
  var waitingDisplayIFrame = document.getElementById(RegisterControl.statics.encodeId(this, "waitingDisplayIFrame"));
  waitingDisplayIFrame.style.display = 'none';
  waitingDisplay.style.display = 'none';
  this.showingWaiting = false;
}

DataGrid.prototype.showNoRecordsMessage = function(message)
{
  var noRecordsMessage = document.getElementById(RegisterControl.statics.encodeId(this, "noRecordsMessage"));
  noRecordsMessage.innerHTML = message;
  noRecordsMessage.style.display = 'block';
}
DataGrid.prototype.hideNoRecordsMessage = function()
{
  var noRecordsMessage = document.getElementById(RegisterControl.statics.encodeId(this, "noRecordsMessage"));
  noRecordsMessage.style.display = 'none';
}