Generating Pages

Both dynamic and static "pages" can be generated using the cloud.template module. The output type can be HTML for web output, or other formats like JSON, or plain text. You can choose the output type based on your needs.

A "page" consists of the following components:

  • A template file with embedded tokens
  • A structured Lua table holding token values
  • A decided upon return type (HTML, JSON, TEXT)

Let's start by looking at an example template, and the Lua content table.

Token Replacement

Token Examples

{{ variable }}
{{ object.variable }}
{{ array_tbl[3] }}
{{ object.someFunc() }}

Template

<!-- tpl/index.tpl -->
<html>
<head>
  <title>{{ page.title }}</title>
</head>
<body>
  <div class="container">
    {{ page.content }}
  </div>
</body>
</html>

Lua

-- api.lua
local api = cloud.api()

function api.get.home()
  local page =
  {
    title = "Welcome",
    content = "Hello Lua!"
  }

  local str = cloud.template.render('index.tpl', page)

  return str, cloud.HTML
end

return api

Output

<!-- index.html -->
<html>
<head>
  <title>Welcome</title>
</head>
<body>
  <div class="container">
    Hello Lua!
  </div>
</body>
</html>

Looping Data

Another nice thing about templates is being able to "loop" over data and generate the output. This has many use cases beyond just displaying a table of data to the user. Setting up a loop is very simple:

Signature

{% for idx, item in ipairs(items) do %} -- that's just Lua!
  <div>{{ item }} is item number {{ idx }}</div>
{% end %}

Template

<!-- tpl/users.tpl -->
<html>
<head>
  <title>{{ page.title }}</title>
</head>
<body>
  <div class="container">
    <ul class="user-list">
      {% for _, user in ipairs(page.users) do %}
      <li class="user">{{ user.first }} {{ user.last }}</li>
      {% end %}
    </ul>
  </div>
</body>
</html>

Lua

local api = cloud.api()

function api.get.users()

  local page =
  {
    title = "Users",
    users =
    {
      { first="Jim", last="Bell" },
      { first="Dani", last="Bell" }
    }
  }

  local str = cloud.template.render('users.tpl', page)

  return str, cloud.HTML
end

return api

Output

<!-- users.html -->
<html>
<head>
  <title>Users</title>
</head>
<body>
  <div class="container">
    <ul class="user-list">
      <li class="user">Jim Bell</li>
      <li class="user">Dani Bell</li>
    </ul>
  </div>
</body>
</html>

Template Tags

Type Code Notes
HTML escaped {{ expression }} Output a HTML escaped value.
Plain value {* expression *} Output a non-escaped (raw) value.
Lua code {% code here %} Run Lua expressions.
Include file {(other.tpl)} or {(other.tpl, ctx)} Include another template file, optionally passing new context.
Raw blocks {-raw-}unhandled text{-raw-} Mark sections for skipping interpolation.

Working with AJAX

Because of the way Coronium 2 apps are built, you can easily point your requests to public, and even key based endpoints.

For example, you can make an asynchrous call to refresh some data:

Lua

-- apps/cats/api.lua
local api = cloud.api()

function api.get.list(input, isAjax)

  if not isAjax then
    return cloud.error('must be Ajax request')
  end

  local cats =
  {
    'Snookie','Fluffy','Yip'
  }

  return cats
end

return api

HTML / Javascript

Using JQuery

...

<body>
  <div id='cats'>cats go here</div>

  <script>
    $.getJSON('https://instance.com/cats/list', function(data) {
      $('cats').innerHTML = data.request;
    });
  </script>
</body>

...