var __popups = [];
 
function make_popup(hover, source, left_offset, top_offset, duration) {
  //hover = $(hover); source = $(source);
  hover = typeof hover == "string" ? document.getElementById(hover) : hover;
  source = typeof source == "string" ? document.getElementById(source) : source;  
 
  //left_offset = left_offset === undefined ? 0 : left_offset;
  left_offset = 0;
  top_offset = top_offset === undefined ? 2 : top_offset;
  duration = duration || 500;
  var hover_dim = get_dimensions(hover);
  //if(top_offset <= 1) 
  top_offset = Math.round(hover_dim.height * top_offset);
  //if(left_offset <= 1) 
  //left_offset = Math.round(hover_dim.width * left_offset);
  
  var hover_pos = get_pos(hover);
  set_opacity(source, 0);
  source.style.position = "absolute";
  if(source.id=="faculty_source")
  {
	source.style.top = hover_pos.top + 107 + 'px';	
  }
  else if(source.id=="multicultural_source")
  {
  	source.style.top = hover_pos.top + 78 + 'px';	
  }
  else
  {
  	source.style.top = hover_pos.top + 49 + 'px';	
  }
  //source.style.top = hover_pos.top + top_offset + 'px';
  //source.style.left = hover_pos.left + left_offset + 'px';
  //source.style.left = (hover_pos.left+30) + 'px';
  //source.style.left = (hover_pos.left+30) + 'px';
  source.style.display = "none";
  
  var hoverover = hover.onmouseover; var hoverout = hover.onmouseout;
  hover.onmouseover = function(e) {
    fade(source, duration, true);
    if(hoverover) hoverover(e);
  }
  hover.onmouseout = function(e) {
    e = e || window.event;
    var to_el = e.relatedTarget || e.toElement;
    if(to_el != source) fade(source, duration, false);
    if(hoverout) hoverout(e);
  }
  source.onmouseout = function(e) {
    e = e || window.event;
    var to_el = e.relatedTarget || e.toElement;
    if(to_el != hover) fade(source, duration, false);
  }
  
  __popups.push(hover); __popups.push(source);
}

window.onunload = function() {
  for(var i = 0; i < __popups.length; i++) {
    __popups[i].onmouseover = null;
    __popups[i].onmouseout = null;
  }
}

//function $(el) {
//  return typeof el == "string" ? document.getElementById(el) : el;
//}

function get_pos(el) {
  var result = {top: 0, left: 0};
  while(el) {
    result.left += el.offsetLeft;
    result.top += el.offsetTop;
    el = el.offsetParent;
  }
  return result;
}

function get_dimensions(el) {
  var style = el.style;
  var visibility = style.visibility;
  var position = style.position;
  var display = style.display;
  style.visibility = "hidden";
  style.position = "absolute";
  style.display = "block";
  var result = {height: el.clientHeight, width: el.clientWidth};
  style.display = display;
  style.position = position;
  style.visibility = visibility;
  return result;
}

function fade(el, duration, fade_in) {
  clearInterval(el.__fade);
  var start = get_opacity(el);
  var current_time = (fade_in ? start : 1 - start) * duration;
  var start_time = (new Date).getTime() - current_time;
  if(fade_in) el.style.display = "block";
   
  el.__fade = setInterval(function() {
    var current = ((new Date).getTime() - start_time) / duration;
    if(current >= 1) {
      set_opacity(el, fade_in ? 1 : 0);
      clearInterval(el.__fade);
      el.__fade = null;
      if(!fade_in) el.style.display = "none";
    } else set_opacity(el, fade_in ? current : 1 - current);
  }, 13);
}

if(/MSIE/.test(navigator.userAgent) && !window.opera) {
  get_opacity = function(el) {
    var filter = el.currentStyle['filter'];
    var value = filter.match(/alpha\(opacity=(.*)\)/);
    return (value && value[1]) ? parseFloat(value[1]) / 100 : 1.0;
  }
  
  set_opacity = function(el, value) {
    var style = el.style;
    var filter = style.filter || el.currentStyle['filter'];
    if(value == 1)
      style.filter = filter.replace(/alpha\([^\)]*\)/gi, "");
    else {
      if(value < 0.00001) value = 0;
      style.filter = filter.replace(/alpha\([^\)]*\)/gi, "") + 
        "alpha(opacity=" + (value * 100) + ")";
    }
  }
} else {
  get_opacity = function(el) {
    var value = el.style.opacity;
    if(!value) {
      var css = document.defaultView.getComputedStyle(el, null);
      value = css ? css.opacity : null;
    }
    return value ? parseFloat(value) : 1.0;
  }
  
  set_opacity = function(el, value) {
    if(value < 0.00001) value = 0;
    el.style.opacity = value == 1 ? "" : value;
  }
}