MDL-15498: Completion: fixed bugs with long titles in the fancy text-rotation SVG code

This commit is contained in:
sam_marshall 2008-07-29 12:27:04 +00:00
parent bb63fc3e0c
commit 388afecdf4

View File

@ -3,22 +3,31 @@ var SVGNS='http://www.w3.org/2000/svg',XLINKNS='http://www.w3.org/1999/xlink';
function textrotate_make_svg(el)
{
var string=el.firstChild.nodeValue;
// Add absolute-positioned string (to measure length)
var abs=document.createElement('div');
abs.appendChild(document.createTextNode(string));
abs.style.position='absolute';
el.parentNode.insertBefore(abs,el);
var textWidth=abs.offsetWidth,textHeight=abs.offsetHeight;
el.parentNode.removeChild(abs);
// Create SVG
var svg=document.createElementNS(SVGNS,'svg');
svg.setAttribute('version','1.1');
var width=(el.offsetHeight*9)/8;
var width=(textHeight*9)/8;
svg.setAttribute('width',width);
svg.setAttribute('height',el.offsetWidth+20);
svg.setAttribute('height',textWidth+20);
// Add text
var text=document.createElementNS(SVGNS,'text');
svg.appendChild(text);
text.setAttribute('x',el.offsetWidth);
text.setAttribute('y',-el.offsetHeight/4);
text.setAttribute('x',textWidth);
text.setAttribute('y',-textHeight/4);
text.setAttribute('text-anchor','end');
text.setAttribute('transform','rotate(90)');
text.appendChild(document.createTextNode(string));
// Is there an icon near the text?
var icon=el.parentNode.firstChild;
if(icon.nodeName.toLowerCase()=='img') {
@ -27,7 +36,7 @@ function textrotate_make_svg(el)
var iconx=el.offsetHeight/4;
if(iconx>width-16) iconx=width-16;
image.setAttribute('x',iconx);
image.setAttribute('y',el.offsetWidth+4);
image.setAttribute('y',textWidth+4);
image.setAttribute('width',16);
image.setAttribute('height',16);
image.setAttributeNS(XLINKNS,'href',icon.src);
@ -50,15 +59,15 @@ function textrotate_init() {
elements=YAHOO.util.Dom.getElementsByClassName('completion-expected', 'div');
for(var i=0;i<elements.length;i++)
{
{
var el=elements[i];
el.style.display='inline';
//el.style.fontSize='0.6em';
var parent=el.parentNode;
parent.removeChild(el);
parent.insertBefore(el,parent.firstChild);
textrotate_make_svg(el.firstChild);
}
}
YAHOO.util.Event.onDOMReady(textrotate_init);