diff --git a/core/modules/parsers/wikiparser/rules/table.js b/core/modules/parsers/wikiparser/rules/table.js index be37f4091..5feb470cf 100644 --- a/core/modules/parsers/wikiparser/rules/table.js +++ b/core/modules/parsers/wikiparser/rules/table.js @@ -38,7 +38,8 @@ var processRow = function(prevColumns) { if(last) { last.rowSpanCount++; $tw.utils.addAttributeToParseTreeNode(last.element,"rowspan",last.rowSpanCount); - $tw.utils.addAttributeToParseTreeNode(last.element,"valign","center"); + var vAlign = $tw.utils.getAttributeValueFromParseTreeNode(last.element,"valign","center"); + $tw.utils.addAttributeToParseTreeNode(last.element,"valign",vAlign); if(colSpanCount > 1) { $tw.utils.addAttributeToParseTreeNode(last.element,"colspan",colSpanCount); colSpanCount = 1; @@ -75,6 +76,16 @@ var processRow = function(prevColumns) { // Look for a space at the start of the cell var spaceLeft = false, chr = this.parser.source.substr(this.parser.pos,1); + var vAlign; + if (chr === "^") { + vAlign = "top"; + } else if(chr === ",") { + vAlign = "bottom"; + } + if(vAlign) { + this.parser.pos++; + chr = this.parser.source.substr(this.parser.pos,1); + } while(chr === " ") { spaceLeft = true; this.parser.pos++; @@ -100,6 +111,9 @@ var processRow = function(prevColumns) { // Parse the cell cell.children = this.parser.parseInlineRun(cellTermRegExp,{eatTerminator: true}); // Set the alignment for the cell + if(vAlign) { + $tw.utils.addAttributeToParseTreeNode(cell,"valign",vAlign); + } if(this.parser.source.substr(this.parser.pos-2,1) === " ") { // spaceRight $tw.utils.addAttributeToParseTreeNode(cell,"align",spaceLeft ? "center" : "left"); } else if(spaceLeft) { diff --git a/editions/tw5.com/tiddlers/wikitext/Tables in WikiText.tid b/editions/tw5.com/tiddlers/wikitext/Tables in WikiText.tid index ed4ea7692..4be222b11 100644 --- a/editions/tw5.com/tiddlers/wikitext/Tables in WikiText.tid +++ b/editions/tw5.com/tiddlers/wikitext/Tables in WikiText.tid @@ -36,6 +36,32 @@ The example renders as: | Centred content | |+++ a very wide column so we can see the alignment +++| +! Cell vertical Alignment + +Vertical alignment of cells is done by inserting either a `^` for top alignment or a `,` for bottom alignment as the first character of a cell. The normal horizontal alignment is still possible. + +A shortned example: + +``` +|^top left |^ top center |^ top right| +|middle left | middle center | middle right| +|,bottom left |, bottom center |, bottom right| +``` + +The example renders as: + +| :: | ::::::::::::::::::::::::::: | ::::::::::::::::::::::::::: | ::::::::::::::::::::::::::: | :: | +| ::
:: |^top left |^ top center |^ top right| ::
:: | +| ::
:: |middle left | middle center | middle right| ::
:: | +| ::
:: |,bottom left |, bottom center |, bottom right| ::
:: | +| :: | ::::::::::::::::::::::::::: | ::::::::::::::::::::::::::: | ::::::::::::::::::::::::::: | :: | + +Should you ever want to have a `^`or a `,` as the first character of a left aligned cell, you need to use html-escaping. + +| `^` | &#94; | +| `,` | &#44; | + + ! Cell Merging To merge a table cell with the one above, use the special cell text `~`. To merge a cell with the one to its left use the text `<`. To merge one to its right use `>`. For example: