/*********************************
   grid_class.js for EA.com
   creates grid layout based on div class
   code by Byron Tredwell (byron(AT)blastradius.com)
*********************************/

/*******************************
  FUNCTIONS FOR GLOBAL INIT
******************************/
initArray[initArray.length] = renderGrid;
/*******************************
******************************/

//var blockUnit  = 5;

var blockWidth   = 65;
var blockHeight  = 40;
var blockSpacing = 10;

/*<!-- X Y W H -->*/
function renderGrid()
{
   var grid = getElm("grid");
   if(!grid)
      return;
   //set teh gid to the page height minus the nav/footer
   var page = getElm("page");
   var hdr  = getElm("header");
   var ftr  = getElm("footer");
   
   grid.style.height = (page.offsetHeight - (hdr?hdr.offsetHeight:0)) +"px";
   
   var divs = grid.getElementsByTagName("div");
   for(i=0;i<divs.length;i++)
   {
	   if(divs[i].className.indexOf("gridBlock") >=0)
      {
        var parent = divs[i].parentNode;
        var props  = divs[i].className.split(" ");
        //validate the numbers
        var x = null;
        var y = null;
        var w = null;
        var h = null;
        for(var j=0; j<props.length; j++)
        {
				if(isNaN(parseInt(props[j])) == false || props[j] == "0")
            {
           
               if(x == null){
                  x = parseInt(props[j]);
                  continue;
               }
               if(y == null){
                  y = parseInt(props[j]);
                  continue;
               }
               if(w == null){
                  w = parseInt(props[j]);
                  continue;
               }
               if(h == null){
                  h = parseInt(props[j]);
                  continue;
               }
            }
        }
        divs[i].x = x;
        divs[i].y = y;
        divs[i].w = w;
        divs[i].h = h;
        initBlock(divs[i],parent);
      }
   }
}

function initBlock(block,parent)
{
   var top     = (block.y*blockHeight)+(block.y*blockSpacing);
   var left    = (block.x*blockWidth)+(block.x*blockSpacing);;
   var width   = (block.w*blockWidth)+((block.w-1)*blockSpacing);
   var height  = (block.h*blockHeight)+((block.h-1)*blockSpacing);

   block.style.top     = top + "px";
   block.style.left    = left + "px";
   if(width <= 0)
      block.style.width   = "1px";
   else
      block.style.width   = (width - ( (isIE) ? 0 : COMP_BORDER_WIDTH )) + "px";
      
   if(height <= 0)
      block.style.height   = "1px";
   else
      block.style.height   = (height - ( (isIE) ? 0 : COMP_BORDER_WIDTH )) + "px";
      
   block.style.display = "block";
    
   block.bg = createElm("DIV",block.id+"BG",parent);
   if(width > 0 && height > 0){
      block.bg.className    = "blockBg";
      block.bg.style.top    = block.style.top;
      block.bg.style.left   = block.style.left;
      block.bg.style.width  = block.offsetWidth+( (isIE) ? 0 : COMP_BORDER_WIDTH )+"px";
      block.bg.style.height = block.offsetHeight+( (isIE) ? 0 : COMP_BORDER_WIDTH )+"px";
   }
   //push the grid out if its not big enough
   var b = top+height+blockSpacing;
   var grid = getElm("grid");
   if(grid.offsetHeight < b)
   {
      var ftr  = getElm("footer");
      if (ftr != null) {
      	grid.style.height = (b + ftr.offsetHeight) +"px";
      }else{
      	grid.style.height = b +"px";
      	grid.parentNode.style.height = grid.style.height;
      	grid.parentNode.parentNode.style.height = grid.style.height;
      }
   }
   if(isMac && !isSafari)
   {
      setOpacity(block.bg,100);
      block.bg.style.backgroundColor = MAC_ALT_BG_COLOR;
   }
}

function showGridGuide()
{
   var grid = document.getElementById("grid"); 
   var gg = createElm("DIV","",grid);
   
   w = grid.offsetWidth;
   h = grid.offsetHeight;
   gg.style.position = "absolute";
   gg.style.width = w+"px";
   gg.style.height = h+"px";

      for(var i=0; i<(w/(blockWidth+blockSpacing)); i++ )
      {
         for(var j=0; j<(h/(blockHeight+blockSpacing)); j++ )
         {
            var b = createElm("DIV","",gg); 
            b.style.border = "1px solid #00cc00";
            b.style.position = "absolute";
            b.style.top     = ((j*blockHeight)+((j)*blockSpacing)) + "px";
            b.style.left    = ((i*blockWidth)+((i)*blockSpacing)) + "px";
            b.style.width   = (blockWidth - 2) + "px";
            b.style.height  = (blockHeight - 2) + "px";
			b.style.zIndex = "1000";
         }
      }
}