var lineGroup;  /* The <g> object we create and destroy to hold our dynamically generated lines. */
var k = 4;      /* How many neighbors to show. */

   
var svgNS = "http://www.w3.org/2000/svg";  /* Used when creating the <g> and <line> elements. */

    /* This is the function that is called by onmouseover events. */
function showNeighbors(evt, k, neighbors)
{
    var idx = 1 * evt.target.getAttribute('id');
    window.status = "Showing " + idx; 
    addLines(evt.target, neighbors[idx], k);
}

function addLines(obj, neighbors, numNeighbors)
{
    var x, y, x1, y1;

    var tmp = obj.getBBox();
    x = tmp.x + tmp.width/2;
    y = tmp.y + tmp.height/2;

    lineGroup = document.createElementNS(svgNS, "g");      
    obj.parentNode.appendChild(lineGroup);
    var ids = obj.getAttribute('id') + ": ";
    for(var i = 1; i <= numNeighbors ; i++) {
	var target;
	target = document.getElementById(neighbors[i]);
	ids = ids + " " + neighbors[i];

	tmp = target.getBBox();
	x1 = tmp.x + tmp.width/2;
	y1 = tmp.y + tmp.height/2;

	var line = document.createElementNS(svgNS, "line");      
	line.setAttribute('x1', x);
	line.setAttribute('y1', y);
	line.setAttribute('x2', x1);
	line.setAttribute('y2', y1);
	line.setAttribute('style', "fill: red; stroke: red;");

	line.setAttribute('class', "neighborLine");
	lineGroup.appendChild(line);
    }
    window.status = ids;
}

function hideLines()
{
    if(typeof lineGroup != "undefined") {
	lineGroup.parentNode.removeChild(lineGroup);
	lineGroup = document.createElementNS(svgNS, "g");      
    }
}

/*
 Debugging: get the property names of the obj.
    var tmp = "";
    for(var j in obj.getBBox()) {
	tmp = tmp + " " + j;
    }
    alert(tmp);
*/