Anvil: Web apps with nothing but Python Transcripts
Chapter: Rounding out the UI
Lecture: Loading averages for compare
0:00 The next step to complete are compare yourself
0:02 to the average person of your height and gender
0:05 is to load up a bunch of averages.
0:08 You know, if you are this height and this gender
0:10 here are your average heart rates
0:12 and average weights and so on.
0:15 I've already dropped in an app here.
0:17 It's very similar to the Fitnessd client
0:20 at least the terminal command line version of it.
0:23 So this is in the GitHub Repo for you to work with.
0:26 But let's go and have a quick look.
0:28 I guess we could clean up some things here.
0:31 So what it's going to do is it's going to go to the service
0:33 and see if the averages exist and not re-upload them
0:37 because then we'd end up with weird duplicates.
0:39 And then it's going to load some CSV data.
0:41 So if you look over here, I've just going to the internet
0:43 and found some probably highly inaccurate
0:46 or at least maybe tilted data around gender and height
0:51 and heart rates and things like this.
0:54 Oh, it just says height and weight.
0:55 They're just height and weight over here.
0:57 And then we're going to take
0:59 we have 10000 rows of this
1:01 and then we're going to process it
1:02 and come up with averages.
1:03 If you're 71 point something inches tall
1:07 then this is the average weight of these measurements.
1:10 If you're 72, and so on.
1:12 And then we're going to upload those really simply here.
1:15 It's using the same authentication mechanism as before.
1:19 Here's where it's computing the averages.
1:20 And then we just did to not upload some when we're testing.
1:24 This is kind of useless line now.
1:26 We're going to go and upload those to the service
1:29 and what we've done is we've added another load average
1:34 function over an.
1:35 So let's look at that real quick.
1:38 So down here, we have a data loader service
1:41 and I've moved the authentication step
1:43 that we wrote before from management
1:45 sorry from the API, over into the separate modules
1:47 so that data loader in API can use it.
1:50 And we're just going to upload a bunch of weights
1:53 heights, genders and heart rate information and save that
1:56 as an average, as I've described before.
1:59 There won't be too many of them.
2:00 Once we average out, it's like 40-some, 41
2:03 something like this.
2:04 We also want to know are there any averages.
2:08 Right, so what you're going to do is we're actually on that
2:11 compare page only show the compare results
2:14 if I even attempt to continue if there are some averages
2:18 uploaded, okay.
2:19 So if we run it now, then we go to compare
2:23 it says, sorry, you don't have any information about
2:25 a male who's five feet 11.
2:28 Actually I've done a little bit more work
2:30 to work with these API end points here
2:34 in this compare 'cause not a lot of sense for you
2:37 watching me do this the whole time.
2:38 So let's just a quick look.
2:41 So it comes in and it's going to ask for
2:44 your averages and let's see what else does it
2:47 Use this count thing.
2:48 So what it's going to do is it's going to ask for your average.
2:51 This is a function on the server side that says
2:54 I'm this tall, I'm this gender.
2:56 Do you have an average for me
2:57 'cause maybe, you know like I said
2:58 we're just randomly grabbing a bunch of measurements
3:00 and turning those into averages.
3:02 So we might not have one for you
3:04 which would be unfortunate
3:05 and you might, may or may not have measurements
3:07 so if you have measurements in an average
3:09 then we're going to build this out here.
3:13 And we're going to hide and show these cards.
3:15 I also added two little quick functions
3:17 the computer a foot statement
3:20 so, like, five feet 11 inches out of just pure inches
3:24 71 inches for example.
3:25 And then computing the sign
3:27 so we want to show you're five pounds heavier
3:31 or five pounds lighter than the average person
3:33 of your height.
3:35 And I just want to reiterate this data is super sketchy
3:38 and please don't take any of this as, like, accurate
3:41 like look at real medical data and stuff
3:43 if you care about this.
3:44 This is just a silly example and we just need some data
3:46 that kind of sort of works.
3:47 That's where that is.
3:49 We're going to run this application here to upload it
3:53 all right, and we've already gone through
3:56 building this application before
3:57 so we don't need to do it again, right.
3:59 We basically did this with our interactive
4:02 our fake mobile app or whatever.
4:05 Okay, so I'm just going to run this and we'll see what we get.
4:08 So it's running.
4:09 It found no data on the server, so it's going to load it.
4:12 It loaded 10000 entries.
4:15 It then computed 41 averages
4:18 by averaging that data
4:20 and then it is uploading stuff
4:22 so we'll give that a second.
4:24 We don't have any data on heart rate
4:26 so I just said, well, the rate is 80.
4:28 I don't even know if that's good or not
4:32 and it probably varies from male to female
4:33 but it's 80.
4:34 It doesn't really mean anything. We just need a number there.
4:35 All that data is uploaded.
4:36 If we go over here and we go back to our data tables
4:41 we should have data in our averages table.
4:45 Here you go!
4:46 We have a bunch of stuff on males
4:47 a bunch of stuff on females
4:48 and their heights and then their weights and so on.
4:51 Again, super sketchy data
4:52 but here it is.
4:54 So for the grand finale
4:55 let's run this and we'll see over here
5:00 in this compare, it's going to go and do a filter
5:04 for this height, this gender, and so on.
5:07 You get an average.
5:08 It's going to take your latest measurement
5:10 and it is going to...
5:12 Here's your latest measurement.
5:14 And it's going to set the average as far as it's concerned
5:17 average weight, and it's going to compute your weight
5:18 and the change relative to the average
5:21 and it'll put a plus or minus and then the value.
5:24 So let's run that see what we get.
5:25 All right, let's compare. Compare me. Alright.
5:29 The average person my size, their weight is 201.9.
5:32 Their heart rate, surprise, is 80 beats per minute.
5:35 I weigh, according to my last measurement, 181
5:39 which is 21 pounds less than average
5:42 and my heart rate was 74, which is 6 beats per minute
5:46 less than average.
5:47 Again, contrived data, semi-contrived.
5:50 I did get it from somewhere but I don't know
5:52 how representative it is.
5:53 Anyway, here's our cool little compare ourself.
5:56 And we were able to use our API and some scripts
5:59 to load up that data and to compute that data.
6:01 And I think that's a really cool aspect of it as well.
6:04 This should be it for our UI.
6:06 We've got home. We've got add.
6:10 We've got compare. We've got our account.
6:13 Now, we haven't the go_pro part
6:14 but that's going to be the e-commerce stuff.
6:16 And then if we log out, finally we have
6:19 this unauthenticated home page
6:21 and then you try to go anywhere, it just says login.
6:24 Okay, that's it. The UI for our app is done.