TableFlip
October 22, 2016 at 12:21 AM by Dr. Drang
A few weeks ago, a new Mac app called TableFlip was released. It’s a spreadsheet-like editor that works with Markdown tables, and it got favorable reviews from folks like Brett Terpstra, Katie Floyd, Eddie Smith, and John Voorhees. Longtime readers of this blog will know that my interest in making it easy to edit and cleanly display Markdown tables goes way back, so I was eager to give TableFlip a try. I was a little busy earlier in the month, but I’ve had a chance to give TableFlip a workout over the past week. Bottom line: in its present state, it’s not ready for me, but I can see where other people would find it quite useful.
Let’s start at the beginning. Strictly speaking, there is no such thing as a “Markdown table,” because John Gruber never implemented a table syntax. What I, and most people, call the “Markdown table” syntax is a common extension to the basic Gruber syntax. It was popularized by Fletcher Penney in his MultiMarkdown processor, although I believe it was Michel Fortin’s PHP Markdown Extra that was the first to include it.
The syntax uses a set of pipe (|) characters to separate the columns and a row of dashes with optional colons to separate the header from body of the table and to set the alignment of the columns. Here’s an example:
| Column 1 | Column 2 | Column 3 |
|--|:--:|--:|
| first | second | third |
| column | column | column |
| left | center | right |
The leading and trailing pipe characters are optional, but I prefer to include them. When processed, the code above turns into a nice HTML table, like this:
| Column 1 | Column 2 | Column 3 |
|---|---|---|
| first | second | third |
| column | column | column |
| left | center | right |
As you can see, the Markdown code for a table can be messy. It’s easy to lose track of which column you’re working on because the contents of the table cells have different lengths and the pipe characters don’t line up with each other.
Veteran Markdown table users like me have written scripts that allow us to create our tables in a spreadsheet, where the columns line up automatically, copy them them into a text editor, and convert the tab-separated text that comes from the spreadsheet into Markdown format. What TableFlip does is turn that two- to three-step process into a single step without any need to invoke a script.
Here’s TableFlip:
As you can see, it looks just like a spreadsheet. You can set the column alignment by clicking one of the buttons on the right side of the toolbar. Other buttons let you insert and delete rows and columns, just like a regular spreadsheet application. Documents created in TableFlip are plain text files with the tables in nicely formatted Markdown. The table shown in the screenshot above is saved in this format:
| Element | Grade B | Grade C |
| :--------- | ------: | ------: |
| Carbon | 0.260 | 0.230 |
| Manganese | -- | 1.350 |
| Phosphorus | 0.035 | 0.035 |
| Sulphur | 0.200 | 0.200 |
As you can see, TableFlip adds spaces to the columns to get the pipe characters to line up and make the text form of the table easy to read.
What’s even better, though, is that TableFlip isn’t limited to files that contain only Markdown tables. Any Markdown file can be opened in TableFlip, and it will find and display for editing the tables within that file. Changes made to the source document in a text editor are reflected in TableFlip; changes made to the tables in TableFlip are reflected in the text editor.
What if you’ve been writing a Markdown file and want to insert a table without typing any of those nasty pipe characters? Can TableFlip help you do that? Yes. If you open an existing Markdown file that has no tables in TableFlip, you’ll see this screen, which gives you an empty stub table to copy and paste into your document.
After you’ve done this a few times, I suspect you’ll learn to just type a pair of pipes wherever you want to put a table.
So after all this praise of TableFlip, why don’t I want to use it? Several reasons, some of which are related to its user interface, some to its functionality, and some to my peculiar tastes in formatting.
On the user interface side, the font size is just a bit too small, and TableFlip has no way to increase it. This is a known problem, and Christian Tietze, TableFlip’s developer, plans to fix it, but until it’s fixed, my 56-year-old eyes find it difficult to use.
Another user interface annoyance is the inability to select more than one cell at a time. TableFlip columns are left-aligned by default, and it’s very common for me to want to change the alignment of several of them after I’ve typed in the data. The natural thing to do would be to drag across the columns I want to change (or to shift-click or command-click to extend a selection) and then click the desired alignment button in the toolbar. But because only one cell can be selected, I’m forced to change the change the alignment one column at a time. This is very unnatural, as no real spreadsheet—and I’ve been using spreadsheets for 30 years—works this way.
On the functionality side, TableFlip doesn’t support two Markdown table features that I use often: multiple header rows, and headers that span multiple columns. Here’s an example with both: as source code,
| | Tensile strength ||
| Grade | ksi | MPa |
|:-----:|:-----------:|:---:|
| B | 58 | 400 |
| C | 62 | 427 |
and as a rendered table.1
| Tensile strength | ||
|---|---|---|
| Grade | ksi | MPa |
| B | 58 | 400 |
| C | 62 | 427 |
I don’t think PHP Markdown Extra supports either of these extensions (in fact, I cheated and wrote HTML directly to get the rendered table above), but MultiMarkdown has both and I use them a lot in the reports I write for work. The TableFlip roadmap shows that these are planned, but because they aren’t available now, I’m forced to do a lot of hand-editing to get what I want.
TableFlip can get confused when reading complicated Markdown documents. In the source file for this page, for example, the single pipe character in the third paragraph caused TableFlip to think that paragraph was a table.
The “tables” that are actually rendered as source code are a further source of confusion.
This is probably not a problem that would arise with most people, but it does if you write examples and explanations of Markdown.
On matters of taste, look again at how TableFlip saves that table of chemistry limits for A500 steels:
| Element | Grade B | Grade C |
| :--------- | ------: | ------: |
| Carbon | 0.260 | 0.230 |
| Manganese | -- | 1.350 |
| Phosphorus | 0.035 | 0.035 |
| Sulphur | 0.200 | 0.200 |
Although the second and third columns are to be right-aligned, TableFlip displays them as left-aligned. I know this only source code and it doesn’t affect the rendered output, but if you’re going to format the source code, format it according to the indicated alignment. Even my script can do that.
| Element | Grade B | Grade C |
|:-----------|--------:|--------:|
| Carbon | 0.260 | 0.230 |
| Manganese | -- | 1.350 |
| Phosphorus | 0.035 | 0.035 |
| Sulphur | 0.200 | 0.200 |
Tietze has big plans for TableFlip, and I hope he follows through with them. I’d like to have a professionally written app that can handle the kinds of tables I need to make. But right now, I’m sticking with Numbers, my formatting scripts, and the workflows I’ve used for years.
-
And I see now that my CSS stylesheet never anticipated multiple header lines. That thick horizontal line between them looks stupid. ↩
