erml
An html library for Erlang, and an sandbox for Erlang, Cowboy, Htmx Spectre, Mnesia (ECHSM).
Main goals:
- simplicity
- flexibility
- extensibility
- portability
Secondary goals:
- htmx compatible
- spectre css compatible
- templating libraries for common usage
- optimized compilation
Build
rebar3 compile
Usage
{html, [
{head, [
{title, <<"my website">>},
{meta, #{ name => "twitter:card", content => "summary"}}
]},
{body, [
]}
]}.
Documentation
| Stability | Elements | Notes |
|---|---|---|
| Standard Elements | ||
| s | {Tag, Content} |
Create an html element without attributes |
| s | {Tag, Attributes, Content} |
Create an html element with attributes |
| s | {{empty, Tag}, Attributes} |
Create an empty element |
| s | {content, Content} |
Add raw content |
| Variables | ||
| s | {Variable} |
Insert a variable |
| Inclusion | ||
| u | {include, Path} |
include an erml file |
| u | {include, Path, Opts} |
include an erml file with custom options |
| u | {include_raw, Path} |
include a raw file |
| u | {include_raw, Path, Opts} |
include a raw file with custom options |
| u | {template, Type, Data, Param} |
insert a template |
| u | {template_file, Type, Filename, Param} |
insert a template file |
| Functions/Modules call | ||
| s | {apply, Module, Function, Arguments} |
call a module/function |
| s | {apply, Function, Arguments} |
call a function |
| s | {apply, Function} |
call a function |
| Process Call | ||
| u | {call, Pid, Message} |
call a gen_server process |
| u | {call, Pid, Message, Timeout} |
call a gen_server process |
| u | {gen_server, call, Pid, Message} |
call a gen_server process |
| u | {gen_server, call, Pid, Message, Timeout} |
call a gen_server process |
| u | {gen_statem, call, Pid, Message} |
call a gen_statem process |
| u | {gen_statem, call, Pid, Message, Timeout} |
call a gen_statem process |
Where u: unstable; s: stable
Creating Standard Elements
Standard elements are creating using tuples with 2 or 3 elements. A simple element can be created with an empty list.
{html, []}.
<html></html>
Attributes can be added.
{html, #{id => "page"}, []}.
<html id="page"></html>
Other elements can be added as contents.
{html, #{},
{body, []}
}.
<html><body></body></html>
{html, #{}, [
{head, []},
{body, []}
]}.
<html><head></head><body></body></html>
It supports also empty elements.
{{empty, image}, #{}}.
<image>
{{empty, image}, #{id => test}}
<image id=\"test\">
{{empty, image}, [selected]}.
<image selected>
Few elements are empty by default, and the content will be automatically converted as attributes or ignored.
{meta, #{name => "twitter:card", content => "summary"}}.
<meta name="twitter:card" content="summary">
Using Variables
Variables are created using tuples with one element and defined in
variables parameters key.
% define variables
Options = #{
variables => #{
test => <<"hello world!">>
}
}.
% create erml template
Erml = {body, [
{p, {test}}
]}.
% compile it.
erml:compile(Erml, Option).
<body><p>hello world!</p></body>
Variables can also includes erml data structure.
% define variables
Options = #{
variables => #{
test => {span, #{class => "bold"}, <<"hello world!">>}
}
}.
% create erml template
Erml = {body, [
{p, {test}}
]}.
% compile it.
erml:compile(Erml, Option).
<body><p><span class=\"bold\">hello world!</span></p></body>
Including Templates and Files
Files and templates can be added from a specific path. By default,
priv directory is used as root.
{body, [
{include_raw, "examples/erlang-punch/lorem_ipsum.txt"}
]}.
<body>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</body>
erml files can also be added.
{body, [
{include, "examples/erlang-punch/hero_01.erml"}
]}.
<body><div style="min-height: 100vh;" class="hero bg-primay">...
One can also use a templating system to insert different kind of content.
{body, [
{template, bbmustache, <<"{{test}}">>, #{"test" => "hello world!"}}
]}.
<body>hello world!</body>
Calling Functions and Modules
Functions and modules can be called.
{body, {apply, fun() -> {ok, <<"hello world!">>} end}}.
<body>hello world!</body>
Calling Running Processes
Active processes using gen_server or gen_statem can be called.