<commit_before>## Cinder
Cinder is a markup and DOM manipulation DSL for the excellent [Fay]
(//fay-lang.org) subset of Haskell.

It would probably be better to look at <//crooney.github.io/cinder>, at least to start.

### DSL
Cinder has combinators defined for all elements and attributes of its modeled
markups (currently HTML and SVG), as well as inline combinators for them. For 
example, the body of a simple web page could be specified like this:

```haskell
myBody = markup ! body ! bgcolor "lightblue"
                    !> h1 !: "Cheers"
                    !< p !: "Visit Margarita!" ! Complete
                !< Complete
```

A single `!` (or `!>`)signals that the following element or attribute is a child pf the
current element. `!:` signifies content follows. `!` followed by the constructor
`Complete` closes the current element and causes following markup to belong to the 
immediate parent. `!<` is equivalent to `! Complete !`, that is it closes the 
current element and takes starts right in on new markup. As a special case 
`!< Complete` closes all pending elements.

Further, complete sections of markup may be added by `!+` (or `!+<` or `!+>`).
Convenience functions are available to add complete tags with commonly used attributes
in this manner.  For instance `markup ! img ! src "f.png" ! alt "f"` is exactly
equivalent to `imgSA "f.png" "f"`.

Attribute constructors which may reasonably expect numeric arguments may be postfixed
by N as a convenience: `heightN 100` as opposed to `height (show 100)`.

### DOM
DOM manipulation happens mostly through `insert` which takes markup and a DOM
node and does the obvious. Various functionality is built on top of it, for zipping
lists of markup into lists of nodes, staggering the valyes of attributes common to
many nodes, etc.

The following, from one of the examples, deletes all animations, inserts a
special effect animation into each circle tag and staggers the animations to start
3/4s of a second apart. (`aADR` stands for "animate an Attribute for a Duration
for a certain number of Repetitions", while bounce and settle are FX).

```haskell
grower = do
            root >>= byTag "animate" >>= mapM_ deleteSelf
            root >>= byTag "circle" >>= zipInsert an
            root >>= byTag "animate" >>= stagger "begin" 9 0.75
            return ()
    where
        an = zipWith (!+) (repeat (aADR "r" 0.75 1 ! fill "freeze"))
                            [bounce 0.5 5 25 50, settle 0.45 5 25 50,
                             bounce 0.85 6 25 50, settle 0.75 6 25 50]
```

###SVG
Cinder started out as an SVG library, before it was realized that it could be generally useful.
All the examples but one are in SVG and almost no convenience funcs beyond combinators
that accept numbers have been yet written for HTML.<commit_msg>tweak copy and remove hard line breaks which pandic will accept but github won't.<commit_after>## Cinder
Cinder is a markup and DOM manipulation DSL for the excellent [Fay](http://fay-lang.org) subset of Haskell.

It may be simpler to look at the [examples](http://crooney.github.io/cinder) to get a feel for the lib.

### DSL
Cinder has combinators defined for all elements and attributes of its modeled markups (currently HTML and SVG), as well as inline combinators for them. For example, the body of a simple web page could be specified like this:

```haskell
myBody = markup ! body ! bgcolor "lightblue"
                    !> h1 !: "Cheers"
                    !< p !: "Visit Margarita!"
                        !+> imgSA "i.png" "La Isla" ! Complete
                !< Complete
```

A single `!` (or `!>`) signals that the following element or attribute is a child of the current element. `!:` signifies that content follows. `!` followed by the constructor `Complete` closes the current element and causes following markup to belong to the immediate parent. `!<` is equivalent to `! Complete !`, that is, it closes the current element and takes starts right in on a sibling. As a special case `!< Complete` closes all pending elements. So, in the example,the `h1` is closed by the `!<` before `p`, the `img` closed explicitly and the `p` and `body` are closed by the `!< Complete`. The `! Complete` after the `img` tag is superfluous, but harmless.

Further, complete sections of markup may be added by `!+` (or `!+<` or `!+>`). Convenience functions are available to add complete tags with commonly used attributes in this manner.  For instance `imgSA "i.png" "La Isla"` is exactly equivalent to `markup ! img ! src "i.png" ! alt "La Isla"`.

Attribute constructors which may reasonably expect numeric arguments may be postfixed by N as a convenience: `heightN 100` as opposed to `height (show 100)`.

### DOM
DOM manipulation happens mostly through `insert` which takes markup and a DOM node and does the obvious. Various functionality is built on top of it, for zipping lists of markup into lists of nodes, etc. In addition, various DOM manipulations not directly related to the DSL are supported.

The following, from one of the examples, deletes all animations, inserts a special effect animation into each circle tag and staggers the animations to start 3/4s of a second apart.

```haskell
grower = do root >>= byTag "animate" >>= mapM_ deleteSelf
            root >>= byTag "circle" >>= zipInsert an
            root >>= byTag "animate" >>= stagger "begin" 9 0.75
            return ()
    where an = zipWith (!+) (repeat (aADR "r" 0.75 1 ! fill "freeze"))
                            [bounce 0.5 5 25 50, settle 0.45 5 25 50,
                             bounce 0.85 6 25 50, settle 0.75 6 25 50]
```
The convenience `aADR "r" 0.75 1` is equal to `markup ! animate ! attributeName "r" ! durN 0.75 ! repeatCountN 1`.

###SVG
Cinder started out as an SVG library, before it was realized that it could be generally useful.  All the examples but one are in SVG and almost no convenience funcs beyond constructors that accept numbers have been yet written for HTML.
{'fraction_non_alphanumeric': 0.08501753799899783, 'fraction_numerical': 0.017537998997828628, 'mean_word_length': 3.2679971489665003, 'pattern_counts': {'":': 0, '<': 16, '<?xml version=': 0, '>': 35, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3760766', 'n_tokens_mistral': 1773, 'n_tokens_neox': 1590, 'n_words': 864}