/* ---------------------------------------------------------------------------------- */
/* ----- Functies: onLoad ----------------------------------------------------------- */
/* ---------------------------------------------------------------------------------- */

$(document).ready(function() {
  initPoolNav();
});


/* ---------------------------------------------------------------------------------- */
/* ----- Functies: Algemeen --------------------------------------------------------- */
/* ---------------------------------------------------------------------------------- */

//Tooltip functies
var idTimeout = null;
var tt = null;

function TT(e, s) {
  var elA = (e.srcElement) ? e.srcElement : e.target;
  if (elA.nodeName == 'IMG') {
    elA = elA.parentNode;
  }
  if (elA.nodeName != 'A') return;
  elA.title = '';
  clearTimeout(idTimeout);
  createTooltip(e || window.event, s);
  elA.onmouseout = function() { idTimeout = window.setTimeout('hideTooltip()', 200) }
}

function hideTooltip() {
  var tt = document.getElementById('tooltip');
  switchSelectBoxes('');
  tt.style.display = 'none';
  tt.style.left = 1;
  tt.style.top = 1;
}

function switchSelectBoxes(mode) {
  var arrSelectBoxes = document.body.getElementsByTagName('SELECT');
  for (var i = 0; i < arrSelectBoxes.length; i++) {
    arrSelectBoxes[i].style.visibility = mode;
  }
}

function createTooltip(e, s) {
  tt = document.getElementById('tooltip');
  tt.onmouseover = function() { clearTimeout(idTimeout) }
  tt.onmouseout = function() { idTimeout = window.setTimeout('hideTooltip()', 200); }

  var strHTML = '<table cellpadding=2 cellspacing=0 border=0>';
  var arrItems = s.split('|');
  for (var i = 0; i < arrItems.length; i++) {
    var arrItem = arrItems[i].split('~');
    strHTML += '<tr><td valign=top><b>' + arrItem[0] + '</b></td>';
    if (arrItem[1] != undefined) if (arrItem[1].length > 0) strHTML += '<td valign=top><img ' + ((arrItem[1].indexOf('kat_') == 0) ? 'style="margin-top:3px;" ' : '') + 'src="/interface/images/' + arrItem[1] + '"></td>';
    if (arrItem[2] != undefined) strHTML += '<td valign=top>' + arrItem[2].replace(/\n/g, '<br>') + '</td>';
    strHTML += '</tr>';
  }
  strHTML += '</table>';

  tt.innerHTML = strHTML;

  var posx = 0;
  var posy = 0;

  if (e.pageX || e.pageY) {
    posx = e.pageX;
    posy = e.pageY;
  } else if (e.clientX || e.clientY) {
    posx = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;
    posy = e.clientY + document.body.scrollTop + document.documentElement.scrollTop;
  }

  switchSelectBoxes('hidden');
  tt.style.display = '';

  if (posx < (document.body.clientWidth / 2)) {
    tt.style.left = (posx) + (10) + 'px';
  } else {
    tt.style.left = (posx) - (tt.clientWidth + 10) + 'px';
  }
  tt.style.top = (posy) + 15 - (tt.clientHeight / 2) + 'px';
}


/* ---------------------------------------------------------------------------------- */
/* ----- Functies: Skutsjepool ------------------------------------------------------ */
/* ---------------------------------------------------------------------------------- */

function initPoolNav() {
  $(".button-predictions").bind("click", function () { setPoolNav("predictions"); });
  $(".button-toplist").bind("click", function () { setPoolNav("toplist"); });
}

function setPoolNav(navID) {
  $(".button-" + navID).addClass("active").siblings().removeClass("active");
  $(".pool-content-wrapper").hide();
  $("#content-" + navID).show();
}