1
00:00:00,360 --> 00:00:05,850
Welcome back in this lesson we're continuing with the camp and in particular we're going to focus on

2
00:00:05,850 --> 00:00:07,990
the user model that we just created.

3
00:00:08,160 --> 00:00:13,170
And the comment model and associating the two so that when you create a new comment it's automatically

4
00:00:13,170 --> 00:00:18,230
associated with the current user with your user ID and your username.

5
00:00:18,240 --> 00:00:22,550
So I'll show you what I mean before I do that I'll highlight that I'm in V8 now.

6
00:00:22,590 --> 00:00:27,640
So a new version we will be making pretty substantial changes to some of the models into the database

7
00:00:27,720 --> 00:00:29,100
so it warrants a new version.

8
00:00:29,100 --> 00:00:30,870
So V8 if you want to follow along.

9
00:00:31,230 --> 00:00:38,280
And we're going to run the server to start and then I'm going to go to slash campgrounds and first I'll

10
00:00:38,280 --> 00:00:46,070
sign up with a new account and this account will be potato and password will be password again.

11
00:00:47,070 --> 00:00:49,410
Sign up.

12
00:00:49,800 --> 00:00:57,000
Now let's take a look at Desert Mesa and go to add a new comment and we get this for in our goal is

13
00:00:57,000 --> 00:01:02,410
to have this Arthur field go away so that we can automatically know the author's name and save that

14
00:01:02,410 --> 00:01:05,740
to the new comment without the user having to manually specify it.

15
00:01:06,030 --> 00:01:14,190
So we'll just have a comment be potato Taito potato and the other is potato.

16
00:01:14,250 --> 00:01:14,820
All right.

17
00:01:14,860 --> 00:01:17,670
Submit and receive this.

18
00:01:17,790 --> 00:01:19,350
And we want to see this.

19
00:01:19,380 --> 00:01:24,150
It should look exactly the same except the user shouldn't have to actually enter that username manually

20
00:01:24,150 --> 00:01:24,770
.

21
00:01:24,990 --> 00:01:30,900
To do that the first thing you need to do is on the comment model we need to add some fields in where

22
00:01:30,900 --> 00:01:34,440
we can store the user's ID and the users name.

23
00:01:34,440 --> 00:01:43,840
So let's stop the server and will open up the comment model so that models slash comment that yes and

24
00:01:43,860 --> 00:01:50,160
inside of here under author it's no longer just going to be a string actually going to be an object

25
00:01:50,820 --> 00:01:53,800
and an author will have two things in ID.

26
00:01:54,000 --> 00:02:00,870
And then also a user name what we could actually do is store the entire author in there.

27
00:02:00,870 --> 00:02:05,130
So it looks like this one we have a new user.

28
00:02:05,130 --> 00:02:13,750
Remember the user account looks like user name potato and then it has underscore or ID some ID.

29
00:02:13,950 --> 00:02:20,100
But there's also the hash which is that crazy long string and then the salt.

30
00:02:20,370 --> 00:02:24,230
And we don't want to store all of that data inside of each comment.

31
00:02:24,390 --> 00:02:29,880
Rather than doing that we'll just take the important pieces which are the ID of the user that created

32
00:02:29,880 --> 00:02:33,240
the comment and the user name of that user.

33
00:02:33,240 --> 00:02:38,470
We could just store the ID and then use that ID to look up the correct author and then grab the user

34
00:02:38,470 --> 00:02:39,460
name from there.

35
00:02:39,720 --> 00:02:44,580
But because we'll be printing out the name pretty often that's the whole point of this is that we loop

36
00:02:44,580 --> 00:02:48,410
through and we print out each comment text but also the author.

37
00:02:48,570 --> 00:02:53,220
It wouldn't be very efficient if we had to look up the correct author every time by taking an author

38
00:02:53,220 --> 00:02:56,790
ID then finding that author and then finding it username.

39
00:02:56,880 --> 00:03:01,500
So instead we're just going to store the data right here inside the comment which is something that

40
00:03:01,500 --> 00:03:05,490
we could only do with a non-relational database like Mongo.

41
00:03:05,910 --> 00:03:17,490
So Id is going to be another object as has a type which is mongoose that schema types that object id

42
00:03:17,880 --> 00:03:19,780
which is just like we've done before.

43
00:03:19,830 --> 00:03:27,680
If we take a look at the campground where we have comments where a type is Mangu schema types of KDE

44
00:03:28,110 --> 00:03:34,020
and then we need a ref and ref refers to the model that we're going to refer to with this object id

