examples: replace jade with hbs in mvc example

fixes #3181 closes #3185 closes #3243 closes #3245 closes #3249
expressjs · Mar 23, 2017 · 3763d73 · 3763d73
1 parent 8acaa9a
commit 3763d73
Show file tree

Hide file tree

Showing 13 changed files with 100 additions and 47 deletions.
diff --git a/examples/mvc/controllers/user/index.js b/examples/mvc/controllers/user/index.js
@@ -4,6 +4,8 @@
 
 var db = require('../../db');
 
+exports.engine = 'hbs';
+
 exports.before = function(req, res, next){
   var id = req.params.user_id;
   if (!id) return next();

diff --git a/examples/mvc/controllers/user/views/edit.hbs b/examples/mvc/controllers/user/views/edit.hbs
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <link rel="stylesheet" href="/style.css">
+  <title>Edit {{user.name}}</title>
+</head>
+<body>
+  <h1>{{user.name}}</h1>
+  <form action="/user/{{user.id}}?_method=put" method="post">
+    <label for="user[name]">Name:
+      <input type="text" name="user[name]" value="{{user.name}}">
+    </label>
+
+    <input type="submit" name="submit" value="Update">
+  </form>
+
+  <form action="/user/{{user.id}}/pet" method="post">
+    <label for="pet[name]">Pet:
+      <input type="text" name="pet[name]" placeholder="Pet Name">
+    </label>
+
+    <input type="submit" name="submit" value="Add">
+  </form>
+</body>
+</html>
diff --git a/examples/mvc/controllers/user/views/edit.jade b/examples/mvc/controllers/user/views/edit.jade
diff --git a/examples/mvc/controllers/user/views/list.hbs b/examples/mvc/controllers/user/views/list.hbs
@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <link rel="stylesheet" href="/style.css">
+  <title>Users</title>
+</head>
+<body>
+  <h1>Users</h1>
+  <p>Click a user below to view their pets.</p>
+  <ul>
+    {{#each users}}
+      <li><a href="/user/{{id}}">{{name}}</a></li>
+    {{/each}}
+  </ul>
+</body>
+</html>
diff --git a/examples/mvc/controllers/user/views/list.jade b/examples/mvc/controllers/user/views/list.jade
diff --git a/examples/mvc/controllers/user/views/show.hbs b/examples/mvc/controllers/user/views/show.hbs
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <link rel="stylesheet" href="/style.css">
+  <title>{{user.name}}</title>
+</head>
+<body>
+<h1>{{user.name}} <a href="/user/{{user.id}}/edit">edit</a></h1>
+
+{{#if hasMessages}}
+  <ul>
+    {{#each messages}}
+      <li>{{this}}</li>
+    {{/each}}
+  </ul>
+{{/if}}
+
+{{#if user.pets.length}}
+  <p>View {{user.name}}'s pets:</p>
+  <ul>
+    {{#each user.pets}}
+      <li><a href="/pet/{{id}}">{{name}}</a></li>
+    {{/each}}
+  </ul>
+{{else}}
+  <p>No pets!</p>
+{{/if}}
+</body>
+</html>
diff --git a/examples/mvc/controllers/user/views/show.jade b/examples/mvc/controllers/user/views/show.jade
diff --git a/examples/mvc/index.js b/examples/mvc/index.js
@@ -11,11 +11,9 @@ var methodOverride = require('method-override');
 
 var app = module.exports = express();
 
-// settings
-
-// set our default template engine to "jade"
-// which prevents the need for extensions
-app.set('view engine', 'jade');
+// set our default template engine to "ejs"
+// which prevents the need for using file extensions
+app.set('view engine', 'ejs');
 
 // set views for error and 404 pages
 app.set('views', path.join(__dirname, 'views'));

diff --git a/examples/mvc/views/404.ejs b/examples/mvc/views/404.ejs
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>Not Found</title>
+    <link rel="stylesheet" href="/style.css">
+  </head>
+  <body>
+    <h1>404: Not Found</h1>
+    <p>Sorry we can't find <%= url %></p>
+  </body>
+</html>
diff --git a/examples/mvc/views/404.jade b/examples/mvc/views/404.jade
diff --git a/examples/mvc/views/5xx.ejs b/examples/mvc/views/5xx.ejs
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>Internal Server Error</title>
+    <link rel="stylesheet" href="/style.css">
+  </head>
+  <body>
+    <h1>500: Internal Server Error</h1>
+    <p>Looks like something blew up!</p>
+  </body>
+</html>
diff --git a/examples/mvc/views/5xx.jade b/examples/mvc/views/5xx.jade
diff --git a/package.json b/package.json
@@ -62,6 +62,7 @@
     "cookie-parser": "~1.4.3",
     "ejs": "2.5.6",
     "express-session": "1.15.1",
+    "hbs": "4.0.1",
     "istanbul": "0.4.5",
     "marked": "0.3.6",
     "method-override": "2.3.7",
@@ -73,7 +74,6 @@
     "supertest": "1.2.0",
     "connect-redis": "~2.4.1",
     "cookie-session": "~1.2.0",
-    "jade": "~1.11.0",
     "vhost": "~3.0.2"
   },
   "engines": {