From 832c46b2936cc6305494211aaea83b100fb94070 Mon Sep 17 00:00:00 2001
From: Clark Reilly <clark.reilly@uconn.edu>
Date: Thu, 7 May 2020 15:47:03 -0400
Subject: [PATCH] profile only displays posts with identical uid, but the
 update function is still not working

---
 final/src/views/Home.vue    | 43 +++++++++++++++++++++++++++++++------
 final/src/views/Profile.vue | 38 +++++++++++++++++++++++++-------
 2 files changed, 67 insertions(+), 14 deletions(-)

diff --git a/final/src/views/Home.vue b/final/src/views/Home.vue
index ddd2ffb..fd6bf20 100644
--- a/final/src/views/Home.vue
+++ b/final/src/views/Home.vue
@@ -1,16 +1,19 @@
 <template>
   <div class="home">
-
+    <!-- make the post input and refresh divs here -->
+    
     <div id="postList">
       <div class="postDiv" v-for="(post, name, index) in posts" :key=index>
         <img v-if="post.hasOwnProperty('img')" class="postPFP" v-bind:src="post.img">
         <img v-if="!post.hasOwnProperty('img')" class="postPFP" src="../assets/ph-pfp.png">
-        {{ post.username }}
+        <span v-if="post.hasOwnProperty('username')">{{ post.username }}</span>
+        <span v-if="!post.hasOwnProperty('username')">[ERROR: USERNAME NOT FOUND]</span>
         <br>
-        {{ post.message }}</div>
+        {{ post.message }}
+      </div>
     </div>
-   
-    <button id="updateButton" @click="getPosts()">update</button>
+   <!-- make a back-to-top button here -->
+    <button id="updateButton" @click="clearPosts()">update</button>
 
   </div>
   
@@ -33,6 +36,16 @@ export default {
 
   methods: {
     getPosts(){
+      db.collection("posts").get().then(querySnapshot => {
+          querySnapshot.forEach( doc => {
+              // doc.data() is never undefined for query doc snapshots
+              /*console.log(doc.id, " => ", doc.data());*/
+              this.posts.push(doc.data())
+          });
+      }); 
+    },
+
+    getMyPosts(){
       db.collection("posts").get().then(querySnapshot => {
           querySnapshot.forEach( doc => {
               // doc.data() is never undefined for query doc snapshots
@@ -40,6 +53,24 @@ export default {
               this.posts.push(doc.data())
           });
       }); 
+    },
+
+
+    // this currently isn't a "clear posts" function, but proves I can grab all posts and do something to them
+    clearPosts(){
+      document.querySelectorAll('.postDiv').forEach( div => {
+        div.style.backgroundColor = "red";
+      })
+    },
+
+    getPostsTest(){
+      db.collection("posts").onSnapshot((snapshot) => {
+        snapshot.docChanges().forEach( change => {
+            if (change.type === "added") {
+                this.posts.push(change.doc.data());
+            }
+        });
+    });
     }
 
   },
@@ -49,7 +80,7 @@ export default {
     // console.log(db);
 
     this.getPosts();
-
+    this.getPostsTest();
   }
 };
 </script>
diff --git a/final/src/views/Profile.vue b/final/src/views/Profile.vue
index f69d544..484e555 100644
--- a/final/src/views/Profile.vue
+++ b/final/src/views/Profile.vue
@@ -1,11 +1,16 @@
 <template>
   <div class="about">
     <h1>This is the profile page</h1>
-    <div>
-      {{ $store.state.user }}
-
+     <div id="postList">
+      <div class="postDiv" v-for="(post, name, index) in posts" :key=index>
+        <img v-if="post.hasOwnProperty('img')" class="postPFP" v-bind:src="post.img">
+        <img v-if="!post.hasOwnProperty('img')" class="postPFP" src="../assets/ph-pfp.png">
+        <span v-if="post.hasOwnProperty('username')">{{ post.username }}</span>
+        <span v-if="!post.hasOwnProperty('username')">[ERROR: USERNAME NOT FOUND]</span>
+        <br>
+        {{ post.message }}
+      </div>
     </div>
-    <img v-bind:src="$store.state.user.photoURL">
   </div>
 
 </template>
@@ -19,13 +24,20 @@ export default {
   name: 'profile',
   data: function(){
     return {
-
+      posts: []
     }
   },
 
 
   methods: {
-
+    getMyPosts(){
+      db.collection("posts").where("uid", "==", this.$store.state.user.uid).get().then(querySnapshot => {
+          querySnapshot.forEach( doc => {
+              // doc.data() is never undefined for query doc snapshots
+              this.posts.push(doc.data())
+          });
+      }); 
+    }
 
   },
 
@@ -33,7 +45,17 @@ export default {
   mounted() {
     // console.log(db);
     console.log(this.$store.state.user.photoURL)
-
+    this.getMyPosts();
   }
 };
-</script>
\ No newline at end of file
+</script>
+
+<!-- getPosts(){
+      db.collection("posts").get().then(querySnapshot => {
+          querySnapshot.forEach( doc => {
+              // doc.data() is never undefined for query doc snapshots
+              console.log(doc.id, " => ", doc.data());
+              this.posts.push(doc.data())
+          });
+      }); 
+    } -->
\ No newline at end of file