45
00:03:34,380 --> 00:03:39,210
which is a user and then user name will just be a string.

46
00:03:39,850 --> 00:03:46,710
And we need to make sure we have our comma in here and save and we should be good to go before we move

47
00:03:46,710 --> 00:03:47,940
on any further.

48
00:03:47,940 --> 00:03:53,340
I'm actually going to stop the seeds in my database so I'm going to open the seeds file and I'm going

49
00:03:53,340 --> 00:03:55,950
to comment out quite a bit of code for now.

50
00:03:56,100 --> 00:04:01,490
So we will remove all but then I'm not going to create campgrounds.

51
00:04:01,680 --> 00:04:03,210
We'll do it manually to start.

52
00:04:03,450 --> 00:04:05,630
So let's make sure we come out the right code.

53
00:04:05,910 --> 00:04:13,830
So we have CGP and campground out remove everything else we'll get rid of just commented out because

54
00:04:13,830 --> 00:04:20,010
comments will now have a user ID and an author name or user name and our code and here doesn't account

55
00:04:20,010 --> 00:04:20,670
for that.

56
00:04:20,670 --> 00:04:22,800
So basically I just want a blank slate to start from.

57
00:04:22,800 --> 00:04:25,670
So I'm not going to see the database but I will run it.

58
00:04:25,710 --> 00:04:31,560
And what this will do is remove everything from our database and I'll just do that one time right now

59
00:04:33,300 --> 00:04:39,700
and if I restart and then go back here I have to start the server again.

60
00:04:39,750 --> 00:04:45,820
We should see there are no campgrounds there you go OK.

61
00:04:46,190 --> 00:04:53,400
So now I will uncomment everything and save and then I'll go back to my apt Yes and just remove the

62
00:04:53,390 --> 00:04:55,390
line where we're calling seed.

63
00:04:55,940 --> 00:05:00,330
So I add a comment here seed database.

64
00:05:00,500 --> 00:05:05,040
And for now and I'll actually do that on the same line.

65
00:05:05,370 --> 00:05:06,210
See the database.

66
00:05:06,200 --> 00:05:09,820
And for now we're going to comment that out we're not going to see the database.

67
00:05:10,010 --> 00:05:15,520
We'll manually go in and add a new comment to a new post and create users.

68
00:05:16,130 --> 00:05:22,430
Ok so now that we have that out of the way let's focus on the logic of associating the author and the

69
00:05:22,440 --> 00:05:25,710
ID and username of that author with the comments.

70
00:05:25,760 --> 00:05:31,280
So we need to go to the code where we're creating the comment which is instead of routes and instead

71
00:05:31,280 --> 00:05:32,060
of comments.

72
00:05:32,160 --> 00:05:35,100
Yes and it's right here.

73
00:05:35,560 --> 00:05:41,180
The comments create in this code is responsible for first finding the correct campground.

74
00:05:41,450 --> 00:05:44,070
Or using that ID in the route.

75
00:05:44,060 --> 00:05:50,240
And then once we find that campground then creating a comment and then pushing that comment into the

76
00:05:50,250 --> 00:05:56,000
campground then saving the campground what we'll do is before we actually push the comment into the

77
00:05:56,030 --> 00:06:06,800
campground into the comments array we're going to add username and ID to comments and then we'll save

78
00:06:06,990 --> 00:06:08,360
comment.

79
00:06:08,370 --> 00:06:14,000
So it's actually pretty easy now that we have our data structure set up all we need to do is figure

80
00:06:14,000 --> 00:06:17,950
out how we get the current users the user name and the current user's ID.

81
00:06:17,960 --> 00:06:25,810
And fortunately we've seen that before it's request that user and we can count on there being a request

82
00:06:25,810 --> 00:06:31,610
out user because if we get to this code the only way we get here is if the user is locked in.

83
00:06:31,680 --> 00:06:37,340
And that's because we have this is locked in Middleware where if there isn't a user we'd redirect back

84
00:06:37,340 --> 00:06:38,500
to slash log in.

85
00:06:38,810 --> 00:06:41,240
So this ensures that someone is logged in.

86
00:06:41,490 --> 00:06:44,260
So why don't we just do a simple cancel dot log.

87
00:06:44,730 --> 00:06:53,420
And we want requests that user that username to start and let's do it like this new comment username

88
00:06:53,970 --> 00:06:55,030
will be.

89
00:06:55,480 --> 00:07:02,420
And just print that out request that user that username and let's start the server up and we will have

90
00:07:02,420 --> 00:07:06,570
to go in and add a new post into our database.

