Added pages to list projects and create new ones

index.js

@@ -22,6 +22,10 @@ sequelize.sync({}).then(function(){
 const session = require("express-session");
 app.use(session({ resave: true, secret: "123456", saveUninitialized: true }));
 
+// enable body-parser to read form data
+const bodyParser = require('body-parser');
+app.use(bodyParser.urlencoded({ extended: true }));
+
 // enable the Twig template engine
 app.set('view engine', 'twig');
 
@@ -30,9 +34,14 @@ app.use(express.static('public'));
 
 // load routes
 const indexRoutes = require('./src/routes/index');
+const projectRoutes = require('./src/routes/project');
 
 // register routes
 app.get('/', indexRoutes.getIndex);
+app.get('/project', projectRoutes.getIndex);
+app.get('/project/list', projectRoutes.getList);
+app.get('/project/add', projectRoutes.getAdd);
+app.post('/project/add', projectRoutes.postAdd);
 
 app.listen(port, () => {
   console.log(`Leviathan listening on port ${port}`);

public/css/eye.css

@@ -12,6 +12,12 @@ body{
   background: #eee;
 }
 
+textarea{
+  max-width: 100%;
+  min-width: 100%;
+  height: 100px;
+}
+
 .container{
   max-width: 1024px;
 }

src/routes/index.js

@@ -1,6 +1,9 @@
+const Project = require('../models').models.Project;
+
 // GET / - primary app dashboard
-exports.getIndex = function(req, res) {
+exports.getIndex = async function(req, res) {
-
+  var projects = await Project.findAll();
-  res.render('index/dashboard', { title: 'Hey', message: 'Hello there!' });
+  res.render('index/dashboard', {
-
+    projects: projects
+  });
 };

src/routes/project.js

@@ -0,0 +1,29 @@
+const Project = require('../models').models.Project;
+
+// GET /project - redirects to project list
+exports.getIndex = async function(req, res) {
+  res.redirect('/project/list');
+};
+
+// GET /project/list - list of projects
+exports.getList = async function(req, res) {
+  var projects = await Project.findAll();
+  res.render('project/list', {
+    projects: projects
+  });
+};
+
+// GET /project/add - add a new project
+exports.getAdd = async function(req, res) {
+  res.render('project/add');
+};
+
+// POST /project/add - add the project to the database
+exports.postAdd = async function(req, res) {
+  var project = await Project.create({
+    title: req.body.project_title,
+    description: req.body.project_description
+  });
+
+  res.redirect('/project');
+};

views/index/dashboard.twig

@@ -3,5 +3,42 @@
 {% block title %}Dashboard{% endblock %}
 
 {% block content %}
-<p>This is the dashboard!</p>
+<div class="row">
+  <h2>Recently updated projects:</h2>
+  <table class="twelve columns">
+    <thead>
+      <tr>
+        <td>Title</td>
+        <td>Last updated</td>
+      </tr>
+    </thead>
+    <tbody>
+      {% for p in projects %}
+        <tr>
+          <td>{{ p.title }}</td>
+          <td>{{ p.updatedAt | date('m/d/Y g:ia') }}</td>
+        </tr>
+      {% endfor %}
+    </tbody>
+  </table>
+</div>
+
+<hr>
+
+<div class="row">
+  <h2>Recently added results:</h2>
+  <table class="twelve columns">
+    <thead>
+      <tr>
+        <td>Benchmark</td>
+        <td>Hardware</td>
+        <td>Average/Score</td>
+        <td>Scoring type</td>
+        <td>Added on</td>
+      </tr>
+    </thead>
+    <tbody>
+    </tbody>
+  </table>
+</div>
 {% endblock %}

views/project/add.twig

@@ -0,0 +1,27 @@
+{% extends 'layouts/default.twig' %}
+
+{% block title %}Add a Project{% endblock %}
+
+{% block content %}
+<div class="row">
+  <h2>Add a project</h2>
+
+  <form class="twelve columns" action="/project/add" method="POST">
+    <div class="row">
+      <label for="project_title">
+        Project title:
+        <input id="project_title" class="u-full-width" type="text" name="project_title" placeholder="My hardware benchmarking project">
+      </label>
+    </div>
+
+    <div class="row">
+      <label for="project_description">
+        Project description:
+        <textarea id="project_description" class="twelve columns" cols="30" rows="10" name="project_description"></textarea>
+      </label>
+    </div>
+
+    <input class="button-primary u-full-width" type="submit" value="Submit">
+  </form>
+</div>
+{% endblock %}

views/project/list.twig

@@ -0,0 +1,29 @@
+{% extends 'layouts/default.twig' %}
+
+{% block title %}List of Projects{% endblock %}
+
+{% block content %}
+<div class="row">
+  <h2>Projects</h2>
+  <a href="/project/add">Add a project</a>
+
+  <table class="twelve columns">
+    <thead>
+      <tr>
+        <td>Title</td>
+        <td>Created at</td>
+        <td>Last updated</td>
+      </tr>
+    </thead>
+    <tbody>
+      {% for p in projects %}
+        <tr>
+          <td><a href="/project/{{ p.id }}">{{ p.title }}</a></td>
+          <td>{{ p.createdAt | date('m/d/Y g:ia') }}</td>
+          <td>{{ p.updatedAt | date('m/d/Y g:ia') }}</td>
+        </tr>
+      {% endfor %}
+    </tbody>
+  </table>
+</div>
+{% endblock %}