# Live apps that can have text editor widgets
# LuaML: An experimental markup language and 'browser' for it
Demo of a simple structured editor for formatted text atop an infinite 2D
surface that can be panned and zoomed.
Don't rely on any commit hashes so far.
For ease of implementation, LuaML documents are always legal Lua objects
rather than a first-class language like HTML. A simple example:
```
{ type='text', data={'hello, world!',} }
```
Text object data consists of an array of strings, one for each line. No
newlines at the moment. (Everything is subject to change.)
You can draw various shapes on the surface:
```
{type='line', data={0,0, 0,600}},
{type='line', data={0,0, 800,0}},
{type='text', data={'0'}, x=-20,y=-20},
{type='rectangle', x=50,y=50, w=20,h=80, r=1,g=0,b=0},
{type='text', data={'abc', 'def'}, x=150, y=50, w=50,h=50, fg={r=0,g=0.4, b=0.9}},
{type='circle', x=300,y=200, radius=40, r=1,g=0,b=1},
{type='arc', x=0,y=0, radius=50, angle1=0, angle2=math.pi*2/3},
{type='ellipse', x=100,y=100, radiusx=10, radiusy=50},
{type='bezier', data={25,25, 25,125, 75,25, 125,25}},
```
But most of the design effort so far has focused on the 3 text types:
* `text` for runs of text to be line-wrapped over the given `width`.
* `rows` and `cols`, the only hierarchical types, ways to compose `text` nodes
into various grid layouts.
Some more examples.
Adjust foreground/background color (akin to a `div` with inline `style`):
```
{ type='text', fg={r=1,g=0,b=0}, bg={r=1,g=1,b=0},
data={'hello, world!'}
}
```
Two-column text:
```
{ type='cols', data={
{type='text', data={'first column'}},
{type='text', data={'second column'}},
}}
```
A table with two rows and two columns:
```
{ type='cols', data={
{ type='rows', data={
{type='text', data='abc'},
{type='text', data='def'},
}},
{ type='rows', data={
{type='text', data='ghi'},
{type='text', data='jkl'},
}},
}}
```
(With the current design, cols of rows seem strictly superior to rows of cols.
Column boundaries line up consistently across rows.)
This is still quite incomplete. Come help figure out its future. Currently
supported "attributes":
* `fg`, `bg` for color (no `blink` tag yet)
* `margin` (used as `margin-left` or `margin-top` depending on whether the
parent node has `cols` or `rows` respectively)
* `width` in pixels (I'd like to add '%' units here.)