Listen(window,'load',load);
Listen(window,'load',sizeSitePrep);
Listen(window,'load',setClocks)
Listen(window,'resize',sizeSite);

var currentTopic = null;
var box;

function load()
{
   if (elemById('people') != null)
   {
      var peopleImages = elemsByTag('img',elemById('people'));

      for (var i=0; i < peopleImages.length ; i++)
      {
         peopleImages[i].onmouseover = showBalloon;
         peopleImages[i].onmouseout = hideBalloon;
      }
   }
   
   for (var i=0; elemById('topic'+i) ; i++ )
   {
      elemById('topic'+i).onclick = function ()
      {
         if (currentTopic && currentTopic.id != this.id)
         {
            var displayState = getStyleValue(_nextSibling(currentTopic),'display');

            if (displayState != 'none')
               Toggle(_nextSibling(currentTopic));

            currentTopic.childNodes[0].className = '';
         }
            
         Toggle(_nextSibling(this));

         var topicLink = this.childNodes[0];
         if (topicLink.className == 'active')
         {
            topicLink.className = '';
            showHide('rightimage','show');
         }
         else
         {
            topicLink.className = 'active';
            showHide('rightimage','hide');
         }

         currentTopic = this;
      }
   }
}

function showBalloon()
{
   
   var matchingInfo = elemById(this.className);
   
   matchingInfo.style.top = this.offsetTop + this.offsetHeight - 0 + 'px';
   matchingInfo.style.left = this.offsetLeft + this.offsetWidth - 10 + 'px';

   matchingInfo.style.display = 'block';

   var overShoot = matchingInfo.offsetLeft + matchingInfo.offsetWidth - elemById('people').offsetWidth;

   if (overShoot > 0)
      matchingInfo.style.left = this.offsetLeft - overShoot + 'px';

   this.src = this.src.replace(/\.gif/,'_front.gif');

   this.style.width = this.offsetWidth - 2 + 'px';
   this.style.height = this.offsetHeight - 2 + 'px';
   this.style.padding = '1px';
   this.style.backgroundColor = '#DEDE52';
}

function hideBalloon()
{
   var matchingInfo = elemById(this.className);
   matchingInfo.style.display = 'none';

   this.src = this.src.replace(/_front/,'');

   this.style.width = this.offsetWidth + 'px';
   this.style.height = this.offsetHeight + 'px';
   this.style.padding = '0px';
}
/// Site Sizing. All between 800*600 and 1024*768.
/// It's pretty heavy stuff, especially for the IE6 engine, so there are plenty of constants.
var upperLimit = 995;
var lowerLimit = 780;
var container, winWidth, leftColumn, middleColumn, rightColumn, padLeft, padRight;

function sizeSitePrep()
{
   container = elemById('zero');
   leftColumn = elemsByClass('navigation')[0];
   middleColumn = elemsByClass('middle')[0];
   rightColumn = elemsByClass('side')[0];
   padLeft = getStyleValue(middleColumn, 'padding-left',true);
   padRight = getStyleValue(middleColumn, 'padding-right',true);

   winWidth = measure('window').x;
   var hasSpace = winWidth > upperLimit;
   var isTooTight = winWidth < lowerLimit;

   if (hasSpace)
      container.style.width = upperLimit + 'px';
   else if (!isTooTight)
      container.style.width = winWidth + 'px';

   middleColumn.style.width = container.offsetWidth
      - padLeft
      - padRight
      - leftColumn.offsetWidth
      - rightColumn.offsetWidth
      + 'px';
}

function sizeSite()
{
   winWidth = measure('window').x;
   var hasSpace = winWidth > upperLimit;
   var isTooTight = winWidth < lowerLimit;

   if (hasSpace)
      container.style.width = upperLimit + 'px';
   else if (!isTooTight)
      container.style.width = winWidth + 'px';

   middleColumn.style.width = container.offsetWidth
      - padLeft
      - padRight
      - leftColumn.offsetWidth
      - rightColumn.offsetWidth
      + 'px';
}

