Pushing for commit

.vscode/launch.json

@@ -0,0 +1,17 @@
+{
+    // Use IntelliSense to learn about possible attributes.
+    // Hover to view descriptions of existing attributes.
+    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
+    "version": "0.2.0",
+    "configurations": [
+        {
+            "type": "node",
+            "request": "launch",
+            "name": "Launch Program",
+            "skipFiles": [
+                "<node_internals>/**"
+            ],
+            "program": "${workspaceFolder}\\src\\App.js"
+        }
+    ]
+}

src/App.js

@@ -7,19 +7,34 @@ import 'bootstrap/dist/css/bootstrap.min.css';
 import Moment from 'moment';
 
 import firebase from "./firebase.js"
-import signInWithGoogle from "./firebase.js"
-import testF from "./firebase.js"
 
 export default class App extends Component {
   constructor(props) {
     super(props);
+    const initRef = firebase.database().ref("fasts");
+    let pastFastsObj;
+    initRef.once("value").then(function (snapshot) {
+      pastFastsObj = snapshot.val();
+    })
+
     this.state = {
       pastFasts: [],
       consecutiveFasts: 0,
       numOfBadges: 0,
-      fastJustCompleted: false
+      fastJustCompleted: false,
+      fastListRef: initRef
+    }
 
+  }
+
+  convertToArray(obj) {
+    let new_arr = [];
+    for (var key in Object.keys(obj)) {
+      new_arr.push(obj.key);
     }
+    console.log("converting " + obj)
+    console.log("did stuff " + new_arr)
+    return new_arr
   }
 
   toggleJustCompleted = () => {
@@ -59,6 +74,8 @@ export default class App extends Component {
     } else {
       this.setState({ fastJustCompleted: false })
     }
+
+    this.state.fastListRef.set(this.state.pastFasts)
   }
 
   toggleEdit = (fastToEdit) => {
@@ -97,6 +114,7 @@ export default class App extends Component {
       return ({ pastFasts: newPastFasts });
     });
 
+    this.state.fastListRef.set(this.state.pastFasts)
   }
 
   deleteAll = () => {
@@ -107,19 +125,40 @@ export default class App extends Component {
       })
     }
 
+    this.state.fastListRef.set(this.state.pastFasts)
   }
 
   test = () => {
-    testF();
     // console.log(signInWithGoogle())
-    // console.log("test");
-    // const itemsRef = firebase.database().ref("test");
+    console.log("test");
+    const itemsRef = firebase.database().ref("fasts");
     // const item = {
     //   title: "test",
     //   field: "testfield"
     // }
+    // itemsRef.set("hi");
+    let pastFastsObj;
+    pastFastsObj = itemsRef.once("value").then(function (snapshot) {
+      console.log("list of things: " + snapshot.val());
+      console.log("that was a " + (typeof snapshot.val()));
+      console.log(snapshot.val[0]);
+      return snapshot.val();
+    })
+
+    componentDidMount = () => {
+
+    }
+
+
+    console.log("pulled out " + pastFastsObj);
+    // console.log("testing " + pastFastsObj);
+
+    // const initRef = firebase.database().ref("fasts");
+    // let pastFastsObj = initRef.once("value").then(function (snapshot) {
+    //   return snapshot.val();
+    // })
 
-    // itemsRef.push(item);
+    // this.convertToArray(pastFastsObj);
   }
   render() {
     return (
@@ -137,7 +176,7 @@ export default class App extends Component {
           <BadgePanel consecutiveFasts={this.state.consecutiveFasts} numOfBadges={this.state.numOfBadges} />
         </div>
         <div>
-          <button onClick={() => testF()}>TEST</button>
+          <button onClick={this.test}>TEST</button>
         </div>
 
       </div>);

src/styling/App.css

@@ -23,7 +23,7 @@
   margin-right: 2vw;
   border-radius: 25px;
   outline: lightblue solid 5px;
-  outline-offset: 10px;
+  outline-offset: 1.5vh;
 }
 
 .StatsPanel {
@@ -32,6 +32,8 @@
   flex: 3;
   align-items: center;
   background-color: pink;
+  outline: pink solid 5px;
+  outline-offset: 1.5vh;
   opacity: 0.93;
   margin-top: 5vh;
   margin-bottom: 5vh;
@@ -49,7 +51,7 @@
   padding-right: 10%;
   margin-bottom: 5vh;
   outline: 3px solid red;
-  outline-offset: 8px;
+  outline-offset: 1vh;
   border: 10px solid red;
   margin-top: 3vh;
 }

src/styling/BadgePanel.css

@@ -7,11 +7,12 @@
     align-items: center;
     margin-top: 5vh;
     margin-bottom: 5vh;
-    background-color: lightgreen;
-    outline: lightgreen solid 5px;
-    outline-offset: 10px;
+    background-color: lightgrey;
+    outline: lightgrey solid 5px;
+    outline-offset: 1.5vh;
     padding-left: 0.5vw;
-    opacity: 0.93
+    opacity: 0.93;
+    border-radius: 25px;
   }
 
   .Achievements {

src/styling/StatsPanel.css

@@ -1,7 +1,5 @@
 .StatsPanel {
     display: flex;
-    outline: pink solid 5px;
-    outline-offset: 10px;
     flex: 3;
 }