//
// Show Image Thumbnail link anchors ....    2010.1.16
//
// Known Issue:
// 1. Position of the "TN" dialog is fixed, but should be dynamically changed in accordance with the number of imgs.

function AlbumNail() {
  uri = document.URL;
    
  
  if (uri.substr(0,4) == 'file') {  //if local file system
    splited = uri.split("\\");
  } else {                          // Assume on http server
    splited = uri.split("\/");
  }

  bandName = splited[splited.length-1].split('.')[0];

  imgCollection =  document.getElementsByTagName('IMG');
  

  var divTn = document.createElement('div');
  divTn.setAttribute('align','right');
  divTn.setAttribute('id','TNDiv');
  
  var anchor = new Array(); 
  var tn = new Array();
  var linkPoint = new Array();  

  for (i = 0;i < imgCollection.length; i++) {   
    splited = imgCollection.item(i).src.split('\/');
    imgFileName = splited[splited.length-1];
    if (imgFileName != 'White.gif') {
      anchor[i] = document.createElement('a');
      anchor[i].setAttribute('href', "#"+imgFileName.split(".")[0]);   
      tn[i]  = document.createElement('img');   
      tn[i].setAttribute('src', imgFileName);   
      tn[i].setAttribute('width','30');   
      tn[i].setAttribute('height','30');   
      tn[i].setAttribute('border','0');   
      anchor[i].appendChild(tn[i]);   
      divTn.appendChild(anchor[i]);
    }
    linkPoint[i] =  document.createElement('a');   
    linkPoint[i].setAttribute('id',imgFileName.split('.')[0]);     
  } 

  var targetTags = new Array();
  targetTags = document.getElementsByTagName('div');

  coverNode = 4;  // <span><br><br><div class='Cover'>      
  k = 0;
 
  for (j = 0 ; j < targetTags.length ; j++) {
    if (targetTags.item(j).className == 'ImgAndMemList') {   
      for (m = 0 ; m < targetTags.item(j).childNodes.item(coverNode).childNodes.length ; m++) {
        if (targetTags.item(j).childNodes.item(coverNode).childNodes.item(m).nodeName == 'IMG') {
          targetTags.item(j).insertBefore(linkPoint[k], targetTags.item(j).firstChild);
          coverNode++;  //new child insertion result in node # shifting. 
          k++;          
        }
      }
      coverNode = 4;    // reset target node number, preparing for next first insertion...
    }
  }

  //confirm(k);


  document.getElementsByTagName('span').item(0).appendChild(divTn);  // Initial position (top of the screen)

  area = document.getElementById('TNDiv');
  area.style.visibility ="visible";
  area.style.position="absolute";
  area.style.top="0";
  area.style.left="800";                  //Known Issue 1
  //area.style.width="150";
  //area.style.height="50";
  area.style.backgroundColor="#FFFFFF";

  if (window.attachEvent) {    
     window.attachEvent("onscroll", moveDialog);
     document.attachEvent("onclick", showDialog);
  } else if (window.addEventListener) {     
     window.addEventListener("scroll", moveDialog, false);
     document.addEventListener("click", showDialog, false);
  } else {
    confirm ("I'm lost ...");
  }
}

function hideDialog() {
  document.getElementById('TNDiv').style.visibility ="hidden";
}

function moveDialog() {
    var a = document.body.scrollTop;
    var b = document.getElementById('TNDiv');
    b.style.visibility ="hidden";
    b.style.position ="absolute";
    b.style.top = a + 10 ;  
}

function showDialog() {
  document.getElementById('TNDiv').style.visibility ="visible";
}