diff --git a/NodeAPI/index.js b/NodeAPI/index.js
index d821d539c846fc8073b11e70c16c0df0fef0728d..7c861f843072907422a60807be040499d7d4e4a2 100644
--- a/NodeAPI/index.js
+++ b/NodeAPI/index.js
@@ -45,19 +45,38 @@ app.post('/predict', (req,res) => {
// Get the data to be stored
var plot = req.body.plot;
- var prediction = JSON.parse(body).predictionText;
+ var prediction = JSON.parse(JSON.parse(body).predictionText);
// Get rcord to be inserted
var rec = {'Plot':plot, 'Prediction': prediction};
// Insert the record to the collection, throw error if insert unsuccessful
collection.insert(rec, {w:1}, function(err, result) {});
+ }, function(){
+ db.close();
});
res.render('predictions',{predictions:JSON.parse(JSON.parse(body).predictionText)})
});
-})
-
-
+ console.log(req.body.plot)
+ // res.render('index', {});
+
+});
+
+app.get('/submissions', function (req, res) {
+ var resultArray = [];
+ MongoClient.connect(url, function(err, db) {
+ if(err) { return console.dir(err); }
+
+ var cursor = db.db('ClusterNLP').collection('Pred_Records').find();
+ cursor.forEach(function(doc, err){
+ resultArray.push(doc)
+ }, function(){
+ db.close();
+ res.render('submissions', {items: resultArray});
+ });
+ });
+
+});
\ No newline at end of file
diff --git a/NodeAPI/public/css/style.css b/NodeAPI/public/css/style.css
index b6f0933e70578175e6e9a0ca960a2965d9db1a58..d6d7f62bb632b1dab57a57dfe3a77c5a625b0b05 100644
--- a/NodeAPI/public/css/style.css
+++ b/NodeAPI/public/css/style.css
@@ -71,7 +71,8 @@ fieldset {
-ms-transition: all 0.1s ease-in-out;
-o-transition: all 0.1s ease-in-out;
transition: all 0.1s ease-in-out;
- color: black;
+ color: #444;
+ margin-top: 4%;
}
.ghost-button:hover {
border:2px solid #e95e01;
@@ -86,7 +87,6 @@ p {
width: 100%;
height: 100%;
color: white;
- display: grid;
background-size: 300% 300%;
/* background-image: linear-gradient(
-90deg,
@@ -132,4 +132,67 @@ p {
border-color: #007299;
color: #007299;
box-shadow: none;
+}
+
+/* Add a black background color to the top navigation */
+.topnav {
+ background-color: cornflowerblue;
+ overflow: hidden;
+}
+
+/* Style the links inside the navigation bar */
+.topnav a {
+ float: left;
+ color: #f2f2f2;
+ text-align: center;
+ padding: 14px 16px;
+ font-size: 1.3em;
+ text-decoration: none;
+ font-family: Calibri, 'Trebuchet MS', sans-serif;
+ font-weight: bold;
+}
+
+/* Change the color of links on hover */
+.topnav a:hover {
+ background-color: #ddd;
+ color: #e95e01;
+ text-decoration: none;
+}
+
+/* Add a color to the active/current link */
+.topnav a.active {
+ background-color: #e95e01;
+ color: white;
+}
+
+.title{
+ color: cornflowerblue;
+ font-size: 2.2em;
+ margin-top: 5%;
+}
+
+.subtitle{
+ color: #e95e01;
+ font-size: 1.2em;
+}
+
+table, th, td {
+ border: 1px solid black;
+ color: black;
+}
+
+td{
+ min-width: 10em;
+ font-family: Calibri, 'Trebuchet MS', sans-serif;
+}
+
+th{
+ color: #e95e01;
+ font-size: 1.2em;
+}
+
+.thead{
+ font-family: Calibri, 'Trebuchet MS', sans-serif;
+ color: cornflowerblue;
+ font-size: 2em;
}
\ No newline at end of file
diff --git a/NodeAPI/views/index.ejs b/NodeAPI/views/index.ejs
index 0ad075c2845356d49185883ecfe0dcf95f107886..fa58fa4e0362edc7f631f0807842e34b1dc3d046 100644
--- a/NodeAPI/views/index.ejs
+++ b/NodeAPI/views/index.ejs
@@ -13,10 +13,14 @@
</head>
<div class="bg">
+ <div class="topnav">
+ <a class="active" href="/">NLP11</a>
+ <a href="/submissions">Submissions</a>
+ </div>
<body class="text-center" >
<div class="row">
- <h1 style="color: cornflowerblue;">NLP Group 11: Predict movie genres by plot</h1>
- <b style="color: #e95e01; font-size: large;">Enter a movie plot text to receive a prediction of the grenre(s)</b> <br>
+ <h1 class="title">NLP Group 11: Predict movie genres by plot</h1>
+ <b class="subtitle">Enter a movie plot text to receive a prediction of the grenre(s)</b> <br>
<!-- <h2>Enter plot text</h2> -->
<!-- <div>Any Address holding a balance of SIMP is able allow the backend to burn their tokens. <b>MAKE SURE METAMASK BROWSER EXTENSION IS CONNECTED TO THE WEBSITE (TOP RIGHT)</b></div> -->
diff --git a/NodeAPI/views/predictions.ejs b/NodeAPI/views/predictions.ejs
index 8dda37800fffb9b47351b575e04c95c2d265d9eb..bc90bf58425b560a406aa84cee3aeb42217d711e 100644
--- a/NodeAPI/views/predictions.ejs
+++ b/NodeAPI/views/predictions.ejs
@@ -15,6 +15,10 @@
</head>
<div class="bg">
+ <div class="topnav">
+ <a href="/">NLP11</a>
+ <a href="/submissions">Submissions</a>
+ </div>
<body class="text-center" >
<div class="row">
<h1 style="color: cornflowerblue;">Predicted Genres</h1>
diff --git a/NodeAPI/views/submissions.ejs b/NodeAPI/views/submissions.ejs
new file mode 100644
index 0000000000000000000000000000000000000000..8e95f03f46d5d2bf22a8138d77eea0e8e71bd352
--- /dev/null
+++ b/NodeAPI/views/submissions.ejs
@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>NLP Demo</title>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <link rel="stylesheet" type="text/css" href="/css/style.css">
+ <link href='https://fonts.googleapis.com/css?family=Open+Sans:300' rel='stylesheet' type='text/css'>
+ <!-- Latest compiled and minified CSS -->
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
+ <!-- jQuery library -->
+ <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
+ </head>
+
+ <div class="bg">
+ <div class="topnav">
+ <a href="/">NLP11</a>
+ <a class="active" href="/submissions">Submissions</a>
+ </div>
+ <body>
+
+ <h1 class = "thead text-center">Movie Submissions and Predictions</h1>
+ <%- include("table", {items}); %>
+
+ </body>
+ </div>
+</html>
+
diff --git a/NodeAPI/views/table.ejs b/NodeAPI/views/table.ejs
new file mode 100644
index 0000000000000000000000000000000000000000..5f802e5eda4a0027ee8de6c05a86c502903b8c85
--- /dev/null
+++ b/NodeAPI/views/table.ejs
@@ -0,0 +1,17 @@
+<table class="table">
+ <tr>
+ <th>Prediction</th>
+ <th>Plot</th>
+ </tr>
+ <%if (items.length >0){ %>
+ <% items.forEach(function(row) { %>
+ <tr>
+ <td><%= row.Prediction %></td>
+ <td><%= row.Plot %></td>
+ </tr>
+ <% })}else{ %>
+ <tr>
+ <td colspan="6">No Record Found</td>
+ </tr>
+ <% } %>
+ </table>
\ No newline at end of file