2019-07-02 02:48:51 +00:00
|
|
|
defmodule Temple do
|
2022-04-20 03:56:46 +00:00
|
|
|
@engine Application.compile_env(:temple, :engine, EEx.SmartEngine)
|
2019-05-11 16:49:34 +00:00
|
|
|
|
2020-06-16 19:28:21 +00:00
|
|
|
@moduledoc """
|
2022-04-20 03:56:46 +00:00
|
|
|
Temple syntax is available inside the `temple`, and is compiled into efficient Elixir code at compile time using the configured `EEx.Engine`.
|
|
|
|
|
|
|
|
|
|
You should checkout the [guides](https://hexdocs.pm/temple/your-first-template.html) for a more in depth explanation.
|
2019-05-11 16:49:34 +00:00
|
|
|
|
2021-05-13 01:40:12 +00:00
|
|
|
## Usage
|
2019-05-11 16:49:34 +00:00
|
|
|
|
2020-06-16 19:28:21 +00:00
|
|
|
```elixir
|
2022-04-20 03:56:46 +00:00
|
|
|
defmodule MyApp.HomePage do
|
|
|
|
|
import Temple
|
|
|
|
|
|
|
|
|
|
def render() do
|
|
|
|
|
assigns = %{title: "My Site | Sign Up", logged_in: false}
|
|
|
|
|
|
|
|
|
|
temple do
|
|
|
|
|
"<!DOCTYPE html>"
|
|
|
|
|
|
|
|
|
|
html do
|
|
|
|
|
head do
|
|
|
|
|
meta charset: "utf-8"
|
|
|
|
|
meta http_equiv: "X-UA-Compatible", content: "IE=edge"
|
|
|
|
|
meta name: "viewport", content: "width=device-width, initial-scale=1.0"
|
|
|
|
|
link rel: "stylesheet", href: "/css/app.css"
|
|
|
|
|
|
|
|
|
|
title do: @title
|
|
|
|
|
end
|
|
|
|
|
|
|
|
|
|
body do
|
|
|
|
|
header class: "header" do
|
|
|
|
|
ul do
|
|
|
|
|
li do
|
|
|
|
|
a href: "/", do: "Home"
|
|
|
|
|
end
|
|
|
|
|
li do
|
|
|
|
|
if @logged_in do
|
|
|
|
|
a href: "/logout", do: "Logout"
|
|
|
|
|
else
|
|
|
|
|
a href: "/login", do: "Login"
|
|
|
|
|
end
|
|
|
|
|
end
|
|
|
|
|
end
|
|
|
|
|
end
|
|
|
|
|
|
|
|
|
|
main do
|
|
|
|
|
"Hi! Welcome to my website."
|
|
|
|
|
end
|
|
|
|
|
end
|
|
|
|
|
end
|
2020-06-16 19:28:21 +00:00
|
|
|
end
|
|
|
|
|
end
|
2021-08-29 21:45:07 +00:00
|
|
|
end
|
|
|
|
|
```
|
|
|
|
|
|
2021-05-13 01:40:12 +00:00
|
|
|
## Configuration
|
|
|
|
|
|
2022-04-20 03:56:46 +00:00
|
|
|
### Engine
|
2021-05-13 01:40:12 +00:00
|
|
|
|
2022-04-20 03:56:46 +00:00
|
|
|
By default Temple wil use the `EEx.SmartEngine`, but you can configure it to use any other engine. Examples could be `Phoenix.HTML.Engine` or `Phoenix.LiveView.Engine`.
|
2019-05-11 16:49:34 +00:00
|
|
|
|
2021-05-13 01:40:12 +00:00
|
|
|
```elixir
|
2022-04-20 03:56:46 +00:00
|
|
|
config :temple, engine: Phoenix.HTML.Engine
|
2021-05-13 01:40:12 +00:00
|
|
|
```
|
2020-06-16 19:28:21 +00:00
|
|
|
|
2021-05-13 01:40:12 +00:00
|
|
|
### Aliases
|
2020-06-16 19:28:21 +00:00
|
|
|
|
|
|
|
|
You can add an alias for an element if there is a namespace collision with a function. If you are using `Phoenix.HTML`, there will be namespace collisions with the `<link>` and `<label>` elements.
|
|
|
|
|
|
|
|
|
|
```elixir
|
|
|
|
|
config :temple, :aliases,
|
2022-04-20 03:56:46 +00:00
|
|
|
label: :label_tag,
|
|
|
|
|
link: :link_tag,
|
|
|
|
|
select: :select_tag
|
2020-06-16 19:28:21 +00:00
|
|
|
|
2019-07-09 02:29:41 +00:00
|
|
|
temple do
|
2022-04-20 03:56:46 +00:00
|
|
|
label_tag do
|
2020-06-16 19:28:21 +00:00
|
|
|
"Email"
|
2019-05-11 16:49:34 +00:00
|
|
|
end
|
2020-06-16 19:28:21 +00:00
|
|
|
|
2022-04-20 03:56:46 +00:00
|
|
|
link_tag href: "/css/site.css"
|
2019-05-11 16:49:34 +00:00
|
|
|
end
|
2020-06-16 19:28:21 +00:00
|
|
|
```
|
|
|
|
|
|
|
|
|
|
This will result in:
|
2019-05-11 16:49:34 +00:00
|
|
|
|
2020-06-16 19:28:21 +00:00
|
|
|
```html
|
|
|
|
|
<label>
|
|
|
|
|
Email
|
|
|
|
|
</label>
|
|
|
|
|
|
|
|
|
|
<link href="/css/site.css">
|
2019-05-11 16:49:34 +00:00
|
|
|
```
|
|
|
|
|
"""
|
2020-06-16 19:28:21 +00:00
|
|
|
|
|
|
|
|
defmacro temple(block) do
|
2022-04-20 03:56:46 +00:00
|
|
|
opts = [engine: engine()]
|
2019-05-11 16:49:34 +00:00
|
|
|
|
2022-04-20 03:56:46 +00:00
|
|
|
quote do
|
|
|
|
|
require Temple.Renderer
|
|
|
|
|
Temple.Renderer.compile(unquote(opts), unquote(block))
|
2021-01-02 18:21:48 +00:00
|
|
|
end
|
|
|
|
|
end
|
|
|
|
|
|
2022-04-20 03:56:46 +00:00
|
|
|
@doc false
|
|
|
|
|
def component(func, assigns) do
|
|
|
|
|
apply(func, [assigns])
|
2019-05-11 16:49:34 +00:00
|
|
|
end
|
2022-04-20 03:56:46 +00:00
|
|
|
|
|
|
|
|
@doc false
|
|
|
|
|
def engine(), do: @engine
|
2019-04-15 01:44:39 +00:00
|
|
|
end
|
