var BlendSpeed = 300;

function UpdateImg(src,name,num)
{
  try
  {
    HighlightSelector(num);
    
    if (document.getElementById('img_preview') != null 
      && document.getElementById('gameNum') != null
      && document.getElementById('div_CurrGame') != null)
    {
      fadeTransStart('div_preview', 'img_preview', ImageUrl+src, BlendSpeed);
      
      document.getElementById('img_preview').alt = name;
      document.getElementById('div_CurrGame').innerHTML = name;
      document.getElementById('gameNum').value = num;
    }
  }
  catch (err)
  {
    //alert(err);
  }
}
function ImageUpDown(dir)
{
  try
  {
    if (document.getElementById('img_preview') != null 
      && document.getElementById('gameNum') != null
      && document.getElementById('div_CurrGame') != null)
    {
      var gameNum = parseInt(document.getElementById('gameNum').value,10);
      var hiddenImg;
      
      switch (dir)
      {
        case '-':
          gameNum--;
          break;
        case '+':
          gameNum++;
          break;
      }
                    
      if (gameNum < 0)                        //View LAST image
        gameNum = GamesArr.length-1;
      else if (gameNum == GamesArr.length)    //View FIRST image
        gameNum = 0;
      
      var detailsArr = GamesArr[gameNum].split(',');
      
      HighlightSelector(gameNum);
      
      fadeTransStart('div_preview', 'img_preview', ImageUrl+detailsArr[2], BlendSpeed);
      
      document.getElementById('img_preview').alt = detailsArr[1];              
      document.getElementById('div_CurrGame').innerHTML = detailsArr[1];                
      document.getElementById('gameNum').value = detailsArr[0];
    }
  }
  catch (err)
  {
    //alert(err);
  }
}
function HighlightSelector(ctrlNum)
{
  try
  {
    if (document.getElementById('nav') != null)
    {
      var liArr = document.getElementById('nav').getElementsByTagName('li');
      
      //Remove ALL Highlights
      for (var i=0; i<liArr.length; i++)
      {
        if (liArr[i].id.indexOf('li_') > -1)
        {
          if (liArr[i].className.indexOf('sub') > -1)
            liArr[i].className = 'sub';
          else if (liArr[i].className.indexOf('dir') > -1)
            liArr[i].className = 'dir';
          else
            liArr[i].className = '';
        }
        else
          liArr[i].className = 'dir';
      }
      
      //Highlight the Selected Item
      if (document.getElementById('li_' + ctrlNum) != null)
        document.getElementById('li_' + ctrlNum).className = 'active';                
      
      //Check if this element is a Sub-Game, so that we can highlight the Parent Item
      var detailsArr = GamesArr[ctrlNum].split(',');                
      if (detailsArr[3].indexOf('sub_') > -1)
      {
        //Determine the which parent the child belongs to
        var SubIndex = detailsArr[3].substring(4,detailsArr[3].length);
        
        //Loop through all items to find the parent
        for (var i=0; i<GamesArr.length; i++)
        {
          if (liArr[i].id == 'dir_'+SubIndex)
          {
            liArr[i].className = 'dir active';
            break;
          }
        }
      }
    }
  }
  catch (err)
  {
    //alert(err);
  }
}