WEBVTT 00:01.490 --> 00:07.460 So we have our front end written for sending messages, we have our back hand written for sending messages, 00:07.460 --> 00:10.190 and we're not sure it's all right yet, but we can test that. 00:10.190 --> 00:16.070 First thing we have to do before we test it is actually populate these two templates, password reset, 00:16.080 --> 00:19.650 HTML template and password reset plain TMB. 00:20.150 --> 00:21.420 Let's start with the HTML one. 00:22.460 --> 00:28.960 So this is a standard template, so we need to define what I'm going to define here is body OK? 00:29.360 --> 00:31.970 And that is what I want to use 00:34.730 --> 00:39.770 back here in Maila, Dongo, when I specify the body on this line. 00:39.770 --> 00:42.230 Twenty six, that's the part I'm executing. 00:42.350 --> 00:46.070 I'm looking for that in the template and the same thing down here on line forty one. 00:46.670 --> 00:52.790 So back in our password reset html, we just defined the HTML for an email. 00:52.940 --> 00:53.810 So DOCTYPE. 00:57.260 --> 01:04.710 And that's going to be tomorrow, and we need our opening HTML tag and our closing HTML tag. 01:07.280 --> 01:12.200 And we also need a head section and a closing head section. 01:13.760 --> 01:16.190 And in the head, I'm going to put in two metal tags. 01:17.030 --> 01:19.070 Not a name equals viewport. 01:24.560 --> 01:34.460 And the content of that tag is equal to width equals device dash width, and the second one is metter 01:35.460 --> 01:37.730 htp dash equiv. 01:39.300 --> 01:51.140 Equals content, dash type content equals text HTML, followed by a semicolon and a space, and shaza 01:51.180 --> 01:59.400 equals UTF Dash eight like that, and then close that time and we probably should close it this way 01:59.400 --> 02:01.510 as well, because male clients aren't that smart. 02:02.340 --> 02:02.910 So that's our head. 02:04.530 --> 02:08.190 Now the actual body has an opening in a closing section. 02:08.830 --> 02:09.270 Body. 02:12.130 --> 02:21.340 And we're going to say in here, just a paragraph to say hello and closing paragraph two and a paragraph 02:21.340 --> 02:36.580 teg, you recently requested a link to reset your password and close this paragraph and then click on 02:36.580 --> 02:37.660 the link below 02:40.510 --> 02:49.660 to get started and close the paragraph to another paragraph tag and the link traffic equals and hear 02:50.320 --> 02:51.640 inside quotation marks. 02:53.000 --> 02:58.150 I'll use the link we specified in our handler that we added to the data we're passing to this template. 02:58.330 --> 02:59.230 So that's the link. 02:59.920 --> 03:05.560 Then we'll print out the link again so they can have something to see and click on and close our. 03:08.050 --> 03:15.250 And down here, I'll just put another paragraph, dash, dash and a paragraph just to be our. 03:18.130 --> 03:21.280 Widgets, coat and clothes. 03:22.240 --> 03:25.750 OK, so that's the HTML version of our email. 03:26.200 --> 03:33.940 Now let's do the plain version of our emails open password reset plain and it's very similar, but of 03:33.940 --> 03:35.070 course it's plain text. 03:35.410 --> 03:36.940 We still have to define body. 03:39.630 --> 03:46.410 And closer and in between, we just say hello and you'll notice and not indenting this, because this 03:46.410 --> 03:47.520 is plain text email. 03:48.720 --> 04:03.870 You recently requested a link to reset your password, blank line, visit the link below to get started. 04:07.410 --> 04:16.030 Then the link, and I'm not going to wrap it in a because this is not HTML and then just widgets code 04:16.380 --> 04:20.550 and I'll put two dashes in front of it because people expect to see that. 04:20.820 --> 04:25.290 OK, so there are two HTML and plain text templates. 04:25.650 --> 04:27.050 So now we can actually try this. 04:27.060 --> 04:29.580 Someone opened my terminal, make sure everything is stopped. 04:29.580 --> 04:30.240 Make stop. 04:31.620 --> 04:32.250 Make start. 04:34.970 --> 04:35.870 They're all compiled. 04:36.930 --> 04:46.620 Let's see what we got wrong, so back to our Web browser and refresh this page, send the reset validation 04:46.620 --> 04:51.600 worked so me and here dot com and again, it doesn't really matter what it is. 04:51.610 --> 04:54.600 I'll open the JavaScript terminal to see if we get any kind of response. 04:56.180 --> 04:58.490 And send password reset link. 05:00.300 --> 05:06.570 So unexpected end of data in line one of column one of the Jason data, so we obviously forgot something. 05:06.600 --> 05:08.020 Let's go back and see what we did wrong. 05:09.000 --> 05:10.620 So no error messages here. 05:10.870 --> 05:12.450 So let's go look at the handlers. 05:12.450 --> 05:15.990 So to make sure I'm getting to the right place, I'm going to reach API. 05:17.440 --> 05:25.540 And I'm looking at apps for password, so let's look at our actual template, which is called password 05:25.540 --> 05:31.470 reset or something like that, forgot password and see if we're going to apply for a password. 05:31.510 --> 05:32.660 That's the first thing to verify. 05:33.920 --> 05:42.230 So when the JavaScript for this, I am going to slash apps forgot password, so that's not it. 05:42.430 --> 05:43.940 So let's go back to our roots. 05:47.090 --> 05:47.880 Roots API. 05:48.530 --> 05:51.860 And now let's look at the handler app to send a password reset. 05:52.850 --> 05:53.260 OK. 05:54.260 --> 05:57.220 Oh, we didn't actually call the function to send the email. 05:57.230 --> 05:57.960 Well, that was silly. 05:58.130 --> 06:02.420 So we actually need to send the email that's as simple as error equals. 06:02.420 --> 06:05.770 And we're going to call app dot sendmail right there. 06:06.440 --> 06:11.420 And it requires the first thing, InFocus widgets, dot com. 06:14.060 --> 06:18.800 The second thing, I use the same email address because it's just a test info widgets, dot com 06:21.590 --> 06:26.780 and a subject password reset request. 06:29.310 --> 06:34.890 And the name of the template I want, which is password dash reset with nothing after it because we 06:34.890 --> 06:40.480 append the HTML template and plain duct tape to it and then data. 06:41.730 --> 06:42.750 Now we'll check for an error. 06:44.040 --> 06:53.640 If error is not equal to nil, then I'll say APTA error log, print line, print the error and I'll 06:53.640 --> 06:57.840 send a bad request after and request. 06:59.330 --> 07:06.770 And that requires are in the air and I'll return, so we send the message, we get past that there's 07:06.770 --> 07:07.370 no air. 07:07.400 --> 07:08.870 Now we need to send our response. 07:08.870 --> 07:15.770 So I'll save our rasp is a struct and I'll populate error rule. 07:15.890 --> 07:23.150 And in JSON, we call that error and the message is a string. 07:23.330 --> 07:31.790 And in Jason, we'll call that message, which is what we're looking for on the front end and right 07:31.790 --> 07:33.440 this apter. 07:34.740 --> 07:37.310 Right, Jason, you have to populate that variable. 07:37.320 --> 07:47.750 All right, Jason, HGP status created, which is a good one for this case and a response our data. 07:48.150 --> 07:52.710 And let's just populate this and all we really need is the the bullier. 07:52.720 --> 07:56.940 So respeto error equals false. 07:58.020 --> 07:59.340 OK, let's stop this. 08:01.050 --> 08:03.990 Make stop start. 08:04.050 --> 08:05.040 See if it compiles. 08:08.270 --> 08:08.840 Perfect. 08:08.990 --> 08:16.400 Let's go back to our Web browser, reload this page, clear the JavaScript console, put in any email 08:16.400 --> 08:21.170 address, Nehad here, dot com, and try sending the password link again. 08:24.390 --> 08:25.770 Messages is not. 08:28.070 --> 08:31.220 So I have a typo somewhere on that page. 08:31.470 --> 08:35.360 So actually look and see what they're looking for, I suspect it's just the ID. 08:35.960 --> 08:37.130 So messages. 08:38.600 --> 08:40.550 And I left logging messages there. 08:40.590 --> 08:41.690 OK, so we'll go fix that. 08:42.770 --> 08:43.760 That's an easy one. 08:43.790 --> 08:51.220 So back to forgot password and my error is pretty simple up here. 08:51.500 --> 08:56.510 I'm saying let messages equal document get element by the log in messages, but I actually called it 08:56.510 --> 08:59.010 messages I think will verify that in a second. 08:59.450 --> 09:00.410 Let's go up here. 09:00.410 --> 09:01.730 And I called it messages. 09:01.790 --> 09:05.110 OK, so third third time's a charm. 09:05.330 --> 09:06.830 So make it stop. 09:08.300 --> 09:09.410 Make start. 09:14.290 --> 09:21.640 And give myself some blank lines, go back to my Web browser, reload this, go to the console, clear 09:21.640 --> 09:27.020 the console me at here dot com, send password, reset. 09:29.750 --> 09:31.350 OK, we got no air. 09:31.460 --> 09:35.870 Now let's go look at our mail trap and chances are we're going to have to in there because I think that 09:35.870 --> 09:39.020 message went and then I got a JavaScript error afterwards. 09:39.020 --> 09:40.760 But let's go find it in mail trapped. 09:41.840 --> 09:43.790 I have two messages, one here. 09:44.660 --> 09:45.590 And that looks right. 09:45.590 --> 09:49.370 And that's the link I specified and one here that looks right. 09:49.370 --> 09:51.560 And that is a good start. 09:51.560 --> 09:55.930 But of course, we don't actually have a reset password link. 09:55.940 --> 10:01.700 I'm just going to some university's Web site, and we have no logic in place to actually change the 10:01.700 --> 10:06.650 user's password, to give them access to a page that allows them to type in their new password twice 10:06.860 --> 10:08.570 and update their password in the database. 10:08.780 --> 10:11.390 So we'll get started on that in the next lecture.