Browse files

improved ejs Example

  • Loading branch information...
1 parent 1bf49ca commit d3c9d4f773fca9f6b02434f876f96cf918bc0820 @sakateka sakateka committed Oct 9, 2012
View
5 examples/auth/app.js
@@ -90,7 +90,10 @@ app.get('/logout', function(req, res){
});
app.get('/login', function(req, res){
- res.render('login');
+ res.render('login', {
+ title: "Authentication Example",
+ user: req.session.user ? req.session.user.name : undefined
+ });
});
app.post('/login', function(req, res){
View
11 examples/auth/views/foot.ejs
@@ -0,0 +1,11 @@
+ <footer>
+ <p>
+ <% if (user) { %>
+ Authenticated as <%= user %>, click to <a href="/logout">logout</a>.
+ <%} else {%>
+ <%= title %>
+ <% } %>
+ </p>
+ </footer>
+ </body>
+</html>
View
22 examples/auth/views/head.ejs
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <title><%= title %></title>
+ <style>
+ body {
+ padding: 50px;
+ font: 13px Helvetica, Arial, sans-serif;
+ }
+ .error {
+ color: red
+ }
+ .success {
+ color: green;
+ }
+ footer {
+ margin-top: 50px;
+ color: gray;
+ }
+ </style>
+ </head>
+ <body>
View
56 examples/auth/views/login.ejs
@@ -1,36 +1,20 @@
-<!DOCTYPE html>
-<html>
- <head>
- <title>Authentication Example</title>
- <style>
- body {
- padding: 50px;
- font: 13px Helvetica, Arial, sans-serif;
- }
- .error {
- color: red
- }
- .success {
- color: green;
- }
- </style>
- </head>
- <body>
- <h1>Login</h1>
- <%- message %>
- Try accessing <a href="/restricted">/restricted</a>, then authenticate with "tj" and "foobar".
- <form method="post" action="/login">
- <p>
- <label>Username:</label>
- <input type="text" name="username">
- </p>
- <p>
- <label>Password:</label>
- <input type="text" name="password">
- </p>
- <p>
- <input type="submit" value="Login">
- </p>
- </form>
- </body>
-</html>
+<% include head %>
+
+<h1>Login</h1>
+<%- message %>
+Try accessing <a href="/restricted">/restricted</a>, then authenticate with "tj" and "foobar".
+<form method="post" action="/login">
+ <p>
+ <label>Username:</label>
+ <input type="text" name="username">
+ </p>
+ <p>
+ <label>Password:</label>
+ <input type="text" name="password">
+ </p>
+ <p>
+ <input type="submit" value="Login">
+ </p>
+</form>
+
+<% include foot %>
View
16 examples/ejs/index.js
@@ -37,10 +37,22 @@ var users = [
];
app.get('/', function(req, res){
- res.render('users', { users: users });
+ res.render('users', {
+ users: users,
+ title: "EJS example",
+ header: "Some users"
+ });
+});
+
+app.get('/next', function(req, res){
+ res.render('emails', {
+ users: users,
+ title: "EJS example",
+ header: "Some email address"
+ });
});
if (!module.parent) {
app.listen(3000);
console.log('Express app started on port 3000');
-}
+}
View
12 examples/ejs/views/emails.html
@@ -0,0 +1,12 @@
+<% include header/emails.html %>
+
+<h1>Emails</h1>
+<ul id="emails">
+ <% users.forEach(function(user){ %>
+ <li><%= user.email %> by <%= user.name %></li>
+ <% }) %>
+</ul>
+
+<p><a href="/">back</a></p>
+
+<% include footer/all.html %>
View
7 examples/ejs/views/footer/all.html
@@ -0,0 +1,7 @@
+ <footer>
+ <p>
+ <%= title %>
+ </p>
+ </footer>
+</body>
+</html>
View
20 examples/ejs/views/header/all.html
@@ -0,0 +1,20 @@
+<!DOCTYPE HTML>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <title> <%= title %> </title>
+ <style type="text/css">
+ body {
+ padding: 50px;
+ font: 13px Helvetica, Arial, sans-serif;
+ }
+ .header {
+ font-size: 4em;
+ }
+ footer {
+ margin-top: 50px;
+ color: gray;
+ }
+ </style>
+</head>
+<body>
View
3 examples/ejs/views/header/emails.html
@@ -0,0 +1,3 @@
+<% include all.html %>
+
+<h1 class="header">Some email address</h1>
View
3 examples/ejs/views/header/users.html
@@ -0,0 +1,3 @@
+<% include all.html %>
+
+<h1 class="header">Some users</h1>
View
8 examples/ejs/views/users.html
@@ -1,6 +1,12 @@
+<% include header/users.html %>
+
<h1>Users</h1>
<ul id="users">
<% users.forEach(function(user){ %>
<li><%= user.name %> <%= user.email %></li>
<% }) %>
-</ul>
+</ul>
+
+<p><a href="/next">next</a></p>
+
+<% include footer/all.html %>

0 comments on commit d3c9d4f

Please sign in to comment.