Everyone welcome back.
Joining me here with those slopes dot com.
And in this lesson we are going to work on logging in the user.
So up till now the only way to kind of log in is to actually create an account.
But I'm getting tired of creating accounts every single time.
So we're going to get this whole logging issue fixed.
All right so what.
What do we need to do.
Well Mr. Postman and I want to show you what what's going on here.
So when we log in a user see here we can log in with this account.
So when I log in what is returned to us is a token came and a user name and we save that into the user
defaults for the user and the off token.
But that doesn't give us the other information we need which is the user name the avatar image the background
color and those other things.
So the only one the only function that we have so far that gives us that information is when we add
a user we get back.
This chase on object right and that contains all of the user infor information that we need.
So we're going to need a new function and the API provides us one.
And that's that function is called the find use or by e-mail function.
All right and so it's this route right here.
So user by e-mail and then at the end you append the user's e-mail and that function actually returns
the exact same Jaison as the add user.
OK.
So that gives us the ID abat color avatar name email and name.
OK.
So this is what we're going to work on.
First we're going to create a new function that can go and fetch that information based just on the
users email that we get after we log in and came.
So we get the users email in off token then we use that e-mail and auto can to get the rest of their
information.
All right.
So let's get to it.
We're going to do this in the off service Dodsworth file sibb and come down here to the bottom and create
a new function.
We're going to call this funk find user by email Ken.
And this one we don't actually need to pass anything into it except for.
We're just going to have our completion handler I say at it's keeping it and completion handler.
All right there we go.
So first off let's go ahead and create our your all going to open.
Run over to utilities.
Where are you.
Here you go.
Constance And our next your health is called Let your underscore user by e-mail that is going to equal
the base you are ill and then you some quotation marks base you are l and then user slash by email slash.
And then over in our office service we're going to append to that the users email but we'll get to that
in a second.
All right.
And we don't actually need a body we don't need to do any lowercase e-mail or anything.
We will need the better header but we have that saved as a.
Or do we.
Oh no we do not.
OK.
So we need we're going to be using this header right here.
And so since we'll be using it in multiple locations Go ahead.
And I'm just going to cut this header.
This is from the create user function.
I'm cutting that header and we're going to jump down here to our hitter's section and I'm going to call
this better.
Header.
OK because this is the header that contains the authorization token going to copy that and then go back
to our service that swift.
And here we're going to replace Heather here with barer header.
OK.
All right.
So now we're back in the Find use or by e-mail we've created a constant for the bearer authorization
token header and now we're going to create our find user by e-mail.
Alamo of our request OK so the Alamo fire dot request and I'm going to use the same one we've been using
this time although we're going to have to do a little bit of string interpolation.
We're going to start with the your L by user or user or by email and then we are going to add onto that
the user e-mail OK remember this function has been called directly after we call the log in a function
right here which saves to our user defaults the user e-mail and the token.
So that's why we have access to those in this function and the type is what is the type.
It might be a.
Actually yes so this function is actually a get.
So this will be our one of our first methods here.
So to do that we just say dupped get the parameters are at.
No we don't have a body to pass this time.
The encoding is Loeb's encoding is based on in coding that default and the headers is our constant Herter
that we just created and the response is a response.
Her response to Jaison.
I'm going to press going to close the side pains to give this little bit more room and clicking here
pressing enter and renaming the data response to just response and then getting rid of that placeholder
for code.
Okeydokey So now we are doing essentially exactly the same thing as we did in the create user function
now.
OK.
So I could actually just copy this entire section here from the create user because the response and
the sun is exactly the same like we saw in Postman.
So here is the response for the add user.
And here it is for the find user by email.
OK.
But we don't not want to violate the dry principle.
Right.
So what we need to do is we're going to go ahead and just extract out all of this right here.
OK.
So I'm going to cut this.
We're going to create a new function called phunk set user info and into that we are going to pass data
type data and then I'm going to paste what we just cut and then right up here where we cut it from I'm
going to call that function that we just created.
I mean to say self set the user info data and we're going to pass into it this data right here that
we're getting from the response.
All right.
So basically all we're doing is if the response error isn't all we're going to extract the data from
the response then we're going to pass that data into this function right here which is essentially the
same thing that we did and our create user account or a function in which we extract the ID color avatar
name email name past those into the function over in our user data service which is used to set the
private privately set variables inside of our user data service.
Okay.
And then appear in our create user we can do a little bit of refactoring here as well.
So I can delete this and say self not set user info data and then Pessin the data right there as well.
All right so we're going to save that.
And now we have a way at any point to as long as we have a valid email to make an API request and retrieve
the information for that for any specific user.
Just by passing in the users e-mail right here.
OK.
So let's let's use that over here in the log in view controller and we haven't actually done much working
here so we're going to need to add a bunch of outlets and do some work here.
All right so the go ahead and do that.
First let's go ahead and add a spinner and just like we did in our create an account we're going to
win our right pane search for activity indicator and I'm going to just drop that in right here and we're
going to say look this attributes inspector said the style to large white and then change the color
to our purple that we've been using then I'm going to select the line constraint right here and say
horizontal and vertical in container and then I'm going to go to the size inspector and select the align
center to Y and enter in minus 100 as a constant.
And that just pop it up for us right there that looks good.
And I'm going to save that and then I'm going to open up our assistant editor by holding option and
clicking on the log and we see right here we go and we are going to need outlets for the username password
and the spinner.
OK so can I create a little section for outlets and the user name label or text field selected and control
dragging.
And I'm going to call this user name text it connect and for the password same thing control drag and
I'm going to save password text to 60.
And finally for the spinner I'm going to control drag and say spinner I'm going to connect those.
And then see here close pressed created Count button looks like we also need a log in.
OK.
So we're going to just put that right here holding log in control dragging and I'm going to say loggin
pressed.
Change that to an action.
And that looks good.
So connect.
All righty then let's go ahead and go back to our standard editor and let's get to work.
So let's jump back into our log NBC and do a little bit of you I said up first just like in our create
a count b c we're going to want to change the placeholder text of of these two text fields.
So let's create a function for setting up the Wii U and I say phunk set up a new hand instead of writing
all that out.
Again I'm just going to go back into our create a count b c and steal a couple of these and I'm going
to copy that and jump back into the log in VC and paste that.
And then just replace looks like that was already the same and replace this one here username and change
the placeholder text to password.
And that should be good.
And then we're going to hide the spinner to start out.
So spinner is hidden is equal to true.
And I'm going to save that.
So now the last thing in our log in the see that we need to do is that well first we need to of course
call the function that we just created.
I always forget that one set up you right here.
All right and then here for the log impressed.
So what's going to happen when we press the button.
We are first going to log the user in with the username and password that they entered then we are going
to go through the off service type instance a logging user where we will log in through the API which
will return to us the users email and the token we save those into service and then we use the find
user by email to go ahead and populate all of our user data service information that we need to do things
like show the avatars images and usernames et cetera.
All right.
So let's go ahead and get started.
First thing we're going to do is say spinner
is hidden is equal to false.
So once we click it the spinner is going to pop up and we're going to start it and the meetings I'm
going to say spinner that is animating or I should say start animating spinner to start animating.
And then we are going to make our then run unwrap our username and password.
So when I say guard let my username is equal to user name
text come on use a name text dot text where and this is just to do a check to make sure that we have
that we don't have an empty string and I say user name text text does not equal an empty string and
it closes right pane.
Else we are just going to return out of this function and then same thing for the password.
So I'm going to copy this and paste it and say Pass is equal to.
Copy this password text that text where past for text or text is not equal to an empty string.
Else return.
OK so then we can call our loggin function.
When I say service instance dot loggin user.
And we're going to pass into it the user name.
So this is actually I mean these poorly.
The user name is not actually the user's name.
The user name is the e-mail.
But that's OK.
This should actually be e-mail.
So I'm going to change this right here to e-mail.
There you go.
All right so e-mail M-Pesa and the e-mail pass.
We're going to pass and pass them for the completion händler press enter to get our going to say success
and get rid of that.
So when I say if success so if the logon is successful then we are going to use our brand new function
that we just created the find user by email.
Ok so when I say off service instance dot fine use or by e-mail completion is access and if it's successful
and if success then we have repopulated our user data service information.
We now have the Avatar color name the user name and email.
OK.
So that's great news.
And so at this point and we've we've logged in what we want to do is we're going to send out our post
notification to let everybody know who cares that we have logged in that the user data has changed.
So that's a good notification center that default dot post and see here.
And this is the one we want right here.
So the name is known to have underscore you the data did change and the object is new.
OK.
Can say that.
And then just a few of the things that we want to do.
We're going to say self that spinner that is
hid in is equal to true self that spinner.
Stop animating.
And then lastly we're going to dismiss so self-taught dismiss animated as true and completion as well.
All right.
Wonderful to save that.
And I think that's actually everything that we need here in the log and B C for now and forever actually.
So I think this one is done.
Yeah let's go ahead and test it out I'm going to run it.
All right.
So when I open this up press log in and log in here at E dot dot com password 1 2 3 4 5 6 and log in
spinner up just like we wanted.
Oh hey there we go.
All right so we are successfully logging in or going to log out and just try that one more time with
a different g g dot com.
One two three four five six.
And there we go.
All right so we have logging in covered.
OK.
But I want to show you something if you do commence shift and go H.H. then you get this here so I'm
going to close our app so close it and then I'm going to reopen it.
Now we were logged in right.
We were logged in as Johnny B.
So I just reopened it and you would expect you know from your normal use of other apps that we would
you know still be logged in.
And we kind of are because if you see here the Boullion is still set saying that we're logged in but
we don't have any of our user info or anything.
So we need to fix that.
So we're going to do that is here in our chat.
See what we're going to do is when we load up the app we're going to go ahead and just do a check.
So I guess we're going to do a check if we're logged in and if we are then we're going to go ahead and
call that function the find use or by email do our post notification that user data has changed.
And that should that should get us going in the right directions.
I want to say if off service come on if off the service that instance that is logged in to if we are
logged in then we are going to call the office service instance dot find use or by email function.
OK.
Success.
And so here we going to do is post the notifications saying that we have logged in so user data has
changed.
So notification center dot default dot post and the notification that were posting that were the name
of the broadcast that we are blasting out is no underscore user data did change object is no case going
to save that.
OK so this is all hunky dory.
But if we come in to our channel ABC this this this view might not have been instantiated at the time
that that notification is fired off.
So we also need to do is here in my view did appear we need to do a check and set up the user data accordingly.
So in other words we need to do everything that is being done right here.
And you did appear so let's go ahead and create a function for that someone to say phunk set up user
info and to just copy her cut everything out of this.
Usually they did change and put you right here.
And then I'm going to call set up user info here and here in view did appear that way if we're opening
up the app from scratch chat we see loads up the end and we have been logged in previously so our token
e-mails are saved.
We're going to find our user information and then when we open up channel ABC here on view did appear
we're going to do a check here and we're going to say Oh hey I have everything that I need to set up
the user info for a logged in user.
OK.
So let's go in and run that and test it.
And I think we ended with a logged in users so we up and there we go all around.
So from a fresh start we we loaded up we got our our user information via that new function that we
created and loaded up all of our eyes accordingly.
So that's pretty exciting and if I log out then it goes back and if I close the app and then re open
it.
All right and I guess I didn't actually close it.
See here.
So closing it and then reopening it and everything should be blank.
So then we can log in again at 1 One two three four five six and boom.
All right so great.
So we have this lesson.
We created a new function so that we could get the users information based off of their e-mail.
And then with that information we were able to set it so that we can log in users from the logging page
instead of having to do the whole create account cycle every single time we wanted to log in.
And then we also set it up to where if you're launching it from scratch and you have already logged
in and in the past you don't have to log in again.
Now it just logs you.
Logs logs you in automatically.
So that's really nice.
All right so we're making great progress.
I know you guys are probably itching to start actually working with web sockets and the actual chat
part of this app but sorry about that.
But this has been a lot of lead up to get into it and but I mean we've learned a ton so far learned
a lot about web requests using El-Amir fire and working with API and everything.
So yeah I hope you guys are having fun.
And just to finish off here I'm going to add our progress make sure that you are doing the same on your
end and I will see you all in the next one.