LOOM Studio

write a program, weave a cloth

New here? Press ▶ Run & weave to watch a cloth being made, then edit the code to change it. What am I looking at?
ready
step 0 / 0

Conformance

The 15 reference programs from conformance/ are run right here, in this page, by the same engine as cli.js, and compared character for character with their expected output.

    How LOOM works

    You do not need to know anything about weaving. Here is the whole idea in a minute.

    1. A loom holds threads

    Long warp threads hang side by side, each with a colour. Every warp thread is also tied to one of up to eight shafts (numbered 1–8): frames that can lift many threads at once. Which thread goes to which shaft is called the threading.

    The loom is W columns wide and will weave H rows.

    2. A pick weaves one row

    To weave a row you lift some shafts, then send a weft thread across. Lifted warp threads stay on top and show their own colour; the rest sink below the weft, so the weft colour shows there.

    Row by row, the pattern of lifts draws the cloth. The finished cloth is a grid of colours: that grid is what a program prints.

    Reading the Loom view

    1Threading draft (top, numbered by shaft): one row per shaft, shaft 1 at the bottom. A dot shows which shaft each warp thread is tied to. The shafts lifted by the current pick glow gold.
    2Warp colours (warp): the colour of each thread, left to right.
    3The shed (shed): threads lifted for this pick rise, the others sink, and the shuttle slides the weft through the gap — over the sunk threads, under the raised ones.
    4Float counters (float, only when maxfloat is on): how many picks in a row each thread has stayed up or down. Amber means at the limit, red means over it.
    5The cloth (numbered rows): woven rows so far, growing downwards; faint lines are threads not yet woven. Click a row to jump to the moment it was woven.
    6Lift plan (lifts, right): for every row, which shafts were lifted, next to a swatch of the weft colour.

    The language

    One statement per line. // starts a comment. Colours are single lowercase letters. The first statement must be loom.

    StatementWhat it does
    loom 12 812 columns (warp threads), 8 rows (picks). Each 1–200. Must be first.
    palette a=#1b3a5c b=#f2e8cfNames colours. Only the letters appear in the output; the hex values are for looking at.
    warp a bColours of the warp threads, repeated across the width.
    thread 1-4Shaft of each warp thread, repeated across the width. Ranges: 1-4 is 1 2 3 4, 4-2 is 4 3 2.
    treadle 1 12Saves a lift under a number (1–10) so picks can say t1.
    shuttle r o yLoads weft colours that picks use in turn when they name no colour.
    pick b 13   pick t2Weave a row: weft colour (optional) and lift. With no colour the next shuttle colour is used.
    cross 1 6Swap two warp threads (colour and shaft) from now on.
    drift 2   drift -1Slide every warp thread that many places right (or left), wrapping round.
    maxfloat 3From now on, a thread may not stay up or down for more than 3 rows in a row (nor more than 3 neighbours in one row).
    repeat 4 { … }Run the lines in between several times. May nest.

    Sequences

    Used by warp, thread and shuttle.

    a b ca b c
    a*3a a a
    (a b)*2a b a b
    mirror(a b c)a b c b a
    1-4  (shafts)1 2 3 4

    Lifts

    Used by pick and treadle.

    13shafts 1 and 3
    -none (all sunk)
    *all eight shafts
    !12everything except 1 and 2
    t2whatever treadle 2 holds (picks only)

    Try it

    When something is wrong

    A program either weaves a cloth or stops at its first mistake with one line, error line 7: unknown color 'q'. Studio shows that line, marks it in the editor, and says what usually causes it.

    MessageUsually means

    Keyboard

    Ctrl+Enter weave  ·  Space play / pause  ·  ← → step back / forward  ·  Home End first / last step  ·  Tab indent (in the editor; Esc then Tab leaves it)

    The command line: node cli.js cloth.loom prints the same grid this page renders.