From 6bc7cd574fd9e3011667dc4d98f7188e5e00a7dd Mon Sep 17 00:00:00 2001 From: Martin von Gagern Date: Thu, 10 Sep 2015 11:34:34 +0200 Subject: [PATCH 1/2] Split up groupType map in buildHTML and buildMathML code Having long object literals containing the code is problematic. It makes it difficult to add auxiliary functions or data close to the function inside the map where it is needed. Building the map in several steps, repeating the map name at each step, avoids that problem since it makes the definitions independent from one another, so anything can go between them. This commit deliberately avoided reindenting existing code to match the new surroundings. That way it is easier to see where actual changes happen, even when not performing a whitespace-ignoring diff. --- src/buildHTML.js | 120 ++++++++++++++++++++++----------------------- src/buildMathML.js | 120 ++++++++++++++++++++++----------------------- 2 files changed, 120 insertions(+), 120 deletions(-) diff --git a/src/buildHTML.js b/src/buildHTML.js index 9e76f82c..74dd993e 100644 --- a/src/buildHTML.js +++ b/src/buildHTML.js @@ -168,16 +168,17 @@ var makeNullDelimiter = function(options) { * This is a map of group types to the function used to handle that type. * Simpler types come at the beginning, while complicated types come afterwards. */ -var groupTypes = { - mathord: function(group, options, prev) { +var groupTypes = {}; + + groupTypes.mathord = function(group, options, prev) { return buildCommon.makeOrd(group, options, "mathord"); - }, + }; - textord: function(group, options, prev) { + groupTypes.textord = function(group, options, prev) { return buildCommon.makeOrd(group, options, "textord"); - }, + }; - bin: function(group, options, prev) { + groupTypes.bin = function(group, options, prev) { var className = "mbin"; // Pull out the most recent element. Do some special handling to find // things at the end of a \color group. Note that we don't use the same @@ -198,46 +199,46 @@ var groupTypes = { return buildCommon.mathsym( group.value, group.mode, options.getColor(), [className]); - }, + }; - rel: function(group, options, prev) { + groupTypes.rel = function(group, options, prev) { return buildCommon.mathsym( group.value, group.mode, options.getColor(), ["mrel"]); - }, + }; - open: function(group, options, prev) { + groupTypes.open = function(group, options, prev) { return buildCommon.mathsym( group.value, group.mode, options.getColor(), ["mopen"]); - }, + }; - close: function(group, options, prev) { + groupTypes.close = function(group, options, prev) { return buildCommon.mathsym( group.value, group.mode, options.getColor(), ["mclose"]); - }, + }; - inner: function(group, options, prev) { + groupTypes.inner = function(group, options, prev) { return buildCommon.mathsym( group.value, group.mode, options.getColor(), ["minner"]); - }, + }; - punct: function(group, options, prev) { + groupTypes.punct = function(group, options, prev) { return buildCommon.mathsym( group.value, group.mode, options.getColor(), ["mpunct"]); - }, + }; - ordgroup: function(group, options, prev) { + groupTypes.ordgroup = function(group, options, prev) { return makeSpan( ["mord", options.style.cls()], buildExpression(group.value, options.reset()) ); - }, + }; - text: function(group, options, prev) { + groupTypes.text = function(group, options, prev) { return makeSpan(["text", "mord", options.style.cls()], buildExpression(group.value.body, options.reset())); - }, + }; - color: function(group, options, prev) { + groupTypes.color = function(group, options, prev) { var elements = buildExpression( group.value.value, options.withColor(group.value.color), @@ -249,9 +250,9 @@ var groupTypes = { // elements will be able to directly interact with their neighbors. For // example, `\color{red}{2 +} 3` has the same spacing as `2 + 3` return new buildCommon.makeFragment(elements); - }, + }; - supsub: function(group, options, prev) { + groupTypes.supsub = function(group, options, prev) { // Superscript and subscripts are handled in the TeXbook on page // 445-446, rules 18(a-f). @@ -370,9 +371,9 @@ var groupTypes = { return makeSpan([getTypeOfGroup(group.value.base)], [base, supsub]); - }, + }; - genfrac: function(group, options, prev) { + groupTypes.genfrac = function(group, options, prev) { // Fractions are handled in the TeXbook on pages 444-445, rules 15(a-e). // Figure out what style this fraction should be in based on the // function used @@ -503,9 +504,9 @@ var groupTypes = { ["mord", options.style.reset(), fstyle.cls()], [leftDelim, makeSpan(["mfrac"], [frac]), rightDelim], options.getColor()); - }, + }; - array: function(group, options, prev) { + groupTypes.array = function(group, options, prev) { var r, c; var nr = group.value.body.length; var nc = 0; @@ -664,9 +665,9 @@ var groupTypes = { } body = makeSpan(["mtable"], cols); return makeSpan(["mord"], [body], options.getColor()); - }, + }; - spacing: function(group, options, prev) { + groupTypes.spacing = function(group, options, prev) { if (group.value === "\\ " || group.value === "\\space" || group.value === " " || group.value === "~") { // Spaces are generated by adding an actual space. Each of these @@ -683,25 +684,25 @@ var groupTypes = { ["mord", "mspace", buildCommon.spacingFunctions[group.value].className]); } - }, + }; - llap: function(group, options, prev) { + groupTypes.llap = function(group, options, prev) { var inner = makeSpan( ["inner"], [buildGroup(group.value.body, options.reset())]); var fix = makeSpan(["fix"], []); return makeSpan( ["llap", options.style.cls()], [inner, fix]); - }, + }; - rlap: function(group, options, prev) { + groupTypes.rlap = function(group, options, prev) { var inner = makeSpan( ["inner"], [buildGroup(group.value.body, options.reset())]); var fix = makeSpan(["fix"], []); return makeSpan( ["rlap", options.style.cls()], [inner, fix]); - }, + }; - op: function(group, options, prev) { + groupTypes.op = function(group, options, prev) { // Operators are handled in the TeXbook pg. 443-444, rule 13(a). var supGroup; var subGroup; @@ -858,9 +859,9 @@ var groupTypes = { return base; } - }, + }; - katex: function(group, options, prev) { + groupTypes.katex = function(group, options, prev) { // The KaTeX logo. The offsets for the K and a were chosen to look // good, but the offsets for the T, E, and X were taken from the // definition of \TeX in TeX (see TeXbook pg. 356) @@ -885,9 +886,9 @@ var groupTypes = { return makeSpan( ["katex-logo", "mord"], [k, a, t, e, x], options.getColor()); - }, + }; - overline: function(group, options, prev) { + groupTypes.overline = function(group, options, prev) { // Overlines are handled in the TeXbook pg 443, Rule 9. // Build the inner group in the cramped style. @@ -912,9 +913,9 @@ var groupTypes = { ], "firstBaseline", null, options); return makeSpan(["overline", "mord"], [vlist], options.getColor()); - }, + }; - sqrt: function(group, options, prev) { + groupTypes.sqrt = function(group, options, prev) { // Square roots are handled in the TeXbook pg. 443, Rule 11. // First, we do the same steps as in overline to build the inner group @@ -1011,9 +1012,9 @@ var groupTypes = { return makeSpan(["sqrt", "mord"], [rootVListWrap, delim, body]); } - }, + }; - sizing: function(group, options, prev) { + groupTypes.sizing = function(group, options, prev) { // Handle sizing operators like \Huge. Real TeX doesn't actually allow // these functions inside of math expressions, so we do some special // handling. @@ -1030,9 +1031,9 @@ var groupTypes = { span.maxFontSize = fontSize * options.style.sizeMultiplier; return span; - }, + }; - styling: function(group, options, prev) { + groupTypes.styling = function(group, options, prev) { // Style changes are handled in the TeXbook on pg. 442, Rule 3. // Figure out what style we're changing to. @@ -1050,14 +1051,14 @@ var groupTypes = { group.value.value, options.withStyle(newStyle), prev); return makeSpan([options.style.reset(), newStyle.cls()], inner); - }, + }; - font: function(group, options, prev) { + groupTypes.font = function(group, options, prev) { var font = group.value.font; return buildGroup(group.value.body, options.withFont(font), prev); - }, + }; - delimsizing: function(group, options, prev) { + groupTypes.delimsizing = function(group, options, prev) { var delim = group.value.value; if (delim === ".") { @@ -1071,9 +1072,9 @@ var groupTypes = { [groupToType[group.value.delimType]], [delimiter.sizedDelim( delim, group.value.size, options, group.mode)]); - }, + }; - leftright: function(group, options, prev) { + groupTypes.leftright = function(group, options, prev) { // Build the inner expression var inner = buildExpression(group.value.body, options.reset()); @@ -1120,9 +1121,9 @@ var groupTypes = { return makeSpan( ["minner", options.style.cls()], inner, options.getColor()); - }, + }; - rule: function(group, options, prev) { + groupTypes.rule = function(group, options, prev) { // Make an empty span for the rule var rule = makeSpan(["mord", "rule"], [], options.getColor()); @@ -1162,9 +1163,9 @@ var groupTypes = { rule.depth = -shift; return rule; - }, + }; - accent: function(group, options, prev) { + groupTypes.accent = function(group, options, prev) { // Accents are handled in the TeXbook pg. 443, rule 12. var base = group.value.base; @@ -1268,9 +1269,9 @@ var groupTypes = { } else { return accentWrap; } - }, + }; - phantom: function(group, options, prev) { + groupTypes.phantom = function(group, options, prev) { var elements = buildExpression( group.value.value, options.withPhantom(), @@ -1280,8 +1281,7 @@ var groupTypes = { // \phantom isn't supposed to affect the elements it contains. // See "color" for more details. return new buildCommon.makeFragment(elements); - } -}; + }; /** * buildGroup is the function that takes a group and calls the correct groupType diff --git a/src/buildMathML.js b/src/buildMathML.js index f0f876af..15346206 100644 --- a/src/buildMathML.js +++ b/src/buildMathML.js @@ -61,8 +61,9 @@ var getVariant = function(group, options) { * Functions for handling the different types of groups found in the parse * tree. Each function should take a parse group and return a MathML node. */ -var groupTypes = { - mathord: function(group, options) { +var groupTypes = {}; + + groupTypes.mathord = function(group, options) { var node = new mathMLTree.MathNode( "mi", [makeText(group.value, group.mode)]); @@ -72,9 +73,9 @@ var groupTypes = { node.setAttribute("mathvariant", variant); } return node; - }, + }; - textord: function(group, options) { + groupTypes.textord = function(group, options) { var text = makeText(group.value, group.mode); var variant = getVariant(group, options) || "normal"; @@ -93,69 +94,69 @@ var groupTypes = { } return node; - }, + }; - bin: function(group) { + groupTypes.bin = function(group) { var node = new mathMLTree.MathNode( "mo", [makeText(group.value, group.mode)]); return node; - }, + }; - rel: function(group) { + groupTypes.rel = function(group) { var node = new mathMLTree.MathNode( "mo", [makeText(group.value, group.mode)]); return node; - }, + }; - open: function(group) { + groupTypes.open = function(group) { var node = new mathMLTree.MathNode( "mo", [makeText(group.value, group.mode)]); return node; - }, + }; - close: function(group) { + groupTypes.close = function(group) { var node = new mathMLTree.MathNode( "mo", [makeText(group.value, group.mode)]); return node; - }, + }; - inner: function(group) { + groupTypes.inner = function(group) { var node = new mathMLTree.MathNode( "mo", [makeText(group.value, group.mode)]); return node; - }, + }; - punct: function(group) { + groupTypes.punct = function(group) { var node = new mathMLTree.MathNode( "mo", [makeText(group.value, group.mode)]); node.setAttribute("separator", "true"); return node; - }, + }; - ordgroup: function(group, options) { + groupTypes.ordgroup = function(group, options) { var inner = buildExpression(group.value, options); var node = new mathMLTree.MathNode("mrow", inner); return node; - }, + }; - text: function(group, options) { + groupTypes.text = function(group, options) { var inner = buildExpression(group.value.body, options); var node = new mathMLTree.MathNode("mtext", inner); return node; - }, + }; - color: function(group, options) { + groupTypes.color = function(group, options) { var inner = buildExpression(group.value.value, options); var node = new mathMLTree.MathNode("mstyle", inner); @@ -163,9 +164,9 @@ var groupTypes = { node.setAttribute("mathcolor", group.value.color); return node; - }, + }; - supsub: function(group, options) { + groupTypes.supsub = function(group, options) { var children = [buildGroup(group.value.base, options)]; if (group.value.sub) { @@ -188,9 +189,9 @@ var groupTypes = { var node = new mathMLTree.MathNode(nodeType, children); return node; - }, + }; - genfrac: function(group, options) { + groupTypes.genfrac = function(group, options) { var node = new mathMLTree.MathNode( "mfrac", [buildGroup(group.value.numer, options), @@ -229,9 +230,9 @@ var groupTypes = { } return node; - }, + }; - array: function(group, options) { + groupTypes.array = function(group, options) { return new mathMLTree.MathNode( "mtable", group.value.body.map(function(row) { return new mathMLTree.MathNode( @@ -240,9 +241,9 @@ var groupTypes = { "mtd", [buildGroup(cell, options)]); })); })); - }, + }; - sqrt: function(group, options) { + groupTypes.sqrt = function(group, options) { var node; if (group.value.index) { node = new mathMLTree.MathNode( @@ -256,9 +257,9 @@ var groupTypes = { } return node; - }, + }; - leftright: function(group, options) { + groupTypes.leftright = function(group, options) { var inner = buildExpression(group.value.body, options); if (group.value.left !== ".") { @@ -282,9 +283,9 @@ var groupTypes = { var outerNode = new mathMLTree.MathNode("mrow", inner); return outerNode; - }, + }; - accent: function(group, options) { + groupTypes.accent = function(group, options) { var accentNode = new mathMLTree.MathNode( "mo", [makeText(group.value.accent, group.mode)]); @@ -296,9 +297,9 @@ var groupTypes = { node.setAttribute("accent", "true"); return node; - }, + }; - spacing: function(group) { + groupTypes.spacing = function(group) { var node; if (group.value === "\\ " || group.value === "\\space" || @@ -313,9 +314,9 @@ var groupTypes = { } return node; - }, + }; - op: function(group) { + groupTypes.op = function(group) { var node; // TODO(emily): handle big operators using the `largeop` attribute @@ -334,21 +335,21 @@ var groupTypes = { } return node; - }, + }; - katex: function(group) { + groupTypes.katex = function(group) { var node = new mathMLTree.MathNode( "mtext", [new mathMLTree.TextNode("KaTeX")]); return node; - }, + }; - font: function(group, options) { + groupTypes.font = function(group, options) { var font = group.value.font; return buildGroup(group.value.body, options.withFont(font)); - }, + }; - delimsizing: function(group) { + groupTypes.delimsizing = function(group) { var children = []; if (group.value.value !== ".") { @@ -369,9 +370,9 @@ var groupTypes = { } return node; - }, + }; - styling: function(group, options) { + groupTypes.styling = function(group, options) { var inner = buildExpression(group.value.value, options); var node = new mathMLTree.MathNode("mstyle", inner); @@ -389,9 +390,9 @@ var groupTypes = { node.setAttribute("displaystyle", attr[1]); return node; - }, + }; - sizing: function(group, options) { + groupTypes.sizing = function(group, options) { var inner = buildExpression(group.value.value, options); var node = new mathMLTree.MathNode("mstyle", inner); @@ -405,9 +406,9 @@ var groupTypes = { "mathsize", buildCommon.sizingMultiplier[group.value.size] + "em"); return node; - }, + }; - overline: function(group, options) { + groupTypes.overline = function(group, options) { var operator = new mathMLTree.MathNode( "mo", [new mathMLTree.TextNode("\u203e")]); operator.setAttribute("stretchy", "true"); @@ -419,17 +420,17 @@ var groupTypes = { node.setAttribute("accent", "true"); return node; - }, + }; - rule: function(group) { + groupTypes.rule = function(group) { // TODO(emily): Figure out if there's an actual way to draw black boxes // in MathML. var node = new mathMLTree.MathNode("mrow"); return node; - }, + }; - llap: function(group, options) { + groupTypes.llap = function(group, options) { var node = new mathMLTree.MathNode( "mpadded", [buildGroup(group.value.body, options)]); @@ -437,22 +438,21 @@ var groupTypes = { node.setAttribute("width", "0px"); return node; - }, + }; - rlap: function(group, options) { + groupTypes.rlap = function(group, options) { var node = new mathMLTree.MathNode( "mpadded", [buildGroup(group.value.body, options)]); node.setAttribute("width", "0px"); return node; - }, + }; - phantom: function(group, options, prev) { + groupTypes.phantom = function(group, options, prev) { var inner = buildExpression(group.value.value, options); return new mathMLTree.MathNode("mphantom", inner); - } -}; + }; /** * Takes a list of nodes, builds them, and returns a list of the generated From d809f9c362afaab67091e5578a7a6f8e28165787 Mon Sep 17 00:00:00 2001 From: Martin von Gagern Date: Thu, 10 Sep 2015 11:47:47 +0200 Subject: [PATCH 2/2] Reindent groupType definitions in buildHTML and buildMathML Since the previous commit deliberately avoided reindenting, this one here does just that: reindenting the existing code. There are no other changes. --- src/buildHTML.js | 2062 ++++++++++++++++++++++---------------------- src/buildMathML.js | 680 +++++++-------- 2 files changed, 1371 insertions(+), 1371 deletions(-) diff --git a/src/buildHTML.js b/src/buildHTML.js index 74dd993e..5bc3cf29 100644 --- a/src/buildHTML.js +++ b/src/buildHTML.js @@ -170,1118 +170,1118 @@ var makeNullDelimiter = function(options) { */ var groupTypes = {}; - groupTypes.mathord = function(group, options, prev) { - return buildCommon.makeOrd(group, options, "mathord"); - }; +groupTypes.mathord = function(group, options, prev) { + return buildCommon.makeOrd(group, options, "mathord"); +}; - groupTypes.textord = function(group, options, prev) { - return buildCommon.makeOrd(group, options, "textord"); - }; +groupTypes.textord = function(group, options, prev) { + return buildCommon.makeOrd(group, options, "textord"); +}; - groupTypes.bin = function(group, options, prev) { - var className = "mbin"; - // Pull out the most recent element. Do some special handling to find - // things at the end of a \color group. Note that we don't use the same - // logic for ordgroups (which count as ords). - var prevAtom = prev; - while (prevAtom && prevAtom.type === "color") { - var atoms = prevAtom.value.value; - prevAtom = atoms[atoms.length - 1]; - } - // See TeXbook pg. 442-446, Rules 5 and 6, and the text before Rule 19. - // Here, we determine whether the bin should turn into an ord. We - // currently only apply Rule 5. - if (!prev || utils.contains(["mbin", "mopen", "mrel", "mop", "mpunct"], - getTypeOfGroup(prevAtom))) { - group.type = "textord"; - className = "mord"; +groupTypes.bin = function(group, options, prev) { + var className = "mbin"; + // Pull out the most recent element. Do some special handling to find + // things at the end of a \color group. Note that we don't use the same + // logic for ordgroups (which count as ords). + var prevAtom = prev; + while (prevAtom && prevAtom.type === "color") { + var atoms = prevAtom.value.value; + prevAtom = atoms[atoms.length - 1]; + } + // See TeXbook pg. 442-446, Rules 5 and 6, and the text before Rule 19. + // Here, we determine whether the bin should turn into an ord. We + // currently only apply Rule 5. + if (!prev || utils.contains(["mbin", "mopen", "mrel", "mop", "mpunct"], + getTypeOfGroup(prevAtom))) { + group.type = "textord"; + className = "mord"; + } + + return buildCommon.mathsym( + group.value, group.mode, options.getColor(), [className]); +}; + +groupTypes.rel = function(group, options, prev) { + return buildCommon.mathsym( + group.value, group.mode, options.getColor(), ["mrel"]); +}; + +groupTypes.open = function(group, options, prev) { + return buildCommon.mathsym( + group.value, group.mode, options.getColor(), ["mopen"]); +}; + +groupTypes.close = function(group, options, prev) { + return buildCommon.mathsym( + group.value, group.mode, options.getColor(), ["mclose"]); +}; + +groupTypes.inner = function(group, options, prev) { + return buildCommon.mathsym( + group.value, group.mode, options.getColor(), ["minner"]); +}; + +groupTypes.punct = function(group, options, prev) { + return buildCommon.mathsym( + group.value, group.mode, options.getColor(), ["mpunct"]); +}; + +groupTypes.ordgroup = function(group, options, prev) { + return makeSpan( + ["mord", options.style.cls()], + buildExpression(group.value, options.reset()) + ); +}; + +groupTypes.text = function(group, options, prev) { + return makeSpan(["text", "mord", options.style.cls()], + buildExpression(group.value.body, options.reset())); +}; + +groupTypes.color = function(group, options, prev) { + var elements = buildExpression( + group.value.value, + options.withColor(group.value.color), + prev + ); + + // \color isn't supposed to affect the type of the elements it contains. + // To accomplish this, we wrap the results in a fragment, so the inner + // elements will be able to directly interact with their neighbors. For + // example, `\color{red}{2 +} 3` has the same spacing as `2 + 3` + return new buildCommon.makeFragment(elements); +}; + +groupTypes.supsub = function(group, options, prev) { + // Superscript and subscripts are handled in the TeXbook on page + // 445-446, rules 18(a-f). + + // Here is where we defer to the inner group if it should handle + // superscripts and subscripts itself. + if (shouldHandleSupSub(group.value.base, options)) { + return groupTypes[group.value.base.type](group, options, prev); + } + + var base = buildGroup(group.value.base, options.reset()); + var supmid, submid, sup, sub; + + if (group.value.sup) { + sup = buildGroup(group.value.sup, + options.withStyle(options.style.sup())); + supmid = makeSpan( + [options.style.reset(), options.style.sup().cls()], [sup]); + } + + if (group.value.sub) { + sub = buildGroup(group.value.sub, + options.withStyle(options.style.sub())); + submid = makeSpan( + [options.style.reset(), options.style.sub().cls()], [sub]); + } + + // Rule 18a + var supShift, subShift; + if (isCharacterBox(group.value.base)) { + supShift = 0; + subShift = 0; + } else { + supShift = base.height - fontMetrics.metrics.supDrop; + subShift = base.depth + fontMetrics.metrics.subDrop; + } + + // Rule 18c + var minSupShift; + if (options.style === Style.DISPLAY) { + minSupShift = fontMetrics.metrics.sup1; + } else if (options.style.cramped) { + minSupShift = fontMetrics.metrics.sup3; + } else { + minSupShift = fontMetrics.metrics.sup2; + } + + // scriptspace is a font-size-independent size, so scale it + // appropriately + var multiplier = Style.TEXT.sizeMultiplier * + options.style.sizeMultiplier; + var scriptspace = + (0.5 / fontMetrics.metrics.ptPerEm) / multiplier + "em"; + + var supsub; + if (!group.value.sup) { + // Rule 18b + subShift = Math.max( + subShift, fontMetrics.metrics.sub1, + sub.height - 0.8 * fontMetrics.metrics.xHeight); + + supsub = buildCommon.makeVList([ + {type: "elem", elem: submid} + ], "shift", subShift, options); + + supsub.children[0].style.marginRight = scriptspace; + + // Subscripts shouldn't be shifted by the base's italic correction. + // Account for that by shifting the subscript back the appropriate + // amount. Note we only do this when the base is a single symbol. + if (base instanceof domTree.symbolNode) { + supsub.children[0].style.marginLeft = -base.italic + "em"; } + } else if (!group.value.sub) { + // Rule 18c, d + supShift = Math.max(supShift, minSupShift, + sup.depth + 0.25 * fontMetrics.metrics.xHeight); - return buildCommon.mathsym( - group.value, group.mode, options.getColor(), [className]); - }; + supsub = buildCommon.makeVList([ + {type: "elem", elem: supmid} + ], "shift", -supShift, options); - groupTypes.rel = function(group, options, prev) { - return buildCommon.mathsym( - group.value, group.mode, options.getColor(), ["mrel"]); - }; + supsub.children[0].style.marginRight = scriptspace; + } else { + supShift = Math.max( + supShift, minSupShift, + sup.depth + 0.25 * fontMetrics.metrics.xHeight); + subShift = Math.max(subShift, fontMetrics.metrics.sub2); - groupTypes.open = function(group, options, prev) { - return buildCommon.mathsym( - group.value, group.mode, options.getColor(), ["mopen"]); - }; + var ruleWidth = fontMetrics.metrics.defaultRuleThickness; - groupTypes.close = function(group, options, prev) { - return buildCommon.mathsym( - group.value, group.mode, options.getColor(), ["mclose"]); - }; - - groupTypes.inner = function(group, options, prev) { - return buildCommon.mathsym( - group.value, group.mode, options.getColor(), ["minner"]); - }; - - groupTypes.punct = function(group, options, prev) { - return buildCommon.mathsym( - group.value, group.mode, options.getColor(), ["mpunct"]); - }; - - groupTypes.ordgroup = function(group, options, prev) { - return makeSpan( - ["mord", options.style.cls()], - buildExpression(group.value, options.reset()) - ); - }; - - groupTypes.text = function(group, options, prev) { - return makeSpan(["text", "mord", options.style.cls()], - buildExpression(group.value.body, options.reset())); - }; - - groupTypes.color = function(group, options, prev) { - var elements = buildExpression( - group.value.value, - options.withColor(group.value.color), - prev - ); - - // \color isn't supposed to affect the type of the elements it contains. - // To accomplish this, we wrap the results in a fragment, so the inner - // elements will be able to directly interact with their neighbors. For - // example, `\color{red}{2 +} 3` has the same spacing as `2 + 3` - return new buildCommon.makeFragment(elements); - }; - - groupTypes.supsub = function(group, options, prev) { - // Superscript and subscripts are handled in the TeXbook on page - // 445-446, rules 18(a-f). - - // Here is where we defer to the inner group if it should handle - // superscripts and subscripts itself. - if (shouldHandleSupSub(group.value.base, options)) { - return groupTypes[group.value.base.type](group, options, prev); - } - - var base = buildGroup(group.value.base, options.reset()); - var supmid, submid, sup, sub; - - if (group.value.sup) { - sup = buildGroup(group.value.sup, - options.withStyle(options.style.sup())); - supmid = makeSpan( - [options.style.reset(), options.style.sup().cls()], [sup]); - } - - if (group.value.sub) { - sub = buildGroup(group.value.sub, - options.withStyle(options.style.sub())); - submid = makeSpan( - [options.style.reset(), options.style.sub().cls()], [sub]); - } - - // Rule 18a - var supShift, subShift; - if (isCharacterBox(group.value.base)) { - supShift = 0; - subShift = 0; - } else { - supShift = base.height - fontMetrics.metrics.supDrop; - subShift = base.depth + fontMetrics.metrics.subDrop; - } - - // Rule 18c - var minSupShift; - if (options.style === Style.DISPLAY) { - minSupShift = fontMetrics.metrics.sup1; - } else if (options.style.cramped) { - minSupShift = fontMetrics.metrics.sup3; - } else { - minSupShift = fontMetrics.metrics.sup2; - } - - // scriptspace is a font-size-independent size, so scale it - // appropriately - var multiplier = Style.TEXT.sizeMultiplier * - options.style.sizeMultiplier; - var scriptspace = - (0.5 / fontMetrics.metrics.ptPerEm) / multiplier + "em"; - - var supsub; - if (!group.value.sup) { - // Rule 18b - subShift = Math.max( - subShift, fontMetrics.metrics.sub1, - sub.height - 0.8 * fontMetrics.metrics.xHeight); - - supsub = buildCommon.makeVList([ - {type: "elem", elem: submid} - ], "shift", subShift, options); - - supsub.children[0].style.marginRight = scriptspace; - - // Subscripts shouldn't be shifted by the base's italic correction. - // Account for that by shifting the subscript back the appropriate - // amount. Note we only do this when the base is a single symbol. - if (base instanceof domTree.symbolNode) { - supsub.children[0].style.marginLeft = -base.italic + "em"; + // Rule 18e + if ((supShift - sup.depth) - (sub.height - subShift) < + 4 * ruleWidth) { + subShift = 4 * ruleWidth - (supShift - sup.depth) + sub.height; + var psi = 0.8 * fontMetrics.metrics.xHeight - + (supShift - sup.depth); + if (psi > 0) { + supShift += psi; + subShift -= psi; } - } else if (!group.value.sub) { - // Rule 18c, d - supShift = Math.max(supShift, minSupShift, - sup.depth + 0.25 * fontMetrics.metrics.xHeight); + } - supsub = buildCommon.makeVList([ - {type: "elem", elem: supmid} - ], "shift", -supShift, options); + supsub = buildCommon.makeVList([ + {type: "elem", elem: submid, shift: subShift}, + {type: "elem", elem: supmid, shift: -supShift} + ], "individualShift", null, options); - supsub.children[0].style.marginRight = scriptspace; + // See comment above about subscripts not being shifted + if (base instanceof domTree.symbolNode) { + supsub.children[0].style.marginLeft = -base.italic + "em"; + } + + supsub.children[0].style.marginRight = scriptspace; + supsub.children[1].style.marginRight = scriptspace; + } + + return makeSpan([getTypeOfGroup(group.value.base)], + [base, supsub]); +}; + +groupTypes.genfrac = function(group, options, prev) { + // Fractions are handled in the TeXbook on pages 444-445, rules 15(a-e). + // Figure out what style this fraction should be in based on the + // function used + var fstyle = options.style; + if (group.value.size === "display") { + fstyle = Style.DISPLAY; + } else if (group.value.size === "text") { + fstyle = Style.TEXT; + } + + var nstyle = fstyle.fracNum(); + var dstyle = fstyle.fracDen(); + + var numer = buildGroup(group.value.numer, options.withStyle(nstyle)); + var numerreset = makeSpan([fstyle.reset(), nstyle.cls()], [numer]); + + var denom = buildGroup(group.value.denom, options.withStyle(dstyle)); + var denomreset = makeSpan([fstyle.reset(), dstyle.cls()], [denom]); + + var ruleWidth; + if (group.value.hasBarLine) { + ruleWidth = fontMetrics.metrics.defaultRuleThickness / + options.style.sizeMultiplier; + } else { + ruleWidth = 0; + } + + // Rule 15b + var numShift; + var clearance; + var denomShift; + if (fstyle.size === Style.DISPLAY.size) { + numShift = fontMetrics.metrics.num1; + if (ruleWidth > 0) { + clearance = 3 * ruleWidth; } else { - supShift = Math.max( - supShift, minSupShift, - sup.depth + 0.25 * fontMetrics.metrics.xHeight); - subShift = Math.max(subShift, fontMetrics.metrics.sub2); + clearance = 7 * fontMetrics.metrics.defaultRuleThickness; + } + denomShift = fontMetrics.metrics.denom1; + } else { + if (ruleWidth > 0) { + numShift = fontMetrics.metrics.num2; + clearance = ruleWidth; + } else { + numShift = fontMetrics.metrics.num3; + clearance = 3 * fontMetrics.metrics.defaultRuleThickness; + } + denomShift = fontMetrics.metrics.denom2; + } - var ruleWidth = fontMetrics.metrics.defaultRuleThickness; + var frac; + if (ruleWidth === 0) { + // Rule 15c + var candiateClearance = + (numShift - numer.depth) - (denom.height - denomShift); + if (candiateClearance < clearance) { + numShift += 0.5 * (clearance - candiateClearance); + denomShift += 0.5 * (clearance - candiateClearance); + } - // Rule 18e - if ((supShift - sup.depth) - (sub.height - subShift) < - 4 * ruleWidth) { - subShift = 4 * ruleWidth - (supShift - sup.depth) + sub.height; - var psi = 0.8 * fontMetrics.metrics.xHeight - - (supShift - sup.depth); - if (psi > 0) { - supShift += psi; - subShift -= psi; + frac = buildCommon.makeVList([ + {type: "elem", elem: denomreset, shift: denomShift}, + {type: "elem", elem: numerreset, shift: -numShift} + ], "individualShift", null, options); + } else { + // Rule 15d + var axisHeight = fontMetrics.metrics.axisHeight; + + if ((numShift - numer.depth) - (axisHeight + 0.5 * ruleWidth) < + clearance) { + numShift += + clearance - ((numShift - numer.depth) - + (axisHeight + 0.5 * ruleWidth)); + } + + if ((axisHeight - 0.5 * ruleWidth) - (denom.height - denomShift) < + clearance) { + denomShift += + clearance - ((axisHeight - 0.5 * ruleWidth) - + (denom.height - denomShift)); + } + + var mid = makeSpan( + [options.style.reset(), Style.TEXT.cls(), "frac-line"]); + // Manually set the height of the line because its height is + // created in CSS + mid.height = ruleWidth; + + var midShift = -(axisHeight - 0.5 * ruleWidth); + + frac = buildCommon.makeVList([ + {type: "elem", elem: denomreset, shift: denomShift}, + {type: "elem", elem: mid, shift: midShift}, + {type: "elem", elem: numerreset, shift: -numShift} + ], "individualShift", null, options); + } + + // Since we manually change the style sometimes (with \dfrac or \tfrac), + // account for the possible size change here. + frac.height *= fstyle.sizeMultiplier / options.style.sizeMultiplier; + frac.depth *= fstyle.sizeMultiplier / options.style.sizeMultiplier; + + // Rule 15e + var delimSize; + if (fstyle.size === Style.DISPLAY.size) { + delimSize = fontMetrics.metrics.delim1; + } else { + delimSize = fontMetrics.metrics.getDelim2(fstyle); + } + + var leftDelim, rightDelim; + if (group.value.leftDelim == null) { + leftDelim = makeNullDelimiter(options); + } else { + leftDelim = delimiter.customSizedDelim( + group.value.leftDelim, delimSize, true, + options.withStyle(fstyle), group.mode); + } + if (group.value.rightDelim == null) { + rightDelim = makeNullDelimiter(options); + } else { + rightDelim = delimiter.customSizedDelim( + group.value.rightDelim, delimSize, true, + options.withStyle(fstyle), group.mode); + } + + return makeSpan( + ["mord", options.style.reset(), fstyle.cls()], + [leftDelim, makeSpan(["mfrac"], [frac]), rightDelim], + options.getColor()); +}; + +groupTypes.array = function(group, options, prev) { + var r, c; + var nr = group.value.body.length; + var nc = 0; + var body = new Array(nr); + + // Horizontal spacing + var pt = 1 / fontMetrics.metrics.ptPerEm; + var arraycolsep = 5 * pt; // \arraycolsep in article.cls + + // Vertical spacing + var baselineskip = 12 * pt; // see size10.clo + // Default \arraystretch from lttab.dtx + // TODO(gagern): may get redefined once we have user-defined macros + var arraystretch = utils.deflt(group.value.arraystretch, 1); + var arrayskip = arraystretch * baselineskip; + var arstrutHeight = 0.7 * arrayskip; // \strutbox in ltfsstrc.dtx and + var arstrutDepth = 0.3 * arrayskip; // \@arstrutbox in lttab.dtx + + var totalHeight = 0; + for (r = 0; r < group.value.body.length; ++r) { + var inrow = group.value.body[r]; + var height = arstrutHeight; // \@array adds an \@arstrut + var depth = arstrutDepth; // to each tow (via the template) + + if (nc < inrow.length) { + nc = inrow.length; + } + + var outrow = new Array(inrow.length); + for (c = 0; c < inrow.length; ++c) { + var elt = buildGroup(inrow[c], options); + if (depth < elt.depth) { + depth = elt.depth; + } + if (height < elt.height) { + height = elt.height; + } + outrow[c] = elt; + } + + var gap = 0; + if (group.value.rowGaps[r]) { + gap = group.value.rowGaps[r].value; + switch (gap.unit) { + case "em": + gap = gap.number; + break; + case "ex": + gap = gap.number * fontMetrics.metrics.emPerEx; + break; + default: + console.error("Can't handle unit " + gap.unit); + gap = 0; + } + if (gap > 0) { // \@argarraycr + gap += arstrutDepth; + if (depth < gap) { + depth = gap; // \@xargarraycr } + gap = 0; + } + } + + outrow.height = height; + outrow.depth = depth; + totalHeight += height; + outrow.pos = totalHeight; + totalHeight += depth + gap; // \@yargarraycr + body[r] = outrow; + } + + var offset = totalHeight / 2 + fontMetrics.metrics.axisHeight; + var colDescriptions = group.value.cols || []; + var cols = []; + var colSep; + var colDescrNum; + for (c = 0, colDescrNum = 0; + // Continue while either there are more columns or more column + // descriptions, so trailing separators don't get lost. + c < nc || colDescrNum < colDescriptions.length; + ++c, ++colDescrNum) { + + var colDescr = colDescriptions[colDescrNum] || {}; + + var firstSeparator = true; + while (colDescr.type === "separator") { + // If there is more than one separator in a row, add a space + // between them. + if (!firstSeparator) { + colSep = makeSpan(["arraycolsep"], []); + colSep.style.width = + fontMetrics.metrics.doubleRuleSep + "em"; + cols.push(colSep); } - supsub = buildCommon.makeVList([ - {type: "elem", elem: submid, shift: subShift}, - {type: "elem", elem: supmid, shift: -supShift} - ], "individualShift", null, options); + if (colDescr.separator === "|") { + var separator = makeSpan( + ["vertical-separator"], + []); + separator.style.height = totalHeight + "em"; + separator.style.verticalAlign = + -(totalHeight - offset) + "em"; - // See comment above about subscripts not being shifted - if (base instanceof domTree.symbolNode) { - supsub.children[0].style.marginLeft = -base.italic + "em"; - } - - supsub.children[0].style.marginRight = scriptspace; - supsub.children[1].style.marginRight = scriptspace; - } - - return makeSpan([getTypeOfGroup(group.value.base)], - [base, supsub]); - }; - - groupTypes.genfrac = function(group, options, prev) { - // Fractions are handled in the TeXbook on pages 444-445, rules 15(a-e). - // Figure out what style this fraction should be in based on the - // function used - var fstyle = options.style; - if (group.value.size === "display") { - fstyle = Style.DISPLAY; - } else if (group.value.size === "text") { - fstyle = Style.TEXT; - } - - var nstyle = fstyle.fracNum(); - var dstyle = fstyle.fracDen(); - - var numer = buildGroup(group.value.numer, options.withStyle(nstyle)); - var numerreset = makeSpan([fstyle.reset(), nstyle.cls()], [numer]); - - var denom = buildGroup(group.value.denom, options.withStyle(dstyle)); - var denomreset = makeSpan([fstyle.reset(), dstyle.cls()], [denom]); - - var ruleWidth; - if (group.value.hasBarLine) { - ruleWidth = fontMetrics.metrics.defaultRuleThickness / - options.style.sizeMultiplier; - } else { - ruleWidth = 0; - } - - // Rule 15b - var numShift; - var clearance; - var denomShift; - if (fstyle.size === Style.DISPLAY.size) { - numShift = fontMetrics.metrics.num1; - if (ruleWidth > 0) { - clearance = 3 * ruleWidth; + cols.push(separator); } else { - clearance = 7 * fontMetrics.metrics.defaultRuleThickness; + throw new ParseError( + "Invalid separator type: " + colDescr.separator); } - denomShift = fontMetrics.metrics.denom1; - } else { - if (ruleWidth > 0) { - numShift = fontMetrics.metrics.num2; - clearance = ruleWidth; - } else { - numShift = fontMetrics.metrics.num3; - clearance = 3 * fontMetrics.metrics.defaultRuleThickness; - } - denomShift = fontMetrics.metrics.denom2; + + colDescrNum++; + colDescr = colDescriptions[colDescrNum] || {}; + firstSeparator = false; } - var frac; - if (ruleWidth === 0) { - // Rule 15c - var candiateClearance = - (numShift - numer.depth) - (denom.height - denomShift); - if (candiateClearance < clearance) { - numShift += 0.5 * (clearance - candiateClearance); - denomShift += 0.5 * (clearance - candiateClearance); - } - - frac = buildCommon.makeVList([ - {type: "elem", elem: denomreset, shift: denomShift}, - {type: "elem", elem: numerreset, shift: -numShift} - ], "individualShift", null, options); - } else { - // Rule 15d - var axisHeight = fontMetrics.metrics.axisHeight; - - if ((numShift - numer.depth) - (axisHeight + 0.5 * ruleWidth) < - clearance) { - numShift += - clearance - ((numShift - numer.depth) - - (axisHeight + 0.5 * ruleWidth)); - } - - if ((axisHeight - 0.5 * ruleWidth) - (denom.height - denomShift) < - clearance) { - denomShift += - clearance - ((axisHeight - 0.5 * ruleWidth) - - (denom.height - denomShift)); - } - - var mid = makeSpan( - [options.style.reset(), Style.TEXT.cls(), "frac-line"]); - // Manually set the height of the line because its height is - // created in CSS - mid.height = ruleWidth; - - var midShift = -(axisHeight - 0.5 * ruleWidth); - - frac = buildCommon.makeVList([ - {type: "elem", elem: denomreset, shift: denomShift}, - {type: "elem", elem: mid, shift: midShift}, - {type: "elem", elem: numerreset, shift: -numShift} - ], "individualShift", null, options); + if (c >= nc) { + continue; } - // Since we manually change the style sometimes (with \dfrac or \tfrac), - // account for the possible size change here. - frac.height *= fstyle.sizeMultiplier / options.style.sizeMultiplier; - frac.depth *= fstyle.sizeMultiplier / options.style.sizeMultiplier; - - // Rule 15e - var delimSize; - if (fstyle.size === Style.DISPLAY.size) { - delimSize = fontMetrics.metrics.delim1; - } else { - delimSize = fontMetrics.metrics.getDelim2(fstyle); + var sepwidth; + if (c > 0 || group.value.hskipBeforeAndAfter) { + sepwidth = utils.deflt(colDescr.pregap, arraycolsep); + if (sepwidth !== 0) { + colSep = makeSpan(["arraycolsep"], []); + colSep.style.width = sepwidth + "em"; + cols.push(colSep); + } } - var leftDelim, rightDelim; - if (group.value.leftDelim == null) { - leftDelim = makeNullDelimiter(options); - } else { - leftDelim = delimiter.customSizedDelim( - group.value.leftDelim, delimSize, true, - options.withStyle(fstyle), group.mode); - } - if (group.value.rightDelim == null) { - rightDelim = makeNullDelimiter(options); - } else { - rightDelim = delimiter.customSizedDelim( - group.value.rightDelim, delimSize, true, - options.withStyle(fstyle), group.mode); - } - - return makeSpan( - ["mord", options.style.reset(), fstyle.cls()], - [leftDelim, makeSpan(["mfrac"], [frac]), rightDelim], - options.getColor()); - }; - - groupTypes.array = function(group, options, prev) { - var r, c; - var nr = group.value.body.length; - var nc = 0; - var body = new Array(nr); - - // Horizontal spacing - var pt = 1 / fontMetrics.metrics.ptPerEm; - var arraycolsep = 5 * pt; // \arraycolsep in article.cls - - // Vertical spacing - var baselineskip = 12 * pt; // see size10.clo - // Default \arraystretch from lttab.dtx - // TODO(gagern): may get redefined once we have user-defined macros - var arraystretch = utils.deflt(group.value.arraystretch, 1); - var arrayskip = arraystretch * baselineskip; - var arstrutHeight = 0.7 * arrayskip; // \strutbox in ltfsstrc.dtx and - var arstrutDepth = 0.3 * arrayskip; // \@arstrutbox in lttab.dtx - - var totalHeight = 0; - for (r = 0; r < group.value.body.length; ++r) { - var inrow = group.value.body[r]; - var height = arstrutHeight; // \@array adds an \@arstrut - var depth = arstrutDepth; // to each tow (via the template) - - if (nc < inrow.length) { - nc = inrow.length; - } - - var outrow = new Array(inrow.length); - for (c = 0; c < inrow.length; ++c) { - var elt = buildGroup(inrow[c], options); - if (depth < elt.depth) { - depth = elt.depth; - } - if (height < elt.height) { - height = elt.height; - } - outrow[c] = elt; - } - - var gap = 0; - if (group.value.rowGaps[r]) { - gap = group.value.rowGaps[r].value; - switch (gap.unit) { - case "em": - gap = gap.number; - break; - case "ex": - gap = gap.number * fontMetrics.metrics.emPerEx; - break; - default: - console.error("Can't handle unit " + gap.unit); - gap = 0; - } - if (gap > 0) { // \@argarraycr - gap += arstrutDepth; - if (depth < gap) { - depth = gap; // \@xargarraycr - } - gap = 0; - } - } - - outrow.height = height; - outrow.depth = depth; - totalHeight += height; - outrow.pos = totalHeight; - totalHeight += depth + gap; // \@yargarraycr - body[r] = outrow; - } - - var offset = totalHeight / 2 + fontMetrics.metrics.axisHeight; - var colDescriptions = group.value.cols || []; - var cols = []; - var colSep; - var colDescrNum; - for (c = 0, colDescrNum = 0; - // Continue while either there are more columns or more column - // descriptions, so trailing separators don't get lost. - c < nc || colDescrNum < colDescriptions.length; - ++c, ++colDescrNum) { - - var colDescr = colDescriptions[colDescrNum] || {}; - - var firstSeparator = true; - while (colDescr.type === "separator") { - // If there is more than one separator in a row, add a space - // between them. - if (!firstSeparator) { - colSep = makeSpan(["arraycolsep"], []); - colSep.style.width = - fontMetrics.metrics.doubleRuleSep + "em"; - cols.push(colSep); - } - - if (colDescr.separator === "|") { - var separator = makeSpan( - ["vertical-separator"], - []); - separator.style.height = totalHeight + "em"; - separator.style.verticalAlign = - -(totalHeight - offset) + "em"; - - cols.push(separator); - } else { - throw new ParseError( - "Invalid separator type: " + colDescr.separator); - } - - colDescrNum++; - colDescr = colDescriptions[colDescrNum] || {}; - firstSeparator = false; - } - - if (c >= nc) { + var col = []; + for (r = 0; r < nr; ++r) { + var row = body[r]; + var elem = row[c]; + if (!elem) { continue; } + var shift = row.pos - offset; + elem.depth = row.depth; + elem.height = row.height; + col.push({type: "elem", elem: elem, shift: shift}); + } - var sepwidth; - if (c > 0 || group.value.hskipBeforeAndAfter) { - sepwidth = utils.deflt(colDescr.pregap, arraycolsep); - if (sepwidth !== 0) { - colSep = makeSpan(["arraycolsep"], []); - colSep.style.width = sepwidth + "em"; - cols.push(colSep); - } - } + col = buildCommon.makeVList(col, "individualShift", null, options); + col = makeSpan( + ["col-align-" + (colDescr.align || "c")], + [col]); + cols.push(col); - var col = []; - for (r = 0; r < nr; ++r) { - var row = body[r]; - var elem = row[c]; - if (!elem) { - continue; - } - var shift = row.pos - offset; - elem.depth = row.depth; - elem.height = row.height; - col.push({type: "elem", elem: elem, shift: shift}); - } - - col = buildCommon.makeVList(col, "individualShift", null, options); - col = makeSpan( - ["col-align-" + (colDescr.align || "c")], - [col]); - cols.push(col); - - if (c < nc - 1 || group.value.hskipBeforeAndAfter) { - sepwidth = utils.deflt(colDescr.postgap, arraycolsep); - if (sepwidth !== 0) { - colSep = makeSpan(["arraycolsep"], []); - colSep.style.width = sepwidth + "em"; - cols.push(colSep); - } + if (c < nc - 1 || group.value.hskipBeforeAndAfter) { + sepwidth = utils.deflt(colDescr.postgap, arraycolsep); + if (sepwidth !== 0) { + colSep = makeSpan(["arraycolsep"], []); + colSep.style.width = sepwidth + "em"; + cols.push(colSep); } } - body = makeSpan(["mtable"], cols); - return makeSpan(["mord"], [body], options.getColor()); - }; + } + body = makeSpan(["mtable"], cols); + return makeSpan(["mord"], [body], options.getColor()); +}; - groupTypes.spacing = function(group, options, prev) { - if (group.value === "\\ " || group.value === "\\space" || - group.value === " " || group.value === "~") { - // Spaces are generated by adding an actual space. Each of these - // things has an entry in the symbols table, so these will be turned - // into appropriate outputs. - return makeSpan( - ["mord", "mspace"], - [buildCommon.mathsym(group.value, group.mode)] - ); - } else { - // Other kinds of spaces are of arbitrary width. We use CSS to - // generate these. - return makeSpan( - ["mord", "mspace", - buildCommon.spacingFunctions[group.value].className]); - } - }; - - groupTypes.llap = function(group, options, prev) { - var inner = makeSpan( - ["inner"], [buildGroup(group.value.body, options.reset())]); - var fix = makeSpan(["fix"], []); +groupTypes.spacing = function(group, options, prev) { + if (group.value === "\\ " || group.value === "\\space" || + group.value === " " || group.value === "~") { + // Spaces are generated by adding an actual space. Each of these + // things has an entry in the symbols table, so these will be turned + // into appropriate outputs. return makeSpan( - ["llap", options.style.cls()], [inner, fix]); - }; - - groupTypes.rlap = function(group, options, prev) { - var inner = makeSpan( - ["inner"], [buildGroup(group.value.body, options.reset())]); - var fix = makeSpan(["fix"], []); + ["mord", "mspace"], + [buildCommon.mathsym(group.value, group.mode)] + ); + } else { + // Other kinds of spaces are of arbitrary width. We use CSS to + // generate these. return makeSpan( - ["rlap", options.style.cls()], [inner, fix]); - }; + ["mord", "mspace", + buildCommon.spacingFunctions[group.value].className]); + } +}; - groupTypes.op = function(group, options, prev) { - // Operators are handled in the TeXbook pg. 443-444, rule 13(a). - var supGroup; - var subGroup; - var hasLimits = false; - if (group.type === "supsub" ) { - // If we have limits, supsub will pass us its group to handle. Pull - // out the superscript and subscript and set the group to the op in - // its base. - supGroup = group.value.sup; - subGroup = group.value.sub; - group = group.value.base; - hasLimits = true; - } +groupTypes.llap = function(group, options, prev) { + var inner = makeSpan( + ["inner"], [buildGroup(group.value.body, options.reset())]); + var fix = makeSpan(["fix"], []); + return makeSpan( + ["llap", options.style.cls()], [inner, fix]); +}; - // Most operators have a large successor symbol, but these don't. - var noSuccessor = [ - "\\smallint" - ]; +groupTypes.rlap = function(group, options, prev) { + var inner = makeSpan( + ["inner"], [buildGroup(group.value.body, options.reset())]); + var fix = makeSpan(["fix"], []); + return makeSpan( + ["rlap", options.style.cls()], [inner, fix]); +}; - var large = false; - if (options.style.size === Style.DISPLAY.size && - group.value.symbol && - !utils.contains(noSuccessor, group.value.body)) { +groupTypes.op = function(group, options, prev) { + // Operators are handled in the TeXbook pg. 443-444, rule 13(a). + var supGroup; + var subGroup; + var hasLimits = false; + if (group.type === "supsub" ) { + // If we have limits, supsub will pass us its group to handle. Pull + // out the superscript and subscript and set the group to the op in + // its base. + supGroup = group.value.sup; + subGroup = group.value.sub; + group = group.value.base; + hasLimits = true; + } - // Most symbol operators get larger in displaystyle (rule 13) - large = true; - } + // Most operators have a large successor symbol, but these don't. + var noSuccessor = [ + "\\smallint" + ]; - var base; - var baseShift = 0; - var slant = 0; - if (group.value.symbol) { - // If this is a symbol, create the symbol. - var style = large ? "Size2-Regular" : "Size1-Regular"; - base = buildCommon.makeSymbol( - group.value.body, style, "math", options.getColor(), - ["op-symbol", large ? "large-op" : "small-op", "mop"]); + var large = false; + if (options.style.size === Style.DISPLAY.size && + group.value.symbol && + !utils.contains(noSuccessor, group.value.body)) { - // Shift the symbol so its center lies on the axis (rule 13). It - // appears that our fonts have the centers of the symbols already - // almost on the axis, so these numbers are very small. Note we - // don't actually apply this here, but instead it is used either in - // the vlist creation or separately when there are no limits. - baseShift = (base.height - base.depth) / 2 - - fontMetrics.metrics.axisHeight * - options.style.sizeMultiplier; + // Most symbol operators get larger in displaystyle (rule 13) + large = true; + } - // The slant of the symbol is just its italic correction. - slant = base.italic; - } else { - // Otherwise, this is a text operator. Build the text from the - // operator's name. - // TODO(emily): Add a space in the middle of some of these - // operators, like \limsup - var output = []; - for (var i = 1; i < group.value.body.length; i++) { - output.push(buildCommon.mathsym(group.value.body[i], group.mode)); - } - base = makeSpan(["mop"], output, options.getColor()); - } + var base; + var baseShift = 0; + var slant = 0; + if (group.value.symbol) { + // If this is a symbol, create the symbol. + var style = large ? "Size2-Regular" : "Size1-Regular"; + base = buildCommon.makeSymbol( + group.value.body, style, "math", options.getColor(), + ["op-symbol", large ? "large-op" : "small-op", "mop"]); - if (hasLimits) { - // IE 8 clips \int if it is in a display: inline-block. We wrap it - // in a new span so it is an inline, and works. - base = makeSpan([], [base]); - - var supmid, supKern, submid, subKern; - // We manually have to handle the superscripts and subscripts. This, - // aside from the kern calculations, is copied from supsub. - if (supGroup) { - var sup = buildGroup( - supGroup, options.withStyle(options.style.sup())); - supmid = makeSpan( - [options.style.reset(), options.style.sup().cls()], [sup]); - - supKern = Math.max( - fontMetrics.metrics.bigOpSpacing1, - fontMetrics.metrics.bigOpSpacing3 - sup.depth); - } - - if (subGroup) { - var sub = buildGroup( - subGroup, options.withStyle(options.style.sub())); - submid = makeSpan( - [options.style.reset(), options.style.sub().cls()], - [sub]); - - subKern = Math.max( - fontMetrics.metrics.bigOpSpacing2, - fontMetrics.metrics.bigOpSpacing4 - sub.height); - } - - // Build the final group as a vlist of the possible subscript, base, - // and possible superscript. - var finalGroup, top, bottom; - if (!supGroup) { - top = base.height - baseShift; - - finalGroup = buildCommon.makeVList([ - {type: "kern", size: fontMetrics.metrics.bigOpSpacing5}, - {type: "elem", elem: submid}, - {type: "kern", size: subKern}, - {type: "elem", elem: base} - ], "top", top, options); - - // Here, we shift the limits by the slant of the symbol. Note - // that we are supposed to shift the limits by 1/2 of the slant, - // but since we are centering the limits adding a full slant of - // margin will shift by 1/2 that. - finalGroup.children[0].style.marginLeft = -slant + "em"; - } else if (!subGroup) { - bottom = base.depth + baseShift; - - finalGroup = buildCommon.makeVList([ - {type: "elem", elem: base}, - {type: "kern", size: supKern}, - {type: "elem", elem: supmid}, - {type: "kern", size: fontMetrics.metrics.bigOpSpacing5} - ], "bottom", bottom, options); - - // See comment above about slants - finalGroup.children[1].style.marginLeft = slant + "em"; - } else if (!supGroup && !subGroup) { - // This case probably shouldn't occur (this would mean the - // supsub was sending us a group with no superscript or - // subscript) but be safe. - return base; - } else { - bottom = fontMetrics.metrics.bigOpSpacing5 + - submid.height + submid.depth + - subKern + - base.depth + baseShift; - - finalGroup = buildCommon.makeVList([ - {type: "kern", size: fontMetrics.metrics.bigOpSpacing5}, - {type: "elem", elem: submid}, - {type: "kern", size: subKern}, - {type: "elem", elem: base}, - {type: "kern", size: supKern}, - {type: "elem", elem: supmid}, - {type: "kern", size: fontMetrics.metrics.bigOpSpacing5} - ], "bottom", bottom, options); - - // See comment above about slants - finalGroup.children[0].style.marginLeft = -slant + "em"; - finalGroup.children[2].style.marginLeft = slant + "em"; - } - - return makeSpan(["mop", "op-limits"], [finalGroup]); - } else { - if (group.value.symbol) { - base.style.top = baseShift + "em"; - } - - return base; - } - }; - - groupTypes.katex = function(group, options, prev) { - // The KaTeX logo. The offsets for the K and a were chosen to look - // good, but the offsets for the T, E, and X were taken from the - // definition of \TeX in TeX (see TeXbook pg. 356) - var k = makeSpan( - ["k"], [buildCommon.mathsym("K", group.mode)]); - var a = makeSpan( - ["a"], [buildCommon.mathsym("A", group.mode)]); - - a.height = (a.height + 0.2) * 0.75; - a.depth = (a.height - 0.2) * 0.75; - - var t = makeSpan( - ["t"], [buildCommon.mathsym("T", group.mode)]); - var e = makeSpan( - ["e"], [buildCommon.mathsym("E", group.mode)]); - - e.height = (e.height - 0.2155); - e.depth = (e.depth + 0.2155); - - var x = makeSpan( - ["x"], [buildCommon.mathsym("X", group.mode)]); - - return makeSpan( - ["katex-logo", "mord"], [k, a, t, e, x], options.getColor()); - }; - - groupTypes.overline = function(group, options, prev) { - // Overlines are handled in the TeXbook pg 443, Rule 9. - - // Build the inner group in the cramped style. - var innerGroup = buildGroup(group.value.body, - options.withStyle(options.style.cramp())); - - var ruleWidth = fontMetrics.metrics.defaultRuleThickness / + // Shift the symbol so its center lies on the axis (rule 13). It + // appears that our fonts have the centers of the symbols already + // almost on the axis, so these numbers are very small. Note we + // don't actually apply this here, but instead it is used either in + // the vlist creation or separately when there are no limits. + baseShift = (base.height - base.depth) / 2 - + fontMetrics.metrics.axisHeight * options.style.sizeMultiplier; - // Create the line above the body - var line = makeSpan( - [options.style.reset(), Style.TEXT.cls(), "overline-line"]); - line.height = ruleWidth; - line.maxFontSize = 1.0; + // The slant of the symbol is just its italic correction. + slant = base.italic; + } else { + // Otherwise, this is a text operator. Build the text from the + // operator's name. + // TODO(emily): Add a space in the middle of some of these + // operators, like \limsup + var output = []; + for (var i = 1; i < group.value.body.length; i++) { + output.push(buildCommon.mathsym(group.value.body[i], group.mode)); + } + base = makeSpan(["mop"], output, options.getColor()); + } - // Generate the vlist, with the appropriate kerns - var vlist = buildCommon.makeVList([ - {type: "elem", elem: innerGroup}, - {type: "kern", size: 3 * ruleWidth}, + if (hasLimits) { + // IE 8 clips \int if it is in a display: inline-block. We wrap it + // in a new span so it is an inline, and works. + base = makeSpan([], [base]); + + var supmid, supKern, submid, subKern; + // We manually have to handle the superscripts and subscripts. This, + // aside from the kern calculations, is copied from supsub. + if (supGroup) { + var sup = buildGroup( + supGroup, options.withStyle(options.style.sup())); + supmid = makeSpan( + [options.style.reset(), options.style.sup().cls()], [sup]); + + supKern = Math.max( + fontMetrics.metrics.bigOpSpacing1, + fontMetrics.metrics.bigOpSpacing3 - sup.depth); + } + + if (subGroup) { + var sub = buildGroup( + subGroup, options.withStyle(options.style.sub())); + submid = makeSpan( + [options.style.reset(), options.style.sub().cls()], + [sub]); + + subKern = Math.max( + fontMetrics.metrics.bigOpSpacing2, + fontMetrics.metrics.bigOpSpacing4 - sub.height); + } + + // Build the final group as a vlist of the possible subscript, base, + // and possible superscript. + var finalGroup, top, bottom; + if (!supGroup) { + top = base.height - baseShift; + + finalGroup = buildCommon.makeVList([ + {type: "kern", size: fontMetrics.metrics.bigOpSpacing5}, + {type: "elem", elem: submid}, + {type: "kern", size: subKern}, + {type: "elem", elem: base} + ], "top", top, options); + + // Here, we shift the limits by the slant of the symbol. Note + // that we are supposed to shift the limits by 1/2 of the slant, + // but since we are centering the limits adding a full slant of + // margin will shift by 1/2 that. + finalGroup.children[0].style.marginLeft = -slant + "em"; + } else if (!subGroup) { + bottom = base.depth + baseShift; + + finalGroup = buildCommon.makeVList([ + {type: "elem", elem: base}, + {type: "kern", size: supKern}, + {type: "elem", elem: supmid}, + {type: "kern", size: fontMetrics.metrics.bigOpSpacing5} + ], "bottom", bottom, options); + + // See comment above about slants + finalGroup.children[1].style.marginLeft = slant + "em"; + } else if (!supGroup && !subGroup) { + // This case probably shouldn't occur (this would mean the + // supsub was sending us a group with no superscript or + // subscript) but be safe. + return base; + } else { + bottom = fontMetrics.metrics.bigOpSpacing5 + + submid.height + submid.depth + + subKern + + base.depth + baseShift; + + finalGroup = buildCommon.makeVList([ + {type: "kern", size: fontMetrics.metrics.bigOpSpacing5}, + {type: "elem", elem: submid}, + {type: "kern", size: subKern}, + {type: "elem", elem: base}, + {type: "kern", size: supKern}, + {type: "elem", elem: supmid}, + {type: "kern", size: fontMetrics.metrics.bigOpSpacing5} + ], "bottom", bottom, options); + + // See comment above about slants + finalGroup.children[0].style.marginLeft = -slant + "em"; + finalGroup.children[2].style.marginLeft = slant + "em"; + } + + return makeSpan(["mop", "op-limits"], [finalGroup]); + } else { + if (group.value.symbol) { + base.style.top = baseShift + "em"; + } + + return base; + } +}; + +groupTypes.katex = function(group, options, prev) { + // The KaTeX logo. The offsets for the K and a were chosen to look + // good, but the offsets for the T, E, and X were taken from the + // definition of \TeX in TeX (see TeXbook pg. 356) + var k = makeSpan( + ["k"], [buildCommon.mathsym("K", group.mode)]); + var a = makeSpan( + ["a"], [buildCommon.mathsym("A", group.mode)]); + + a.height = (a.height + 0.2) * 0.75; + a.depth = (a.height - 0.2) * 0.75; + + var t = makeSpan( + ["t"], [buildCommon.mathsym("T", group.mode)]); + var e = makeSpan( + ["e"], [buildCommon.mathsym("E", group.mode)]); + + e.height = (e.height - 0.2155); + e.depth = (e.depth + 0.2155); + + var x = makeSpan( + ["x"], [buildCommon.mathsym("X", group.mode)]); + + return makeSpan( + ["katex-logo", "mord"], [k, a, t, e, x], options.getColor()); +}; + +groupTypes.overline = function(group, options, prev) { + // Overlines are handled in the TeXbook pg 443, Rule 9. + + // Build the inner group in the cramped style. + var innerGroup = buildGroup(group.value.body, + options.withStyle(options.style.cramp())); + + var ruleWidth = fontMetrics.metrics.defaultRuleThickness / + options.style.sizeMultiplier; + + // Create the line above the body + var line = makeSpan( + [options.style.reset(), Style.TEXT.cls(), "overline-line"]); + line.height = ruleWidth; + line.maxFontSize = 1.0; + + // Generate the vlist, with the appropriate kerns + var vlist = buildCommon.makeVList([ + {type: "elem", elem: innerGroup}, + {type: "kern", size: 3 * ruleWidth}, + {type: "elem", elem: line}, + {type: "kern", size: ruleWidth} + ], "firstBaseline", null, options); + + return makeSpan(["overline", "mord"], [vlist], options.getColor()); +}; + +groupTypes.sqrt = function(group, options, prev) { + // Square roots are handled in the TeXbook pg. 443, Rule 11. + + // First, we do the same steps as in overline to build the inner group + // and line + var inner = buildGroup(group.value.body, + options.withStyle(options.style.cramp())); + + var ruleWidth = fontMetrics.metrics.defaultRuleThickness / + options.style.sizeMultiplier; + + var line = makeSpan( + [options.style.reset(), Style.TEXT.cls(), "sqrt-line"], [], + options.getColor()); + line.height = ruleWidth; + line.maxFontSize = 1.0; + + var phi = ruleWidth; + if (options.style.id < Style.TEXT.id) { + phi = fontMetrics.metrics.xHeight; + } + + // Calculate the clearance between the body and line + var lineClearance = ruleWidth + phi / 4; + + var innerHeight = + (inner.height + inner.depth) * options.style.sizeMultiplier; + var minDelimiterHeight = innerHeight + lineClearance + ruleWidth; + + // Create a \surd delimiter of the required minimum size + var delim = makeSpan(["sqrt-sign"], [ + delimiter.customSizedDelim("\\surd", minDelimiterHeight, + false, options, group.mode)], + options.getColor()); + + var delimDepth = (delim.height + delim.depth) - ruleWidth; + + // Adjust the clearance based on the delimiter size + if (delimDepth > inner.height + inner.depth + lineClearance) { + lineClearance = + (lineClearance + delimDepth - inner.height - inner.depth) / 2; + } + + // Shift the delimiter so that its top lines up with the top of the line + var delimShift = -(inner.height + lineClearance + ruleWidth) + delim.height; + delim.style.top = delimShift + "em"; + delim.height -= delimShift; + delim.depth += delimShift; + + // We add a special case here, because even when `inner` is empty, we + // still get a line. So, we use a simple heuristic to decide if we + // should omit the body entirely. (note this doesn't work for something + // like `\sqrt{\rlap{x}}`, but if someone is doing that they deserve for + // it not to work. + var body; + if (inner.height === 0 && inner.depth === 0) { + body = makeSpan(); + } else { + body = buildCommon.makeVList([ + {type: "elem", elem: inner}, + {type: "kern", size: lineClearance}, {type: "elem", elem: line}, {type: "kern", size: ruleWidth} ], "firstBaseline", null, options); + } - return makeSpan(["overline", "mord"], [vlist], options.getColor()); + if (!group.value.index) { + return makeSpan(["sqrt", "mord"], [delim, body]); + } else { + // Handle the optional root index + + // The index is always in scriptscript style + var root = buildGroup( + group.value.index, + options.withStyle(Style.SCRIPTSCRIPT)); + var rootWrap = makeSpan( + [options.style.reset(), Style.SCRIPTSCRIPT.cls()], + [root]); + + // Figure out the height and depth of the inner part + var innerRootHeight = Math.max(delim.height, body.height); + var innerRootDepth = Math.max(delim.depth, body.depth); + + // The amount the index is shifted by. This is taken from the TeX + // source, in the definition of `\r@@t`. + var toShift = 0.6 * (innerRootHeight - innerRootDepth); + + // Build a VList with the superscript shifted up correctly + var rootVList = buildCommon.makeVList( + [{type: "elem", elem: rootWrap}], + "shift", -toShift, options); + // Add a class surrounding it so we can add on the appropriate + // kerning + var rootVListWrap = makeSpan(["root"], [rootVList]); + + return makeSpan(["sqrt", "mord"], [rootVListWrap, delim, body]); + } +}; + +groupTypes.sizing = function(group, options, prev) { + // Handle sizing operators like \Huge. Real TeX doesn't actually allow + // these functions inside of math expressions, so we do some special + // handling. + var inner = buildExpression(group.value.value, + options.withSize(group.value.size), prev); + + var span = makeSpan(["mord"], + [makeSpan(["sizing", "reset-" + options.size, group.value.size, + options.style.cls()], + inner)]); + + // Calculate the correct maxFontSize manually + var fontSize = buildCommon.sizingMultiplier[group.value.size]; + span.maxFontSize = fontSize * options.style.sizeMultiplier; + + return span; +}; + +groupTypes.styling = function(group, options, prev) { + // Style changes are handled in the TeXbook on pg. 442, Rule 3. + + // Figure out what style we're changing to. + var style = { + "display": Style.DISPLAY, + "text": Style.TEXT, + "script": Style.SCRIPT, + "scriptscript": Style.SCRIPTSCRIPT }; - groupTypes.sqrt = function(group, options, prev) { - // Square roots are handled in the TeXbook pg. 443, Rule 11. + var newStyle = style[group.value.style]; - // First, we do the same steps as in overline to build the inner group - // and line - var inner = buildGroup(group.value.body, - options.withStyle(options.style.cramp())); + // Build the inner expression in the new style. + var inner = buildExpression( + group.value.value, options.withStyle(newStyle), prev); - var ruleWidth = fontMetrics.metrics.defaultRuleThickness / - options.style.sizeMultiplier; + return makeSpan([options.style.reset(), newStyle.cls()], inner); +}; - var line = makeSpan( - [options.style.reset(), Style.TEXT.cls(), "sqrt-line"], [], - options.getColor()); - line.height = ruleWidth; - line.maxFontSize = 1.0; +groupTypes.font = function(group, options, prev) { + var font = group.value.font; + return buildGroup(group.value.body, options.withFont(font), prev); +}; - var phi = ruleWidth; - if (options.style.id < Style.TEXT.id) { - phi = fontMetrics.metrics.xHeight; +groupTypes.delimsizing = function(group, options, prev) { + var delim = group.value.value; + + if (delim === ".") { + // Empty delimiters still count as elements, even though they don't + // show anything. + return makeSpan([groupToType[group.value.delimType]]); + } + + // Use delimiter.sizedDelim to generate the delimiter. + return makeSpan( + [groupToType[group.value.delimType]], + [delimiter.sizedDelim( + delim, group.value.size, options, group.mode)]); +}; + +groupTypes.leftright = function(group, options, prev) { + // Build the inner expression + var inner = buildExpression(group.value.body, options.reset()); + + var innerHeight = 0; + var innerDepth = 0; + + // Calculate its height and depth + for (var i = 0; i < inner.length; i++) { + innerHeight = Math.max(inner[i].height, innerHeight); + innerDepth = Math.max(inner[i].depth, innerDepth); + } + + // The size of delimiters is the same, regardless of what style we are + // in. Thus, to correctly calculate the size of delimiter we need around + // a group, we scale down the inner size based on the size. + innerHeight *= options.style.sizeMultiplier; + innerDepth *= options.style.sizeMultiplier; + + var leftDelim; + if (group.value.left === ".") { + // Empty delimiters in \left and \right make null delimiter spaces. + leftDelim = makeNullDelimiter(options); + } else { + // Otherwise, use leftRightDelim to generate the correct sized + // delimiter. + leftDelim = delimiter.leftRightDelim( + group.value.left, innerHeight, innerDepth, options, + group.mode); + } + // Add it to the beginning of the expression + inner.unshift(leftDelim); + + var rightDelim; + // Same for the right delimiter + if (group.value.right === ".") { + rightDelim = makeNullDelimiter(options); + } else { + rightDelim = delimiter.leftRightDelim( + group.value.right, innerHeight, innerDepth, options, + group.mode); + } + // Add it to the end of the expression. + inner.push(rightDelim); + + return makeSpan( + ["minner", options.style.cls()], inner, options.getColor()); +}; + +groupTypes.rule = function(group, options, prev) { + // Make an empty span for the rule + var rule = makeSpan(["mord", "rule"], [], options.getColor()); + + // Calculate the shift, width, and height of the rule, and account for units + var shift = 0; + if (group.value.shift) { + shift = group.value.shift.number; + if (group.value.shift.unit === "ex") { + shift *= fontMetrics.metrics.xHeight; } + } - // Calculate the clearance between the body and line - var lineClearance = ruleWidth + phi / 4; + var width = group.value.width.number; + if (group.value.width.unit === "ex") { + width *= fontMetrics.metrics.xHeight; + } - var innerHeight = - (inner.height + inner.depth) * options.style.sizeMultiplier; - var minDelimiterHeight = innerHeight + lineClearance + ruleWidth; + var height = group.value.height.number; + if (group.value.height.unit === "ex") { + height *= fontMetrics.metrics.xHeight; + } - // Create a \surd delimiter of the required minimum size - var delim = makeSpan(["sqrt-sign"], [ - delimiter.customSizedDelim("\\surd", minDelimiterHeight, - false, options, group.mode)], - options.getColor()); + // The sizes of rules are absolute, so make it larger if we are in a + // smaller style. + shift /= options.style.sizeMultiplier; + width /= options.style.sizeMultiplier; + height /= options.style.sizeMultiplier; - var delimDepth = (delim.height + delim.depth) - ruleWidth; + // Style the rule to the right size + rule.style.borderRightWidth = width + "em"; + rule.style.borderTopWidth = height + "em"; + rule.style.bottom = shift + "em"; - // Adjust the clearance based on the delimiter size - if (delimDepth > inner.height + inner.depth + lineClearance) { - lineClearance = - (lineClearance + delimDepth - inner.height - inner.depth) / 2; - } + // Record the height and width + rule.width = width; + rule.height = height + shift; + rule.depth = -shift; - // Shift the delimiter so that its top lines up with the top of the line - var delimShift = -(inner.height + lineClearance + ruleWidth) + delim.height; - delim.style.top = delimShift + "em"; - delim.height -= delimShift; - delim.depth += delimShift; + return rule; +}; - // We add a special case here, because even when `inner` is empty, we - // still get a line. So, we use a simple heuristic to decide if we - // should omit the body entirely. (note this doesn't work for something - // like `\sqrt{\rlap{x}}`, but if someone is doing that they deserve for - // it not to work. - var body; - if (inner.height === 0 && inner.depth === 0) { - body = makeSpan(); - } else { - body = buildCommon.makeVList([ - {type: "elem", elem: inner}, - {type: "kern", size: lineClearance}, - {type: "elem", elem: line}, - {type: "kern", size: ruleWidth} - ], "firstBaseline", null, options); - } +groupTypes.accent = function(group, options, prev) { + // Accents are handled in the TeXbook pg. 443, rule 12. + var base = group.value.base; - if (!group.value.index) { - return makeSpan(["sqrt", "mord"], [delim, body]); - } else { - // Handle the optional root index + var supsubGroup; + if (group.type === "supsub") { + // If our base is a character box, and we have superscripts and + // subscripts, the supsub will defer to us. In particular, we want + // to attach the superscripts and subscripts to the inner body (so + // that the position of the superscripts and subscripts won't be + // affected by the height of the accent). We accomplish this by + // sticking the base of the accent into the base of the supsub, and + // rendering that, while keeping track of where the accent is. - // The index is always in scriptscript style - var root = buildGroup( - group.value.index, - options.withStyle(Style.SCRIPTSCRIPT)); - var rootWrap = makeSpan( - [options.style.reset(), Style.SCRIPTSCRIPT.cls()], - [root]); + // The supsub group is the group that was passed in + var supsub = group; + // The real accent group is the base of the supsub group + group = supsub.value.base; + // The character box is the base of the accent group + base = group.value.base; + // Stick the character box into the base of the supsub group + supsub.value.base = base; - // Figure out the height and depth of the inner part - var innerRootHeight = Math.max(delim.height, body.height); - var innerRootDepth = Math.max(delim.depth, body.depth); + // Rerender the supsub group with its new base, and store that + // result. + supsubGroup = buildGroup( + supsub, options.reset(), prev); + } - // The amount the index is shifted by. This is taken from the TeX - // source, in the definition of `\r@@t`. - var toShift = 0.6 * (innerRootHeight - innerRootDepth); + // Build the base group + var body = buildGroup( + base, options.withStyle(options.style.cramp())); - // Build a VList with the superscript shifted up correctly - var rootVList = buildCommon.makeVList( - [{type: "elem", elem: rootWrap}], - "shift", -toShift, options); - // Add a class surrounding it so we can add on the appropriate - // kerning - var rootVListWrap = makeSpan(["root"], [rootVList]); + // Calculate the skew of the accent. This is based on the line "If the + // nucleus is not a single character, let s = 0; otherwise set s to the + // kern amount for the nucleus followed by the \skewchar of its font." + // Note that our skew metrics are just the kern between each character + // and the skewchar. + var skew; + if (isCharacterBox(base)) { + // If the base is a character box, then we want the skew of the + // innermost character. To do that, we find the innermost character: + var baseChar = getBaseElem(base); + // Then, we render its group to get the symbol inside it + var baseGroup = buildGroup( + baseChar, options.withStyle(options.style.cramp())); + // Finally, we pull the skew off of the symbol. + skew = baseGroup.skew; + // Note that we now throw away baseGroup, because the layers we + // removed with getBaseElem might contain things like \color which + // we can't get rid of. + // TODO(emily): Find a better way to get the skew + } else { + skew = 0; + } - return makeSpan(["sqrt", "mord"], [rootVListWrap, delim, body]); - } - }; + // calculate the amount of space between the body and the accent + var clearance = Math.min(body.height, fontMetrics.metrics.xHeight); - groupTypes.sizing = function(group, options, prev) { - // Handle sizing operators like \Huge. Real TeX doesn't actually allow - // these functions inside of math expressions, so we do some special - // handling. - var inner = buildExpression(group.value.value, - options.withSize(group.value.size), prev); + // Build the accent + var accent = buildCommon.makeSymbol( + group.value.accent, "Main-Regular", "math", options.getColor()); + // Remove the italic correction of the accent, because it only serves to + // shift the accent over to a place we don't want. + accent.italic = 0; - var span = makeSpan(["mord"], - [makeSpan(["sizing", "reset-" + options.size, group.value.size, - options.style.cls()], - inner)]); + // The \vec character that the fonts use is a combining character, and + // thus shows up much too far to the left. To account for this, we add a + // specific class which shifts the accent over to where we want it. + // TODO(emily): Fix this in a better way, like by changing the font + var vecClass = group.value.accent === "\\vec" ? "accent-vec" : null; - // Calculate the correct maxFontSize manually - var fontSize = buildCommon.sizingMultiplier[group.value.size]; - span.maxFontSize = fontSize * options.style.sizeMultiplier; + var accentBody = makeSpan(["accent-body", vecClass], [ + makeSpan([], [accent])]); - return span; - }; + accentBody = buildCommon.makeVList([ + {type: "elem", elem: body}, + {type: "kern", size: -clearance}, + {type: "elem", elem: accentBody} + ], "firstBaseline", null, options); - groupTypes.styling = function(group, options, prev) { - // Style changes are handled in the TeXbook on pg. 442, Rule 3. + // Shift the accent over by the skew. Note we shift by twice the skew + // because we are centering the accent, so by adding 2*skew to the left, + // we shift it to the right by 1*skew. + accentBody.children[1].style.marginLeft = 2 * skew + "em"; - // Figure out what style we're changing to. - var style = { - "display": Style.DISPLAY, - "text": Style.TEXT, - "script": Style.SCRIPT, - "scriptscript": Style.SCRIPTSCRIPT - }; + var accentWrap = makeSpan(["mord", "accent"], [accentBody]); - var newStyle = style[group.value.style]; + if (supsubGroup) { + // Here, we replace the "base" child of the supsub with our newly + // generated accent. + supsubGroup.children[0] = accentWrap; - // Build the inner expression in the new style. - var inner = buildExpression( - group.value.value, options.withStyle(newStyle), prev); + // Since we don't rerun the height calculation after replacing the + // accent, we manually recalculate height. + supsubGroup.height = Math.max(accentWrap.height, supsubGroup.height); - return makeSpan([options.style.reset(), newStyle.cls()], inner); - }; + // Accents should always be ords, even when their innards are not. + supsubGroup.classes[0] = "mord"; - groupTypes.font = function(group, options, prev) { - var font = group.value.font; - return buildGroup(group.value.body, options.withFont(font), prev); - }; + return supsubGroup; + } else { + return accentWrap; + } +}; - groupTypes.delimsizing = function(group, options, prev) { - var delim = group.value.value; +groupTypes.phantom = function(group, options, prev) { + var elements = buildExpression( + group.value.value, + options.withPhantom(), + prev + ); - if (delim === ".") { - // Empty delimiters still count as elements, even though they don't - // show anything. - return makeSpan([groupToType[group.value.delimType]]); - } - - // Use delimiter.sizedDelim to generate the delimiter. - return makeSpan( - [groupToType[group.value.delimType]], - [delimiter.sizedDelim( - delim, group.value.size, options, group.mode)]); - }; - - groupTypes.leftright = function(group, options, prev) { - // Build the inner expression - var inner = buildExpression(group.value.body, options.reset()); - - var innerHeight = 0; - var innerDepth = 0; - - // Calculate its height and depth - for (var i = 0; i < inner.length; i++) { - innerHeight = Math.max(inner[i].height, innerHeight); - innerDepth = Math.max(inner[i].depth, innerDepth); - } - - // The size of delimiters is the same, regardless of what style we are - // in. Thus, to correctly calculate the size of delimiter we need around - // a group, we scale down the inner size based on the size. - innerHeight *= options.style.sizeMultiplier; - innerDepth *= options.style.sizeMultiplier; - - var leftDelim; - if (group.value.left === ".") { - // Empty delimiters in \left and \right make null delimiter spaces. - leftDelim = makeNullDelimiter(options); - } else { - // Otherwise, use leftRightDelim to generate the correct sized - // delimiter. - leftDelim = delimiter.leftRightDelim( - group.value.left, innerHeight, innerDepth, options, - group.mode); - } - // Add it to the beginning of the expression - inner.unshift(leftDelim); - - var rightDelim; - // Same for the right delimiter - if (group.value.right === ".") { - rightDelim = makeNullDelimiter(options); - } else { - rightDelim = delimiter.leftRightDelim( - group.value.right, innerHeight, innerDepth, options, - group.mode); - } - // Add it to the end of the expression. - inner.push(rightDelim); - - return makeSpan( - ["minner", options.style.cls()], inner, options.getColor()); - }; - - groupTypes.rule = function(group, options, prev) { - // Make an empty span for the rule - var rule = makeSpan(["mord", "rule"], [], options.getColor()); - - // Calculate the shift, width, and height of the rule, and account for units - var shift = 0; - if (group.value.shift) { - shift = group.value.shift.number; - if (group.value.shift.unit === "ex") { - shift *= fontMetrics.metrics.xHeight; - } - } - - var width = group.value.width.number; - if (group.value.width.unit === "ex") { - width *= fontMetrics.metrics.xHeight; - } - - var height = group.value.height.number; - if (group.value.height.unit === "ex") { - height *= fontMetrics.metrics.xHeight; - } - - // The sizes of rules are absolute, so make it larger if we are in a - // smaller style. - shift /= options.style.sizeMultiplier; - width /= options.style.sizeMultiplier; - height /= options.style.sizeMultiplier; - - // Style the rule to the right size - rule.style.borderRightWidth = width + "em"; - rule.style.borderTopWidth = height + "em"; - rule.style.bottom = shift + "em"; - - // Record the height and width - rule.width = width; - rule.height = height + shift; - rule.depth = -shift; - - return rule; - }; - - groupTypes.accent = function(group, options, prev) { - // Accents are handled in the TeXbook pg. 443, rule 12. - var base = group.value.base; - - var supsubGroup; - if (group.type === "supsub") { - // If our base is a character box, and we have superscripts and - // subscripts, the supsub will defer to us. In particular, we want - // to attach the superscripts and subscripts to the inner body (so - // that the position of the superscripts and subscripts won't be - // affected by the height of the accent). We accomplish this by - // sticking the base of the accent into the base of the supsub, and - // rendering that, while keeping track of where the accent is. - - // The supsub group is the group that was passed in - var supsub = group; - // The real accent group is the base of the supsub group - group = supsub.value.base; - // The character box is the base of the accent group - base = group.value.base; - // Stick the character box into the base of the supsub group - supsub.value.base = base; - - // Rerender the supsub group with its new base, and store that - // result. - supsubGroup = buildGroup( - supsub, options.reset(), prev); - } - - // Build the base group - var body = buildGroup( - base, options.withStyle(options.style.cramp())); - - // Calculate the skew of the accent. This is based on the line "If the - // nucleus is not a single character, let s = 0; otherwise set s to the - // kern amount for the nucleus followed by the \skewchar of its font." - // Note that our skew metrics are just the kern between each character - // and the skewchar. - var skew; - if (isCharacterBox(base)) { - // If the base is a character box, then we want the skew of the - // innermost character. To do that, we find the innermost character: - var baseChar = getBaseElem(base); - // Then, we render its group to get the symbol inside it - var baseGroup = buildGroup( - baseChar, options.withStyle(options.style.cramp())); - // Finally, we pull the skew off of the symbol. - skew = baseGroup.skew; - // Note that we now throw away baseGroup, because the layers we - // removed with getBaseElem might contain things like \color which - // we can't get rid of. - // TODO(emily): Find a better way to get the skew - } else { - skew = 0; - } - - // calculate the amount of space between the body and the accent - var clearance = Math.min(body.height, fontMetrics.metrics.xHeight); - - // Build the accent - var accent = buildCommon.makeSymbol( - group.value.accent, "Main-Regular", "math", options.getColor()); - // Remove the italic correction of the accent, because it only serves to - // shift the accent over to a place we don't want. - accent.italic = 0; - - // The \vec character that the fonts use is a combining character, and - // thus shows up much too far to the left. To account for this, we add a - // specific class which shifts the accent over to where we want it. - // TODO(emily): Fix this in a better way, like by changing the font - var vecClass = group.value.accent === "\\vec" ? "accent-vec" : null; - - var accentBody = makeSpan(["accent-body", vecClass], [ - makeSpan([], [accent])]); - - accentBody = buildCommon.makeVList([ - {type: "elem", elem: body}, - {type: "kern", size: -clearance}, - {type: "elem", elem: accentBody} - ], "firstBaseline", null, options); - - // Shift the accent over by the skew. Note we shift by twice the skew - // because we are centering the accent, so by adding 2*skew to the left, - // we shift it to the right by 1*skew. - accentBody.children[1].style.marginLeft = 2 * skew + "em"; - - var accentWrap = makeSpan(["mord", "accent"], [accentBody]); - - if (supsubGroup) { - // Here, we replace the "base" child of the supsub with our newly - // generated accent. - supsubGroup.children[0] = accentWrap; - - // Since we don't rerun the height calculation after replacing the - // accent, we manually recalculate height. - supsubGroup.height = Math.max(accentWrap.height, supsubGroup.height); - - // Accents should always be ords, even when their innards are not. - supsubGroup.classes[0] = "mord"; - - return supsubGroup; - } else { - return accentWrap; - } - }; - - groupTypes.phantom = function(group, options, prev) { - var elements = buildExpression( - group.value.value, - options.withPhantom(), - prev - ); - - // \phantom isn't supposed to affect the elements it contains. - // See "color" for more details. - return new buildCommon.makeFragment(elements); - }; + // \phantom isn't supposed to affect the elements it contains. + // See "color" for more details. + return new buildCommon.makeFragment(elements); +}; /** * buildGroup is the function that takes a group and calls the correct groupType diff --git a/src/buildMathML.js b/src/buildMathML.js index 15346206..2408ba34 100644 --- a/src/buildMathML.js +++ b/src/buildMathML.js @@ -63,396 +63,396 @@ var getVariant = function(group, options) { */ var groupTypes = {}; - groupTypes.mathord = function(group, options) { - var node = new mathMLTree.MathNode( - "mi", - [makeText(group.value, group.mode)]); +groupTypes.mathord = function(group, options) { + var node = new mathMLTree.MathNode( + "mi", + [makeText(group.value, group.mode)]); - var variant = getVariant(group, options); - if (variant) { + var variant = getVariant(group, options); + if (variant) { + node.setAttribute("mathvariant", variant); + } + return node; +}; + +groupTypes.textord = function(group, options) { + var text = makeText(group.value, group.mode); + + var variant = getVariant(group, options) || "normal"; + + var node; + if (/[0-9]/.test(group.value)) { + // TODO(kevinb) merge adjacent nodes + // do it as a post processing step + node = new mathMLTree.MathNode("mn", [text]); + if (options.font) { node.setAttribute("mathvariant", variant); } - return node; - }; + } else { + node = new mathMLTree.MathNode("mi", [text]); + node.setAttribute("mathvariant", variant); + } - groupTypes.textord = function(group, options) { - var text = makeText(group.value, group.mode); + return node; +}; - var variant = getVariant(group, options) || "normal"; +groupTypes.bin = function(group) { + var node = new mathMLTree.MathNode( + "mo", [makeText(group.value, group.mode)]); - var node; - if (/[0-9]/.test(group.value)) { - // TODO(kevinb) merge adjacent nodes - // do it as a post processing step - node = new mathMLTree.MathNode("mn", [text]); - if (options.font) { - node.setAttribute("mathvariant", variant); - } - } else { - node = new mathMLTree.MathNode("mi", [text]); - node.setAttribute("mathvariant", variant); + return node; +}; + +groupTypes.rel = function(group) { + var node = new mathMLTree.MathNode( + "mo", [makeText(group.value, group.mode)]); + + return node; +}; + +groupTypes.open = function(group) { + var node = new mathMLTree.MathNode( + "mo", [makeText(group.value, group.mode)]); + + return node; +}; + +groupTypes.close = function(group) { + var node = new mathMLTree.MathNode( + "mo", [makeText(group.value, group.mode)]); + + return node; +}; + +groupTypes.inner = function(group) { + var node = new mathMLTree.MathNode( + "mo", [makeText(group.value, group.mode)]); + + return node; +}; + +groupTypes.punct = function(group) { + var node = new mathMLTree.MathNode( + "mo", [makeText(group.value, group.mode)]); + + node.setAttribute("separator", "true"); + + return node; +}; + +groupTypes.ordgroup = function(group, options) { + var inner = buildExpression(group.value, options); + + var node = new mathMLTree.MathNode("mrow", inner); + + return node; +}; + +groupTypes.text = function(group, options) { + var inner = buildExpression(group.value.body, options); + + var node = new mathMLTree.MathNode("mtext", inner); + + return node; +}; + +groupTypes.color = function(group, options) { + var inner = buildExpression(group.value.value, options); + + var node = new mathMLTree.MathNode("mstyle", inner); + + node.setAttribute("mathcolor", group.value.color); + + return node; +}; + +groupTypes.supsub = function(group, options) { + var children = [buildGroup(group.value.base, options)]; + + if (group.value.sub) { + children.push(buildGroup(group.value.sub, options)); + } + + if (group.value.sup) { + children.push(buildGroup(group.value.sup, options)); + } + + var nodeType; + if (!group.value.sub) { + nodeType = "msup"; + } else if (!group.value.sup) { + nodeType = "msub"; + } else { + nodeType = "msubsup"; + } + + var node = new mathMLTree.MathNode(nodeType, children); + + return node; +}; + +groupTypes.genfrac = function(group, options) { + var node = new mathMLTree.MathNode( + "mfrac", + [buildGroup(group.value.numer, options), + buildGroup(group.value.denom, options)]); + + if (!group.value.hasBarLine) { + node.setAttribute("linethickness", "0px"); + } + + if (group.value.leftDelim != null || group.value.rightDelim != null) { + var withDelims = []; + + if (group.value.leftDelim != null) { + var leftOp = new mathMLTree.MathNode( + "mo", [new mathMLTree.TextNode(group.value.leftDelim)]); + + leftOp.setAttribute("fence", "true"); + + withDelims.push(leftOp); } - return node; - }; + withDelims.push(node); - groupTypes.bin = function(group) { - var node = new mathMLTree.MathNode( - "mo", [makeText(group.value, group.mode)]); + if (group.value.rightDelim != null) { + var rightOp = new mathMLTree.MathNode( + "mo", [new mathMLTree.TextNode(group.value.rightDelim)]); - return node; - }; + rightOp.setAttribute("fence", "true"); - groupTypes.rel = function(group) { - var node = new mathMLTree.MathNode( - "mo", [makeText(group.value, group.mode)]); - - return node; - }; - - groupTypes.open = function(group) { - var node = new mathMLTree.MathNode( - "mo", [makeText(group.value, group.mode)]); - - return node; - }; - - groupTypes.close = function(group) { - var node = new mathMLTree.MathNode( - "mo", [makeText(group.value, group.mode)]); - - return node; - }; - - groupTypes.inner = function(group) { - var node = new mathMLTree.MathNode( - "mo", [makeText(group.value, group.mode)]); - - return node; - }; - - groupTypes.punct = function(group) { - var node = new mathMLTree.MathNode( - "mo", [makeText(group.value, group.mode)]); - - node.setAttribute("separator", "true"); - - return node; - }; - - groupTypes.ordgroup = function(group, options) { - var inner = buildExpression(group.value, options); - - var node = new mathMLTree.MathNode("mrow", inner); - - return node; - }; - - groupTypes.text = function(group, options) { - var inner = buildExpression(group.value.body, options); - - var node = new mathMLTree.MathNode("mtext", inner); - - return node; - }; - - groupTypes.color = function(group, options) { - var inner = buildExpression(group.value.value, options); - - var node = new mathMLTree.MathNode("mstyle", inner); - - node.setAttribute("mathcolor", group.value.color); - - return node; - }; - - groupTypes.supsub = function(group, options) { - var children = [buildGroup(group.value.base, options)]; - - if (group.value.sub) { - children.push(buildGroup(group.value.sub, options)); + withDelims.push(rightOp); } - if (group.value.sup) { - children.push(buildGroup(group.value.sup, options)); - } - - var nodeType; - if (!group.value.sub) { - nodeType = "msup"; - } else if (!group.value.sup) { - nodeType = "msub"; - } else { - nodeType = "msubsup"; - } - - var node = new mathMLTree.MathNode(nodeType, children); - - return node; - }; - - groupTypes.genfrac = function(group, options) { - var node = new mathMLTree.MathNode( - "mfrac", - [buildGroup(group.value.numer, options), - buildGroup(group.value.denom, options)]); - - if (!group.value.hasBarLine) { - node.setAttribute("linethickness", "0px"); - } - - if (group.value.leftDelim != null || group.value.rightDelim != null) { - var withDelims = []; - - if (group.value.leftDelim != null) { - var leftOp = new mathMLTree.MathNode( - "mo", [new mathMLTree.TextNode(group.value.leftDelim)]); - - leftOp.setAttribute("fence", "true"); - - withDelims.push(leftOp); - } - - withDelims.push(node); - - if (group.value.rightDelim != null) { - var rightOp = new mathMLTree.MathNode( - "mo", [new mathMLTree.TextNode(group.value.rightDelim)]); - - rightOp.setAttribute("fence", "true"); - - withDelims.push(rightOp); - } - - var outerNode = new mathMLTree.MathNode("mrow", withDelims); - - return outerNode; - } - - return node; - }; - - groupTypes.array = function(group, options) { - return new mathMLTree.MathNode( - "mtable", group.value.body.map(function(row) { - return new mathMLTree.MathNode( - "mtr", row.map(function(cell) { - return new mathMLTree.MathNode( - "mtd", [buildGroup(cell, options)]); - })); - })); - }; - - groupTypes.sqrt = function(group, options) { - var node; - if (group.value.index) { - node = new mathMLTree.MathNode( - "mroot", [ - buildGroup(group.value.body, options), - buildGroup(group.value.index, options) - ]); - } else { - node = new mathMLTree.MathNode( - "msqrt", [buildGroup(group.value.body, options)]); - } - - return node; - }; - - groupTypes.leftright = function(group, options) { - var inner = buildExpression(group.value.body, options); - - if (group.value.left !== ".") { - var leftNode = new mathMLTree.MathNode( - "mo", [makeText(group.value.left, group.mode)]); - - leftNode.setAttribute("fence", "true"); - - inner.unshift(leftNode); - } - - if (group.value.right !== ".") { - var rightNode = new mathMLTree.MathNode( - "mo", [makeText(group.value.right, group.mode)]); - - rightNode.setAttribute("fence", "true"); - - inner.push(rightNode); - } - - var outerNode = new mathMLTree.MathNode("mrow", inner); + var outerNode = new mathMLTree.MathNode("mrow", withDelims); return outerNode; - }; + } - groupTypes.accent = function(group, options) { - var accentNode = new mathMLTree.MathNode( - "mo", [makeText(group.value.accent, group.mode)]); + return node; +}; - var node = new mathMLTree.MathNode( - "mover", - [buildGroup(group.value.base, options), - accentNode]); +groupTypes.array = function(group, options) { + return new mathMLTree.MathNode( + "mtable", group.value.body.map(function(row) { + return new mathMLTree.MathNode( + "mtr", row.map(function(cell) { + return new mathMLTree.MathNode( + "mtd", [buildGroup(cell, options)]); + })); + })); +}; - node.setAttribute("accent", "true"); +groupTypes.sqrt = function(group, options) { + var node; + if (group.value.index) { + node = new mathMLTree.MathNode( + "mroot", [ + buildGroup(group.value.body, options), + buildGroup(group.value.index, options) + ]); + } else { + node = new mathMLTree.MathNode( + "msqrt", [buildGroup(group.value.body, options)]); + } - return node; - }; + return node; +}; - groupTypes.spacing = function(group) { - var node; +groupTypes.leftright = function(group, options) { + var inner = buildExpression(group.value.body, options); - if (group.value === "\\ " || group.value === "\\space" || - group.value === " " || group.value === "~") { - node = new mathMLTree.MathNode( - "mtext", [new mathMLTree.TextNode("\u00a0")]); - } else { - node = new mathMLTree.MathNode("mspace"); + if (group.value.left !== ".") { + var leftNode = new mathMLTree.MathNode( + "mo", [makeText(group.value.left, group.mode)]); - node.setAttribute( - "width", buildCommon.spacingFunctions[group.value].size); - } + leftNode.setAttribute("fence", "true"); - return node; - }; + inner.unshift(leftNode); + } - groupTypes.op = function(group) { - var node; + if (group.value.right !== ".") { + var rightNode = new mathMLTree.MathNode( + "mo", [makeText(group.value.right, group.mode)]); - // TODO(emily): handle big operators using the `largeop` attribute + rightNode.setAttribute("fence", "true"); - if (group.value.symbol) { - // This is a symbol. Just add the symbol. - node = new mathMLTree.MathNode( - "mo", [makeText(group.value.body, group.mode)]); - } else { - // This is a text operator. Add all of the characters from the - // operator's name. - // TODO(emily): Add a space in the middle of some of these - // operators, like \limsup. - node = new mathMLTree.MathNode( - "mi", [new mathMLTree.TextNode(group.value.body.slice(1))]); - } + inner.push(rightNode); + } - return node; - }; + var outerNode = new mathMLTree.MathNode("mrow", inner); - groupTypes.katex = function(group) { - var node = new mathMLTree.MathNode( - "mtext", [new mathMLTree.TextNode("KaTeX")]); + return outerNode; +}; - return node; - }; +groupTypes.accent = function(group, options) { + var accentNode = new mathMLTree.MathNode( + "mo", [makeText(group.value.accent, group.mode)]); - groupTypes.font = function(group, options) { - var font = group.value.font; - return buildGroup(group.value.body, options.withFont(font)); - }; + var node = new mathMLTree.MathNode( + "mover", + [buildGroup(group.value.base, options), + accentNode]); - groupTypes.delimsizing = function(group) { - var children = []; + node.setAttribute("accent", "true"); - if (group.value.value !== ".") { - children.push(makeText(group.value.value, group.mode)); - } + return node; +}; - var node = new mathMLTree.MathNode("mo", children); +groupTypes.spacing = function(group) { + var node; - if (group.value.delimType === "open" || - group.value.delimType === "close") { - // Only some of the delimsizing functions act as fences, and they - // return "open" or "close" delimTypes. - node.setAttribute("fence", "true"); - } else { - // Explicitly disable fencing if it's not a fence, to override the - // defaults. - node.setAttribute("fence", "false"); - } + if (group.value === "\\ " || group.value === "\\space" || + group.value === " " || group.value === "~") { + node = new mathMLTree.MathNode( + "mtext", [new mathMLTree.TextNode("\u00a0")]); + } else { + node = new mathMLTree.MathNode("mspace"); - return node; - }; - - groupTypes.styling = function(group, options) { - var inner = buildExpression(group.value.value, options); - - var node = new mathMLTree.MathNode("mstyle", inner); - - var styleAttributes = { - "display": ["0", "true"], - "text": ["0", "false"], - "script": ["1", "false"], - "scriptscript": ["2", "false"] - }; - - var attr = styleAttributes[group.value.style]; - - node.setAttribute("scriptlevel", attr[0]); - node.setAttribute("displaystyle", attr[1]); - - return node; - }; - - groupTypes.sizing = function(group, options) { - var inner = buildExpression(group.value.value, options); - - var node = new mathMLTree.MathNode("mstyle", inner); - - // TODO(emily): This doesn't produce the correct size for nested size - // changes, because we don't keep state of what style we're currently - // in, so we can't reset the size to normal before changing it. Now - // that we're passing an options parameter we should be able to fix - // this. node.setAttribute( - "mathsize", buildCommon.sizingMultiplier[group.value.size] + "em"); + "width", buildCommon.spacingFunctions[group.value].size); + } - return node; + return node; +}; + +groupTypes.op = function(group) { + var node; + + // TODO(emily): handle big operators using the `largeop` attribute + + if (group.value.symbol) { + // This is a symbol. Just add the symbol. + node = new mathMLTree.MathNode( + "mo", [makeText(group.value.body, group.mode)]); + } else { + // This is a text operator. Add all of the characters from the + // operator's name. + // TODO(emily): Add a space in the middle of some of these + // operators, like \limsup. + node = new mathMLTree.MathNode( + "mi", [new mathMLTree.TextNode(group.value.body.slice(1))]); + } + + return node; +}; + +groupTypes.katex = function(group) { + var node = new mathMLTree.MathNode( + "mtext", [new mathMLTree.TextNode("KaTeX")]); + + return node; +}; + +groupTypes.font = function(group, options) { + var font = group.value.font; + return buildGroup(group.value.body, options.withFont(font)); +}; + +groupTypes.delimsizing = function(group) { + var children = []; + + if (group.value.value !== ".") { + children.push(makeText(group.value.value, group.mode)); + } + + var node = new mathMLTree.MathNode("mo", children); + + if (group.value.delimType === "open" || + group.value.delimType === "close") { + // Only some of the delimsizing functions act as fences, and they + // return "open" or "close" delimTypes. + node.setAttribute("fence", "true"); + } else { + // Explicitly disable fencing if it's not a fence, to override the + // defaults. + node.setAttribute("fence", "false"); + } + + return node; +}; + +groupTypes.styling = function(group, options) { + var inner = buildExpression(group.value.value, options); + + var node = new mathMLTree.MathNode("mstyle", inner); + + var styleAttributes = { + "display": ["0", "true"], + "text": ["0", "false"], + "script": ["1", "false"], + "scriptscript": ["2", "false"] }; - groupTypes.overline = function(group, options) { - var operator = new mathMLTree.MathNode( - "mo", [new mathMLTree.TextNode("\u203e")]); - operator.setAttribute("stretchy", "true"); + var attr = styleAttributes[group.value.style]; - var node = new mathMLTree.MathNode( - "mover", - [buildGroup(group.value.body, options), - operator]); - node.setAttribute("accent", "true"); + node.setAttribute("scriptlevel", attr[0]); + node.setAttribute("displaystyle", attr[1]); - return node; - }; + return node; +}; - groupTypes.rule = function(group) { - // TODO(emily): Figure out if there's an actual way to draw black boxes - // in MathML. - var node = new mathMLTree.MathNode("mrow"); +groupTypes.sizing = function(group, options) { + var inner = buildExpression(group.value.value, options); - return node; - }; + var node = new mathMLTree.MathNode("mstyle", inner); - groupTypes.llap = function(group, options) { - var node = new mathMLTree.MathNode( - "mpadded", [buildGroup(group.value.body, options)]); + // TODO(emily): This doesn't produce the correct size for nested size + // changes, because we don't keep state of what style we're currently + // in, so we can't reset the size to normal before changing it. Now + // that we're passing an options parameter we should be able to fix + // this. + node.setAttribute( + "mathsize", buildCommon.sizingMultiplier[group.value.size] + "em"); - node.setAttribute("lspace", "-1width"); - node.setAttribute("width", "0px"); + return node; +}; - return node; - }; +groupTypes.overline = function(group, options) { + var operator = new mathMLTree.MathNode( + "mo", [new mathMLTree.TextNode("\u203e")]); + operator.setAttribute("stretchy", "true"); - groupTypes.rlap = function(group, options) { - var node = new mathMLTree.MathNode( - "mpadded", [buildGroup(group.value.body, options)]); + var node = new mathMLTree.MathNode( + "mover", + [buildGroup(group.value.body, options), + operator]); + node.setAttribute("accent", "true"); - node.setAttribute("width", "0px"); + return node; +}; - return node; - }; +groupTypes.rule = function(group) { + // TODO(emily): Figure out if there's an actual way to draw black boxes + // in MathML. + var node = new mathMLTree.MathNode("mrow"); - groupTypes.phantom = function(group, options, prev) { - var inner = buildExpression(group.value.value, options); - return new mathMLTree.MathNode("mphantom", inner); - }; + return node; +}; + +groupTypes.llap = function(group, options) { + var node = new mathMLTree.MathNode( + "mpadded", [buildGroup(group.value.body, options)]); + + node.setAttribute("lspace", "-1width"); + node.setAttribute("width", "0px"); + + return node; +}; + +groupTypes.rlap = function(group, options) { + var node = new mathMLTree.MathNode( + "mpadded", [buildGroup(group.value.body, options)]); + + node.setAttribute("width", "0px"); + + return node; +}; + +groupTypes.phantom = function(group, options, prev) { + var inner = buildExpression(group.value.value, options); + return new mathMLTree.MathNode("mphantom", inner); +}; /** * Takes a list of nodes, builds them, and returns a list of the generated