(chore) added ipfs instructions on login screen

.gitignore

@@ -72,3 +72,4 @@ server/db/index.js
 
 package-lock.json
 *.DS_STORE
+.env

README.md

@@ -1,6 +1,6 @@
 # AbleBox
 
-> AbleBox is a SaaS that enables users to upload their files to the cloud, offering individuals and teams the ability to create and collaborate efficiently.
+> [AbleBox is a SaaS that enables users to upload their files to the cloud, offering individuals and teams the ability to create and collaborate efficiently.](https://glacial-island-66806.herokuapp.com/)
 
 ## Team
 

client/src/components/Login.jsx

@@ -2,6 +2,7 @@ import React from 'react';
 import { Row, Col, Button, Form, FormGroup, FormControl, Label, Input } from 'reactstrap';
 import { withRouter } from 'react-router-dom';
 import $ from 'jquery';
+import ipfsAPI from 'ipfs-api';
 
 class Login extends React.Component {
   constructor(props) {
@@ -10,6 +11,9 @@ class Login extends React.Component {
       email: '',
       password: ''
     };
+
+    this.ipfsApi = ipfsAPI('localhost', '5001');
+
     this.handleChange = this.handleChange.bind(this);
     this.handleSubmit = this.handleSubmit.bind(this);
   }
@@ -53,31 +57,37 @@ console.log(parsedUrl.searchParams); // 123
   render() {
     return (
       <div color="light">
-        <div>
-        <br/>
-          <h2 color="light" className="text-center font-weight-bold" id="signInTitle"> Sign In </h2>
-        </div>
-        <br/>
-          <Form onSubmit={this.handleSubmit}>
-            <Row>
-              <Col xs={{ size: 8, offset: 2 }} sm={{ size: 6, offset: 3 }} md={{ size: 6}} lg={{ size: 6}}>
-                <FormGroup>
-                  <Label for="email">Email Address</Label>
-                  <Input type="text" name="email" placeholder="email address" onChange={this.handleChange}></Input>
-                </FormGroup>
-              </Col>
-            </Row>
-            <Row>
-              <Col xs={{ size: 8, offset: 2 }} sm={{ size: 6, offset: 3 }} md={{ size: 6}} lg={{ size: 6}}>
-                <FormGroup>
-                  <Label for="password">Password</Label>
-                  <Input type="password" name="password" placeholder="password" onChange={this.handleChange}></Input>
-                </FormGroup>
-              </Col>
-            </Row>
-            <br/>
-            <Button className="d-block mx-auto btn-outline-primary" type="submit">Login</Button>
-          </Form>
+          <div>
+          <br/>
+            <h2 color="light" className="text-center font-weight-bold" id="signInTitle"> Sign In </h2>
+          </div>
+          <br/>
+            <Form onSubmit={this.handleSubmit}>
+              <Row>
+                <Col xs={{ size: 8, offset: 2 }} sm={{ size: 6, offset: 3 }} md={{ size: 6}} lg={{ size: 6}}>
+                  <FormGroup>
+                    <Label for="email">Email Address</Label>
+                    <Input type="text" name="email" placeholder="email address" onChange={this.handleChange}></Input>
+                  </FormGroup>
+                </Col>
+              </Row>
+              <Row>
+                <Col xs={{ size: 8, offset: 2 }} sm={{ size: 6, offset: 3 }} md={{ size: 6}} lg={{ size: 6}}>
+                  <FormGroup>
+                    <Label for="password">Password</Label>
+                    <Input type="password" name="password" placeholder="password" onChange={this.handleChange}></Input>
+                  </FormGroup>
+                </Col>
+              </Row>
+              <br/>
+              <Button className="d-block mx-auto btn-outline-primary" type="submit">Login</Button>
+            </Form>
+          { !this.ipfsApi.id() && <footer className="footer">
+          <p className="text-muted">This app utilizes block-chain decentralized file storage. Please <a href="https://ipfs.io/docs/install/">download ipfs</a> and configure with the following command-line heades in order to enable this feature</p>
+          <div className="text-muted">ipfs config --json API.HTTPHeaders.Access-Control-Allow-Origin "[\"http://example.com\"]"</div>
+          <div className="text-muted">ipfs config --json API.HTTPHeaders.Access-Control-Allow-Credentials "[\"true\"]"</div>
+          <div className="text-muted">ipfs config --json API.HTTPHeaders.Access-Control-Allow-Methods "[\"PUT\", \"POST\", \"GET\"]"</div>
+          </footer> }
       </div>
     )
   }

client/src/styles/global.css

@@ -1,5 +1,5 @@
 html * {
-  font-family: 'Open Sans'
+  font-family: 'Open Sans';
 }
 
 h1, h2, h3, h4, h5, h6 {
@@ -21,4 +21,11 @@ a, .btn-outline-primary {
 
 .progress-bar {
   background-color: #25a5ff;
+}
+
+.footer {
+  position: fixed;
+  bottom: 0;
+  width: 100%;
+  font-size: 1vw;
 }

package.json

@@ -6,7 +6,10 @@
   "scripts": {
     "react-dev": "webpack -d --watch",
     "server-dev": "nodemon server/index.js",
-    "ipfs-dev": "ipfs daemon"
+    "ipfs-dev": "ipfs daemon",
+    "start": "node server/index.js",
+    "build": "webpack",
+    "postinstall": "npm run build"
   },
   "repository": {
     "type": "git",

server/db/index.js

@@ -1,11 +1,13 @@
 const mysql = require('mysql');
 
-const connection = mysql.createConnection({
-  host: process.env.MYSQL_HOST || 'localhost',
-  user: process.env.MYSQL_USER || "root",
-  password: process.env.MYSQL_PASSWORD || "",
-  database: "ablebox"
-});
+// const connection = mysql.createConnection({
+//   host: process.env.MYSQL_HOST || 'localhost',
+//   user: process.env.MYSQL_USER || "root",
+//   password: process.env.MYSQL_PASSWORD || "",
+//   database: "ablebox"
+// });
+
+const connection = mysql.createConnection(process.env.JAWSDB_URL || require('../config.js').jawsDB);
 
 connection.connect();
 

server/index.js

@@ -16,7 +16,7 @@ const os = require('os');
 var request = require('request');
 var multer = require('multer');
 var multerS3 = require('multer-s3');
-const ABLEBOX_BUCKET = require('./config.js').bucketName;
+const ABLEBOX_BUCKET = process.env.ABLEBOX_BUCKET || require('./config.js').bucketName;
 const S3_API_VER = '2006-03-01';
 
 var app = express();
@@ -157,7 +157,7 @@ app.post('/launchWriter', (req, res) => {
       console.log('hash: ', hash)
       var url = `https://ipfs.io/ipfs/${hash}`
       console.log('url: ', url)
-      const zoho = require('./config.js').editor.apikey;
+      const zoho = process.env.EDITOR || require('./config.js').editor.apikey;
       request(`https://writer.zoho.com/writer/remotedoc.im?url=${url}&mode=collabedit&apikey=${zoho}`, { json: true }, (err, response, body) => {
         if (err) { return console.log(err); }
         var arr = body.split('=');
@@ -180,7 +180,7 @@ app.post('/launchSheet', (req, res) => {
       console.log('hash: ', hash)
       var url = `https://ipfs.io/ipfs/${hash}`
       console.log('url: ', url)
-      const zoho = require('./config.js').editor.apikey;
+      const zoho = process.env.EDITOR || require('./config.js').editor.apikey;
       request(`https://sheet.zoho.com/sheet/remotedoc.im?url=${url}&mode=collabedit&apikey=${zoho}`, { json: true }, (err, response, body) => {
         if (err) { return console.log(err); }
         console.log('Inside launchSheet body: ', body)

server/models/index.js

@@ -169,6 +169,7 @@ const getKey = (id, cb) => {
 };
 
 const getHash = (id, cb) => {
+  console.log('inside model getHash')
   const query = 'SELECT hash, s3_objectId FROM files WHERE id=?';
 
   db.connection.query(query, id, (err, result, fields) => {

server/schema.sql

@@ -1,8 +1,14 @@
-DROP DATABASE IF EXISTS `ablebox`;
+-- DROP DATABASE IF EXISTS `ablebox`;
 
-CREATE DATABASE `ablebox`;
+-- CREATE DATABASE `ablebox`;
 
-USE `ablebox`;
+-- USE `ablebox`;
+
+DROP DATABASE IF EXISTS `tgskw326mrjqo040`;
+
+CREATE DATABASE `tgskw326mrjqo040`;
+
+USE `tgskw326mrjqo040`;
 
 DROP TABLE IF EXISTS `users`;