WEBVTT 00:01.330 --> 00:05.580 So just a few things to clean up on this page before we move on, and I give you a challenge. 00:06.190 --> 00:12.130 And first of all, I'm looking right now at old dash sales page HTML in the fetch statement at the bottom 00:12.130 --> 00:14.220 of that file, and it works pretty well. 00:14.410 --> 00:16.900 But of course, we're not checking for some obvious things. 00:16.960 --> 00:18.970 What if there are no sales, for example? 00:19.000 --> 00:20.910 Well, this for each will never execute. 00:21.220 --> 00:24.240 We probably want to display something saying there are no sales. 00:25.000 --> 00:30.670 So what I'll do is just before this, a very simple check if data, if that's not equal to know because 00:30.670 --> 00:31.450 we'll be getting null. 00:31.450 --> 00:39.640 If there is no data, then I'll come down here, close that if statement and just put it in and close 00:39.640 --> 00:43.690 that up and tab things over so things are a little more visually appealing. 00:44.720 --> 00:47.800 I can get rid of this console log data because you don't need that anymore. 00:48.850 --> 00:56.290 If there is no data, then I'll again get a reference to the Tebaldi for inserting a row and create 00:56.290 --> 00:56.590 an empty. 00:56.590 --> 01:01.210 So I'll put those right here and tab this one back. 01:01.690 --> 01:03.790 So I have a row and I have a cell now. 01:03.790 --> 01:06.290 I want this cell to have a couple spent attributes at the. 01:06.640 --> 01:07.510 And that's easy enough. 01:08.020 --> 01:17.440 So it's an attribute called spane for and I'll said it's interreg html. 01:17.890 --> 01:22.300 So Interreg HTML is going to be equal to 01:24.940 --> 01:25.910 no data available. 01:29.320 --> 01:33.940 OK, so there's the first thing, the next thing we want to do is to format currency to make it a little 01:33.940 --> 01:37.680 more attractive than it is right now because we're displaying it simply a sense. 01:38.860 --> 01:46.540 So we'll go outside of my statement and read a function which I'll call format currency and it will 01:46.540 --> 01:53.650 take the amount which comes as sense, and we'll just adjust that format it the way we want it to be. 01:53.680 --> 01:57.310 So I'll say let the variables see equal to that. 01:57.310 --> 02:02.680 I'll pass float to get it into the form that I want, which is a floating point number, the amount 02:02.710 --> 02:05.020 which I received as a parameter divided by one hundred. 02:06.280 --> 02:14.650 And then I will simply say return using c dot to local string, which I better spell. 02:14.650 --> 02:14.920 Right. 02:16.220 --> 02:19.800 And this is built right into pretty much every browser out there right now. 02:20.470 --> 02:21.850 My currency's Canadian. 02:21.850 --> 02:30.400 You can use whatever your currency is in yen for English, Deshchytsia for Canada and then curly brackets 02:31.690 --> 02:34.930 and close my curly brackets and it's really straightforward. 02:35.080 --> 02:37.540 I say style is going to be currency 02:40.180 --> 02:45.030 and the currency in my case is equal to see. 02:45.760 --> 02:49.840 Now you can use that value from the database and convert it to uppercase if you want to. 02:50.200 --> 02:53.260 But I only care about Canadian currency right now, so I'll just do it this way. 02:53.950 --> 02:59.890 So now that I have this function available, I can I can come back up here before I display the amount 02:59.890 --> 03:04.990 in that cell and simply say let cur for currency equal the function. 03:04.990 --> 03:10.300 I just wrote format currency and pass it I transaction amount. 03:11.920 --> 03:15.470 And down here where I create the text node, I'll put her in there. 03:17.710 --> 03:18.520 All right, let's try that. 03:18.790 --> 03:20.170 So make sure everything is running. 03:20.290 --> 03:20.980 Nothing else. 03:20.980 --> 03:22.870 So make start back. 03:25.660 --> 03:32.260 And I'll run air in case I have a typo, which I often do, go back to my Web browser, reload this 03:32.260 --> 03:33.370 to see if I'm logged in. 03:33.370 --> 03:33.860 I'm not. 03:33.880 --> 03:37.690 So let me log in admin at example. 03:37.690 --> 03:41.150 Dot com password p. 03:41.590 --> 03:45.460 S s w r d and try logging in. 03:46.240 --> 03:46.820 There we are. 03:47.380 --> 03:51.770 Let's go to admin all sales and they're they're displaying the way they should be. 03:52.390 --> 03:59.530 Now, if I go back to my database and look at my Transat or my orders and look at the content, I just 03:59.530 --> 04:00.630 delete everything in here. 04:00.640 --> 04:01.720 So I'll delete those. 04:05.600 --> 04:10.970 And come back here now and refresh this, it should give me the call span four with no data available 04:11.540 --> 04:12.220 and it does. 04:12.800 --> 04:13.190 All right. 04:13.250 --> 04:14.120 So that's pretty good. 04:14.660 --> 04:16.970 Now, obviously, there are more things we could do here. 04:16.970 --> 04:21.160 And you may have your own favorite JavaScript library for displaying tabular data. 04:21.170 --> 04:22.370 And that's easy enough to implement. 04:22.370 --> 04:23.900 There are many, many to choose from. 04:25.160 --> 04:29.960 The only other thing I really need to worry about at this point is what happens when I'm really successful 04:29.960 --> 04:32.800 and I have twenty thousand or 50000 orders. 04:33.470 --> 04:38.810 Right now, we're going to be getting all 50000 orders and trying to display them in a single table, 04:38.810 --> 04:40.390 and that's really inefficient. 04:40.520 --> 04:45.200 So we're going to want to chunk our data and we'll get started on that before too long before we do 04:45.200 --> 04:45.470 that. 04:45.710 --> 04:49.520 I have a challenge for you, which I'm going to give you in the next lecture.