Merge branch 'master' of https://github.com/dandiflower/Footprint int…

…o jessica

app.js

@@ -3,14 +3,19 @@ var path = require('path');
 var favicon = require('serve-favicon');
 var logger = require('morgan');
 var bodyParser = require('body-parser');
-
+const PORT = process.env.PORT || 3001;
 var person = require('./routes/person');
 var auth = require('./routes/auth');
 var app = express();
 
+// if (process.env.NODE_ENV === "production") {
+app.use(express.static("client/build"));
+// }
+
+
 var mongoose = require('mongoose');
 mongoose.Promise = require('bluebird');
-mongoose.connect('mongodb://localhost/mern-secure', { promiseLibrary: require('bluebird') })
+mongoose.connect(process.env.MONGODB_URI || 'mongodb://localhost/mern-secure', { promiseLibrary: require('bluebird') })
   .then(() =>  console.log('connection succesful'))
   .catch((err) => console.error(err));
 
@@ -40,4 +45,9 @@ app.use(function(err, req, res, next) {
   res.render('error');
 });
 
+//Start the API server
+app.listen(PORT, function () {
+  console.log(`🌎  ==> API Server now listening on PORT ${PORT}!`);
+});
+
 module.exports = app;

bin/www → bin_bk/www

@@ -7,6 +7,7 @@
 var app = require('../app');
 var debug = require('debug')('mean-app:server');
 var http = require('http');
+var express = require('express');
 
 /**
  * Get port from environment and store in Express.
@@ -15,6 +16,10 @@ var http = require('http');
 var port = normalizePort(process.env.PORT || '3001');
 app.set('port', port);
 
+if (process.env.NODE_ENV === "production") {
+  app.use(express.static("../client/build"));
+}
+
 /**
  * Create HTTP server.
  */

client/src/components/Chart/Chart.css

@@ -0,0 +1,4 @@
+.chartDiv {
+    height: 20px;
+    width: 50px;
+}

client/src/components/Chart/Chart.js

@@ -1,11 +1,50 @@
-import React, {Component} from 'react';
-import {Bar, Line, Pie} from 'react-chartjs-2';
+import React, { Component } from 'react';
+import { HorizontalBar } from 'react-chartjs-2';
+import { BarChart } from 'react-easy-chart';
+// import "./Chart.css";
 
 class Chart extends Component {
-    render(){
-        return(
-            <div className="chart">
-                CHART COMPONENT
+    constructor(props) {
+        super(props)
+        this.state= {
+            data:[]
+        }
+    }
+    render() {
+        const chart = {
+            data: {
+                labels: ['You', 'USA Average'],
+                datasets: [{
+                    label: 'My First dataset',
+                    backgroundColor: 'rgba(255,99,132,0.2)',
+                    borderColor: 'rgba(255,99,132,1)',
+                    borderWidth: 1,
+                    hoverBackgroundColor: 'rgba(255,99,132,0.4)',
+                    hoverBorderColor: 'rgba(255,99,132,1)',
+                    data: [3, 5]
+                }]
+            },
+            options: {
+                maintainAspectRatio: true,
+                xAxes: [{
+                    display: true,
+                    ticks: {
+                        beginAtZero: true,
+                        max: 10
+                    }
+                }]
+            }
+        }
+
+
+        return (
+            <div>
+                <HorizontalBar
+                    data={chart.data}
+                    width={this.props.width}
+                    height={this.props.height}
+                    options={chart.options}
+                />
             </div>
         );
     }

client/src/components/Chart/index.js

@@ -0,0 +1 @@
+export { default } from './Chart';

client/src/components/Quiz/Form.css

@@ -4,4 +4,10 @@ form {
   left: 0%;
   transform: translate(0%, 5%);
   z-index: 100%;
-}
+}
+
+.sliderLabels {
+  position: absolute;
+right: 2px;
+}
+