Subtitles section Play video Print subtitles COLTON OGDEN: All right, I think we're alive now. Sorry for the delay. This is CS50 on Twitch. My name is Colton Ogden and today we're going to continue the stream that we did last week on Friday where we started implementing the game Snake from scratch. Recall, we ended up putting something together a little bit like this. So we had a little-- oh, sorry. I forgot to switch to actual machine over there. There we go. We had something that look a little bit like this. So almost like a little Etch A Sketch going but not exactly Snake in the sense that most people I think recognize Snake. But a lot of the pieces are still there. You know, we went from having a cube that moved across the screen to having a cube that sort of moved discreetly across the screen in like a grid sort of way. Talking about how we can actually divide our game space up into a grid, which allows us to then start transitioning into games like Rogue Lights and other games that are more tile based, which we could definitely get into in the future. And then we started talking about a Snake data structure and we talked about some basic drawing routines and Love 2D and all sorts of other stuff. Won't go too much into the details because the VOD will be up and this and the other video will also be going on YouTube. But today, a couple of the problems that we want to solve are one, make sure that when we do eat an apple in our game, rather than our snake kind of just drawing an infinite line, we want to actually get rid of the tail. We want to pop the tail while continuing to draw, you know, the head is just moving in another direction. And another big thing that we want to bite off today is making sure that when we collide with other parts of the snake that we trigger a game over, as I would have just done right there. And those are two sort of big pieces that we're going to bite off and they're actually not terribly difficult. I spent a little bit time over the weekend actually thinking through the problem and I was a little bit tired last time but we should be good today. And then if we do have time, which I think we will-- we're going to be on for a three hour stream today. We'll take a look at having an intro screen. Like a-- you know, the word snake, press enter to start because right now you kind of just get right into the action, which is a little bit tricky to jump just right into. And then also a game over screen so that when we do intersect with the snake, the game should stop. Maybe transition us to another screen with some text on it that says, "you've got a game over" and then display your score. [? Sue Leith ?] says hello. Hello, [? Sue Leith. ?] Good to see you. [? Bavick Night ?] says hey, how's it going. [? Bavick Night, ?] good to see you again. And [? Sue Leith ?] asks, will this be re uploaded? Yes. So last week's video and this video will be up-- uploaded to YouTube. They should be uploaded today, tonight, if not tomorrow morning. And the VOD from last week is actually-- should be accessible on this Twitch account. The get hub for the actual code itself is on this URL. So, github.com/coltonoscopy/snake50. And you'll be able to see the main.lua file that's in there just by itself. And recall main.lua is the entry point for LOVE 2D, which is the framework that we used last Friday. If unfamiliar, if you're just joining the stream for the first time, LOVE 2D is the framework that we're using to do all of the game programming. All the graphics, all the windowing, all the input, all that stuff. So you can go to love2d.org. By default, it should take you to a page that looks like this and then you can download the version of ProCreate for your operating system. So I'm on a Mac, I'm on Mojave, so you can just download here. If you want to download other versions and older versions, you have an option to do so here. [? Bavick Night ?] says glad to be here. Glad to have you, with us [? Bavick Night. ?] Thanks for joining. All right. So let's dive right in. Briefly I will just summarize the code that we have. So we have a constant table up here. So just a set of constants that just basically say, oh what's the window width and height? What's the tile size? Tile size being of our grid size, so we could think of it that way as well. The number of tiles on the X and Y. And then a few constants to represent particular slots in the grid whether a tile is empty, whether it's a snake head, whether it's a snake body, whether it's an apple. Those are the main sort of game play mechanics at play. And then lastly, a constant for the time in seconds that should elapse before the snake actually moves in an individual grid tile in the game. We have a few other variables here. So a font, a score, which is important, the actual grid for our tiles. This is the data structure that actually holds the zeros, one's, two's and three's that represent what's going on in our game world. The snake X and the snake Y, which is where the snake's head is located, whether our snake-- what direction or snake is moving in. Which, this should just probably be called local snake direction equals right. But we've already called it snake moving, so we'll just keep it that way. And then a snake timer because remember we do have to keep track of how much time has actually elapsed over the course of all the frames before we end up moving our snake. So we basically check snake timer against snake speed. If snake timer is greater than snake speed, then we should move to the next location. And then here, we do need a data structure to represent our snake. So because we need to make sure that we pop our tail off of the snake whenever we move, we need to keep track of all the nodes that we add to the snake as time goes on. [? Sue Leith ?] says, where did you learn all of this? Is there a Love 2D manual? So, yeah. Actually, Love 2D has some excellent documentation. So there's a very basic set of tutorials just on the main page. So here you can see there's some examples of basic application where you draw text, draw on image, play a sound. There are some full games you can take a look at. I believe some of these have source code and some of these are actually commercial Steam projects, which is cool. Which goes to show you that you can actually use this to make a published game on Steam if that's something that's of interest to you. The actual documentation is here. So at the very bottom right, you can just click on any of those modules and that will take you to the page for that. [? CPU Intensive ?] says, tall hair. Yeah, I know. I need a haircut super badly, like really bad. But if you go to love2d.org/wiki/love is where you can actually see the documentation. And there's a bunch of different name spaces here. Love, love.audio, love.data, love.event. We're going to be using pretty much just love.graphics. We use love.window, as well, and then the core functions that you can access in love. So love.load, love.update, love.draw. These are the functions that make up our game loop. If you're familiar, we talked about this last week. Every frame, which is usually 1/60 of a second. Love2D will execute some code in a function called love.update and love.draw each frame, update happening before draw. And at the very start of your program it'll call a function called love.load. Love.load sort of sets up everything, if you have some variables that need to be initialized or some resources that need to be loaded. Optionally, as we did up here, you could just put them at the very top of your script, and they'll all execute in advance in much the same way. But as is sort of tradition, you'll see a lot of these functions like love.window.setTitle, love.graphics.setFont, love.window.setMode, a lot of these functions that sort of set up the game, set up the state machine that is Love2D, in a sense. Those all exist here, as does setting the random number generator, which we did last week. And maybe initializing some data, and such. [? JPguy ?] says hello again. Hello, JP. Good to see you. I wanted to have the Twitch chat enabled in today's stream, but we're having a little bit of difficulties with Streamlabs. So we're going to try again. Next week we should actually have the embedded chat in the final video, so that folks watching online on YouTube or what not after the fact can see what people in the chat saying.