Ncotto · Ncotto · Sep 17, 2020 · Sep 17, 2020
diff --git a/package.json b/package.json
@@ -1,8 +1,8 @@
 {
-  "name": "",
+  "name": "To Do List",
   "version": "",
-  "description": "",
-  "author": "",
+  "description": "Create a todo list",
+  "author": "Nicole Cotto",
   "scripts": {
     "start": "node server.improved.js"
   },

diff --git a/public/css/style.css b/public/css/style.css
@@ -1 +1,56 @@
-/*Style your own assignment! This is fun! */
+/*Style your own assignment! This is fun! */
+body {
+  background-color: violet;
+}
+
+table,
+th,
+td {
+  border: 1px solid black;
+  text-align: center;
+  background: white;
+}
+
+input {
+  padding: 10px 2px;
+  margin: 2px 0 10px 10px;
+}
+
+h1 {
+  font-family: verdana;
+  color: purple;
+}
+
+button{
+    margin: 2px 0 2px 10px;
+}
+
+label{
+  font-size: 20px;
+  margin: 2px 0 2px 10px;
+}
+
+#add {
+  background-color: green;
+  color: white;
+}
+
+#submit {
+  background-color: blue;
+  color: white;
+}
+
+#delete {
+  background-color: red;
+  color: white;
+}
+
+#edit {
+  background-color: yellow;
+  color: black;
+}
+
+#results {
+  background-color: orange;
+  color: black;
+}
diff --git a/public/index.html b/public/index.html
@@ -1,41 +1,45 @@
-<!doctype html>
+<!DOCTYPE html>
+
 <html lang="en">
   <head>
+    <link rel="stylesheet" href="css/style.css" />
+    <script type="text/javascript" src="js/scripts.js"></script>
+
     <title>CS4241 Assignment 2</title>
-    <meta charset="utf-8">
+    <meta charset="utf-8" />
   </head>
   <body>
+    <h1>
+      To-Do List
+    </h1>
     <form action="">
-      <input type='text' id='yourname' value="your name here">
-      <button>submit</button>
-    </form>
-  </body>
-  <script>
+      <label for="ftask">Task To Do:</label><br />
+      <input type="text" id="task" /><br />
 
-  const submit = function( e ) {
-    // prevent default form action from being carried out
-    e.preventDefault()
+      <label for="fdate">Date to Complete:</label><br />
+      <input type="date" id="date" /><br />
 
-    const input = document.querySelector( '#yourname' ),
-          json = { yourname: input.value },
-          body = JSON.stringify( json )
-
-    fetch( '/submit', {
-      method:'POST',
-      body 
-    })
-    .then( function( response ) {
-      // do something with the reponse 
-      console.log( response )
-    })
+      <label for="ftime">Time to Start:</label><br />
+      <input type="time" id="time" /><br />
+      <button id="submit">Submit</button>
+    </form>
 
-    return false
-  }
+    <table style="width:100%">
+      <caption>
+        To Do List
+      </caption>
+      <tr>
+        <th>Task</th>
+        <th>Date</th>
+        <th>Time</th>
+      </tr>
+      <script>dataTable();</script>
+    </table>
 
-  window.onload = function() {
-    const button = document.querySelector( 'button' )
-    button.onclick = submit
-  }
+    <button id="results">Results</button><br />
+    <button id="add">Add</button><br />
+    <button id="edit">Edit</button><br />
+    <button id="delete">Delete</button>
+  </body>
 
-  </script>
 </html>
diff --git a/public/js/scripts.js b/public/js/scripts.js
@@ -1,3 +1,50 @@
 // Add some Javascript code here, to run on the front end.
 
