1 00:00:03,740 --> 00:00:06,980 In this lecture, we're going to finish off our timer script. 2 00:00:06,980 --> 00:00:13,400 We're going to be calculating the fill amount for our timer image, which will connect up in the next 3 00:00:13,400 --> 00:00:14,150 lecture. 4 00:00:14,150 --> 00:00:19,220 And we're also going to add a couple of additional hooks that our quiz script can use to talk to our 5 00:00:19,220 --> 00:00:19,940 timer. 6 00:00:19,970 --> 00:00:21,470 So let's dive in. 7 00:00:22,420 --> 00:00:26,440 So next, let's have a look at the fill fraction for our image. 8 00:00:26,440 --> 00:00:28,020 So over on our quiz canvas. 9 00:00:28,030 --> 00:00:35,110 If we go down to our time image, our fill amount is ranging anywhere between one and zero. 10 00:00:35,140 --> 00:00:40,960 So we want to say, based on the amount of time that we've given our timer, we want to normalize that 11 00:00:40,960 --> 00:00:44,380 between zero and one and return a fraction. 12 00:00:45,170 --> 00:00:48,290 So let's jump back to our script for a little bit of math. 13 00:00:48,290 --> 00:00:52,280 And I'm actually going to change our if statements here just a little bit. 14 00:00:52,280 --> 00:00:54,270 I'm actually going to change them around. 15 00:00:54,290 --> 00:01:03,050 So instead what I'm going to do is say if the timer value is greater than zero, then we want to figure 16 00:01:03,050 --> 00:01:06,950 out this fill fraction amount for our time image. 17 00:01:07,460 --> 00:01:11,810 Else we want to change the timer over and set all our values. 18 00:01:11,810 --> 00:01:14,720 So a little bit of a change there, but nothing too drastic. 19 00:01:14,720 --> 00:01:21,080 It's just reframing our if statement and this is just a personal preference thing of mine, so feel 20 00:01:21,080 --> 00:01:24,860 free to leave yours as we've had it if you prefer it that way. 21 00:01:25,430 --> 00:01:30,050 So on to figuring out this fill fraction amount for our image. 22 00:01:30,710 --> 00:01:35,000 At the top of the script, let's create a new variable to store that value. 23 00:01:35,710 --> 00:01:42,550 This value is again going to be needed by our quiz script so it can adjust the actual image sprite on 24 00:01:42,550 --> 00:01:43,600 our canvas. 25 00:01:43,720 --> 00:01:46,090 So let's make a public float. 26 00:01:46,090 --> 00:01:50,620 And again, you may want to make this private and add getter methods and things like that. 27 00:01:50,620 --> 00:01:56,320 But again, it's a very small game and I'm not too worried about lots of things trying to change this. 28 00:01:56,500 --> 00:01:59,290 And I'm going to call this the fill fraction. 29 00:02:00,920 --> 00:02:02,300 With our variable set. 30 00:02:02,300 --> 00:02:07,820 Let's head back down to update timer and figure out what's going to go in this if statement. 31 00:02:08,360 --> 00:02:14,390 Well, with a little bit of very simple math, we can just say that the fill fraction is going to be 32 00:02:14,390 --> 00:02:19,410 equal to the current time of value divided by. 33 00:02:19,430 --> 00:02:23,930 In this case, the time to complete question to explain this math. 34 00:02:23,930 --> 00:02:25,880 So I'm not just giving you code. 35 00:02:26,240 --> 00:02:30,860 Let's imagine that we have a time to complete question of 10 seconds. 36 00:02:31,710 --> 00:02:35,040 And a time of value of 5 seconds. 37 00:02:35,710 --> 00:02:44,470 This gives us five divided by ten, which would give us 0.5, so a half would be halfway through our 38 00:02:44,470 --> 00:02:45,160 time. 39 00:02:45,820 --> 00:02:49,180 If we instead change our timer value to say zero. 40 00:02:49,180 --> 00:02:50,620 So it's just run out. 41 00:02:50,620 --> 00:02:52,960 This would give us zero divided by ten. 42 00:02:52,960 --> 00:02:54,760 Which would give us zero. 43 00:02:55,530 --> 00:03:01,350 And at the other extreme of this, if we had a time of value of ten, so it's just started, we'd have 44 00:03:01,350 --> 00:03:03,720 ten divided by ten would give us one. 45 00:03:03,900 --> 00:03:09,960 So our fill fraction has been nicely constrained between zero and one, which is what our UI element 46 00:03:09,960 --> 00:03:13,830 expects, and everything should work nicely. 47 00:03:14,310 --> 00:03:20,190 So with our math done, let's just copy and paste this line and drop it into our other if statement 48 00:03:20,190 --> 00:03:22,500 below, so in our else block. 49 00:03:23,040 --> 00:03:29,730 But this time we're going to say that the fill fraction is equal to our time of value, divided by our 50 00:03:29,730 --> 00:03:31,590 time to show correct answer. 51 00:03:32,360 --> 00:03:38,330 And to test this out, let's go down to our debug log message here and let's add a bit more detail to 52 00:03:38,330 --> 00:03:40,730 this so we can see exactly what's going on. 53 00:03:40,730 --> 00:03:44,150 So let's add the is answering question toggle. 54 00:03:46,020 --> 00:03:50,340 But then going to have our current time of value for that state. 55 00:03:51,750 --> 00:03:54,740 And then finally we're going to add in our Phil Fraction. 56 00:03:54,750 --> 00:04:00,480 So this is just for testing, so it doesn't matter how pretty it looks, but hopefully this format should 57 00:04:00,480 --> 00:04:02,370 look okay in unity. 58 00:04:02,520 --> 00:04:06,420 So let's save up our script and jump back into Unity to test this out. 59 00:04:07,090 --> 00:04:10,450 If we clear our console, let's go ahead and hit play. 60 00:04:11,160 --> 00:04:16,709 And if we pause very quickly, we can see here that we are currently in the answering state. 61 00:04:16,920 --> 00:04:21,120 The answering state, if you remember, has 5 seconds on the clock. 62 00:04:21,269 --> 00:04:27,420 So here with 3 seconds left on the clock, we're around 0.6 of the way through. 63 00:04:27,900 --> 00:04:33,330 And if we carry on playing just a little bit more and let that timer run down, we'll see that as the 64 00:04:33,330 --> 00:04:37,710 timer runs down, the fill fraction gets closer and closer to zero. 65 00:04:37,710 --> 00:04:44,430 So here with 0.4 seconds left on the clock, we have a fill fraction of around 0.08. 66 00:04:45,000 --> 00:04:52,050 Let's carry on playing to see that tick over here we can see the answer state is now false. 67 00:04:52,050 --> 00:04:55,680 So we're in the showing correct answer phase of our game. 68 00:04:56,220 --> 00:05:03,300 We've got around 9 seconds on the clock and a fill fraction of around 0.9, so almost completely full. 69 00:05:03,690 --> 00:05:06,210 So our timer is working nicely. 70 00:05:06,210 --> 00:05:12,210 It's quickly changing states when we need it to, keeping track of the remaining time in that state 71 00:05:12,210 --> 00:05:19,050 and also giving us a nice fractional value that we can pass over to our quiz script to update our timer 72 00:05:19,050 --> 00:05:19,740 image. 73 00:05:20,800 --> 00:05:26,590 There are two more things that we want to do in this time of script, so let's jump back. 74 00:05:27,270 --> 00:05:32,640 One thing I'm going to want in here is another public variable, which will talk to our quiz script 75 00:05:32,640 --> 00:05:36,390 and let it know when it needs to show the next question. 76 00:05:36,600 --> 00:05:41,310 So let's create another public bool and let's call this load. 77 00:05:41,310 --> 00:05:42,480 Next question. 78 00:05:43,730 --> 00:05:46,910 We want to set this to true in our timer script. 79 00:05:46,910 --> 00:05:49,820 So let's have a think about where this should live. 80 00:05:50,550 --> 00:05:54,990 And if we run through the logic, we won't say that if we are not answering a question. 81 00:05:54,990 --> 00:05:56,170 So we're going to be in our else. 82 00:05:56,250 --> 00:05:59,370 BLOCK And the timer has also run out. 83 00:05:59,370 --> 00:06:04,950 So essentially where we're setting this is answered question to true and resetting our timer value, 84 00:06:04,980 --> 00:06:10,260 we're also going to set load next question to true in here as well. 85 00:06:10,860 --> 00:06:16,800 Now you might be wondering why we're not just reusing this is answering question and that's because 86 00:06:16,800 --> 00:06:18,870 we want to be able to set this load. 87 00:06:18,870 --> 00:06:21,990 Next question to false from our quiz script. 88 00:06:21,990 --> 00:06:26,220 And it doesn't really have anything to do with the logic of the timer itself. 89 00:06:26,220 --> 00:06:32,610 It's purely a hook into our timer script that will become a lot clearer when we actually hook it up 90 00:06:32,610 --> 00:06:33,980 in the next lecture. 91 00:06:33,990 --> 00:06:38,640 So for now, just put a pin in that for the moment and we will come back to it. 92 00:06:38,970 --> 00:06:46,410 But the last thing for this script is going to be a way of cancelling our timer early, because once 93 00:06:46,410 --> 00:06:51,990 we've answered a question in our quiz, we don't want to have to sit and wait for this full 30 seconds 94 00:06:51,990 --> 00:06:52,770 to run out. 95 00:06:52,800 --> 00:06:55,410 We want to jump straight to the solution. 96 00:06:55,650 --> 00:06:58,320 So let's create another method in here. 97 00:06:58,320 --> 00:07:03,780 And this one is going to be public this time so that our quiz script again can talk to our timer. 98 00:07:04,110 --> 00:07:05,910 It's not going to need to return anything. 99 00:07:05,910 --> 00:07:09,210 So let's make it void and we'll call it cancel timer. 100 00:07:11,750 --> 00:07:13,490 This is super simple. 101 00:07:13,490 --> 00:07:17,480 So I have a quick think and see if you can figure out what this is going to do. 102 00:07:17,810 --> 00:07:23,450 And I'm not going to give you too long or this is going to do is set our timer value equal to zero. 103 00:07:23,810 --> 00:07:30,980 So in our update timer, this will basically just hotwire this timer value minus equals delta time. 104 00:07:30,980 --> 00:07:36,890 It will throw timer values straight to zero so that when we hit our if statement, it's going to change 105 00:07:36,890 --> 00:07:38,360 its state for us. 106 00:07:38,570 --> 00:07:46,340 So that is our timer script all set up quite a lot of work in this one little script, in this one video, 107 00:07:46,430 --> 00:07:51,560 but in the next lecture we're going to hook it all up to our quiz script and actually see our timer 108 00:07:51,560 --> 00:07:53,450 in action on the canvas. 109 00:07:53,900 --> 00:07:55,370 So I'll see you there.