Begin refactor to use server side templates

9 files changed, 185 insertions, 92 deletions

diff --git a/src/index.js b/src/index.js
index 0cbba31..8e18272 100644
--- a/src/index.js
+++ b/src/index.js
@@ -4,12 +4,13 @@ const fs = require('fs');
 const path = require('path');
 const jwt = require('jsonwebtoken');
 
-
 const config = JSON.parse(fs.readFileSync(path.join(__dirname, 'config.json')));
-
 const dbCreds = config.database;
 const secret = config.jwt_secret;
 
+const models = require('./models');
+const templates = require('./templates');
+
 const jwtFunctions = {
   sign: function (message) {
     return jwt.sign({ value: message }, secret);
@@ -44,90 +45,11 @@ async function sync(alter, force, callback) {
   await database.sync({ alter, force, logging: console.log });
 }
 
-function setUpModels() {
-  const models = {
-    "transaction": database.define('transaction', {
-      when: {
-        type: Sequelize.DATE,
-        allowNull: false,
-      },
-      amount: {
-        type: Sequelize.DECIMAL,
-        allowNull: false,
-      },
-      where: {
-        type: Sequelize.STRING,
-        allowNull: false,
-      },
-      category: {
-        type: Sequelize.STRING,
-        allowNull: false,
-      },
-      subcategory: {
-        type: Sequelize.STRING,
-        allowNull: false,
-      },
-      username: {
-        type: Sequelize.STRING,
-        allowNull: false,
-      },
-    }),
-    "goals": database.define('goal', {
-      username: {
-        type: Sequelize.STRING,
-        allowNull: false,
-      },
-      name: {
-        type: Sequelize.STRING,
-        allowNull: false,
-      },
-      total: {
-        type: Sequelize.DECIMAL,
-        allowNull: false,
-      }, 
-      amount: {
-        type: Sequelize.DECIMAL,
-        allowNull: false,
-      }
-    }),
-    "expected": database.define('expected', {
-      username: {
-        type: Sequelize.STRING,
-        allowNull: false,
-      },
-      name: {
-        type: Sequelize.STRING,
-        allowNull: false,
-      },
-      total: {
-        type: Sequelize.DECIMAL,
-        allowNull: false,
-      }, 
-      days: {
-        type: Sequelize.INTEGER,
-        allowNull: false,
-      }
-    }),
-    "users": database.define('user', {
-      username: {
-        type: Sequelize.STRING,
-        allowNull: false,
-      },
-      password: {
-        type: Sequelize.STRING,
-        allowNull: false,
-      },
-      salt: {
-        type: Sequelize.STRING,
-        allowNull: false,
-      },}),
-  }
-  return models;
-}
 
-const models = setUpModels();
 sync();
 
-server.setUpRoutes(models, jwtFunctions, database);
+server.setUpRoutes(models.setUpModels(database), 
+  jwtFunctions, 
+  database, templates.setUpTemplates());
 server.listen(config.port);
 
diff --git a/src/models.js b/src/models.js
new file mode 100644
index 0000000..23d2032
--- /dev/null
+++ b/src/models.js
@@ -0,0 +1,85 @@
+const Sequelize = require('sequelize');
+function setUpModels(database) {
+    const models = {
+        "transaction": database.define('transaction', {
+            when: {
+                type: Sequelize.DATE,
+                allowNull: false,
+            },
+            amount: {
+                type: Sequelize.DECIMAL,
+                allowNull: false,
+            },
+            where: {
+                type: Sequelize.STRING,
+                allowNull: false,
+            },
+            category: {
+                type: Sequelize.STRING,
+                allowNull: false,
+            },
+            subcategory: {
+                type: Sequelize.STRING,
+                allowNull: false,
+            },
+            username: {
+                type: Sequelize.STRING,
+                allowNull: false,
+            },
+        }),
+        "goals": database.define('goal', {
+            username: {
+                type: Sequelize.STRING,
+                allowNull: false,
+            },
+            name: {
+                type: Sequelize.STRING,
+                allowNull: false,
+            },
+            total: {
+                type: Sequelize.DECIMAL,
+                allowNull: false,
+            },
+            amount: {
+                type: Sequelize.DECIMAL,
+                allowNull: false,
+            }
+        }),
+        "expected": database.define('expected', {
+            username: {
+                type: Sequelize.STRING,
+                allowNull: false,
+            },
+            name: {
+                type: Sequelize.STRING,
+                allowNull: false,
+            },
+            total: {
+                type: Sequelize.DECIMAL,
+                allowNull: false,
+            },
+            days: {
+                type: Sequelize.INTEGER,
+                allowNull: false,
+            }
+        }),
+        "users": database.define('user', {
+            username: {
+                type: Sequelize.STRING,
+                allowNull: false,
+            },
+            password: {
+                type: Sequelize.STRING,
+                allowNull: false,
+            },
+            salt: {
+                type: Sequelize.STRING,
+                allowNull: false,
+            },
+        }),
+    }
+    return models;
+}
+module.exports = {
+    setUpModels
+}
\ No newline at end of file
diff --git a/src/server.js b/src/server.js
index f72f21b..ffbc373 100644
--- a/src/server.js
+++ b/src/server.js
@@ -11,7 +11,7 @@ const config = JSON.parse(fs.readFileSync(path.join(__dirname, 'config.json')));
 const server = express();
 server.use(cookieParser())
 server.use(bodyParser.json());
-//server.use(bodyParser.urlencoded({ extended: true }));
+server.use(bodyParser.urlencoded({ extended: true }));
 
 function listen(port) {
     server.listen(port, () => console.info(`Listening: http://localhost:${port} `));
@@ -23,7 +23,7 @@ function hashWithSalt(password, salt){
     return hash.digest("base64");
 };
 
-function setUpRoutes(models, jwtFunctions, database) {
+function setUpRoutes(models, jwtFunctions, database, templates) {
     // Authentication routine
     server.use(async function (req, res, next) {
         if (!req.path.toLowerCase().startsWith("/login")) {
@@ -58,8 +58,19 @@ function setUpRoutes(models, jwtFunctions, database) {
 
     server.get('/', (req, res) => res.sendFile(__dirname + "/index.html"))
     server.get('/login', (req, res) => res.sendFile(__dirname + "/login.html"))
-    server.get('/styles.css', (req, res) => res.sendFile(__dirname + "/styles.css"))
-    server.get('/main.js', (req, res) => res.sendFile(__dirname + "/main.js"))
+
+    server.get('/summary', async (req, res) => {
+        var ledger = await database.query("SELECT * FROM transactions WHERE username = '" + res.locals.user.username + "' ORDER BY `when` DESC", { type: database.QueryTypes.SELECT })
+        ledger.forEach((element, i) => {
+            element.when = element.when.toString().substring(0, 10);
+            element.index = i+1
+        });
+        var name = res.locals.user.username
+        let body = templates["summary"]({ name, ledger })
+        res.status(200).send(body)
+    })
+
+    server.use('/static', express.static(path.join(__dirname, '/static')))
 
     server.post('/login', async (req, res, next) => {
         const user = await models.users.findOne({ where: { username: req.body.username} })
@@ -90,9 +101,11 @@ function setUpRoutes(models, jwtFunctions, database) {
             let item = req.body;
             console.log(item);
             item.username = res.locals.user.username
+            if(!item.when){
+                item.when = new Date().toLocaleDateString();
+            }
             await models.transaction.create(item);
-            var result = await database.query("SELECT * FROM transactions WHERE username = '" + res.locals.user.username + "' ORDER BY `when` DESC", { type: database.QueryTypes.SELECT })
-            res.status(200).send(result);
+            res.redirect("/summary")
         } catch (e) {
             console.log(e);
             res.status(400).send(e.message);
@@ -126,6 +139,7 @@ function setUpRoutes(models, jwtFunctions, database) {
             res.status(400).send(e.message);
         }
     })
+    
     server.get(`/goals`, async (req, res, next) => {
         try {
             var result = await database.query("SELECT * FROM goals WHERE username = '" + res.locals.user.username + "' ORDER BY `name` DESC", { type: database.QueryTypes.SELECT })
diff --git a/src/main.js b/src/static/main.js
index 0a381b0..0a381b0 100644
--- a/src/main.js
+++ b/src/static/main.js
diff --git a/src/styles.css b/src/static/styles.css
index 4eedd0b..4eedd0b 100644
--- a/src/styles.css
+++ b/src/static/styles.css
diff --git a/src/templates.js b/src/templates.js
new file mode 100644
index 0000000..2c02905
--- /dev/null
+++ b/src/templates.js
@@ -0,0 +1,27 @@
+const fs = require('fs');
+const path = require('path');
+const handlebars = require("handlebars");
+
+function setUpTemplates(){
+    let templates = {};
+    
+    {
+        const templateContent = fs.readFileSync(path.join(__dirname, 'templates/login.html')).toString()
+        templates["login"] = handlebars.compile(templateContent);
+    }
+    {
+        const templateContent = fs.readFileSync(path.join(__dirname, 'templates/index.html')).toString()
+        // templates["index"] = handlebars.compile(templateContent);
+    }
+    {
+        const templateContent = fs.readFileSync(path.join(__dirname, 'templates/summary.html')).toString()
+        templates["summary"] = handlebars.compile(templateContent);
+    }
+
+    return templates
+}
+
+
+module.exports = {
+    setUpTemplates
+};
diff --git a/src/index.html b/src/templates/index.html
index cba242d..525f8fe 100644
--- a/src/index.html
+++ b/src/templates/index.html
@@ -8,8 +8,8 @@
     <link rel="shortcut icon" href="/favicon.ico">
     <!-- <script src="https://cdn.jsdelivr.net/npm/vue"></script> -->
     <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
-    <script src="main.js"></script>
-    <link rel="stylesheet" type="text/css" href="styles.css">
+    <script src="static/main.js"></script>
+    <link rel="stylesheet" type="text/css" href="static/styles.css">
 </head>
 
 <body>
diff --git a/src/login.html b/src/templates/login.html
index ec41762..ec41762 100644
--- a/src/login.html
+++ b/src/templates/login.html
diff --git a/src/templates/summary.html b/src/templates/summary.html
new file mode 100644
index 0000000..5bf828e
--- /dev/null
+++ b/src/templates/summary.html
@@ -0,0 +1,45 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <title>{{name}}'s Budget</title>
+    <meta charset="UTF-8">
+    <link rel="stylesheet" type="text/css" href="static/styles.css">
+</head>
+
+<body>
+    <h1>{{name}}'s Budget</h1>
+    <form method="post" action="/transaction">
+        <input id="datePicker" name="when" placeholder="date" type="date"> 
+        <input name="where" placeholder="where" type="text"> 
+        <input name="amount" placeholder="amount" type="number" step="0.01"> 
+        <input name="category" placeholder="category" type="text"> 
+        <input name="subcategory" placeholder="tags (csv)" type="text"> 
+        <input type="submit" value="Add">
+    </form>
+    <table>
+        <tr>
+            <th></th>
+            <th>When</th>
+            <th>Where</th>
+            <th>Amount</th>
+            <th>Category</th>
+            <th>Tags</th>
+        </tr>
+        {{#each ledger}}
+        <tr>
+            <td>{{this.index}}</td>
+            <td>{{this.when}}</td>
+            <td>{{this.where}}</td>
+            <td>{{this.amount}}</td>
+            <td>{{this.category}}</td>
+            <td>{{this.subcategory}}</td>
+        </tr>
+        {{/each}}
+    </table>
+    <script>
+        document.getElementById('datePicker').value = new Date().toLocaleDateString();
+    </script>
+</body>
+</html>
+