omniJS bug: Copy As > JavaScript on tables with gaps

Automation OmniGraffle Automation
#1

Giving Edit > Copy As > JavaScript a bit of a workout here …

It’s not at all an easy thing to get completely right first time, and I’m focusing on it simply because it seems likely to be a learner’s first port of call, and is a very useful instrument for getting to understand how omniJS works within OG.

One remaining glitch is that in the current release build, if a learner copies a table which includes a gap (one or more cells deleted):

then the generated JS code will move the gap, and scramble some of the remaining cell positions, if it is run to reproduce or ‘paste’ the copied table:

The top row looks ok, but the others have been both gap-shuffled and unexpectedly reversed.


( A separate bug (see other posts) causes omniJS to render the default horizontal text alignment incorrectly when the code doesn't explicitly specify the alignment - omniJS was implicitly asking for centered text here, and thinks that it has given it, but has somehow been let down (on macOS, not iOS) in the details of the rendering - the inspector actually shows 'centered' for these cells, but the display doesn't match the reported state of the model)

iOS version Cells still scrambled, but text properly centered, though we had to change the font name to get the code to run on iOS – the iOS system lacked the ‘Monaco’ font specified in the Copy As > JavaScript code:

#2

One interim workaround here is to create a table in which the null cells are replaced by transparent cells.

( The omniJS method Table.graphicAt(row, column) returns null where it finds a gap, but the Table constructor doesn’t yet translate corresponding null values in its argument array into empty cells )

A function like:

[details=(expand for code)]```JavaScript
// Maps any null cells in a table Dict to transparent cell Dicts
// Table properties -> {objects: styles:} -> {objects: styles:}
// fullTable :: Dict -> Dict -> Dict
const fullTable = (dctParent, dct) => {
const alphaZero = {
r: 0,
g: 0,
b: 0,
a: 0
};
return ({
objects: map(
x => x !== null ? (
x
) : ({
type: “Shape”,
fillColor: alphaZero,
strokeColor: alphaZero
}),
dct.objects
),
styles: dct.styles
});
};


Lets us create a table like this using omniJS:

<img src="/uploads/default/original/2X/d/de267926cdf0c388c61c1cccc5aa6b96ec92899c.png" width="177" height="176">

by replacing any nulls in the array passed to the Table constructor with transparent cells. 

The Table constructor already does an excellent job of magically conferring an appropriate size and position on them, so we don't need to calculate or specify any geometry.