91
00:07:06,620 --> 00:07:14,000
The first thing I'll do is log in as potato with my password which is password and then that takes me

92
00:07:14,000 --> 00:07:15,290
to slash campgrounds.

93
00:07:15,290 --> 00:07:17,540
Now it's at a new campground.

94
00:07:17,580 --> 00:07:20,480
They have a Creative Commons image that I'm just going to use here.

95
00:07:20,610 --> 00:07:22,510
But feel free to use any image of course.

96
00:07:22,760 --> 00:07:24,220
And then I'll add a name.

97
00:07:24,240 --> 00:07:30,200
Let's just call it crazy insane you know full mountains.

98
00:07:30,200 --> 00:07:35,300
And then for that description I have some more I'm ipsum that I'll paste in just some placeholder text

99
00:07:35,300 --> 00:07:35,840
.

100
00:07:35,850 --> 00:07:36,870
Let's click on submit.

101
00:07:36,920 --> 00:07:38,000
Make new campground.

102
00:07:38,240 --> 00:07:41,360
Now let's go to more info and try and add a comment.

103
00:07:41,390 --> 00:07:43,690
You can see I'm signed in as potato.

104
00:07:43,910 --> 00:07:45,420
Let's add a new comment.

105
00:07:45,500 --> 00:07:46,790
Fill up some text here.

106
00:07:46,980 --> 00:07:49,760
I'll just do more Lorem Ipsum some of that.

107
00:07:49,760 --> 00:07:51,460
They're great.

108
00:07:51,560 --> 00:07:56,630
And then I'll leave the author blank just to show you that we can still get potato even if I don't type

109
00:07:56,630 --> 00:07:57,300
it here.

110
00:07:57,320 --> 00:07:59,070
Then we click submit.

111
00:07:59,060 --> 00:08:00,920
Now let's look at what was counted out loud.

112
00:08:01,130 --> 00:08:04,640
So I will need to scroll up right here.

113
00:08:04,670 --> 00:08:08,230
New comments you name will be potato.

114
00:08:08,300 --> 00:08:08,830
Great.

115
00:08:08,850 --> 00:08:09,820
So that's request.

116
00:08:09,830 --> 00:08:11,320
Use your username.

117
00:08:11,490 --> 00:08:17,040
And there's also request that user underscore ID and I won't go through Konsole like that again.

118
00:08:17,020 --> 00:08:18,370
But trust me it's there.

119
00:08:18,380 --> 00:08:24,440
We've seen it in previous videos request that user contained those two pieces of information I.D. and

120
00:08:24,440 --> 00:08:25,260
the username.

121
00:08:25,640 --> 00:08:33,850
So before we go any further let's go and remove this field this author field from the form so that's

122
00:08:33,870 --> 00:08:36,150
inside of the comment new.

123
00:08:36,170 --> 00:08:39,430
So rather than stopping my server I'll just use my mouse to find it.

124
00:08:39,440 --> 00:08:46,180
So that's views comments new and we'll just get rid of this entire thing right here.

125
00:08:46,280 --> 00:08:49,070
So we no longer have author.

126
00:08:49,110 --> 00:08:51,390
It's just text.

127
00:08:51,500 --> 00:08:53,570
And then we'll follow the text and hit submit.

128
00:08:53,970 --> 00:08:58,370
And that will then send our data here we'll create a new comment.

129
00:08:58,380 --> 00:09:04,620
To use request a user username and Dot I.D. to actually associate the user with the comment.

130
00:09:04,760 --> 00:09:06,920
So to add the user name and ID to the comment.

131
00:09:07,110 --> 00:09:16,370
Let's start with the ID just right comment that author ID equals request user dot underscore ID and

132
00:09:16,380 --> 00:09:20,300
common dot author dot ID is because of the way our model was set up.

133
00:09:20,370 --> 00:09:24,330
So a comet has an author and an author has an ID and a username.

134
00:09:24,770 --> 00:09:27,300
So let's go back now comment.

135
00:09:27,360 --> 00:09:37,130
Author ID request that user ID and comment author dot username equals requested user dot username just

136
00:09:37,130 --> 00:09:39,600
like that and all save.

137
00:09:40,010 --> 00:09:46,320
And then what we also have to do get rid of this line is actually save the comment so comment that save

138
00:09:46,320 --> 00:09:47,000
.

139
00:09:47,550 --> 00:09:52,010
And then we'll push it into the comments on the campground and then we'll save the whole campground

140
00:09:52,020 --> 00:09:52,140
.

141
00:09:52,350 --> 00:09:53,550
And then we'll redirect.

