var bcBoxState = new Array();
var bcBoxCache = new Array();

function bc_hover(bcBoxID) {

  bcBoxStyle          = document.getElementById(bcBoxID).style;
  bcBoxCache[bcBoxID] = (bcBoxCache[bcBoxID] == undefined) ? bcBoxStyle.backgroundColor : bcBoxCache[bcBoxID];

  bcBoxStyle.backgroundColor = (bcBoxState[bcBoxID] == 1) ? bcBoxCache[bcBoxID] : "DD5E00";
  bcBoxState[bcBoxID] = (bcBoxState[bcBoxID] == 1) ? 0 : 1;

} // ! bc_hover()



var bcDetailState = 'hidden';
var bcDetailPosX  = 0;
var bcDetailPosY  = 0;

function bc_detail(bcDetailBox, bcSetX, bcSetY, bcDetailAction) {

  bcDetailStyle       = document.getElementById(bcDetailBox).style;
  bcDetailState       = (bcDetailAction == 'show') ? 'visible' : 'hidden';

  // Determine the position of the detail box
  // If set to 0, the current position will be used
  bcSetX              = (bcSetX == 0) ? bcDetailPosX : bcSetX;
  bcSetY              = (bcSetY == 0) ? bcDetailPosY : bcSetY;

  switch(bcDetailState) {
  case 'visible':
  // Change the position of the detail box
    bcDetailStyle.top  = bcSetY;
    bcDetailStyle.left = bcSetX;
    bcDetailPosX       = bcSetX; // store as current
    bcDetailPosY       = bcSetY; // -
  break;
  } // ! switch

  // Change the visibility of the detail box
  bcDetailStyle.visibility = bcDetailState;

} // ! bc_detail()