/*
    fixpix.js

    Copyright 2007 Curtis Smith
    
    The fix_pix() function tries to simulate the effects of the 
    cascading-style-sheets (CSS) directive display:inline-block for  
    a set of identified pictures on browsers that don't support the 
    CSS directive (namely, Firefox and Internet Explorer).
    
    The Safari and Opera browsers support display:inline-block.
    
    The pictures are assumed to be in a <div class="pix"> block.
    Individual pictures are in a <div> section within the main 
    <div> block.
    
*/
//
// For each picture, we set the float attribute to "left".  For 
// Internet Explorer, we also extend the bottom margin on pictures
// as necessary to ensure that we don't skew the pictures

function fix_pix()
{
       // Browsers conformant to the CSS 2 standard that support the display:inline-block
       // tag (e.g., the Safari browser) already display the pictures correctly, but
       // as of Firefox version 2.0.0.6 and Internet Explorer version 7, those browsers
       // need a little help.
       
  var is_firefox = 0;
  var is_ie = 0;
  switch ( navigator.appName )
  {
  case "Netscape":
    is_firefox = 1;
    break;
  case "Microsoft Internet Explorer":
    is_ie = 1;
    break;
  default:
              /* browser might be "Safari" or "Opera" which already position
                 the pictures correctly or something like "Links" for which
                 the whole point is moot anyway. */
    return;
  }

  if ( document.getElementById )
  {
    var pix = document.getElementById('pix');
    
    var j;
    
    /* we go through the loop twice because sometimes the boxes adjust */
    
    for ( j = 0; j < 2 ; ++j )
    {
        var n = pix.firstChild;
            /* The strategey in Firefox is just to float all the pictures */
              
        var y = -1; /* offsetTop value for pictures in current line */
        var h = -1;
        while ( n )
        {
          if ( n.nodeName.toLowerCase() == 'div' )
          {
            if ( y < 0 )
            {
              // very first time through
              // check to see if the top offset be the same for the first 
              // two pictures; if so, then the version of Firefox apparently
              // handles display:inline-block correctly, so we don't need
              // to do anything
              if ( ! n.nextSibling || n.offsetTop == n.nextSibling.offsetTop )
              {
                 return; /* either only one pic or first two on same line */
              }
            }
            if ( is_ie )
                n.style.styleFloat = 'left';
            else
                n.style.cssFloat = 'left';

            var pref = n.offsetTop;
            if ( y != n.offsetTop )
            {
              // This is the first picture on a new line
              if ( is_firefox )
              {
                  n.style.clear = 'left';
              }
              y = n.offsetTop;
              h = n.offsetHeight;
            }
            else if ( is_ie )
            {
              if ( n.offsetHeight >= h )
              {
                h = n.offsetHeight;
              }
              else
              {
                  /* the constant 1 below is the usual bottom margin defined for the t1 class */
                n.style.marginBottom = (1 + h - n.offsetHeight) + 'px';
              }
            }
            else if ( is_firefox )
            {
               n.style.clear = '';
            }
          }
          n = n.nextSibling;
        }
    }
  }
}