window.onload = function () {
  buildInfo ();
}

lDiv = null;
activeTimer = null;
activeTimeout = 1000;
imageTypes = Array ( 'jpg', 'gif', 'jpeg', 'png' );

function trim(value) {
	value = value.replace(/^\s+/,'');
	value = value.replace(/\s+$/,'');
	return value;
}

function buildInfo() {
  if ( ( lDiv = document.getElementById ( "libraryDiv" ) ) == null )
  {
    lDiv = document.createElement ( "div" );
    lDiv.id = "libraryDiv";
    lDiv.className = "infoField";
    lDiv.style [ 'position' ] = 'absolute';
    lDiv.style [ 'display' ] = 'none';
    lDiv.style [ 'visibility' ] = 'hidden';
    document.getElementsByTagName ( 'body' ) [ 0 ].appendChild ( lDiv );

    lDiv.onmouseover = function () {
      clearTimeout ( activeTimer );
    }

    lDiv.onmouseout = function () {
      activeTimer = setTimeout ( 'hideImageInfo ( );', activeTimeout );
    }
		
    /*var dms = $('dmsMOD');
		dms.getElements('tr').forEach( function(el) {
      alert(el.className);
			//console.log(el);
			//var ids = el.id.split('_');
      //el.addEvent('click', function() {
      //  this.selectAll(ids[1], ids[2]);
//      }.bind(this) );
//      if (ids[2]!='all')
//        this.selectAll(ids[1], ids[2]);
    });*/
		
		
		
		l = document.getElementById ( 'dms' ).getElementsByTagName ( 'tr' );
		//alert( l.length );
		//console.log(l);
    for ( a = 0; a < l.length; a ++ )
    {
			//alert( a );
      if ( l [ a ].id.indexOf ( 'dmsInfo_' ) != -1 )
      {
		    t = l [ a ].getElementsByTagName ( 'td' );
		    t [ 1 ].onmouseover = function () {
					//alert('test');
		      return showImageInfo ( this.parentNode , t );
		    };
		    t [ 1 ].onmouseout = function () {
		      activeTimer = setTimeout ( 'hideImageInfo ( );', activeTimeout );
		      return false;
		    };
      }
    }
  }
}

function showImageInfo ( elm , t )
{
  clearTimeout ( activeTimer );

  if ( lDiv )
  {
		//alert( 'lDiv' );
    //tmp = elm.getElementsByTagName ( 'a' );
    //title = tmp [ 0 ].innerHTML;
		
    tmp = elm.getElementsByTagName ( 'span' );
		//console.log( tmp );
		//alert( 'tst1' );
    title = tmp [ 0 ].innerHTML;
//alert( tmp [ 1 ].innerHTML );
    desc = tmp [ 1 ].innerHTML;
//alert( 'test' );
		
		tmp = elm.getElementsByTagName ( 'img' );
		//alert( 'test' );
		//console.log( tmp.length );
    img = tmp [ 0 ].alt;
		//alert( 'test' );
		
		
		tmp = elm.getElementsByTagName ( 'td' );
		//alert( tmp.length );
		if(t.length > 2){
			//alert( 'test' );
		//alert('test');
			size = 0;
			user = '';
			auteur = '';
		//alert('test');
			for(i=0;i<tmp.length;i++){
				if(tmp[i].className == 'fileSize'){
					size = tmp[i].innerHTML;
				}
				if(tmp[i].className == 'fileUser'){
					user = tmp[i].innerHTML;
				}
				if(tmp[i].className == 'fileAuthor'){
					auteur = tmp[i].innerHTML;
				}
			}
			//user = (tmp [ 4 ]) ? tmp [ 4 ].innerHTML : '' ;
			//size = tmp [ 2 ].innerHTML;
		}else{
			user = "";
			size = "";
			auteur = "";
		}

    lDiv.style.width = '250px';

    leftOff = 160;
    topOff = 15;
    tElm = elm;
    while ( tElm.tagName.toLowerCase () != "body" )
    {
      topOff += tElm.offsetTop;
      leftOff += tElm.offsetLeft;
      tElm = tElm.offsetParent;
    }

    c = '<p style="margin: 0px; padding: 5px;"><b>' + title + '</b><br /><br/>';
		if(trim(user) != '')
			c += '<a href="#">' + user + '</a><br />';
		if(trim(auteur) != '')
			c += '<span style="color: #abadb3;">Auteur:</span> ' + auteur + '<br/>';
    //c += user + '<br />';
		if(trim(size) != '')
			c += '<span style="color: #abadb3;">Bestandsgrootte:</span> ' + size + '<br/>';
		if(trim(desc) != ''){
			c += '<br/><span style="color: #abadb3;font-weight:bold">Omschrijving:</span><br/>' + desc + '</p>';
		}
    imageFile = false;
    for ( a = 0; a < imageTypes.length; a ++ )
      imageFile = imageFile || img.toLowerCase ().indexOf ( imageTypes [ a ] ) != -1;

    if ( imageFile )
      c += '<p><img src="' + img + '" style="padding-top: 8px; padding-left: 5px; padding-right: 5px; width: 245px;"></p>'

    lDiv.innerHTML = c;
    lDiv.style.left = leftOff + "px";
    lDiv.style.top = topOff + "px";
    lDiv.style.visibility = "visible";
    lDiv.style.display = "block";
  }
  return false;
}

function hideImageInfo ( )
{
  if ( lDiv != null )
  {
    lDiv.style [ 'display' ] = 'none';
    lDiv.style [ 'visibility' ] = 'hidden';
  }

  return false;
}