Handle vertical stretchy cells when equalrows is in effect, and reorganize stretching of columns

Author: dpvc

mathjax3-ts/output/chtml/Wrappers/mtable.ts

@@ -134,17 +134,39 @@ export class CHTMLmtable<N, T, D> extends CHTMLWrapper<N, T, D> {
         this.rLines = this.getColumnAttributes('rowlines').map(x => (x === 'none' ? 0 : .07));
         this.cWidths = this.getColumnWidths();
         //
-        // Stretch the columns (rows are already taken care of in the CHTMLmtr wrapper)
+        // Stretch the rows and columns
         //
+        this.stretchRows();
+        this.stretchColumns();
+    }
+
+    /*
+     * Stretch the rows to the equal height or natural height
+     */
+    protected stretchRows() {
+        const equal = this.node.attributes.get('equalrows') as boolean;
+        const HD = (equal ? this.getEqualRowHeight() : 0);
+        const {H, D} = (equal ? this.getTableData() : {H: [0], D: [0]});
+        for (let i = 0; i < this.numRows; i++) {
+            const hd = (equal ? [(HD + H[i] - D[i]) / 2, (HD - H[i] + D[i]) / 2] : null);
+            (this.childNodes[i] as CHTMLmtr<N, T, D>).stretchChildren(hd);
+        }
+    }
+
+    /*
+     * Stretch the columns to their proper widths
+     */
+    protected stretchColumns() {
         for (let i = 0; i < this.numCols; i++) {
-            this.stretchColumn(i);
+            const width = (typeof this.cWidths[i] === 'number' ? this.cWidths[i] as number : null);
+            this.stretchColumn(i, width);
         }
     }
 
     /*
      * Handle horizontal stretching within the ith column
      */
-    protected stretchColumn(i: number) {
+    protected stretchColumn(i: number, W: number) {
         let stretchy: CHTMLWrapper<N, T, D>[] = [];
         //
         //  Locate and count the stretchy children
@@ -162,21 +184,23 @@ export class CHTMLmtable<N, T, D> extends CHTMLWrapper<N, T, D> {
         let count = stretchy.length;
         let nodeCount = this.childNodes.length;
         if (count && nodeCount > 1) {
-            let W = 0;
-            //
-            //  If all the children are stretchy, find the largest one,
-            //  otherwise, find the width of the non-stretchy children.
-            //
-            let all = (count > 1 && count === nodeCount);
-            for (const row of (this.childNodes as CHTMLmtr<N, T, D>[])) {
-                const cell = row.childNodes[i + row.firstCell];
-                if (cell) {
-                    const child = cell.childNodes[0];
-                    const noStretch = (child.stretch.dir === DIRECTION.None);
-                    if (all || noStretch) {
-                        const {w} = child.getBBox(noStretch);
-                        if (w > W) {
-                            W = w;
+            if (W === null) {
+                W = 0;
+                //
+                //  If all the children are stretchy, find the largest one,
+                //  otherwise, find the width of the non-stretchy children.
+                //
+                let all = (count > 1 && count === nodeCount);
+                for (const row of (this.childNodes as CHTMLmtr<N, T, D>[])) {
+                    const cell = row.childNodes[i + row.firstCell];
+                    if (cell) {
+                        const child = cell.childNodes[0];
+                        const noStretch = (child.stretch.dir === DIRECTION.None);
+                        if (all || noStretch) {
+                            const {w} = child.getBBox(noStretch);
+                            if (w > W) {
+                                W = w;
+                            }
                         }
                     }
                 }

mathjax3-ts/output/chtml/Wrappers/mtr.ts

@@ -83,15 +83,6 @@ export class CHTMLmtr<N, T, D> extends CHTMLWrapper<N, T, D> {
         return this.childNodes.map(cell => cell.getBBox());
     }
 
-    /*
-     * @override
-     * @constructor
-     */
-    constructor(factory: CHTMLWrapperFactory<N, T, D>, node: MmlNode, parent: CHTMLWrapper<N, T, D> = null) {
-        super(factory, node, parent);
-        this.stretchChildren();
-    }
-
     /*
      * @override
      */
@@ -104,8 +95,12 @@ export class CHTMLmtr<N, T, D> extends CHTMLWrapper<N, T, D> {
     /*
      * Handle vertical stretching of cells to match height of
      *  other cells in the row.
+     *
+     * @param{number[]} HD   The total height and depth for the row [H, D]
+     *
+     * If this isn't specified, the maximum height and depth is computed.
      */
-    protected stretchChildren() {
+    public stretchChildren(HD: number[] = null) {
         let stretchy: CHTMLWrapper<N, T, D>[] = [];
         let children = (this.firstCell ? this.childNodes.slice(this.firstCell) : this.childNodes);
         //
@@ -120,31 +115,34 @@ export class CHTMLmtr<N, T, D> extends CHTMLWrapper<N, T, D> {
         let count = stretchy.length;
         let nodeCount = this.childNodes.length;
         if (count && nodeCount > 1) {
-            let H = 0, D = 0;
-            //
-            //  If all the children are stretchy, find the largest one,
-            //  otherwise, find the height and depth of the non-stretchy
-            //  children.
-            //
-            let all = (count > 1 && count === nodeCount);
-            for (const mtd of children) {
-                const child = mtd.childNodes[0];
-                const noStretch = (child.stretch.dir === DIRECTION.None);
-                if (all || noStretch) {
-                    const {h, d} = child.getBBox(noStretch);
-                    if (h > H) {
-                        H = h;
-                    }
-                    if (d > D) {
-                        D = d;
+            if (HD === null) {
+                let H = 0, D = 0;
+                //
+                //  If all the children are stretchy, find the largest one,
+                //  otherwise, find the height and depth of the non-stretchy
+                //  children.
+                //
+                let all = (count > 1 && count === nodeCount);
+                for (const mtd of children) {
+                    const child = mtd.childNodes[0];
+                    const noStretch = (child.stretch.dir === DIRECTION.None);
+                    if (all || noStretch) {
+                        const {h, d} = child.getBBox(noStretch);
+                        if (h > H) {
+                            H = h;
+                        }
+                        if (d > D) {
+                            D = d;
+                        }
                     }
                 }
+                HD = [H, D];
             }
             //
             //  Stretch the stretchable children
             //
             for (const child of stretchy) {
-                child.coreMO().getStretchedVariant([H, D]);
+                child.coreMO().getStretchedVariant(HD);
             }
         }
     }