var fadePos = new Array();
var fadeColours = new Array();
var hexLookup = ['0','1','2','3','4','5','6','7','8','9','A','B','C','D','E','F'];
var tmrId = null;

function toHex(n) {
  if (n<16) {
    return "0" + hexLookup[n];
  }
  else {
    return hexLookup[Math.floor(n/16)] + hexLookup[n % 16];
  }
}

var easeFn = function(pos) { return ((-Math.cos(pos*Math.PI)/2) + 0.5); };

function initMenu() {
  //alert("initMenu()");
  // Setup colour lookup table
  var r1 =  0; var g1 =  0; var b1 = 51;
  var r2 = 51; var g2 = 51; var b2 = 94;
  
  //r1 = 255; g1 = 0; b1 = 0;
  //r2 = 255; g2 = 255; b2 = 0;
  
  var r = 0; var g = 0; var b = 0;
  var amount = 0.0;
  for (var i=0; i<=100; i++) {
    amount = i * 0.01;
    amount = easeFn(amount);
    r = Math.floor(0.5 + (r1 + (r2-r1) * amount));
    g = Math.floor(0.5 + (g1 + (g2-g1) * amount));
    b = Math.floor(0.5 + (b1 + (b2-b1) * amount));
    fadeColours[i] = "#" + toHex(r) + toHex(g) + toHex(b);
  }
  
  // Setup links
  var menu = $("navigation");
  var lnks = menu.getElementsByTagName("a");
  for (var i=0; i<lnks.length; i++) {
    fadePos[i] = { dir:0 , pos:0, el:lnks[i] };
    lnks[i].onmouseover = new Function("fadeIn(" + i + ");");
    lnks[i].onmouseout  = new Function("fadeOut(" + i + ");");
    fadePos[i].el.style.backgroundColor = fadeColours[fadePos[i].pos];
  }
  //alert(lnks);
  // Setup callback
  tmrId = setInterval(function() { fadeCallback(); }, 10);
}

function fadeIn(i) {
  //alert("In : " + i);
  fadePos[i].dir = 10;
}

function fadeOut(i) {
  //alert("Out : " + i);
  fadePos[i].dir = -10;
}

function fadeCallback() {
  for (var i=0; i<fadePos.length; i++) {
    if (fadePos[i].dir != 0) {
      fadePos[i].pos += fadePos[i].dir;
      if (fadePos[i].dir > 0 && fadePos[i].pos >= 100) { fadePos[i].dir = 0; fadePos[i].pos = 100; }
      if (fadePos[i].dir < 0 && fadePos[i].pos <=   0) { fadePos[i].dir = 0; fadePos[i].pos =   0; }
      fadePos[i].el.style.backgroundColor = fadeColours[fadePos[i].pos];
      //fadePos[i].el.style.letterSpacing = Math.floor(0.5 + easeFn(fadePos[i].pos * 0.01) * 4 - 1) + "px";
      fadePos[i].el.style.paddingLeft = Math.floor(10 + easeFn(fadePos[i].pos * 0.01) * 15) + "px";
    }
    else {
      if (fadePos[i].pos > 50) {
        // Top-end
        
      }
    }
  }
}

addLoadEvent( function() { initMenu(); });