SHARE
TWEET

Untitled

a guest Apr 23rd, 2019 72 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. import React, { Component } from 'react';
  2. import fire from './config/Fire';
  3.  
  4. class PostView extends Component{
  5.     constructor(props){
  6.         super(props);
  7.         this.state = {
  8.             title: props.selected_title,
  9.             author: "",
  10.             category: "",
  11.             comments: [],
  12.             date: "",
  13.             post_text: "",
  14.             views: -1,
  15.             loaded: false,
  16.             viewsUpdated:false,
  17.             categoryViews:-1
  18.         }
  19.     }
  20.  
  21.     loadPost = () => {
  22.         let x = this;
  23.         fire.firestore().collection("posts").doc(x.state.title).get().then(function(doc){
  24.             let author = doc.data().author_username;
  25.             let category = doc.data().category;
  26.             let comments = doc.data().comments;
  27.             let date = doc.data().date;
  28.             let post_text = doc.data().post_text;
  29.             let views = doc.data().views;
  30.  
  31.             x.setState({
  32.                 author: author,
  33.                 category: category,
  34.                 comments: comments,
  35.                 date: date,
  36.                 post_text: post_text,
  37.                 views: views,
  38.                
  39.             });
  40.         });
  41.         if(this.state.category !== ""){
  42.             let x = this;
  43.             fire.firestore().collection("categories").doc(this.state.category).get().then(function(doc){
  44.                 let categoryViews = doc.data().totalviews;
  45.                 x.setState({
  46.                     categoryViews:categoryViews,
  47.                     loaded: true
  48.                 })
  49.             });
  50.         }
  51.     }
  52.  
  53.     //Helper function called in displayPost()
  54.     displayComments = (commentsMap) =>{
  55.         commentsMap.map(i =>{
  56.             return <li>{i}</li>
  57.         })
  58.     }
  59.  
  60.     displayPost = () =>{
  61.         let commentsMap = [];
  62.         for(let i=0; i<this.state.comments.length; i=i+2){
  63.             commentsMap[i/2] = this.state.comments[i] + ": " + this.state.comments[i+1];
  64.         }
  65.         return (
  66.             <div>
  67.                 <p>By: {this.state.author}</p>
  68.                 <p>Category: {this.state.category}</p>
  69.                 <p>Date: {this.state.date}</p>
  70.                 <p>Views: {this.state.views}</p>
  71.                 <h3>Post</h3>
  72.                 <br/>
  73.                 <p>{this.state.post_text}</p>
  74.                 <br/><br/>
  75.                 <p>Comments: </p>
  76.                 {this.displayComments(commentsMap)}
  77.             </div>
  78.         )
  79.     }
  80.  
  81.     goBack = () =>{
  82.         this.props.updateDisplayPosts(this.state.title);
  83.     }
  84.  
  85.     incrementViews = () =>{
  86.         let incrementViews = this.state.views + 1;
  87.         this.setState({views:incrementViews});
  88.         let postRef = fire.firestore().collection("posts").doc(this.state.title);
  89.         postRef.set({
  90.             author_username:x.state.author,
  91.             category: x.state.category,
  92.             comments:x.state.comments,
  93.             date:x.state.date,
  94.             post_text:x.state.post_text,
  95.             views:incrementViews
  96.         });
  97.         let incrementCategoryViews = this.state.categoryViews + 1;
  98.         this.setState({categoryViews:incrementCategoryViews});
  99.         let categoryRef = fire.firestore().collection("categories").doc(this.state.category);
  100.         categoryRef.set({
  101.             totalviews:incrementCategoryViews
  102.         });
  103.         this.setState({viewsUpdated:true});
  104.  
  105.  
  106.     }
  107.  
  108.     render(){
  109.         return(
  110.             <div>
  111.                 <h2>{this.state.title}</h2>
  112.                 <button onClick = {this.goBack}>Back</button>
  113.                 {this.loadPost()}
  114.                 {this.state.loaded ? this.displayPost() : null}
  115.                 {(!this.state.viewsUpdated && this.state.loaded) ? null : this.incrementViews()}
  116.  
  117.             </div>
  118.         )
  119.     }
  120. }
  121.  
  122. export default PostView;
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top