function Clock(strElemId,intOffset)
{
   var objDate = new Date();

   /*
   box.set('<br>' + strElemId.replace('clock_',''))
   box.set('now hours: '+objDate.getHours());
   box.set('offset: '+(objDate.getHours() + intOffset));
   */

   objDate.setHours(objDate.getUTCHours() + intOffset)

   //box.set('hours: ' + objDate.getHours());
   
   var strHours = objDate.getHours();
   var strMinutes = objDate.getMinutes();

   if (strHours < 10) strHours = '0'+ String(strHours);
   if (strMinutes < 10) strMinutes = '0' + String(strMinutes);

   elemById(strElemId).innerHTML = strHours+':'+strMinutes;
}

/** clocksDST
 * calculates for 3 cities (tokyo, delft and boston)
 * local time (regarding DST).
 * created by Paul 2-2-2006
 */
function clocks()
{
   /*
      DST (means +1):
         Delft: "last sunday march, 02:00 - last sunday october, 03:00h"
                  "UTC: last sunday march 01:00 - last sunday oct 02:00"
         Boston: "first sunday march, 02:00 - last sunday october, 02:00h"
                  "UTC: first sunday march 07:00 - last sunday oct 07:00"
         Tokyo: "no DST"
   */
   var objDate = new Date();
   var objSearchDate = objDate;

   var intMonth = objDate.getUTCMonth();
   var intDayOfMonth = objDate.getUTCDate();
   var intDayOfWeek = objDate.getUTCDay();

   var intHours = objDate.getUTCHours();
   var intMinutes = objDate.getUTCMinutes();

   var boolDST;  // DST period, true when DST
   var intFirstSun;
   var intLastSun;
   

   /* boston */
   
   boolDST = false;
   
   if (intMonth == 2) // march, possible DST
   {
      objSearchDate.setUTCDate(1);  // 1st day of month
      intFirstSun = objSearchDate.getUTCDate() + (7-objDate.getUTCDay());

      if ((intDayOfMonth > intFirstSun) || 
         ((intDayOfMonth == intFirstSun) && (intHours >= 7)) )
      {
         boolDST = true;
      }
   }  else if ((intMonth >= 3) && (intMonth < 10)) // may - sept DST
   {
      boolDST = true;
   }
   else if (intMonth == 10) // nov, possible DST
   {
      objSearchDate.setUTCDate(1);  // 1st day of month
      intFirstSun = objSearchDate.getUTCDate() + (7-objDate.getUTCDay());

      if ((intDayOfMonth > intFirstSun) || 
         ((intDayOfMonth == intFirstSun) && (intHours >=6)) )
      {
         boolDST = false;
      }
   }
   if (boolDST)
   {
      Clock('clock_boston',-4);
   } else
   {
      Clock('clock_boston',-5);
   }

   /* delft */
   boolDST = false;
   if (intMonth == 2) // march, possible DST
   {
      objSearchDate.setUTCDate(31);  // last day of month
      intLastSun = ( objSearchDate.getUTCDate() - objDate.getUTCDay() );

      if ((intDayOfMonth > intLastSun) || 
         ((intDayOfMonth == intLastSun) && (intHours >= 1)) )
      {
         boolDST = true;
      }
   }  else if ((intMonth > 2) && (intMonth < 9)) // apr - sept DST
   {
      boolDST = true;
   }  else if (intMonth == 9) // oct, possible DST
   {
      objSearchDate.setUTCDate(31);   // last day of october
      intLastSun = ( objSearchDate.getUTCDate() - objDate.getUTCDay() );

      if ((intDayOfMonth < intLastSun) || 
         ((intDayOfMonth == intLastSun) && (intHours < 1)))
      {
         boolDST = true;
      }
   }
   if (boolDST)
   {
      Clock('clock_delft',2);
   } else
   {
      Clock('clock_delft',1);
   }
   
   /* tokyo */
   Clock('clock_tokyo',9);
   
}

function clocks_oud()
{
   Clock('clock_boston',-5);
   Clock('clock_delft',1);
   Clock('clock_tokyo',9);
}

function setClocks()
{
/*
box = spawnBox('bugbox');
box.style.position = 'absolute';
box.style.top = '2px';
box.style.left = '2px';
box.style.backgroundColor = '#ffffff';
box.style.padding = '3px';
box.style.fontFamily = 'Courier New';
box.style.fontSize = '16px';
box.set = function (str) { this.innerHTML += str+'<br />';};
box.setall = function (str) { this.innerHTML = str+'<br />';};
box.set('Bugs<br />');
*/
   clocks();
   setInterval('clocks()', 60000);
}