-console.log("Welcome to assignment 2!")
+console.log("Welcome to assignment 2!");
+
+ let data = [];
+const submit = function(e) {
+  // prevent default form action from being carried out
+  e.preventDefault();
+
+  const input = document.querySelector("#task");
+  const input2 = document.querySelector("#date");
+  const input3 = document.querySelector("#time"),
+    json = { task: input.value, date: input2.value, time: input3.value },
+    body = JSON.stringify(json);
+
+
+  fetch("/submit", {
+    method: "POST",
+    body
+  })
+    .then(function(response) {
+      // do something with the reponse
+      return response.json();
+    })
+
+    .then(function(json) {
+      data.push(json);
+      console.log(json);
+    });
+
+  return false;
+};
+
+function dataTable(){
+    var dataLength = data.length;
+    for (var i = 0; i <= dataLength; i++) {
+
+      document.write("<tr>");
+      document.write("<td>"+JSON.stringify(data[i])+"</td>");
+      document.write("<td>"+data[i+1]+"</td>");
+      document.write("<td>"+data[i+2]+"</td>");
+      console.log(i);
+      document.write("</tr>");
+    }
+};
+
+window.onload = function() {
+  const button = document.querySelector("button");
+  button.onclick = submit;
+};
diff --git a/server.improved.js b/server.improved.js
@@ -1,72 +1,69 @@
-const http = require( 'http' ),
-      fs   = require( 'fs' ),
-      // IMPORTANT: you must run `npm install` in the directory for this assignment
-      // to install the mime library used in the following line of code
-      mime = require( 'mime' ),
-      dir  = 'public/',
-      port = 3000
+const http = require("http"),
+  fs = require("fs"),
+  // IMPORTANT: you must run `npm install` in the directory for this assignment
+  // to install the mime library used in the following line of code
+  mime = require("mime"),
+  dir = "public/",
+  port = 3000;
 
 const appdata = [
-  { 'model': 'toyota', 'year': 1999, 'mpg': 23 },
-  { 'model': 'honda', 'year': 2004, 'mpg': 30 },
-  { 'model': 'ford', 'year': 1987, 'mpg': 14} 
-]
-
-const server = http.createServer( function( request,response ) {
-  if( request.method === 'GET' ) {
-    handleGet( request, response )    
-  }else if( request.method === 'POST' ){
-    handlePost( request, response ) 
+  { model: "toyota", year: 1999, mpg: 23 },
+  { model: "honda", year: 2004, mpg: 30 },
+  { model: "ford", year: 1987, mpg: 14 }
+];
+
+const server = http.createServer(function(request, response) {
+  if (request.method === "GET") {
+    handleGet(request, response);
+  } else if (request.method === "POST") {
+    handlePost(request, response);
   }
-})
+});
 
-const handleGet = function( request, response ) {
-  const filename = dir + request.url.slice( 1 ) 
+const handleGet = function(request, response) {
+  const filename = dir + request.url.slice(1);
 
-  if( request.url === '/' ) {
-    sendFile( response, 'public/index.html' )
-  }else{
-    sendFile( response, filename )
+  if (request.url === "/") {
+    sendFile(response, "public/index.html");
+  } else {
+    sendFile(response, filename);
   }
-}
-
-const handlePost = function( request, response ) {
-  let dataString = ''
-
-  request.on( 'data', function( data ) {
-      dataString += data 
-  })
-
-  request.on( 'end', function() {
-    console.log( JSON.parse( dataString ) )
-
-    // ... do something with the data here!!!
-
-    response.writeHead( 200, "OK", {'Content-Type': 'text/plain' })
-    response.end()
-  })
-}
-
-const sendFile = function( response, filename ) {
-   const type = mime.getType( filename ) 
+};
 
-   fs.readFile( filename, function( err, content ) {
+let dataString = [];
+const handlePost = function(request, response) {
 
-     // if the error = null, then we've loaded the file successfully
-     if( err === null ) {
+  request.on("data", function(data) {
+    dataString.push(JSON.parse(data));
 
-       // status code: https://httpstatuses.com
-       response.writeHeader( 200, { 'Content-Type': type })
-       response.end( content )
+  });
 
-     }else{
+  request.on("end", function() {
+    //console.log(JSON.parse(dataString));
 
-       // file not found, error code 404
-       response.writeHeader( 404 )
-       response.end( '404 Error: File Not Found' )
-
-     }
-   })
-}
+    // ... do something with the data here!!!
 
-server.listen( process.env.PORT || port )
+    response.writeHead(200, "OK", { "Content-Type": "text/plain" });
+    response.end(JSON.stringify(dataString));
+
+  });
+};
+
+const sendFile = function(response, filename) {
+  const type = mime.getType(filename);
+
+  fs.readFile(filename, function(err, content) {
+    // if the error = null, then we've loaded the file successfully
+    if (err === null) {
+      // status code: https://httpstatuses.com
+      response.writeHeader(200, { "Content-Type": type });
+      response.end(content);
+    } else {
+      // file not found, error code 404
+      response.writeHeader(404);
+      response.end("404 Error: File Not Found");
+    }
+  });
+};
+
+server.listen(process.env.PORT || port);
diff --git a/shrinkwrap.yaml b/shrinkwrap.yaml
@@ -0,0 +1,15 @@
+dependencies:
+  mime: 2.4.6
+packages:
+  /mime/2.4.6:
+    dev: false
+    engines:
+      node: '>=4.0.0'
+    hasBin: true
+    resolution:
+      integrity: sha512-RZKhC3EmpBchfTGBVb8fb+RL2cWyw/32lshnsETttkBAyAUXSGHxbEJWWRXc751DrIxG1q04b8QwMbAwkRPpUA==
+registry: 'https://registry.npmjs.org/'
+shrinkwrapMinorVersion: 9
+shrinkwrapVersion: 3
+specifiers:
+  mime: ^2.4.4