basic-ejs-layout

Template system based on EJS for express/loopback 3.x modules

Installation

npm install basic-ejs-layout --save

Usage

Include

var Layout = require('basic-ejs-layout');

new Layout(globalsLocals = {}, transform = null);

Create a instance to render views. The views will be render with at least globalsLocals vars. The transform params allow customize how vars will be available in the view.

Arguments

Name	Type	Description
globalsLocals	object	Vars to all views.
transform	function	Function to custom how vars will be available in the view.

Example

// Option 1
var layout = new Layout();

// Option 2
var layout = new Layout({
  var1: "one",
  var2: "two",
});

// Option 3
var layout = new Layout(function (locals, layout) {
  return {
    ly: layout,
    vars: locals
  };
}));

// Option 4
var layout = new Layout({
  var1: "one",
  var2: "two",
}, function (locals, layout) {
  return {
    ly: layout,
    vars: locals
  };
});

layout.render(filePath, locals = {}, ejsOpts = {})

Render a the file indicated in filePath, with vars in locast, and EJS options ejsOpts. Vars in locals are extend from globalsLocals in new Layout call. Return the view rendered.

Arguments

Name	Type	Description
filePath	string	View path to render.
locals	object	Vars to include in rendering.
ejsOpts	object	Options to EJS render.

Example

var layout   = new Layout('./myviews', { appname: 'My App' });
var rendered = layout.render('myview.ejs', { message: 'Hello world' });
// Render ./myviews/myview.ejs file with vars appname='My app' and message='Hello world'.

layout.parent(filePath)

Indicate a view is render into another view. Child view is set in property body from renderer instance. This require send layout instance into vars to render.

Arguments

Name	Type	Description
filePath	string	Directory where find views.

Example

var layout   = new Layout('./myviews');
var rendered = layout.render('myview.ejs', {  ly: layout }); // Render ./myviews/myview.ejs

./myviews/myview.ejs

<% ly.parent('myparent.ejs') %>
<p>Luke: Nooooo!!!</p>

./myviews/myparent.ejs

<p>Luke: He told me you kill him</p>
<p>Darth Vader: No, I am your father</p>
<%- ly.body %>

Result:

<p>Luke: He told me you kill him</p>
<p>Darth Vader: No, I am your father</p>
<p>Luke: Nooooo!!!</p>

layout.include(filePath, locals = {})

Render a view into another view. Vars in locals will be add into rendering view. Return the view rendered.

Arguments

Name	Type	Description
filePath	string	Directory where find views.
locals	object	Vars to include in rendering.

Example

var layout   = new Layout('./myviews');
var rendered = layout.render('myview.ejs', {  ly: layout }); // Render ./myviews/myview.ejs

./myviews/myview.ejs

<p>Luke: He told me you kill him</p>
<p>Darth Vader: No, I am your father</p>
<%- ly.include('otherview.ejs', { destinatary: 'Luke' }) %>

./myviews/otherview.ejs

<p><%- destinatary %>: Nooooo!!!</p>

Result:

<p>Luke: He told me you kill him</p>
<p>Darth Vader: No, I am your father</p>
<p>Luke: Nooooo!!!</p>

layout.engine(globalsLocals = {}, transform = null)

Return a callback to set in a engine render. This method has the same contructor's params.

Arguments

Name	Type	Description
globalsLocals	object	Vars to all views.
transform	function	Function to custom how vars will be available
in the view.

Example

var app = express();
app.set('view engine', 'ejs');
app.set('views', 'myviews'); // Optional.

// Option 1
app.engine('ejs', Layout.engine());

// Option 2
app.engine('ejs', Layout.engine({
  myVar: 'myValue'
}));

// Option 3
app.engine('ejs', Layout.engine(function (locals, layout) {
  return {
    ly: layout,
    vars: locals
  };
}));

// Option 4
app.engine('ejs', Layout.engine({
  myVar: 'myValue'
}, function (locals, layout) {
  return {
    ly: layout,
    vars: locals
  };
}));

app.get('/', function (req, res) {
  // myview.ejs in views folder set in express app.
  res.render('myview', {
    displayName: 'Alexander'
  });
});

<!-- myviews/myview.ejs -->

<!-- Option 1 -->
  <%= displayName %> // 'Alexander'
  <%= myVar %> // Generate an error

<!-- Option 2 -->
  <%= displayName %> // 'Alexander'
  <%= myVar %> // 'myValue'

<!-- Option 3 -->
  <% ly.parent('mytemplate') %>
  <%= vars.displayName %> // 'Alexander'
  <%= vars.myVar %> // undefined

<!-- Option 4 -->
  <% ly.parent('mytemplate') %>
  <%= vars.displayName %> // 'Alexander'
  <%= vars.myVar %> // 'myValue'

Troubles

If you have any kind of trouble with it, just let me now by raising an issue on the GitHub issue tracker here:

https://github.com/arondn2/basic-ejs-layout/issues

Also, you can report the orthographic errors in the READMEs files or comments. Sorry for that, English is not my main language.

Tests

npm test or npm run cover