function ShowContentProperties(sender, overlayId, toolTipId)
{
	var overlay = $(overlayId);
	if (overlay && overlay.style.display == "none")
	{
	    if (overlay.parentNode)
	    {    
	        overlay = overlay.parentNode.removeChild(overlay);
            document.body.appendChild(overlay);
	    }
	    overlay.style.height = sender.offsetHeight + 'px';
	    overlay.style.width = sender.offsetWidth + 'px';
	    overlay.style.left = (getContentPartRealPos(sender, 'x')) + 'px';
	    overlay.style.top = (getContentPartRealPos(sender, 'y')) + 'px';
	    overlay.style.display = "block";
	}
	
	var toolTip = $(toolTipId); 
	
	if(toolTip && toolTip.style.display == "none")
	{
	    if (toolTip.parentNode)
	    {    
	        toolTip = toolTip.parentNode.removeChild(toolTip);
            document.body.appendChild(toolTip);
	    }
	    
	    toolTip.style.left = (getContentPartRealPos(sender, 'x')) + 'px';
		toolTip.style.top = (getContentPartRealPos(sender, 'y') - 79) + 'px'; // position slightly higher than the content part
		toolTip.style.display = "block";
	}
}

function HideContentProperties(overlayId, toolTipId)
{
    var overlay = $(overlayId);
    if(overlay)
    {
        overlay.style.display = "none";
    }
    
    var toolTip = $(toolTipId); 
	
	if(toolTip)
	{
	    toolTip.style.display = "none";
	}
}

var getContentPartRealPos = function (ele,dir)
{
	(dir == 'x') ? pos = ele.offsetLeft : pos = ele.offsetTop;
	tempEle = ele.offsetParent;
	while (tempEle != null)
	{
		pos += (dir == 'x') ? tempEle.offsetLeft : tempEle.offsetTop;
		tempEle = tempEle.offsetParent;
	}
	return pos;
}