ClaytonWWilson/CS307-Team24
1
0
Fork 0
mirror of https://github.com/ClaytonWWilson/CS307-Team24.git synced 2025-12-15 18:08:46 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Merge branch 'master' into finalfix

Browse Source
This commit is contained in:
Leon Liang 2019-12-05 17:25:19 -05:00 committed by GitHub
commit aad9dc0273
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 166 additions and 101 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
functions/handlers/post.js
View File

@ -56,7 +56,7 @@ exports.getallPostsforUser = (req, res) => {
.catch(function(err) { .catch(function(err) {
return res return res
.status(500) .status(500)
.json("Failed to retrieve user's posts from database.", err); .json({message: "Failed to retrieve user's posts from database.", error: err});
}); });
}; };

42
twistter-frontend/src/Writing_Microblogs.js
View File

@ -8,6 +8,7 @@ import TextField from '@material-ui/core/TextField';
// import Typography from '@material-ui/core/Typography'; // import Typography from '@material-ui/core/Typography';
import Button from '@material-ui/core/Button'; import Button from '@material-ui/core/Button';
import withStyles from "@material-ui/styles/withStyles"; import withStyles from "@material-ui/styles/withStyles";
import CircularProgress from "@material-ui/core/CircularProgress";
const styles = { const styles = {
container: { container: {
@ -21,6 +22,13 @@ const styles = {
}, },
textField: { textField: {
marginBottom: 15 marginBottom: 15
},
progress: {
position: "absolute"
},
button: {
positon: "relative",
marginBottom: 30
} }
} }
@ -31,7 +39,8 @@ class Writing_Microblogs extends Component {
value: "", value: "",
title: "", title: "",
topics: "", topics: "",
characterCount: 250 characterCount: 250,
loading: false
}; };
this.handleChange = this.handleChange.bind(this); this.handleChange = this.handleChange.bind(this);
@ -56,11 +65,15 @@ class Writing_Microblogs extends Component {
microBlogTitle: this.state.title, microBlogTitle: this.state.title,
microBlogTopics: this.state.topics.split(", ") microBlogTopics: this.state.topics.split(", ")
}; };
this.setState({
loading: true
})
const headers = { const headers = {
headers: { "Content-Type": "application/json" } headers: { "Content-Type": "application/json" }
}; };
axios let postPromise = axios
.post("/putPost", postData, headers) // TODO: add topics .post("/putPost", postData, headers) // TODO: add topics
.then(res => { .then(res => {
// alert("Post was shared successfully!"); // alert("Post was shared successfully!");
@ -71,8 +84,9 @@ class Writing_Microblogs extends Component {
console.error(err); console.error(err);
}); });
console.log(postData.microBlogTopics); console.log(postData.microBlogTopics);
let topicPromises = [];
postData.microBlogTopics.forEach(topic => { postData.microBlogTopics.forEach(topic => {
axios topicPromises.push(axios
.post("/putTopic", { .post("/putTopic", {
following: topic following: topic
}) })
@ -81,10 +95,24 @@ class Writing_Microblogs extends Component {
}) })
.catch(err => { .catch(err => {
console.error(err); console.error(err);
}); })
)
}); });
event.preventDefault(); event.preventDefault();
this.setState({ value: "", title: "", characterCount: 250, topics: "" }); topicPromises.push(postPromise);
Promise.all(topicPromises)
.then(() => {
this.setState({
value: "",
title: "",
characterCount: 250,
topics: "",
loading: false
});
})
.catch((error) => {
console.log(error);
})
} }
handleChangeforPost(event) { handleChangeforPost(event) {
@ -149,12 +177,14 @@ class Writing_Microblogs extends Component {
autoComplete='off' autoComplete='off'
/> />
<Button <Button
className={classes.button}
onClick={this.handleSubmit} onClick={this.handleSubmit}
// disabled={loading} disabled={this.state.loading}
variant="outlined" variant="outlined"
color="primary" color="primary"
> >
Share Post Share Post
{this.state.loading && <CircularProgress size={30} className={classes.progress} />}
</Button> </Button>
</form> </form>
</div> </div>

85
twistter-frontend/src/pages/Home.js
View File

@ -35,12 +35,14 @@ const styles = {
class Home extends Component { class Home extends Component {
state = { state = {
likes: [], likes: [],
loading: false,
following: null, following: null,
topics: null topics: null
}; };
componentDidMount() { componentDidMount() {
axios this.setState({loading: true});
let userPromise = axios
.get("/user") .get("/user")
.then(res => { .then(res => {
this.setState({ this.setState({
@ -50,7 +52,7 @@ class Home extends Component {
}) })
.catch(err => console.log(err)); .catch(err => console.log(err));
axios let postPromise = axios
.get("/getallPosts") .get("/getallPosts")
.then(res => { .then(res => {
// console.log(res.data); // console.log(res.data);
@ -60,6 +62,16 @@ class Home extends Component {
}) })
.catch(err => console.log(err)); .catch(err => console.log(err));
Promise.all([userPromise, postPromise])
.then(() => {
this.setState({
loading: false
})
})
.catch((error) => {
console.log(error);
})
this.props.getLikes(); this.props.getLikes();
} }
@ -175,7 +187,9 @@ class Home extends Component {
<p>Loading post...</p> <p>Loading post...</p>
); );
return authenticated ? ( return (
authenticated ? (
this.state.loading ? (<CircularProgress size={60} style={{marginTop: "300px"}}></CircularProgress>) :
<Grid container> <Grid container>
<Grid item sm={4} xs={8}> <Grid item sm={4} xs={8}>
<Writing_Microblogs /> <Writing_Microblogs />
@ -183,42 +197,39 @@ class Home extends Component {
<Grid item sm={4} xs={8}> <Grid item sm={4} xs={8}>
{postMarkup} {postMarkup}
</Grid> </Grid>
</Grid> </Grid>
) : loading ? ( ) : loading ?
<CircularProgress (<CircularProgress size={60} style={{marginTop: "300px"}}></CircularProgress>)
size={60} :
style={{ marginTop: "300px" }} (
></CircularProgress> <div>
) : ( <div>
<div> <img src={logo} className="app-logo" alt="logo" />
<div> <br/><br/>
<img src={logo} className="app-logo" alt="logo" /> <b>Welcome to Twistter!</b>
<br /> <br/><br/>
<br /> <b>See the most interesting topics people are following right now.</b>
<b>Welcome to Twistter!</b> </div>
<br />
<br />
<b>See the most interesting topics people are following right now.</b>
</div>
<br /> <br />
<br /> <br />
<br /> <br />
<br /> <br />
<div> <div>
<b>Join today or sign in if you already have an account.</b> <b>Join today or sign in if you already have an account.</b>
<br /> <br />
<br /> <br />
<form action="./signup"> <form action="./signup">
<button className="authButtons signup">Sign up</button> <button className="authButtons signup">Sign up</button>
</form> </form>
<br /> <br />
<form action="./login"> <form action="./login">
<button className="authButtons login">Sign in</button> <button className="authButtons login">Sign in</button>
</form> </form>
</div> </div>
</div> </div>
)
); );
} }
} }

102
twistter-frontend/src/pages/directMessages.js
View File

@ -377,7 +377,7 @@ export class directMessages extends Component {
const open = Boolean(this.state.anchorEl); const open = Boolean(this.state.anchorEl);
const id = open ? 'simple-popover' : undefined; const id = open ? 'simple-popover' : undefined;
let dmListMarkup = this.state.dmData ? ( let dmListMarkup = this.state.dmData ? (
this.state.dmData.map((channel) => ( this.state.dmData.map((channel) => (
<Card <Card
onClick={this.handleClickChannel} onClick={this.handleClickChannel}
@ -524,35 +524,35 @@ export class directMessages extends Component {
onChange={this.handleChangeAddDMUsername} onChange={this.handleChangeAddDMUsername}
value={this.state.createDMUsername} value={this.state.createDMUsername}
label="Username" label="Username"
variant="outlined" variant="outlined"
helperText={errors.createDirectMessage} helperText={errors.createDirectMessage}
error={errors.createDirectMessage ? true : false} error={errors.createDirectMessage ? true : false}
style={{ style={{
width: 265, width: 265,
marginRight: 10, marginRight: 10,
marginLeft: 10, marginLeft: 10,
textAlign: 'center', textAlign: 'center',
}} }}
/> />
</Grid> </Grid>
<Grid item> <Grid item>
<Button <Button
className={classes.createButton} className={classes.createButton}
variant="outlined" variant="outlined"
color="primary" color="primary"
onClick={this.handleClickCreate} onClick={this.handleClickCreate}
disabled={ disabled={
creatingDirectMessage || creatingDirectMessage ||
this.state.createDMUsername === "" this.state.createDMUsername === ""
} }
> >
Create Create
{creatingDirectMessage && {creatingDirectMessage &&
<CircularProgress size={30} style={{position: "absolute"}}/> // Won't accept classes style for some reason
// Won't accept classes style for some reason <CircularProgress size={30} style={{position: "absolute"}}/>
} }
</Button> </Button>
</Grid> </Grid>
</Grid> </Grid>
</Grid> </Grid>
<Grid item sm /> <Grid item sm />
@ -572,13 +572,13 @@ export class directMessages extends Component {
<Grid item className={classes.dmItemsUpper} id="dmItemsUpper"> <Grid item className={classes.dmItemsUpper} id="dmItemsUpper">
{dmListMarkup} {dmListMarkup}
</Grid> </Grid>
<Grid item className={classes.dmItemsLower}> <Grid item className={classes.dmItemsLower}>
<Card key="5555" data-key="5555" className={classes.dmCardUnselected}> <Card key="5555" data-key="5555" className={classes.dmCardUnselected}>
<Box className={classes.dmListItemContainer}> <Box className={classes.dmListItemContainer}>
{addDMMarkup} {addDMMarkup}
</Box> </Box>
</Card> </Card>
</Grid> </Grid>
</Grid> </Grid>
</Grid> </Grid>
<Grid item className={classes.messagesGrid} sm> <Grid item className={classes.messagesGrid} sm>
@ -596,30 +596,30 @@ export class directMessages extends Component {
variant="outlined" variant="outlined"
multiline multiline
rows={2} rows={2}
margin="dense" margin="dense"
value={this.state.drafts[this.state.selectedChannel.dmId] ? this.state.drafts[this.state.selectedChannel.dmId] : ""} value={this.state.drafts[this.state.selectedChannel.dmId] ? this.state.drafts[this.state.selectedChannel.dmId] : ""}
onChange={this.handleChangeMessage} onChange={this.handleChangeMessage}
/> />
<Fab <Fab
className={classes.messageButton} className={classes.messageButton}
onClick={this.handleClickSend} onClick={this.handleClickSend}
disabled={ disabled={
sendingDirectMessage || sendingDirectMessage ||
!this.state.drafts[this.state.selectedChannel.dmId] || !this.state.drafts[this.state.selectedChannel.dmId] ||
this.state.drafts[this.state.selectedChannel.dmId] === "" this.state.drafts[this.state.selectedChannel.dmId] === ""
} }
> >
<SendIcon style={{ color: '#FFFFFF' }} /> <SendIcon style={{ color: '#FFFFFF' }} />
{ {
sendingDirectMessage && sendingDirectMessage &&
<CircularProgress size={30} style={{position: "absolute"}}/> <CircularProgress size={30} style={{position: "absolute"}}/>
// Won't accept classes style for some reason // Won't accept classes style for some reason
} }
</Fab> </Fab>
</Box> </Box>
</Card> </Card>
)} )}
{!this.state.hasChannelSelected && {!this.state.hasChannelSelected &&
this.state.dmData && <Typography>Select a DM on the left</Typography>} this.state.dmData && <Typography>Select a DM on the left</Typography>}
</Box> </Box>
</Grid> </Grid>

18
twistter-frontend/src/pages/otherUser.js
View File

@ -22,6 +22,7 @@ import AddCircle from "@material-ui/icons/AddCircle";
import TextField from "@material-ui/core/TextField"; import TextField from "@material-ui/core/TextField";
import VerifiedIcon from "@material-ui/icons/CheckSharp"; import VerifiedIcon from "@material-ui/icons/CheckSharp";
import DoneIcon from "@material-ui/icons/Done"; import DoneIcon from "@material-ui/icons/Done";
import CircularProgress from "@material-ui/core/CircularProgress";
// component // component
import "../App.css"; import "../App.css";
@ -79,6 +80,7 @@ class user extends Component {
posts: null, posts: null,
myTopics: null, myTopics: null,
followingList: null followingList: null
loading: false
}; };
} }
@ -133,7 +135,8 @@ class user extends Component {
}; };
componentDidMount() { componentDidMount() {
axios this.setState({loading: true});
let otherUserPromise = axios
.post("/getUserDetails", { .post("/getUserDetails", {
handle: this.state.profile handle: this.state.profile
}) })
@ -145,7 +148,7 @@ class user extends Component {
}) })
.catch(err => console.log(err)); .catch(err => console.log(err));
axios let userPromise = axios
.get("/user") .get("/user")
.then(res => { .then(res => {
// console.log(res.data.credentials.following); // console.log(res.data.credentials.following);
@ -165,7 +168,7 @@ class user extends Component {
}) })
.catch(err => console.log(err)); .catch(err => console.log(err));
axios let posts = axios
.post("/getOtherUsersPosts", { .post("/getOtherUsersPosts", {
handle: this.state.profile handle: this.state.profile
}) })
@ -193,6 +196,14 @@ class user extends Component {
.catch(function(err) { .catch(function(err) {
console.log(err); console.log(err);
}); });
Promise.all([otherUserPromise, userPromise, posts])
.then(() => {
this.setState({loading: false});
})
.catch((error) => {
console.log(error);
})
} }
render() { render() {
@ -300,6 +311,7 @@ class user extends Component {
); );
return ( return (
this.state.loading ? <CircularProgress size={60} style={{marginTop: "300px"}}></CircularProgress> :
<Grid container spacing={24}> <Grid container spacing={24}>
<Grid item sm={4} xs={8}> <Grid item sm={4} xs={8}>
{imageMarkup} {imageMarkup}

18
twistter-frontend/src/pages/user.js
View File

@ -13,6 +13,7 @@ import CardMedia from "@material-ui/core/CardMedia";
import CardContent from "@material-ui/core/CardContent"; import CardContent from "@material-ui/core/CardContent";
import Button from "@material-ui/core/Button"; import Button from "@material-ui/core/Button";
import Grid from "@material-ui/core/Grid"; import Grid from "@material-ui/core/Grid";
import CircularProgress from "@material-ui/core/CircularProgress";
import Chip from "@material-ui/core/Chip"; import Chip from "@material-ui/core/Chip";
import Typography from "@material-ui/core/Typography"; import Typography from "@material-ui/core/Typography";
@ -76,7 +77,8 @@ class user extends Component {
profile: null, profile: null,
imageUrl: null, imageUrl: null,
topics: null, topics: null,
newTopic: "" newTopic: "",
loading: false
}; };
} }
@ -127,7 +129,8 @@ class user extends Component {
} }
componentDidMount() { componentDidMount() {
axios this.setState({loading: true})
let userPromise = axios
.get("/user") .get("/user")
.then(res => { .then(res => {
this.setState({ this.setState({
@ -141,7 +144,7 @@ class user extends Component {
}) })
.catch(err => console.log(err)); .catch(err => console.log(err));
axios let postsPromise = axios
.get("/getallPostsforUser") .get("/getallPostsforUser")
.then(res => { .then(res => {
// console.log(res.data); // console.log(res.data);
@ -150,6 +153,14 @@ class user extends Component {
}); });
}) })
.catch(err => console.log(err)); .catch(err => console.log(err));
Promise.all([userPromise, postsPromise])
.then(() => {
this.setState({loading: false});
})
.catch((error) => {
console.log(error)
})
} }
formatDate(dateString) { formatDate(dateString) {
@ -259,6 +270,7 @@ class user extends Component {
) : null; ) : null;
return ( return (
this.state.loading ? <CircularProgress size={60} style={{marginTop: "300px"}}></CircularProgress> :
<div> <div>
{/* <Paper className={classes.paper}> */} {/* <Paper className={classes.paper}> */}
<Grid container direction="column"> <Grid container direction="column">