Skip to content

marianoguerra/emel

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

18 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

emel - generate HTML with CSS-like selectors

emel is an erlang module that allows to generate complex HTML (or XML) using a syntax that is similar to CSS selectors.

emel is inspired by zen-coding: https://code.google.com/p/zen-coding/

get it

git clone https://github.com/marianoguerra/emel

build it

cd emel
./rebar compile

test it

./rebar eunit

use it

1> emel:gen("span[type=\"text\"]#asd.foo.bar.baz").
{ok,"<span id=\"asd\" class=\"foo bar baz\" type=\"text\"/>"}

2> {ok, S} = emel:gen("span[type=\"text\"]#asd.foo.bar.baz").
{ok,"<span id=\"asd\" class=\"foo bar baz\" type=\"text\"/>"}

3> io:format("~s~n", [S]).
<span id="asd" class="foo bar baz" type="text"/>
ok

try it interactively

run the following command:

erl -run emel shell -run init stop -noshell -pa ebin

play with an interactive console:

emel console Ctrl + d to exit

>>> p
{ok,[{node,1,p,[],[],[]}],[]}

<p/>

>>> p{hi}
{ok,[{node,1,p,[],[],"hi"}],[]}

<p>hi</p>

>>> li*3
{ok,[{times,1,{node,1,li,[],[],[]},3}],[]}

<li/><li/><li/>

author

Mariano Guerra

license

BSD (+ optional beer to the author)

examples

input:

p

output:

<p/>

input:

p#id

output:

<p id="id"/>

input:

p.class

output:

<p class="class"/>

input:

p#id.class

output:

<p id="id" class="class"/>

input:

p#foo.bar.baz

output:

<p id="foo" class="bar baz"/>

input:

p#id-$ * 3

output:

<p id="id-1"/><p id="id-2"/><p id="id-3"/>

input:

{hello}

output:

hello

input:

p{hello}

output:

<p>hello</p>

input:

h1#title.important {hi}

output:

<h1 id="title" class="important">hi</h1>

input:

ul > li * 3

output:

<ul><li/><li/><li/></ul>

input:

ul.list > li#item-$.list-item * 3

output:

<ul class="list"><li id="item-1" class="list-item"/><li id="item-2" class="list-item"/><li id="item-3" class="list-item"/></ul>

input:

.username > (span.first-name{Mariano} + { } + span.last-name{Guerra})

output:

<div class="username"><span class="first-name">Mariano</span> <span class="last-name">Guerra</span></div>

input:

p * 3 > a{asd}

output:

<p><a>asd</a></p><p><a>asd</a></p><p><a>asd</a></p>

input:

p > ({Click } + a{here} + { to continue})

output:

<p>Click <a>here</a> to continue</p>

About

generate HTML (or XML) using CSS-like selectors in erlang

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages