Properly determine container width for shrink-wrapped elements, and try to handle the problem with full-width equations being too wide when the ex-size isn't measured accurately enough. Issue #1478.

This commit is contained in:
Davide P. Cervone 2016-05-17 15:52:50 -04:00
parent c0c63b1e12
commit 67bca32380

View File

@ -100,6 +100,12 @@
"min-height": 0, "max-height":"none", "min-height": 0, "max-height":"none",
padding:0, border: 0, margin: 0 padding:0, border: 0, margin: 0
}, },
".MathJax_SVG_LineBox": {
display: "table-cell!important",
width: "10000em!important",
"min-width":0, "max-width":"none",
padding:0, border:0, margin:0
},
"#MathJax_SVG_Tooltip": { "#MathJax_SVG_Tooltip": {
position: "absolute", left: 0, top: 0, position: "absolute", left: 0, top: 0,
@ -173,8 +179,7 @@
); );
// Used in preTranslate to get linebreak width // Used in preTranslate to get linebreak width
this.linebreakSpan = HTML.Element("span",null, this.linebreakSpan = HTML.Element("span",{className:"MathJax_SVG_LineBox"});
[["hr",{style: {width:"auto", size:1, padding:0, border:0, margin:0}}]]);
// Set up styles // Set up styles
return AJAX.Styles(this.config.styles,["InitializeSVG",this]); return AJAX.Styles(this.config.styles,["InitializeSVG",this]);
@ -190,7 +195,7 @@
document.body.appendChild(this.ExSpan); document.body.appendChild(this.ExSpan);
document.body.appendChild(this.linebreakSpan); document.body.appendChild(this.linebreakSpan);
this.defaultEx = this.ExSpan.firstChild.offsetHeight/60; this.defaultEx = this.ExSpan.firstChild.offsetHeight/60;
this.defaultWidth = this.linebreakSpan.firstChild.offsetWidth; this.defaultWidth = this.linebreakSpan.offsetWidth;
document.body.removeChild(this.linebreakSpan); document.body.removeChild(this.linebreakSpan);
document.body.removeChild(this.ExSpan); document.body.removeChild(this.ExSpan);
}, },
@ -256,16 +261,15 @@
test = script.previousSibling; div = test.previousSibling; test = script.previousSibling; div = test.previousSibling;
jax = script.MathJax.elementJax; if (!jax) continue; jax = script.MathJax.elementJax; if (!jax) continue;
ex = test.firstChild.offsetHeight/60; ex = test.firstChild.offsetHeight/60;
cwidth = div.previousSibling.firstChild.offsetWidth / this.config.scale * 100; cwidth = Math.max(0,(div.previousSibling.offsetWidth-2) / this.config.scale * 100);
if (relwidth) {maxwidth = cwidth}
if (ex === 0 || ex === "NaN") { if (ex === 0 || ex === "NaN") {
// can't read width, so move to hidden div for processing // can't read width, so move to hidden div for processing
// (this will cause a reflow for each math element that is hidden) // (this will cause a reflow for each math element that is hidden)
this.hiddenDiv.appendChild(div); this.hiddenDiv.appendChild(div);
jax.SVG.isHidden = true; jax.SVG.isHidden = true;
ex = this.defaultEx; cwidth = this.defaultWidth; ex = this.defaultEx; cwidth = this.defaultWidth;
if (relwidth) {maxwidth = cwidth}
} }
if (relwidth) {maxwidth = cwidth}
jax.SVG.ex = ex; jax.SVG.ex = ex;
jax.SVG.em = em = ex / SVG.TeX.x_height * 1000; // scale ex to x_height jax.SVG.em = em = ex / SVG.TeX.x_height * 1000; // scale ex to x_height
jax.SVG.cwidth = cwidth/em * 1000; jax.SVG.cwidth = cwidth/em * 1000;
@ -2089,13 +2093,14 @@
var style = svg.element.style, px = SVG.TeX.x_height/SVG.ex; var style = svg.element.style, px = SVG.TeX.x_height/SVG.ex;
var H = (Math.ceil(svg.H/px)+1)*px+SVG.HFUZZ, // round to pixels and add padding var H = (Math.ceil(svg.H/px)+1)*px+SVG.HFUZZ, // round to pixels and add padding
D = (Math.ceil(svg.D/px)+1)*px+SVG.DFUZZ; D = (Math.ceil(svg.D/px)+1)*px+SVG.DFUZZ;
svg.element.setAttribute("width",SVG.Ex(l+svg.w+r)); var w = l + svg.w + r;
svg.element.setAttribute("width",SVG.Ex(w));
svg.element.setAttribute("height",SVG.Ex(H+D)); svg.element.setAttribute("height",SVG.Ex(H+D));
style.verticalAlign = SVG.Ex(-D); style.verticalAlign = SVG.Ex(-D);
if (l) style.marginLeft = SVG.Ex(-l); if (l) style.marginLeft = SVG.Ex(-l);
if (r) style.marginRight = SVG.Ex(-r); if (r) style.marginRight = SVG.Ex(-r);
svg.element.setAttribute("viewBox",SVG.Fixed(-l,1)+" "+SVG.Fixed(-H,1)+" "+ svg.element.setAttribute("viewBox",SVG.Fixed(-l,1)+" "+SVG.Fixed(-H,1)+" "+
SVG.Fixed(l+svg.w+r,1)+" "+SVG.Fixed(H+D,1)); SVG.Fixed(w,1)+" "+SVG.Fixed(H+D,1));
// //
// If there is extra height or depth, hide that // If there is extra height or depth, hide that
// //
@ -2105,6 +2110,12 @@
style.verticalAlign = SVG.Ex(-svg.d); style.verticalAlign = SVG.Ex(-svg.d);
} }
// //
// The approximate ex can cause full-width equations to be too wide,
// so if they are close to full width, make sure they aren't too big.
//
if (Math.abs(w-SVG.cwidth) < 10)
style.maxWidth = SVG.Fixed(SVG.cwidth*SVG.em/1000);
//
// Add it to the MathJax span // Add it to the MathJax span
// //
var alttext = this.Get("alttext"); var alttext = this.Get("alttext");
@ -2131,7 +2142,7 @@
if (shift) { if (shift) {
HUB.Insert(style,({ HUB.Insert(style,({
left: {marginLeft: SVG.Ex(shift)}, left: {marginLeft: SVG.Ex(shift)},
right: {marginRight: SVG.Ex(-shift), marginLeft: SVG.Ex(Math.max(0,shift-(l+svg.w+r)))}, right: {marginRight: SVG.Ex(-shift), marginLeft: SVG.Ex(Math.max(0,shift-(w)))},
center: {marginLeft: SVG.Ex(shift), marginRight: SVG.Ex(-shift)} center: {marginLeft: SVG.Ex(shift), marginRight: SVG.Ex(-shift)}
})[values.indentalign]); })[values.indentalign]);
} }