/**
 * This file contains the function used to handle folding boxes.
 */

/**
 * This is a simple way to pre-load the images into the browser cache.
 * It is not a 'full-on' preloader, but is sufficient for our purposes.
 */
expand = new Image;
expand.src = 'static/expand.gif';
expandover = new Image;
expandover.src = 'static/expand-over.gif';
contract = new Image;
contract.src = 'static/contract.gif';
contractover = new Image;
contractover.src = 'static/contract-over.gif';




/**
 * This function toggles the display of an area, when a fold button is toggled.
 * Some useful debug code is included but commented out.
 **/
function fold_toggle(self, tagname)
{
  var fold_area, node;

  /**
   * Search up the node tree until we find a node with class "fold_section"
   **/
  for(node = self; node != null; node = node.parentNode)
  {
    if(node.className == 'fold_section')
      break;
  }
  if(!node) return;

  /**
   * Search through this nodes' children until we find one with class
   * "<identifier>_area"
   **/
  var childNodes = node.getElementsByTagName(tagname);
  var identifier = self.className.match(/^(\w+)_/)[1];
  for(var i = 0; i < childNodes.length; i++)
  {
    if(childNodes[i].className == identifier + '_area' )
    {
      fold_area = childNodes[i];
      
      /* Hide/Show the affected elements */
      if(self.src.indexOf('contract') >= 0)
      {
        fold_area.style.display = 'none'
      } else
      {
        fold_area.style.display = '';
      }
    }
  }

  /**
   *  We didn't change anything so exit befor updating the
   *  fold button image.
   **/
  if(!fold_area) return;

  /**
   * Now toggle the display
   **/
  if(self.src.indexOf('contract') >= 0)
  {
    self.src = 'static/expand-over.gif';
    self.alt = 'Expand';
  }
  else
  {
    self.src = 'static/contract-over.gif';
    self.alt = 'Collapse';
  }
}



/**
 * This function either expands or contacts all foldable areas matching an
 * identifier.
 **/
function fold_tweak_all(identifier, expand, tagname)
{
  var new_image;
  var new_style;
  var new_alttext;

  /**
   * Determine the new image and display state, depending on whether we are
   * expanding or contracting.
   **/
  if(expand)
  {
    new_image = 'static/contract.gif';
    new_style = '';
    new_alttext = 'Collapse';
  }
  else
  {
    new_image = 'static/expand.gif';
    new_style = 'none';
    new_alttext = 'Expand';
  }

  /**
   * Update all the fold buttons
   **/
  var nodes = document.getElementsByTagName('img');
  for(var i = 0; i < nodes.length; i++)
  {
    if(nodes[i].className == identifier + '_icon')
    {
      nodes[i].src = new_image;
      nodes[i].alt = new_alttext;
    }
  }

  /**
   * Update all the foldable sections
   **/
  var nodes = document.getElementsByTagName(tagname);
  for(var i = 0; i < nodes.length; i++)
  {
    if(nodes[i].className == identifier + '_area')
      nodes[i].style.display = new_style;
  }
}

/**
 * These functions make the fold buttons "light up" as the mouse hovers over.
 **/
function fold_hover_enter(self)
{
  if(self.src.indexOf('contract') >= 0)
    self.src = 'static/contract-over.gif';
  else
    self.src = 'static/expand-over.gif';
}
function fold_hover_leave(self)
{
  if(self.src.indexOf('contract') >= 0)
    self.src = 'static/contract.gif';
  else
    self.src = 'static/expand.gif';
}