/**
 * 
 *
 */
jQuery.fn.infobar = function(params) {

		var options = {
			hideall:  true
		}
		op = jQuery.extend(options, params)


   return this.each(function(){
		//initializing variables
		var $self  =  jQuery(this);
	    var width  =  $self.width()+2;
	    var height =  $self.height()+2;
	    var offset =  $self.offset();
        var xpos   =  offset.left;  
	    var ypos   =  offset.top + height - 30;
	    var name   =  "infobox" + $self.children(":first").attr("id");
	    var text   =  $self.children(":first").attr("info");
	    	    
	    //append box 
	    var $box = $("<div></div>");
	    $box.attr("id", name);
	    $box.addClass("imgInfo");
	    $box.html("<p><a href='?remove=" + name + "'><img src='images/infobox-remove.gif' align='right' /></a>"+text+"</p>");
        // bind roll-over
	    $box.bind("mouseenter", function(e){
	      $(this).show();
        });
	    $box.bind("mouseleave", function(e){
          $(this).hide();
        });        
	    $("body").append( $box ) ;

	    // set box position        
	    var xpos   =  offset.left;  
	    var ypos   =  offset.top + height - $box.height();
	    $box.css({ top: ypos, left: xpos });        
        
        //hide at beginning
	    if(op.hideall) {
          $(".imgInfo").hide();
        }

	   
	    $self.hover(
          function () {
          	$box.show();
          }, 
          function () {
          	$box.hide();
          }
        );



   	   

	   
   });

};