From 97ab12ea52403990ba9dbb105fa7f43b84f67d7c Mon Sep 17 00:00:00 2001 From: "Davide P. Cervone" Date: Tue, 17 May 2016 15:55:07 -0400 Subject: [PATCH] Properly determine container width for shrink-wrapped elements in CommonHTML. Issue #1478. --- unpacked/jax/output/CommonHTML/jax.js | 34 ++++++++++++++++++++------- 1 file changed, 26 insertions(+), 8 deletions(-) diff --git a/unpacked/jax/output/CommonHTML/jax.js b/unpacked/jax/output/CommonHTML/jax.js index beb7380a8..b0fd4eacd 100644 --- a/unpacked/jax/output/CommonHTML/jax.js +++ b/unpacked/jax/output/CommonHTML/jax.js @@ -71,6 +71,10 @@ ".mjx-chtml[tabindex]:focus, body :focus .mjx-chtml[tabindex]": { display: "inline-table" // see issues #1282 and #1338 }, + ".mjx-full-width": { + display: "table-cell", + width: "10000em" + }, ".mjx-math": { "display": "inline-block", @@ -170,6 +174,12 @@ position: "absolute", width:"1px", height:"60ex" }, + ".mjx-line-box-test": { + display: "table-cell!important", + width: "10000em!important", + "min-width":0, "max-width":"none", + padding:0, border:0, margin:0 + }, "#MathJax_CHTML_Tooltip": { "background-color": "InfoBackground", color: "InfoText", @@ -232,6 +242,11 @@ // this.TestSpan = CHTML.Element("mjx-test",{style:{left:"1em"}},[["mjx-ex-box-test"]]); + // + // Used in preTranslate to get linebreak width + // + this.linebreakSpan = HTML.Element("span",{className:"mjx-line-box-test"}); + // // Set up styles and preload web fonts // @@ -260,9 +275,11 @@ // Get the default sizes (need styles in place to do this) // document.body.appendChild(this.TestSpan); + document.body.appendChild(this.linebreakSpan); this.defaultEm = this.getFontSize(this.TestSpan); this.defaultEx = this.TestSpan.firstChild.offsetHeight/60; - this.defaultWidth = this.TestSpan.offsetWidth; + this.defaultWidth = this.linebreakSpan.offsetWidth; + document.body.removeChild(this.linebreakSpan); document.body.removeChild(this.TestSpan); }, getFontSize: (window.getComputedStyle ? @@ -422,6 +439,7 @@ // // Add test nodes for determineing scales and linebreak widths // + script.parentNode.insertBefore(this.linebreakSpan.cloneNode(true),script); script.parentNode.insertBefore(this.TestSpan.cloneNode(true),script); } // @@ -434,12 +452,10 @@ jax = script.MathJax.elementJax; if (!jax) continue; em = CHTML.getFontSize(test); ex = test.firstChild.offsetHeight/60; - if (ex === 0 || ex === "NaN") ex = this.defaultEx - node = test; - while (node) { - cwidth = node.offsetWidth; if (cwidth) break; - cwidth = CHTML.getMaxWidth(node); if (cwidth) break; - node = node.parentNode; + cwidth = Math.max(0,test.previousSibling.offsetWidth-2); + if (ex === 0 || ex === "NaN") { + ex = this.defaultEx; + cwidth = this.defaultWidth; } if (relwidth) maxwidth = cwidth; scale = (this.config.matchFontHeight ? ex/this.TEX.x_height/em : 1); @@ -455,7 +471,9 @@ for (i = 0; i < m; i++) { script = scripts[i]; if (!script.parentNode) continue; test = scripts[i].previousSibling; + span = test.previousSibling; jax = scripts[i].MathJax.elementJax; if (!jax) continue; + span.parentNode.removeChild(span); test.parentNode.removeChild(test); } state.CHTMLeqn = state.CHTMLlast = 0; state.CHTMLi = -1; @@ -1723,8 +1741,8 @@ var alttext = this.Get("alttext"); if (alttext && !node.getAttribute("aria-label")) node.setAttribute("aria-label",alttext); if (this.CHTML.pwidth) { - node.parentNode.style.width = this.CHTML.pwidth; node.parentNode.style.minWidth = this.CHTML.mwidth||CHTML.Em(this.CHTML.w); + node.parentNode.className += " mjx-full-width"; } else if (!this.isMultiline && this.Get("display") === "block") { var values = this.getValues("indentalignfirst","indentshiftfirst","indentalign","indentshift"); if (values.indentalignfirst !== MML.INDENTALIGN.INDENTALIGN) values.indentalign = values.indentalignfirst;