better layout control example

This commit is contained in:
Tj Holowaychuk 2011-08-08 17:15:13 -07:00
parent 509601e617
commit 23dbe6a5f0
8 changed files with 65 additions and 22 deletions

View File

@ -3,29 +3,39 @@
* Module dependencies.
*/
var express = require('../../lib/express');
var express = require('../../lib/express')
, url = require('url');
var app = express.createServer();
app.set('views', __dirname + '/views');
// map .html to ejs module
app.register('html', require('ejs'));
app.set('view engine', 'html');
// set default layout, usually "layout"
app.locals.layout = 'layouts/default';
// Set our default template engine to "ejs"
// which prevents the need for extensions
// (although you can still mix and match)
app.set('view engine', 'ejs');
// expose the current path as a view local
app.use(function(req, res, next){
res.locals.path = url.parse(req.url).pathname;
next();
});
app.get('/', function(req, res){
res.render('pages/default');
res.render('page');
});
app.get('/alternate', function(req, res){
res.render('page', { layout: 'layouts/alternate' });
});
app.get('/defined-in-view', function(req, res){
// note that we do not explicitly
// state the layout here, the view does,
// although we could do it here as well.
res.render('pages/alternate');
res.render('pages');
});
app.listen(3000);

View File

@ -1,6 +0,0 @@
<html>
<body>
<h1>Alternate Layout</h1>
<%- body %>
</body>
</html>

View File

@ -0,0 +1,26 @@
<html>
<title>Alternate</title>
<style>
body {
padding: 50px;
font: 14px "helvetica neue", helvetica, sans-serif;
color: #333;
}
#sidebar {
float: left;
width: 150px;
}
#content {
float: left;
}
</style>
<body>
<h1>Alternate Layout</h1>
<div id="sidebar">
<p>Moar sidebar!</p>
</div>
<div id="content">
<%- body %>
</div>
</body>
</html>

View File

@ -1,6 +0,0 @@
<html>
<body>
<h1>Default Layout</h1>
<%- body %>
</body>
</html>

View File

@ -0,0 +1,16 @@
<html>
<head>
<title>Default</title>
<style>
body {
padding: 50px;
font: 14px "helvetica neue", helvetica, sans-serif;
color: #333;
}
</style>
</head>
<body>
<h1>Default Layout</h1>
<%- body %>
</body>
</html>

View File

@ -0,0 +1,6 @@
<h1>Page</h1>
<% if (path == '/alternate') { %>
<p>Click <a href="/">here</a> to view the default layout.</p>
<% } else { %>
<p>Click <a href="/alternate">here</a> to view the alternate layout.</p>
<% } %>

View File

@ -1,2 +0,0 @@
<% layout('layouts/alternate') %>
<h1>Page</h1>

View File

@ -1 +0,0 @@
<h1>Page</h1>