foxy.sample.js

/* simple */
document.body.appendChild(
    Fox.makeTable([
        "+---+---+---+",
        "|A  |B  |C  |",
        "|   +---+---+",
        "|   |D  |E  |",
        "|   +---+   |",
        "|   |F  |   |",
        "+---+---+---+",
    ])
);

/* bells and whistles */
document.body.appendChild(
    Fox.makeTable([
        "+-----------+---+",
        "|a          |b  |",
        "|---+-------+---+",
        "|c  |d          |",
        "|   |           |",
        "|   |           |",
        "|   +---+-------+",
        "|   |e  |f      |",
        "+---+---+-------+",
    ], {
        debug:true,
        map: {
            a: "Toolbar",
            b: "Menu",
            c: "Sidebar",
            d: "Canvas",
            e: "Button",
            f: "Button"
        },
        styles: {
            table: {'border-collapse':'collapse'},
            a: {width: '80%', background: '#ccc'},
            b: {width: '20%'},
            c: {width: '20%', background: '#777'},
            d: {height: '150px', width: '80%'},
            e: {width: '20%'},
            f: {width: '60%'}
        }
    })
);