142
00:09:53,690 --> 00:09:59,700
And why don't we before we do that let's just do a concert log comment so you can see what it looks

143
00:09:59,690 --> 00:10:02,480
like at the end there before we redirect.

144
00:10:02,820 --> 00:10:09,040
OK restart the server Now let's go back.

145
00:10:09,090 --> 00:10:09,770
We'll have to

146
00:10:12,620 --> 00:10:13,660
refresh the page.

147
00:10:13,740 --> 00:10:15,300
It will have to log in again.

148
00:10:15,370 --> 00:10:21,210
So potato password is password log in.

149
00:10:22,220 --> 00:10:29,220
Let's go and add a new comment and the comment here will just be blah blah blah.

150
00:10:29,310 --> 00:10:31,260
Submit.

151
00:10:31,350 --> 00:10:31,990
All right.

152
00:10:32,340 --> 00:10:34,590
Let's take a look at what was canceled out logged.

153
00:10:34,700 --> 00:10:39,850
So it's hard to see because we have some other council that logs but it's rate here.

154
00:10:40,910 --> 00:10:43,520
So we have text which is blah blah blah.

155
00:10:43,670 --> 00:10:50,070
We have the common ID itself and then we have author which has an I.D. and a user name potato.

156
00:10:50,260 --> 00:10:51,030
Great.

157
00:10:51,060 --> 00:10:55,080
Now the last thing we want to do is actually display the user name here.

158
00:10:55,190 --> 00:11:01,130
What we're doing now is displaying the entire user because all that we had was comment dot author and

159
00:11:01,130 --> 00:11:02,970
this is on the show template.

160
00:11:02,960 --> 00:11:10,550
So let's open up the show template for campground and I'll show you what I'm talking about down here

161
00:11:11,030 --> 00:11:12,260
we're printing comment.

162
00:11:12,300 --> 00:11:15,820
Author and that's referring to this entire thing.

163
00:11:15,830 --> 00:11:20,550
It has an I.D. and a user name we want comment that author dot username.

164
00:11:20,660 --> 00:11:25,620
So that's an easy fix dot user name here and save.

165
00:11:26,120 --> 00:11:33,860
Now let's stop the server restarted and then we go back and can refresh the page and you'll see that

166
00:11:33,870 --> 00:11:35,420
we have a potato here.

167
00:11:35,900 --> 00:11:40,250
This first one we didn't create correctly where we didn't actually have that code set up yet.

168
00:11:40,250 --> 00:11:44,310
So it has an empty author username but this one is working just fine.

169
00:11:44,340 --> 00:11:51,150
Let's add one more under a different account and I'll call this one tomato and the password is also

170
00:11:51,140 --> 00:11:52,700
password.

171
00:11:52,700 --> 00:11:54,890
Sign up.

172
00:11:54,920 --> 00:12:00,350
Let's go at a comment and this will just be HA HA HA.

173
00:12:01,130 --> 00:12:03,800
Submit and there we go.

174
00:12:03,920 --> 00:12:06,190
Automatically says the username tomato.

175
00:12:06,300 --> 00:12:09,850
We didn't have to have the user enter that manually as always.

176
00:12:09,870 --> 00:12:12,950
I'll end this video with a quick recap of everything we did.

177
00:12:12,950 --> 00:12:17,420
We started by going to comment model and adding in an author field.

178
00:12:17,450 --> 00:12:23,700
We already had author those string but adding an author is an object that has two properties ID and

179
00:12:23,810 --> 00:12:31,550
username and ID is a reference to a user model ID and username is just the string name of the current

180
00:12:31,560 --> 00:12:32,440
user.

181
00:12:32,450 --> 00:12:36,160
So we set that up and then we need it to go into our comments route.

182
00:12:36,440 --> 00:12:42,070
And it was pretty simple when it comments created we use requests that user ID and request that user

183
00:12:42,180 --> 00:12:45,940
username and just plug those right in to comment author.

184
00:12:45,990 --> 00:12:48,660
And then we saved the comment and that's all we had to do.

185
00:12:48,750 --> 00:12:54,260
And the very last thing was making sure we displayed a comment that authored user name not just comment

186
00:12:54,260 --> 00:12:55,570
that author.

187
00:12:55,830 --> 00:12:56,360
Awesome.

188
00:12:56,370 --> 00:12:57,950
So this is really starting to come together.

189
00:12:57,950 --> 00:13:02,800
If you take a look at how far we've come we still have a ways to go with some of the styling.

190
00:13:02,820 --> 00:13:06,770
We have a little bit more logic to do but we've really covered a lot so far with the camp