+ {
+ //inluded Timeline component from Timeline.js}
+ }
diff --git a/client/src/components/SignUp/SignUp.js b/client/src/components/SignUp/SignUp.js
index 924100b..86654e3 100644
--- a/client/src/components/SignUp/SignUp.js
+++ b/client/src/components/SignUp/SignUp.js
@@ -15,17 +15,19 @@ class FormPage extends React.Component {
handleSubmit = () => alert("Thank you for Subscribing!");
onSubmit(e) {
+ //prevents page from refreshing and losing form data
e.preventDefault();
+ //object to hold form fields
let user = {};
user.name = e.target[0].value;
user.email = e.target[1].value;
- //user.timestamp = new Date();
+
console.log("username: ", user.name);
console.log("useremail: ", user.email);
- //console.log("date added: ", user.timestamp);
-
+
+ //axios used to post the information to the database
axios
.post("/signup", user)
.then(res => {
diff --git a/client/src/components/Timeline/Timeline.js b/client/src/components/Timeline/Timeline.js
index f2df3bb..61195d9 100644
--- a/client/src/components/Timeline/Timeline.js
+++ b/client/src/components/Timeline/Timeline.js
@@ -1,83 +1,81 @@
import React from 'react'
import './Timeline.css'
import { VerticalTimeline, VerticalTimelineElement } from 'react-vertical-timeline-component';
-//import 'react-vertical-timeline-component/style.min.css';
-class Timeline extends React.Component {
+class Timeline extends React.Component {
+//timeline component used from react-vertical-timeline
render() {
return (
-
- Tumbler Lock
- 1778
-
- uses pins of varying lengths to prevent the lock from opening without the correct key
-
-
-
- Flat Key
- 1851
-
- key with serrated edges as well as pins of varying lengths within the lock itself
-
-
-
- Electronic Locks
- 1970s
-
- lock or unlock with the assistance of an electrical current
-
-
-
- Smart Lock
- 2014
-
- opens wirelessly with authorized user authentication
-
-
-
- FaceR
- 2020
-
- uses facial recognition as a form of user authentication to unlock
-
-
+
+ Tumbler Lock
+ 1778
+
+ uses pins of varying lengths to prevent the lock from opening without the correct key
+
+
+
+ Flat Key
+ 1851
+
+ key with serrated edges as well as pins of varying lengths within the lock itself
+
+
+
- )
+ >
+ Electronic Locks
+ 1970s
+
+ lock or unlock with the assistance of an electrical current
+
+
+
+ Smart Lock
+ 2014
+
+ opens wirelessly with authorized user authentication
+
+
+
+ FaceR
+ 2020
+
+ uses facial recognition as a form of user authentication to unlock
+
+
+
+ )
}
}
diff --git a/client/src/views/AdminList/AdminList.js b/client/src/views/AdminList/AdminList.js
index eddb130..1bb766f 100644
--- a/client/src/views/AdminList/AdminList.js
+++ b/client/src/views/AdminList/AdminList.js
@@ -12,13 +12,11 @@ class AdminList extends React.Component {
};
}
+ //function gets database information and stores it in the usersCollection array
componentDidMount() {
axios.get('/signup')
.then(res => {
this.setState({ usersCollection: res.data });
- //console.log(res.data[1].created_at);
- //console.log(new Date(res.data[1].created_at).getMonth());
-
})
.catch(function (err) {
console.log(err);
@@ -26,17 +24,18 @@ class AdminList extends React.Component {
}
render() {
+ //array starts with zero users for each month
let usersPerMonth = [0,0,0,0,0,0,0,0,0,0,0,0];
let emails = [];
this.state.usersCollection.forEach((item) => {
console.log(item.name);
emails.push(item.email);
+ //gets the month from the date and iincrements the corresponding month
var index = new Date(item.created_at).getMonth();
usersPerMonth[index]++;
});
- console.log(usersPerMonth);
- console.log(emails);
+ //zingchart bar graph configuration
let graphConfig = {
type: 'bar',
title: {