1 00:00:00,550 --> 00:00:01,880 All right. 2 00:00:01,910 --> 00:00:05,930 Your head must be spinning because of all these looping. 3 00:00:05,930 --> 00:00:06,250 That's. 4 00:00:06,410 --> 00:00:07,420 That's a really bad joke. 5 00:00:07,430 --> 00:00:11,540 But I thought it was funny because I've been recording for hours now and I think I'm going a little 6 00:00:11,540 --> 00:00:11,990 kooky. 7 00:00:11,990 --> 00:00:15,060 So this is going to be my last video for the day. 8 00:00:15,110 --> 00:00:16,360 Now for the course. 9 00:00:16,370 --> 00:00:19,060 But we're gonna do a little fun exercise. 10 00:00:19,160 --> 00:00:21,410 Now I call all exercise is fun. 11 00:00:21,410 --> 00:00:25,660 Obviously I'm biased but this one this one's especially fun. 12 00:00:25,670 --> 00:00:28,490 Where are we going to do well. 13 00:00:28,550 --> 00:00:35,210 We're going to simulate what a computer does when when we have something like a graphical user interface 14 00:00:35,600 --> 00:00:40,490 that is a computer is able to display let's say even an image over here right. 15 00:00:40,490 --> 00:00:44,450 I can see the robot over here I can see the mouse. 16 00:00:44,480 --> 00:00:46,420 This is a graphical user interface. 17 00:00:46,430 --> 00:00:49,130 I see pictures I see images on my screen. 18 00:00:49,130 --> 00:00:53,060 These pixels on my screen and I can control them. 19 00:00:53,120 --> 00:01:00,620 Well we're going to create a basic version of this to show you how a computer would work just from the 20 00:01:00,620 --> 00:01:02,520 stuff that we've learned up until now. 21 00:01:02,600 --> 00:01:05,600 Using loops and using conditional logic. 22 00:01:05,600 --> 00:01:06,950 So what are we going to do. 23 00:01:08,210 --> 00:01:10,900 Well this is the exercise. 24 00:01:11,090 --> 00:01:17,420 And you can check out the reptile here or you can recreate this or again in this video you should have 25 00:01:17,420 --> 00:01:22,260 resources attached that you can play with it yourself. 26 00:01:22,340 --> 00:01:27,440 And what I want you to do is I want you to loop through this list of lists. 27 00:01:28,070 --> 00:01:37,650 And every time you encounter a zero I want you to display on the screen over here an empty space because 28 00:01:37,720 --> 00:01:41,280 zero in a computer denotes nothing right. 29 00:01:41,280 --> 00:01:43,830 We want a blank on the screen. 30 00:01:43,830 --> 00:01:51,510 However when I see a one I want to simulate a pixel right that tiny tiny dot on our computers that can 31 00:01:51,510 --> 00:01:53,190 be full of colors it could be green. 32 00:01:53,190 --> 00:01:55,170 It can be blue can be orange. 33 00:01:55,170 --> 00:02:00,090 But for our case I want it to be a star and using that. 34 00:02:00,090 --> 00:02:06,450 I want you to create a program that takes this picture that let's say is in our database or in our computers 35 00:02:06,450 --> 00:02:12,660 hard harddrive and displays it on the screen using space for multiply. 36 00:02:13,080 --> 00:02:20,260 And all I want you to do is when I click Run I want you to display that image right here. 37 00:02:20,340 --> 00:02:20,760 All right. 38 00:02:20,760 --> 00:02:24,230 This is a little tough one and I'm kind of letting you figure out on your own. 39 00:02:24,240 --> 00:02:28,530 But trust me you've learned all the tools necessary to do this. 40 00:02:28,560 --> 00:02:29,580 Pause the video. 41 00:02:29,760 --> 00:02:30,390 Give it a go. 42 00:02:30,900 --> 00:02:32,690 Otherwise I'm going to show you how it's done. 43 00:02:34,280 --> 00:02:38,950 So the very first thing I like to do is to think about what I'm about to do. 44 00:02:39,050 --> 00:02:40,920 I want to make sure that we have a plan in mind. 45 00:02:41,000 --> 00:02:48,190 So I'm going to comment first and I'm going to say well we definitely want to iterate over a picture. 46 00:02:48,400 --> 00:02:49,190 Right. 47 00:02:49,250 --> 00:02:51,680 So we're going to do some sort of iteration here. 48 00:02:51,680 --> 00:03:05,970 So that's number one and then in here I want to say that if it's a zero then I want to print an empty 49 00:03:05,970 --> 00:03:17,460 space and if it's a one I want to print a star. 50 00:03:17,520 --> 00:03:17,900 All right. 51 00:03:17,910 --> 00:03:18,840 So that's the plan. 52 00:03:19,680 --> 00:03:19,890 OK. 53 00:03:19,890 --> 00:03:24,080 So this shouldn't be too hard actually. 54 00:03:24,300 --> 00:03:32,490 Before you get started in order for this to work you need to google a special parameter or special option 55 00:03:32,490 --> 00:03:40,140 that you can give the print function and as a matter of fact the print function that you need to add 56 00:03:40,140 --> 00:03:44,840 or the option that you need to add is this and option. 57 00:03:45,060 --> 00:03:52,730 And if we scroll down it doesn't display that well I can see here string appended after the last value. 58 00:03:52,930 --> 00:03:56,670 So the default when we print something is a new line. 59 00:03:56,710 --> 00:04:00,620 But ideally we might not want a new line. 60 00:04:00,670 --> 00:04:06,120 So when that happens you might have to use this and option. 61 00:04:06,170 --> 00:04:08,030 Now I know I left it really vague. 62 00:04:08,030 --> 00:04:08,360 I want to. 63 00:04:08,390 --> 00:04:13,520 I want you to practice googling this and and figuring out from your mistake you're gonna have a bug 64 00:04:13,550 --> 00:04:21,230 when you create this code when you try to display this information but try to solve it using the tools 65 00:04:21,230 --> 00:04:24,280 that you have of problem solving. 66 00:04:24,280 --> 00:04:25,330 All right enough talk. 67 00:04:25,330 --> 00:04:31,260 Let's get to it so the first thing I want to do is iterate over the picture. 68 00:04:31,360 --> 00:04:41,010 I'm going to say for image in the picture because well this is one picture right here. 69 00:04:41,050 --> 00:04:47,140 So this is the picture but it's inside of a list because we can have multiple pictures and then I'm 70 00:04:47,140 --> 00:04:52,510 going to loop once again over this individual list. 71 00:04:52,510 --> 00:04:59,050 So once again I need to do a for loop and this time I want to say for pixel because each one of this 72 00:04:59,050 --> 00:05:03,570 is a pixel in the image. 73 00:05:03,570 --> 00:05:06,070 So this is a nested for loop. 74 00:05:06,100 --> 00:05:15,960 Now I'm going to add a conditional and say if pixel equals one then I'm going to 75 00:05:19,040 --> 00:05:24,320 a star. 76 00:05:24,540 --> 00:05:25,230 Otherwise 77 00:05:28,090 --> 00:05:33,320 I'm going to print an empty string. 78 00:05:33,320 --> 00:05:35,960 Well maybe not empty right. 79 00:05:35,960 --> 00:05:41,990 Because we do want a space a blank space in the image. 80 00:05:42,020 --> 00:05:44,980 All right so let's see if this works. 81 00:05:46,240 --> 00:05:52,610 If I click Run that's not really why I wanted. 82 00:05:52,850 --> 00:05:57,990 I want a clear image here but I'm just getting things one in line. 83 00:05:58,130 --> 00:06:07,840 And remember this was the little trick where a print every time it prints it creates a new line the 84 00:06:07,840 --> 00:06:18,240 default again if we close this you'll see is that end equals to this escape sequence of new line. 85 00:06:19,170 --> 00:06:28,430 So we can change that by simply saying star comma end and then I'm going to say for the end I don't 86 00:06:28,430 --> 00:06:37,980 want a new line I just want well a string but an empty string and same over here I do comma 87 00:06:41,800 --> 00:06:46,470 and and if I click Run All right. 88 00:06:46,950 --> 00:06:52,590 It's getting a little bit better but now I have an issue where we don't have any new lines. 89 00:06:52,600 --> 00:06:55,820 Everything is on one line. 90 00:06:56,290 --> 00:06:56,920 That's not good. 91 00:06:56,920 --> 00:06:58,990 How can we solve this. 92 00:06:58,990 --> 00:07:05,590 Well ideally the end of this first loop where we're just going. 93 00:07:05,590 --> 00:07:10,840 The image or the line in the image at the end of this. 94 00:07:11,020 --> 00:07:13,650 We create a new line right here. 95 00:07:13,870 --> 00:07:14,580 Right. 96 00:07:14,590 --> 00:07:22,500 So again looking at the indentation I don't want a new line on every pixel which we had the first time. 97 00:07:22,500 --> 00:07:31,720 But I also want to add a line between the lists of rows so maybe a better name for this will be a row 98 00:07:31,990 --> 00:07:38,890 in picture and in here I'm going to add the end of this for loop. 99 00:07:38,890 --> 00:07:48,250 So after we're done looping through the entire row at the bottom here I'm going to print an empty line. 100 00:07:48,250 --> 00:07:52,350 But remember the default is going to be a new line. 101 00:07:52,440 --> 00:07:53,700 So again an empty string. 102 00:07:53,700 --> 00:07:55,630 It's going to default to a new line. 103 00:07:56,100 --> 00:08:04,990 And we're still going to have this code if I run this so I get an error because image is not defined 104 00:08:05,020 --> 00:08:07,180 because I've just changed this to a row. 105 00:08:07,200 --> 00:08:14,270 So let's do row here click Run and look at that. 106 00:08:14,350 --> 00:08:16,810 We have our beautiful Christmas tree. 107 00:08:16,900 --> 00:08:18,280 If you don't think this is beautiful. 108 00:08:18,310 --> 00:08:25,110 This is the best I could but this is a Christmas tree and we finally have a display. 109 00:08:25,110 --> 00:08:31,320 We've used loops we've used conditional logic and we used a little googling to figure out hey we we 110 00:08:31,320 --> 00:08:32,700 need this option. 111 00:08:33,090 --> 00:08:36,000 Now our code works. 112 00:08:36,000 --> 00:08:42,060 But I want to do something better here and in the next video I want to clean up this code a little bit 113 00:08:42,720 --> 00:08:46,620 and cover a very important topic when it comes to programming. 114 00:08:46,740 --> 00:08:47,990 I'll see on that one by.