1 00:00:01,970 --> 00:00:08,690 In today's lecture, are we going to do this play the day when I say it's going to have the year, the 2 00:00:08,690 --> 00:00:18,830 day, the month and yeah, and also we're going to play around with some areas and some objects. 3 00:00:19,460 --> 00:00:24,940 So one more thing that we're going to do is we going to set the UI values back to zero. 4 00:00:25,310 --> 00:00:32,540 When I said UI values, I mean this obviously when I refresh here, we don't need those things and you 5 00:00:32,540 --> 00:00:33,820 can come this one out. 6 00:00:33,830 --> 00:00:36,590 I don't want that to be initiated in the moment. 7 00:00:36,860 --> 00:00:38,410 We will use function in you. 8 00:00:38,750 --> 00:00:41,150 We will use template literals. 9 00:00:41,200 --> 00:00:47,320 OK, now the question here is where I should put this play date function. 10 00:00:48,050 --> 00:00:56,530 So it's about the UI and the most obvious way to put it inside the app UI controller. 11 00:00:56,930 --> 00:00:59,710 But the thing is that where are we going to call this function from? 12 00:01:00,110 --> 00:01:04,520 And the best way for me is when I open the app. 13 00:01:04,760 --> 00:01:10,900 I just want this today to be replaced with actual date year and stuff like that. 14 00:01:11,150 --> 00:01:13,370 So maybe not. 15 00:01:13,370 --> 00:01:15,260 Maybe we should put it here. 16 00:01:15,540 --> 00:01:26,270 So I'm going to say, OK, I'm going to use the app UI controller and I'm going to say this play date 17 00:01:26,270 --> 00:01:28,990 and we don't need to pass any parameters here. 18 00:01:29,360 --> 00:01:37,340 No, this play date function will go as a public function in this UI control. 19 00:01:37,370 --> 00:01:37,740 Right. 20 00:01:38,000 --> 00:01:46,730 So where we have it is after the delete calories, we're going to come out here and we're going to say 21 00:01:47,750 --> 00:01:55,790 this play date month, year and day. 22 00:01:57,410 --> 00:02:09,140 OK, now what we will do, I will say this function, sorry about the capsular function and we are done 23 00:02:09,140 --> 00:02:14,840 pretty much don't forget to put a comma here because we might create another function there. 24 00:02:15,540 --> 00:02:15,920 OK. 25 00:02:17,780 --> 00:02:28,340 So let's test this out, let's councillor's something here as a date started, and it can be anything 26 00:02:28,340 --> 00:02:29,050 just to test it out. 27 00:02:29,060 --> 00:02:29,840 It's working here. 28 00:02:29,840 --> 00:02:30,230 It is. 29 00:02:31,100 --> 00:02:32,030 It is working. 30 00:02:32,720 --> 00:02:34,190 And don't worry about this, too. 31 00:02:34,190 --> 00:02:35,690 Got these two taps here. 32 00:02:35,690 --> 00:02:36,770 I'm just going to explain them. 33 00:02:37,280 --> 00:02:37,550 Right. 34 00:02:37,670 --> 00:02:43,370 I can just easily close this for you, not be able to see it will not be able to see these minutes here. 35 00:02:44,420 --> 00:02:49,760 But I really don't think that it's too much of a concern. 36 00:02:49,760 --> 00:02:59,690 So if you if this is bothering you, I can do as the other the other courses they just shoot up to until 37 00:02:59,690 --> 00:02:59,990 here. 38 00:03:00,110 --> 00:03:03,440 But I just want to show you what I'm doing all the time. 39 00:03:03,500 --> 00:03:09,080 So, yeah, if you have any problems, we know in the comments, let me know wherever you want, shoot 40 00:03:09,080 --> 00:03:12,920 me an email or whatever you think it's reasonable. 41 00:03:13,220 --> 00:03:16,010 Just don't give me a bad review joke. 42 00:03:16,030 --> 00:03:17,660 OK, so the daily started. 43 00:03:17,930 --> 00:03:18,600 This is working. 44 00:03:18,650 --> 00:03:19,760 I'm just going to close that one. 45 00:03:19,970 --> 00:03:22,490 OK, I'm going to create a variable today. 46 00:03:23,090 --> 00:03:23,960 What else. 47 00:03:23,960 --> 00:03:26,210 Year and date. 48 00:03:26,630 --> 00:03:30,740 OK, these variables I can easily grab what's happened. 49 00:03:30,740 --> 00:03:35,300 Date, ok, these variables I can easily grab from date function. 50 00:03:35,330 --> 00:03:48,140 OK, now I'm going to see today it will be equal to the new new date and that comes along today. 51 00:03:51,620 --> 00:03:53,970 And that will give me the entire thing, right? 52 00:03:54,290 --> 00:03:57,350 So Australian Eastern Standard Time, Wednesday, July. 53 00:03:57,570 --> 00:04:00,910 So I'm just planning to do something similar like this part. 54 00:04:01,160 --> 00:04:04,880 But in JavaScript, if you don't use some library, it's a little bit tricky. 55 00:04:04,910 --> 00:04:07,130 You do have to do a little bit of coding. 56 00:04:07,310 --> 00:04:13,170 Otherwise, if you use a library, you can just grab all of those things in less than a minute. 57 00:04:13,190 --> 00:04:23,300 OK, now I'm just going to say you're here so I can grab the year and say today, but I need to access 58 00:04:23,300 --> 00:04:27,470 that today and to get a full year just like that. 59 00:04:28,850 --> 00:04:30,530 OK, let's test start the year. 60 00:04:35,430 --> 00:04:41,590 And don't put anything here, here, so I do have 20, 20. 61 00:04:41,790 --> 00:04:42,600 How cool is this? 62 00:04:42,720 --> 00:04:45,590 You're going to have a different a year, probably because you're not going to watch in 20. 63 00:04:45,780 --> 00:04:48,660 Or if you watch in 20, you're going to have the same year. 64 00:04:48,900 --> 00:04:56,230 OK, no one is the last is the day in the day is going to be today. 65 00:04:56,730 --> 00:04:59,380 Again, I'm going to access that today and get date. 66 00:04:59,660 --> 00:05:05,940 OK, so the most crucial part for us is to get that today. 67 00:05:06,270 --> 00:05:10,800 And let's say they hear so well, it will give us. 68 00:05:11,250 --> 00:05:12,840 OK, it's 15, right? 69 00:05:14,110 --> 00:05:14,480 Nice. 70 00:05:14,740 --> 00:05:22,900 So we do use it here for what else I'm going to do here, I'm just gonna come at this point I don't 71 00:05:22,900 --> 00:05:28,150 need it, but now I'm just going to create a couple of objects here, and I'm going to show you that 72 00:05:28,150 --> 00:05:35,410 we can use an array and we can use what we can use an object for our months in our data base. 73 00:05:35,920 --> 00:05:38,250 So this area I can put it here. 74 00:05:38,340 --> 00:05:41,050 So I suggest you can put it here. 75 00:05:41,050 --> 00:05:47,240 But I'm going to create that area as a private here variable, I mean, as a private object. 76 00:05:47,380 --> 00:05:54,430 So first, I'm going to do the months is object and the days as an area of this. 77 00:05:54,430 --> 00:05:54,750 Right. 78 00:05:55,210 --> 00:06:00,530 So we will need this for for our application to work. 79 00:06:02,020 --> 00:06:06,220 So I'm going to be just a normal object here and inside. 80 00:06:06,220 --> 00:06:09,180 I will have zero, you know. 81 00:06:09,450 --> 00:06:16,640 You know what I have open up here so you can go on Google and say months, 12 months, a year. 82 00:06:16,660 --> 00:06:22,900 So, yeah, I'm just going to steal some of those things, you know, because I'm bothered. 83 00:06:22,930 --> 00:06:27,340 I don't want to write and I don't want to waste your time right now. 84 00:06:27,340 --> 00:06:28,870 January will be like that. 85 00:06:29,500 --> 00:06:34,060 So but it should be site quotes. 86 00:06:34,720 --> 00:06:39,460 No, I'm just going to press enter, you know, for all of them. 87 00:06:40,420 --> 00:06:42,910 And yeah, he should do the same. 88 00:06:45,670 --> 00:06:49,000 So, yeah, that looks nice. 89 00:06:51,440 --> 00:06:56,360 OK, now I'm just going to wrap the quotes around them. 90 00:07:00,920 --> 00:07:04,490 So, yeah, you can feel my clicking on the keyboard. 91 00:07:04,880 --> 00:07:05,250 Good. 92 00:07:05,840 --> 00:07:12,440 So what I do have here left is to put a number in front of them, right? 93 00:07:12,860 --> 00:07:15,700 So that will be one like that. 94 00:07:15,890 --> 00:07:18,670 It will be two for the march. 95 00:07:19,730 --> 00:07:25,820 So don't laugh at me if I just mix up the dates because I'm not good with those months and I know what's 96 00:07:25,820 --> 00:07:26,540 wrong with me. 97 00:07:26,960 --> 00:07:28,190 That's my personal story. 98 00:07:28,700 --> 00:07:34,130 And for some reason I forgot about the months in there or so. 99 00:07:34,130 --> 00:07:39,350 Yeah, I'm not sure how I managed to do that, but I don't keep a track. 100 00:07:40,010 --> 00:07:41,490 So September is number eight. 101 00:07:43,190 --> 00:07:44,660 Yeah, September is no evidence. 102 00:07:44,960 --> 00:07:45,970 We started from zero. 103 00:07:46,100 --> 00:07:47,480 I was thinking I'm born in September. 104 00:07:47,490 --> 00:07:48,340 Should be number nine. 105 00:07:48,350 --> 00:07:49,200 OK, right. 106 00:07:49,610 --> 00:07:50,980 So I'm confused here. 107 00:07:50,990 --> 00:07:51,930 I was confused. 108 00:07:53,030 --> 00:07:53,450 Nice. 109 00:07:53,810 --> 00:07:59,480 So we've created these months here as an object. 110 00:07:59,720 --> 00:08:01,130 You can just achieve that. 111 00:08:01,130 --> 00:08:04,630 Same with a as a as a normal area. 112 00:08:04,850 --> 00:08:07,090 And I'm going to show you that you can do it. 113 00:08:07,370 --> 00:08:13,460 But for the area, we use the brackets like this and we don't pull zero one, two, three or four like 114 00:08:13,460 --> 00:08:17,800 that because the error will we'll put it. 115 00:08:18,710 --> 00:08:21,890 Yeah, we'll put every item here. 116 00:08:22,100 --> 00:08:23,620 It will start from zero position. 117 00:08:23,630 --> 00:08:23,750 Right. 118 00:08:23,790 --> 00:08:29,090 It will put the indexes as they shoot from zero until here until we have. 119 00:08:29,600 --> 00:08:32,740 So here on Sunday, Monday, Tuesday. 120 00:08:33,050 --> 00:08:35,240 So I'm using like three letters. 121 00:08:35,240 --> 00:08:36,360 You can use more if you want. 122 00:08:36,380 --> 00:08:37,910 That's not a problem. 123 00:08:38,390 --> 00:08:43,730 And I've used more before, but it doesn't look right in the application. 124 00:08:43,730 --> 00:08:44,420 It's too big. 125 00:08:45,080 --> 00:08:49,750 So yeah, that's another hint from me Saturday. 126 00:08:50,070 --> 00:08:58,440 OK, so we start from the sun, we finishing in Saturday cuz now let's use them in our data display 127 00:08:58,440 --> 00:08:58,700 date. 128 00:08:58,700 --> 00:08:59,000 Right. 129 00:08:59,450 --> 00:09:00,780 So how are we going to use them. 130 00:09:00,800 --> 00:09:09,430 So here we already have the date that today we already have a couple of things but we need to use now 131 00:09:09,620 --> 00:09:20,510 there's this month's OK, just cause a lot of the month and sorry and can't come on and cancel the dates. 132 00:09:20,720 --> 00:09:21,130 Right. 133 00:09:21,650 --> 00:09:25,940 Or the date should be based there. 134 00:09:26,150 --> 00:09:29,450 Why there should be days, not days. 135 00:09:29,630 --> 00:09:30,040 Right. 136 00:09:30,920 --> 00:09:33,280 So I'm just going to cancel these days. 137 00:09:33,830 --> 00:09:36,580 So I was thinking why it's not giving me that. 138 00:09:36,590 --> 00:09:39,170 No, I don't need this anymore. 139 00:09:39,340 --> 00:09:39,770 It is. 140 00:09:39,890 --> 00:09:42,230 I do have a January start from zero. 141 00:09:42,350 --> 00:09:42,770 Right. 142 00:09:42,770 --> 00:09:45,740 I should start but that you don't need to worry about it. 143 00:09:45,980 --> 00:09:48,920 And also here is sun start from zero. 144 00:09:48,920 --> 00:09:52,670 As I told you, the area will put its own indexes in the length is seven. 145 00:09:53,210 --> 00:09:53,630 Good. 146 00:09:54,320 --> 00:09:56,240 Now what we will do here. 147 00:09:57,410 --> 00:09:59,090 So I know that this is working. 148 00:09:59,450 --> 00:10:07,610 So we're going to use some to grab the Monday so we can say month name. 149 00:10:07,820 --> 00:10:09,260 We can see the name. 150 00:10:10,730 --> 00:10:13,550 So I'll create this area to grab their names. 151 00:10:13,550 --> 00:10:13,850 Right. 152 00:10:14,120 --> 00:10:16,610 So let's put it here. 153 00:10:16,610 --> 00:10:17,330 Let's test it out. 154 00:10:17,780 --> 00:10:24,440 The logic we're going to work, someone name it will be equal two months. 155 00:10:24,740 --> 00:10:34,190 I'm just going to access this object and I will say today that get month. 156 00:10:35,210 --> 00:10:37,610 Right, because the Getman will return us. 157 00:10:38,900 --> 00:10:39,440 No. 158 00:10:41,090 --> 00:10:42,560 And I need to count our luck. 159 00:10:42,950 --> 00:10:43,370 All right. 160 00:10:48,880 --> 00:10:50,380 Last month name. 161 00:10:54,920 --> 00:11:03,770 It's undefined and why is this OK, because I need here a curly brackets like this, it's a method ID 162 00:11:03,770 --> 00:11:05,320 and we need to call it so July. 163 00:11:05,330 --> 00:11:06,410 Yes, it's July. 164 00:11:06,640 --> 00:11:07,940 OK, why this is working? 165 00:11:08,210 --> 00:11:17,120 Because look at this now, if it comes along the today that get month, it will give me a six in. 166 00:11:17,480 --> 00:11:18,920 If it just uncommon. 167 00:11:19,460 --> 00:11:21,780 That's uncommon this until we are finished. 168 00:11:22,040 --> 00:11:27,530 So on the sixth position, what I do have is actually July. 169 00:11:27,700 --> 00:11:28,170 Right. 170 00:11:29,240 --> 00:11:31,700 That is why I started from zero. 171 00:11:32,150 --> 00:11:32,970 Very good. 172 00:11:32,990 --> 00:11:35,680 No one else here. 173 00:11:36,010 --> 00:11:45,610 We are going to create the day name and we need to grab this day name and we can access what the area 174 00:11:45,830 --> 00:11:49,870 and it will be today that get day. 175 00:11:49,910 --> 00:11:53,730 Another function that we can use from date. 176 00:11:54,230 --> 00:11:55,150 So cool. 177 00:11:55,160 --> 00:12:00,340 Let's let OK, not I'm not going to do this. 178 00:12:00,350 --> 00:12:05,690 I'm going to copy these two lines here, but that will be for the day, the name. 179 00:12:07,010 --> 00:12:14,120 And here I will say I will today get paid just in order to see how it's going to work. 180 00:12:14,270 --> 00:12:22,850 OK, so today's Wednesday and it's giving me Wednesday because these get the method is returning number 181 00:12:22,850 --> 00:12:25,910 three and number three is actually Wednesday. 182 00:12:25,910 --> 00:12:27,120 Now, you know why I put it. 183 00:12:27,320 --> 00:12:30,830 I started from zero one, two, three, four, five, six and stuff like that. 184 00:12:30,920 --> 00:12:37,340 Right now, you know that you can grab any money that you want any day that you want like this. 185 00:12:37,620 --> 00:12:39,980 OK, this is working. 186 00:12:40,490 --> 00:12:41,510 I don't need this. 187 00:12:41,510 --> 00:12:43,260 You don't need this. 188 00:12:43,430 --> 00:12:48,050 Now, what I'm going to show you is how we can format a string. 189 00:12:48,200 --> 00:12:48,620 Right. 190 00:12:49,190 --> 00:12:52,820 And plus, you can write a comments here, how you can format a string. 191 00:12:53,150 --> 00:12:57,380 So that's why we going to use this template literals template strings. 192 00:12:57,380 --> 00:12:59,060 I've never shown you this before. 193 00:12:59,330 --> 00:13:06,890 They were called template strings in prior editions, year 2015 specification template letters are string 194 00:13:06,890 --> 00:13:09,500 literals, allowing embedded expression. 195 00:13:09,680 --> 00:13:11,860 You can use multiline strings. 196 00:13:11,870 --> 00:13:16,910 Now, this is good because I've haven't shown you this, so I'm just gonna print out this. 197 00:13:16,970 --> 00:13:23,930 If we want to have this output in two lines, we will have to use this backslash end and that will create 198 00:13:23,930 --> 00:13:27,620 that new line for us right here. 199 00:13:27,690 --> 00:13:30,500 Extreme text line one, strict text line two. 200 00:13:30,650 --> 00:13:35,120 If I remove this, look what will happen. 201 00:13:36,050 --> 00:13:37,110 It will not even give. 202 00:13:37,130 --> 00:13:38,690 Yeah, it will be in one line. 203 00:13:38,690 --> 00:13:44,540 So that again means starting the new line, go to the new line. 204 00:13:44,780 --> 00:13:48,380 But this is how I'm still doing it. 205 00:13:48,860 --> 00:13:53,900 But there is a better way that you can do it so you can use template literals. 206 00:13:54,110 --> 00:13:56,720 So this is the sign like here. 207 00:13:56,930 --> 00:14:01,160 So they call this one way template. 208 00:14:01,160 --> 00:14:08,480 Letters are enclosed in a back stick right in the back in my keyboard is under the escape button. 209 00:14:09,290 --> 00:14:17,580 Some somewhere in past I was thinking that there was Tilde or whatever name to use, but that's backtalk. 210 00:14:17,630 --> 00:14:23,360 Now you can get exact same like this without that again. 211 00:14:25,520 --> 00:14:28,700 And look at it with back. 212 00:14:28,760 --> 00:14:31,850 I'm going to say with the back deck. 213 00:14:32,900 --> 00:14:33,440 Nice. 214 00:14:34,760 --> 00:14:35,600 Here it is with back. 215 00:14:35,870 --> 00:14:37,850 We are just getting everything. 216 00:14:38,120 --> 00:14:43,970 But we need to use this one and I'm going to show it to you why I'm doing this, because you can say 217 00:14:44,000 --> 00:14:49,280 you can use an expression interpellation in order to embed an expression with normal string. 218 00:14:49,290 --> 00:14:51,050 You will use the following syntax. 219 00:14:51,050 --> 00:14:56,540 Right now, I'm going to use something like this when I have the variables like here, don't worry about 220 00:14:56,540 --> 00:14:56,720 this. 221 00:14:56,720 --> 00:15:02,270 Let I can use fifteen dollar sign in these brackets. 222 00:15:02,270 --> 00:15:06,190 I'm going to you can put this through here and not stuff. 223 00:15:06,470 --> 00:15:07,580 And that is history. 224 00:15:07,670 --> 00:15:15,980 So we our format, the, the screen using this way because I have a lot of variables in my, my coat 225 00:15:15,980 --> 00:15:16,400 now. 226 00:15:16,820 --> 00:15:18,110 So I'm going to remove this. 227 00:15:18,110 --> 00:15:21,020 This was just to show you this was just to give you an example. 228 00:15:21,170 --> 00:15:27,830 I'm going to say let's put this here for a minute format text. 229 00:15:31,480 --> 00:15:39,640 And I'm just going to copy it and I'm going to put it here and I'm going to say, OK, now you need 230 00:15:39,640 --> 00:15:46,080 to use F and yes, in order to to be able to. 231 00:15:46,460 --> 00:15:47,800 Yeah, I'm using windows. 232 00:15:47,800 --> 00:15:48,080 Right. 233 00:15:48,430 --> 00:15:53,050 So if you're using Mac, just find a way how you can just insert this. 234 00:15:53,080 --> 00:16:01,840 And now before any before any variable, I do have this dollar sign that this clearly brekke basis. 235 00:16:02,020 --> 00:16:09,370 So I'm going to say deigning here now I'm going to get a comma so we can easily achieve this with normal 236 00:16:09,370 --> 00:16:09,630 strings. 237 00:16:09,640 --> 00:16:11,400 But I want to show you something, something different. 238 00:16:11,560 --> 00:16:16,150 So date here, then I'm going to give you the space then. 239 00:16:16,150 --> 00:16:20,140 A month month name. 240 00:16:22,900 --> 00:16:26,350 My name like that and what else we need here? 241 00:16:26,650 --> 00:16:31,540 I think the year end should be enough year. 242 00:16:32,290 --> 00:16:39,550 So that is about the format index you can control along the four minute text and see what's going on. 243 00:16:40,060 --> 00:16:45,470 It is it's going to be like this Wednesday, 15 July 2020. 244 00:16:45,490 --> 00:16:49,780 If you're from USA, just swap some of things around right now. 245 00:16:50,140 --> 00:16:57,460 The goal is to put it here, but how we can get it here, we need to get this main panel date tax. 246 00:16:57,670 --> 00:16:58,090 Right. 247 00:16:58,510 --> 00:17:02,770 Where are we going to put this one in our name, Placidyl. 248 00:17:02,950 --> 00:17:04,290 So sorry, HTML. 249 00:17:05,410 --> 00:17:10,060 And it's going to be easier if I find them like this here. 250 00:17:10,060 --> 00:17:18,850 I'm just going to put it here and what I'm going to say, Front Ebbitt and I'm going to say that the 251 00:17:18,850 --> 00:17:19,690 main text. 252 00:17:20,050 --> 00:17:20,470 Cool. 253 00:17:20,860 --> 00:17:22,930 So I've just pasted that one there. 254 00:17:23,260 --> 00:17:23,650 Right. 255 00:17:23,650 --> 00:17:29,740 I'm just going to close it and I'm going to go to display play date. 256 00:17:30,760 --> 00:17:31,450 Very good. 257 00:17:31,630 --> 00:17:34,930 No, so I don't need this formatted text. 258 00:17:35,080 --> 00:17:45,550 And what I need to use is document selector and to get HTML class names up front up date. 259 00:17:46,150 --> 00:17:52,060 And I'm going to say inor Schimel inside a span, I will create a span here. 260 00:17:52,120 --> 00:17:54,340 Loops, span. 261 00:17:56,530 --> 00:17:58,150 That's why I use this HDMI. 262 00:17:58,210 --> 00:18:02,560 Otherwise you can put as a text and I don't see. 263 00:18:04,390 --> 00:18:15,850 Plus, for Romney to escape it here again here and I will see four minute text that should give me this 264 00:18:15,850 --> 00:18:19,330 here every is I save it and it's immediately dear, right. 265 00:18:19,660 --> 00:18:20,980 Why is immediately there? 266 00:18:20,980 --> 00:18:27,200 Because we put it where in the init function in the initialize function. 267 00:18:27,550 --> 00:18:30,850 Now in this initialize function we can create, we can get the rest of it. 268 00:18:31,450 --> 00:18:34,080 So I don't want this to be 92 percent. 269 00:18:34,090 --> 00:18:39,010 I want this to be only two thousand three hundred and this to be a zero. 270 00:18:39,700 --> 00:18:40,570 But how we can do that. 271 00:18:40,990 --> 00:18:44,950 OK, so what was the name of the function that we use? 272 00:18:44,980 --> 00:18:50,140 So here it is displayed front an app calories and we set your calorie. 273 00:18:50,140 --> 00:18:50,440 Right. 274 00:18:50,590 --> 00:18:59,500 So if you go control and if you look it up, you will have all the day's calories is never used. 275 00:19:01,510 --> 00:19:01,690 Hmm. 276 00:19:02,180 --> 00:19:07,750 OK, I'm going to go back that to some stage later, maybe we haven't used that one again. 277 00:19:07,810 --> 00:19:08,380 That doesn't matter. 278 00:19:08,730 --> 00:19:11,710 No, this requires an object in here. 279 00:19:11,710 --> 00:19:15,300 We set everything that we have right now. 280 00:19:15,970 --> 00:19:17,320 I can use the same thing. 281 00:19:17,320 --> 00:19:18,820 I can just copy this one. 282 00:19:19,450 --> 00:19:21,790 Just copy that one or. 283 00:19:21,790 --> 00:19:23,320 No, I'm not going to copy that one. 284 00:19:23,590 --> 00:19:28,690 I'm just going to copy the other one and you will see what we will do right here. 285 00:19:31,690 --> 00:19:37,700 This we need this and we need exactly the same call from this that you are controller. 286 00:19:38,110 --> 00:19:44,830 We need to call it here, OK, maybe we can call it even up here. 287 00:19:46,720 --> 00:19:51,400 No, Apu, I controller this an calories in here. 288 00:19:51,400 --> 00:19:54,480 We passing the calories, but we don't have access to these calories matter. 289 00:19:54,700 --> 00:20:01,900 So what we object are what we can do is we can actually create an object or we can pass directly an 290 00:20:01,900 --> 00:20:02,530 object here. 291 00:20:02,550 --> 00:20:03,910 So I'm going to show you the ways. 292 00:20:04,120 --> 00:20:10,090 So I'm going to say empty calories and that will be an object in here. 293 00:20:10,330 --> 00:20:14,680 I'm going to say, OK, I need to go back and get all of those things. 294 00:20:15,640 --> 00:20:17,200 I need these things. 295 00:20:19,360 --> 00:20:24,480 OK, so I copy those things where I am here. 296 00:20:25,330 --> 00:20:30,370 So today's calories, I'm going to set this to zero, right. 297 00:20:30,640 --> 00:20:31,840 To total burn. 298 00:20:31,840 --> 00:20:35,650 I'm going to set to zero in here. 299 00:20:36,280 --> 00:20:37,780 Should not be like that. 300 00:20:37,780 --> 00:20:39,670 Should be because we are inside the object. 301 00:20:39,670 --> 00:20:40,180 We're not. 302 00:20:42,360 --> 00:20:47,130 OK, so if we don't need some of them, I'm going to do it and should be coming here, right? 303 00:20:47,160 --> 00:20:54,420 It's not going to work otherwise no total burn is going to be zero because we starting it, but remaining 304 00:20:54,420 --> 00:20:59,730 it will be two thousand three hundred comma in here. 305 00:20:59,730 --> 00:21:01,450 The percentage again will be zero. 306 00:21:02,070 --> 00:21:06,270 So instead of passing the calories here, I can pass this empty object. 307 00:21:06,540 --> 00:21:11,610 So if I save it now and expect a token three seventy one. 308 00:21:13,690 --> 00:21:22,990 Yeah, that it's so here it is, zero zero zero two thousand three hundred, if you don't think this 309 00:21:22,990 --> 00:21:24,170 is working, let's change it. 310 00:21:24,400 --> 00:21:32,100 That's why I told you at the beginning that you can adjust this as your needs, as your body mass is 311 00:21:32,350 --> 00:21:38,370 your body mass index to know everything you set, everything is working. 312 00:21:38,620 --> 00:21:41,890 So the other way that you can do it, I'm just going to show you. 313 00:21:43,810 --> 00:21:45,790 I'm just going to come and this guy here. 314 00:21:46,180 --> 00:21:53,800 Oops, before I'm going to copy it and I'm going to put it down here, he can put it straight into it, 315 00:21:54,700 --> 00:21:55,630 straight into here. 316 00:21:55,630 --> 00:21:58,480 I'm going to cut it and I'm going to put it straight into here. 317 00:21:59,320 --> 00:22:05,320 You can put the straight there, the entire object. 318 00:22:05,590 --> 00:22:07,420 You can put it just like that. 319 00:22:07,660 --> 00:22:09,490 Save it and it will work. 320 00:22:09,490 --> 00:22:09,900 Right. 321 00:22:11,890 --> 00:22:15,760 So, yeah, let's change this one to back to two thousand three hundred. 322 00:22:16,090 --> 00:22:16,990 So it's working. 323 00:22:16,990 --> 00:22:23,650 You can put whatever object you want straight into the function, but I do prefer to be. 324 00:22:23,680 --> 00:22:26,890 So I'm just going to comment up and I do prefer to be like that. 325 00:22:26,890 --> 00:22:29,860 So yeah, you should work for you guys both ways. 326 00:22:30,070 --> 00:22:31,900 Now we are done with this lecture. 327 00:22:32,080 --> 00:22:33,910 I hope you understand what we have done. 328 00:22:34,090 --> 00:22:43,930 We grab the day, we get we grab the day's name, the money these days here, the year end. 329 00:22:43,930 --> 00:22:46,150 Plus we used what we used. 330 00:22:46,360 --> 00:22:48,730 We used months as an object. 331 00:22:49,120 --> 00:22:49,400 Right. 332 00:22:49,570 --> 00:22:51,280 We test it out here, all of this. 333 00:22:51,430 --> 00:22:55,900 So probably in future I'm going to delete them because it's messing up my coat. 334 00:22:57,870 --> 00:23:02,910 Let's make them let's make them to look more on the right side. 335 00:23:02,980 --> 00:23:03,430 Here it is. 336 00:23:03,580 --> 00:23:07,000 So in a private here, I'm sitting months. 337 00:23:10,820 --> 00:23:14,970 Pamoja, and this will be these objects. 338 00:23:15,920 --> 00:23:16,400 All right. 339 00:23:19,520 --> 00:23:20,440 It will be hairy. 340 00:23:20,610 --> 00:23:27,470 OK, so I have two areas and I used to display them into our front. 341 00:23:27,500 --> 00:23:34,600 You are right and this display is actually public function in the UI API controller. 342 00:23:34,660 --> 00:23:40,690 Okay, so I have days we grabbing equal to new date year, end date as well. 343 00:23:40,970 --> 00:23:47,660 Then the money we use that object that we created for the month, for the days, then we use that one 344 00:23:47,660 --> 00:23:49,910 and use a couple of methods here. 345 00:23:50,180 --> 00:23:52,150 You should all know about these matters. 346 00:23:52,170 --> 00:23:55,880 As I told you, if you use some other libraries, this will be extremely easy. 347 00:23:56,010 --> 00:24:01,690 Now, here we used template literals. 348 00:24:01,700 --> 00:24:05,230 Yeah, it's hard for me even to pronounce it, but now you know how to use it. 349 00:24:05,240 --> 00:24:11,120 If you see somewhere in some other coding, for example, we've worked in a company where if you start 350 00:24:12,440 --> 00:24:20,480 browsing through some, I don't know, threw some things on Internet, you will find this this way of 351 00:24:20,480 --> 00:24:23,540 writing down the strings that now you know what they mean. 352 00:24:23,690 --> 00:24:24,050 Right. 353 00:24:24,530 --> 00:24:25,430 So thank you very much. 354 00:24:25,430 --> 00:24:26,930 I hope you enjoyed this one. 355 00:24:27,110 --> 00:24:29,210 And I will see you in the next one.