
zoom_init(document.getElementById('content'),
          'Klik om te vergroten',
          'Klik om te sluiten',
          '../images/icoon_groot/zoom_in.png',
          '../images/icoon_groot/zoom_out.png');

/*
* zoom_init()
* container   parent element for zoom content, must be current scope or closed element for IE6 compat
* zoomtitle   tooltip shown on images mouseover
* closetitle  tooltip shown on zoom content
* zoomicon    url for icon shown on images
* closeicon   url for icon shown on zoom content
*/
function zoom_init(container, zoomtitle, closetitle, zoomicon, closeicon)
{
   // do not load on IE6 or older
   if ((navigator.appName == 'Microsoft Internet Explorer')
    && (parseFloat(navigator.userAgent.match(/MSIE ([0-9]{1,}[.0-9]{0,})/)[1]) < 7))
   {
      return false;
   }  

   // load css only when javascript enabled
   var css = document.createElement('link');
   css.rel = 'stylesheet';
   css.type = 'text/css';
   css.href = '../css/zoom.css';
   css.media = 'screen';
   container.appendChild(css);
   
   // setup background
   var zoom_bg = document.createElement('div');
   zoom_bg.id = 'zoom_bg';   
   zoom_bg.onclick = zoom_undo;
   zoom_bg.style.display = 'none';
   container.appendChild(zoom_bg);
   
   // setup zoom content 
   var zoom_tbl = document.createElement('table');
   var zoom_bdy = document.createElement('tbody'); // needed for IE7 compat   
   var zoom_row = document.createElement('tr');
   var zoom_col = document.createElement('td');
   zoom_tbl.id = 'zoom_tbl';
   zoom_tbl.cellSpacing = 0;
   zoom_tbl.cellPadding = 0;
   zoom_tbl.onclick = zoom_undo;
   zoom_tbl.style.display = 'none';
   zoom_row.appendChild(zoom_col);
   zoom_bdy.appendChild(zoom_row);   
   zoom_tbl.appendChild(zoom_bdy);   
   
   var zoom_img = document.createElement('img');
   zoom_img.id = 'zoom_img';
   zoom_img.onclick = zoom_undo;
   zoom_img.title = closetitle; 
   zoom_col.appendChild(zoom_img);
   
   var icon = document.createElement('img');
   icon.src = closeicon;
   icon.className = 'zoom_out_icon';
   icon.title = closetitle;
   icon.onclick = zoom_undo; 
   zoom_col.appendChild(icon);

   container.appendChild(zoom_tbl);            

   var imgs = document.getElementsByTagName('img');
   
   for (var i = 0; i < imgs.length; i++)
   {
      if (has_css_class(imgs[i], 'zoom'))
      {         
         imgs[i].onclick = zoom_do;
         imgs[i].title   = zoomtitle; 
         
         // add icon to image
         var ico = document.createElement('img');
         ico.src = zoomicon;
         ico.title = zoomtitle;
         ico.onclick = zoom_icon_do;
         ico.className = 'zoom_in_icon';
         
         imgs[i].parentNode.insertBefore(ico, imgs[i].nextSibling);
      }      
   }    
}

function zoom_do(event)
{
   var e = event ? event : window.event;   
   var t = e.target ? e.target : e.srcElement;   
   
   document.getElementById('zoom_img').src = t.src;
  
   zoom_fade('zoom_bg', 1, 3);
   document.getElementById('zoom_bg').style.display = '';        

   zoom_fade('zoom_tbl', 1, 5);
   document.getElementById('zoom_tbl').style.display = '';      
}

function zoom_icon_do(event)
{
   var e = event ? event : window.event;   
   var t = e.target ? e.target : e.srcElement;   
   
   zoom_do({ target: t.previousSibling });    
}

function zoom_undo()
{
   zoom_fade('zoom_tbl', 0, 5);
   zoom_fade('zoom_bg',  0, 3);   
}


function zoom_fade(id, dir, steps, i)
{
   if (!i)
   {
      i = 0;
   }
      
   var o = dir ? i / 5 : 1 - ((i + 5 - steps) / 5); 

   var os = document.getElementById(id).style;
   os.filter = 'alpha(opacity=' + o * 100 + ')';
   os.MozOpacity = o;
   os.KhtmlOpacity = o;
   os.opacity = o;
   
   if (!o)
   {
      os.display = 'none';
   }
   
   if (i < steps)
   {
      setTimeout("zoom_fade('" + id + "', " + dir + ", " + steps + ", " + (i + 1) + ")", 100); 
   }             
}

function has_css_class(obj, classname)
{
   var c = obj.className.split(' ');
   
   for (i in c)
   {      
      if (c[i] == classname)
      {
         return true;
      }
   }
   
   return false;    
}

