function selImg( e )
{
  var evt = getEvent( e );
  
  evt.preventDefault();
  evt.stopPropagation();

  var index = evt.target.getAttribute( 'img_idx' );
  
  var main_img = document.getElementById( 'main_img' );
  main_img.width  = album_files[ index ].img.width;
  main_img.height = album_files[ index ].img.height;
  main_img.src    = album_files[ index ].img.src;
  
  var thumbs = document.getElementById( 'thumb_area' ).getElementsByTagName( 'IMG' );
  for( var i=0; i<thumbs.length; ++i )
  {
    if( i == index )
    {
      thumbs[ i ].id = 'th_sel';
      thumbs[ i ].className = '';
    }
    else
    {
      thumbs[ i ].id = '';
      thumbs[ i ].className = 'th_ns';
    }
  }
  
  document.getElementById( 'main_img' ).onclick = function() { return mainImgOnClick( index ) };
  return false;
}

function mainImgOnClick( index )
{
  var url = 'view_image.php?gallery_id=' + gallery_id + 
            '&album_id=' + album_id + 
            '&image=' + album_files[ index ].file;
            
  var opts = 'left=0, toolbar=no, location=no,directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=yes, width=' +
  album_files[ index ].width +
  ', height=' + album_files[ index ].height;
  window.open( url,
               '_blank',
               opts );
               
  return false;
};

function initAlbum()
{
  var imgs = document.getElementById( 'thumb_area' ).getElementsByTagName( 'IMG' );
  for( var i=0; i<imgs.length; ++i )
  {
    if( imgs[ i ].id == 'th_sel' )
    {
      sel_index = i;
      document.getElementById( 'main_img' ).onclick = function() { return mainImgOnClick( sel_index ) };
    }
    
    addEvent( imgs[ i ], 'click', selImg, false );
  }
}

var sel_index = 0;

addEvent( window, 'load', initAlbum, false );