Placeholder Image

Subtitles section Play video

  • All right.

  • Hello, world.

  • This is CS 50 on Twitch.

  • My name is Colton Ogden.

  • And, uh, today we're going to a little bit of game development.

  • So last week we looked at a C T f.

  • Which was a capture the flag thing with Nick, which was super cool.

  • We're actually into apart to event next a week.

  • Nick is currently on spring break right now.

  • Um, and then later on this week, we're gonna actually take a dive into something completely different.

  • Spark a R.

  • Which Connor Doyle, one of CIA cities producer, is going to sort of lead.

  • So thanks, everybody who's in the chat right now we have a ton of people already socialist.

  • Everybody.

  • I have been chatting with them before break here or before the while.

  • We had the music sort of coming in, but it feels like it's been a little while since we've done a game from scratch.

  • I think by myself, I might be misremembering, but let me go ahead, and I'm actually gonna switch over to my laptop over here, which is I'm realizing, not plugged in.

  • Only crap.

  • I didn't even like my laptop whips.

  • Um, well, while while we get that set up?

  • Um, I want to shout out.

  • Actually, my dad who suggested that we do today's stream, so I think he was considering potentially making a slot machine himself in, um, in Java script.

  • Here we go.

  • My laptop is all set up.

  • Thanks.

  • I appreciate it.

  • Um, and so he was like, how would you implement a slot machine, You know, in rah Java script?

  • And I, uh, not asked, really, with javascript as I am with, um, Lou and love to D and stuff like that.

  • Um, but, you know, I sort of have the mental model as a game programmer what I would do to get it working in Java script, and I think I'd have to find an A p I or something to get it working.

  • You know, I probably use something phaser.

  • If I were doing it in Java script or maybe even with raw Java script, I could figure out ways to do it with the dibs and whatnot in images and maybe Jake weary.

  • But you're gonna do a stream on.

  • Actually, I think next week, next Friday.

  • Um, but we're going to implement it in love to D, which is a framework that I am more familiar with to see how you would use it in the context of something like a proper to D game development framework.

  • Um, and as Lee T.

  • Who has popped up in the chats Asshole, Everybody under one and that's a rule.

  • Points out that last time we did a game was actually on my birthday.

  • Was that cookie clicker?

  • If I'm not mistaken, I think it might have been, um so I'm going to pull up a actually, let me go ahead.

  • And I'm going to just switch my screen off here for just a second because I realized that I need to grab the images off of my email.

  • So give me one second here.

  • So you have my dad suggested that, you know, let's do a slot machine example.

  • Because you know, he's learning how to do drop a script.

  • You wanted to a slot machine, and actually, he was kind enough to put together the artwork for today's game.

  • So shot us to my dad for doing that as well.

  • Im going thio, pull those up here and whips.

  • I am just messing up all over the place here.

  • Um, what we get that up and running house Everyone's day.

  • Let me know how what people are doing and what they're working on and what they're interested in seeing you know in the future, for for the show, Binary warrior says, Isn't Jake weary kind of dying out at this point?

  • Um, and to a to a degree, I would say, Probably, Yeah, um, it's definitely not quite as used as it used to be, but the reality is that it's still used in a lot of applications, is still very much used in legacy.

  • And things like bootstrap, which are very much in use now, still use Jake Worry underneath the hood and as they're active as an act of layer for, um, interfacing with the more dynamic widgets within the library within the framework.

  • So I would say kind of probably it's dying out, especially with things like React doing a lot of making, taking care of a lot of the things that Jake worried was really useful for in the past and things like the Fetch a P I, which Jake where it was really used for a lot of Ajax related stuff, but it still very much used, um, still and probably will be used for a long time.

  • But I think that I think the transition that I'm sort of feeling is that people are moving, um, towards a less j query focused.

  • Certainly at least unless Jake we focused approach to the front and it used to be a major component of front of applications and now react a sort of saw planted, that react view angular, those types of frameworks.

  • Um oh, I'm sure asks what is a slot machine, and actually, that's a great point.

  • We're going to bring up exactly what that is, and I have just finished downloading the images.

  • Let me.

  • I think it's now.

  • I could bring my computer back onto the screen like that Boom.

  • And then I'm going to just go ahead and downloads, Grab my pinks folder here and drag that over to a new folder.

  • J.

  • Harvard Dev Streams slot machine.

  • So here, I'm just gonna make a new folder.

  • We're gonna bootstrap this application the way we do with all of our love to the applications with a new folder, and I'm gonna show you the tools that we're using here in just a second as well.

  • I just wanna make sure all the files are in the right location.

  • Slot machine graphics.

  • Let's go ahead and bring those PNG files over here like that.

  • And then now, now, let's go ahead and talk about, um, what a slot machine is, because that's actually a valid point.

  • So slot machine is something like this.

  • You might be familiar if you've seen a casino.

  • Where've you been?

  • To Las Vegas.

  • If you played any games that might have a gambling sort of aspect to them, a slot machine is essentially a box that you put a coin inside of.

  • Or so however amount of money that the machine takes might take chips might take paper, might take coins.

  • And, uh, I think traditionally used the lever toe actually get it to work in this day and age.

  • Most slot machines or just digital see, press it while they're not purely digital, but they're typically mostly digitized in that you press a button the button, will fig fire off some bit of code that will either scroll virtual wheels or physical wheels?

  • These three things here and, um actually, maybe we can go.

  • We can see, like a slot machine Example on YouTube or something.

  • Goto a slot machine.

  • Example.

  • Um so something like this where you have ah, you press a button and I'm gonna make sure I don't know what the audio is going to sound like.

  • Um, where do we have actual gameplay of it?

  • So you have.

  • It's hard to tell in this example.

  • Um, you think that there would be like, a nice, really easy like ho?

  • Here's what a slot machine is.

  • Let's see this work.

  • Okay, so let's get it to go.

  • The problem is that slot machines these days air so complicated they have, Ah, like a billionaire.

  • There's a perfect example right there.

  • So you press the button, you have all these rows of things that move, you know, vertically, right.

  • You have different rose, and if you match any row in your slot machine, and in today's example, we're just using a single rose.

  • But if the all these symbols are the same, you'll get a different reward, depending on how, like how rare that symbol is in your pool of symbols, for example, you might have a ah selection of different types of fruit, which is what we're actually gonna be doing today, and maybe you want oranges to be really rare.

  • Maybe you only want one orange and every row of symbols, but maybe you want pineapples to be more common, so maybe you have two pineapples in your row, so maybe a pineapple orange pineapple.

  • So therefore, you're twice as likely to get your wheel to end in a pineapple as it is to end in an orange.

  • And then you could do the same thing by may be adding three apples to your roast.

  • You have apple, pineapple, apple, banana, apple, orange or whatever.

  • The ratio is so more apples equals more chance to get apples, which means that you get less reward for matching a row of apples versus matching a row of pineapples versus matching a row of oranges or whatever you want.

  • Thio.

  • However, you want to structure your your reward system, but this is how casinos typically look with their slot machines.

  • Now they're very complicated.

  • They have a lot of rose, but the sort of I guess, more iconic illustration of what a slot machine looks like.

  • How I think they traditionally looked before, you know, Vegas blew up and there's a 1,000,000 different slot machine vendors is something that looks like this.

  • This is the archetypal, archetypal sort of iconic slot machine.

  • And actually, it's very iconic for there to be sevens as sort of the jackpot symbol.

  • So a jackpot just means you get a ton of money when you when you match all three sevens, right?

  • It's way more than any of the other rewards that you get today.

  • We're actually gonna be using not seven, but more appropriately 50.

  • That'll be our our jackpot number.

  • And we may not have time necessarily to get into, uh, actually implementing it.

  • I mean, it would be fairly easy to implement a jackpot.

  • It's a little bit tougher to test because it's all luck based, and it's statistic statistical rat.

  • But, um, the code behind actually detecting matches and choosing you know what's what's more rare versus other things.

  • That's all stuff that will have time to cover today.

  • So this is what a slot machine looks like, and this is sort of how we're going to be going around implementing it.

  • Um, now, there was a, um, graphic, actually, that I had set up in advance.

  • So actually, I'm going to cut my slide up off of Sorry.

  • I'm going to get my computer feet off of there for just a second and grab some images that is sort of prefabricated.

  • Um, in the meantime, I'll answer some chat questions.

  • Bab ignite asks.

  • Is this based on total probability concept?

  • I'm not entirely sure I have to maybe recently Google What?

  • That means Slot machines are based on probability.

  • So you have, you know, by waiting which symbols are in each pool in each sort of really on your machine.

  • You do therefore influence the odds off.

  • Whether you get you know, the sevens will usually be very rare.

  • There only be 17 per row.

  • There used to be 20 symbols per slot, so you'll have 2020 and 20 all vertically oriented or in a wheel you can sort of think of and, um, by having 17 versus having maybe five apples or four oranges.

  • You make the seven very rare to match, especially if you multiply that factor by three, you know, going 17 out of 20 times 17 out of 20 times 17 out of 20 on.

  • I think that adds up to being what whatever 20 to the third power is, which I think is what What would that be won over 80,000?

  • Something like that.

  • Or one over 8000?

  • That's your chance of getting a jackpot, I think in that model, although the numbers might be, it might be slightly different because you're especially when you start getting into choosing random offsets after you end up actually slowing down the wheel.

  • We'll see how that all works out.

  • Um, but oh, yeah, nice as they kindly plug a lever based slot machine there in the chat.

  • So I'm just I'm gonna separate account.

  • I'm grabbing all the images that I put together in advance.

  • I'm just going to grab that go down tear.

  • So apologize.

  • Just give me one second.

  • If anybody's been working on their own games, Definitely no, because I'm very curious if anybody's doing their own game development.

  • Like I said, I think it's been two or three weeks, three weeks, maybe since we've done game any game development streams, um, with microprocessors now ubiquitous the computers inside modern slot machines a lot manufacturers to assign a different probability to every symbol on every real right.

  • Yeah, yeah, because you can get fancy with your algorithm and shift the influences that it will end up spending the wheel in a certain way and waiting.

  • You know where it ends after it ends up spinning.

  • That's certainly possible to dio ours is gonna be a little bit more of a naive, random approach, which I think does go down to what a detail was saying of 8000 1 and 8000 Probability for the for the three sevens actually aligning.

  • So, yeah, that's you can flub the absolutely can flood the numbers, whoever you want.

  • And I I wouldn't doubt that casinos actually end up doing this in practice quite a bit.

  • Um, I'm just make sure that I have this all set in the right place.

  • Uh, J R one's just about done here.

  • Copy these.

  • Over.

  • This will save us a little bit of time on stream rather than rather than cutting all these images, finding the images, etcetera.

  • We get sort of right into the coding which I think will save us, save us some time.

  • All right, do that.

  • I think we're just about ready.

  • Just switching uses one more time.

  • Oh, and thank you.

  • Also to Matley 333 Hara Theresa and Raw Leo for the follow is much appreciated.

  • We'll get to some very interesting visual step here in just a second.

  • I recently made a very basic version of Brick Breaker in, JavaScript says by near Warrior 76.

  • That's awesome.

  • The game course that I teach teach is how to make brick maker or break out as we as it's called.

  • Um, it's a very good game that you can really actually taken a lot of directions in the game course.

  • We end up using procedural generation well, sort of procedure generation, random ization of the game grid for a more interesting layout to the game so you don't get the same grid every single time, and I think you can.

  • You can go and get him to see it.

  • If you're if you're interested, um, it would be the, um, actually one of the game's course.

  • CS moody dot net x dot org slash game If I plug that here, which I might be able to do that sees $50 fedex dot org's slash games.

  • Go to that game scores.

  • We teach brick breaker as the, um, assignment to zero.

  • Wait.

  • Oh, is that Yeah.

  • 012 Simon, too.

  • And Griff.

  • Oz, thank you very much for the father.

  • All right, cool.

  • I think we're all set.

  • Let me let me just confirm images.

  • Air here.

  • Awesome.

  • Cool.

  • So I'm gonna switch my computer back on here.

  • So these are the images that my dad put together.

  • They look a little bit blurry because Mac uses filtering when you're previewing images.

  • But I went and the essentially the pings folder here has all these images, but at their native size, So 200 by 200.

  • So stuff they're slightly.

  • It might be hard to see on your end, but they're slightly higher resolution.

  • But for a 7 20 p demonstration, the 200 by 200 eyes a little bit large.

  • So these are shrunk down to 64 by 64 which is actually a fairly common size for textures, actually, especially when powers of two textures worm or important for open geo back in the day.

  • Um, not something that usually have to worry about too much now, but it was an optimization for the open geo frame where things had to be a power of two.

  • Um, let me just show you what these images look like.

  • So here's the slot machine that we're gonna be using.

  • So this is just an image that I found online.

  • Actually, I might be able to find it again.

  • So if I decided to quit Spotify here if I go over to Google images, So let's say images, slot machine.

  • I think it'd slot machine free day do that.

  • Oh, you know what am I done?

  • Free slot machine image and shoot off hand?

  • No, I'm actually not remembering where I found it.

  • I found it yesterday when I was exploring.

  • Let's see.

  • Yeah, I'll try and find it in the future.

  • But it was essentially a royalty free, um, slot machine picture.

  • That was just an illustration.

  • But that was the one difference that I made was that you'll notice here.

  • There's these three sort of holes and this will be included in the get hungry.

  • But when I pushed to get have repo.

  • But there's there were these three holes here that were actually filled in with a static image they had sevens in them.

  • So what I did was I actually and open this up in a spread to illustrate this, I opened it this up in a sprite, and then I just cut these out.

  • You can notice that you can see the background, because what we're gonna do is we're gonna sort of visually scroll sort of some symbols, right?

  • But we want them visible on Lee.

  • We don't want obviously, for them to be visible outside of this sort of window of the slot machine.

  • We want a layer when a sort of have it look as if they're inside the slot machine.

  • And so you do this by drawing the wheels or the stadium, the slots, and then you draw the slot machine box sort of over on top of that.

  • And so that's why we needed these to be transparent.

  • So now we can draw whatever we want behind these, and it'll render it and give us the illusion of it actually being a slot machine, which is pretty cool.

  • And then I resized it appropriately.

  • I made sure that these were all just a cz large as they needed to be to be visible within those individuals.

  • Lots himself.

  • Right now, it's not important for them to be powers of to know right now.

  • Most any Tootie Game development framework.

  • You can have any arbitrarily size texture, and it'll work great, I think, for, um, I think for unity in certain con in certain contexts, having a power of two texture does give you some sort of optimization.

  • I think this applies to, um, to certain other domains across frameworks bit.

  • And I think for three engines you get into more of this being a thing.

  • And that's why you'll see a lot of textures for Game seven.

  • Game engines are usually like 40 96 by 40 96 or 2048 by 2048 because there are territories domains where this is important.

  • Um, J p, I says so you'd only need to render to images per column.

  • Yeah, effectively or three.

  • If I if I wanted to render the for example here on, and we'll see this sort of if I have this slot machine here and let's say I have my image here sort of in the middle right here, I I'm gonna want to also render slightly the image above it and the image below its are actually rendering only three images visible behind it.

  • Um, and actually, the way we're structuring everything, we're going to have every single image in our sort of invisible wheel rendered in a vertical column and then the scrolling upwards, and that'll give us the illusion of slot machines rials being scroll like an actual wheel.

  • But we can say, you know, if the images texture is, you know, higher than this point on the Y axis or lower than this point on the Y axis, just don't render it.

  • Even though we're sort of scrolling them invisibly and we're showing them, we can tell it not to render them.

  • And it'll just make it look as if they're not there, right, even though they're rendering, even though they're moving their Y position and scrolling indefinitely and looping around, which will take a look at, um, using a simple if statement, we can just make it not render what we don't care about seeing, and it's super easy.

  • So let's go ahead and actually start this project and get coding a little bit, uh, making sure that I'm not missing anything which it doesn't look like it.

  • Okay, so we have our project here, is gonna go and drag it over to V s code.

  • And for those folks who are unfamiliar with what we're doing, I typically implement to two games in love to D.

  • So this is where you can get love to do, which is an awesome to D game development framework.

  • Totally free exports toe all major operating systems exports to mobile.

  • And it has, ah, library that you can even use to get it to work on the Web.

  • But love to D day or get the version for your operating system here.

  • There are other versions for older versions of it.

  • If you, uh if you want my games course uses for 0.10 point two, if you're following along with the games course on and you can get all of the versions for all of your operating systems here and loved it, he has an awesome set of documentation.

  • Go to the wiki.

  • You can get started here.

  • If you go to the getting started link, you get some instructions on how to get it up and running on your operating system how to get some very basic, very basic game implemented some nice, handy shortcuts, depending on which operative system you're using to get your game working really fast.

  • So you don't have to, you know, have a very tedious work flow and looks like, hey, visuals to decode.

  • Updated.

  • So I'm curious to see if the Lua syntax stuff got fixed from last time, which last time is kind of a pain.

  • I use visual studio code because V s code actually has a really cool extension.

  • This pixel bite studios love to the support plug in if you get this and using V s code, if you're on a Mac, you could just hit command l and that will actually run your game immediately if you have loved to be installed in the right location.

  • If you're on Windows at the same thing, but it's all tell, so it just saves a lot of time.

  • It's super handy.

  • Um, I don't really like clicking and dragging to it an e x c or a nap.

  • I don't like going to my terminal unnecessarily and per the instructions on delecti forms, for example, I could go love dot and that will do the same thing, although right now I don't have a love application.

  • I can just type love, for example, that will pull up.

  • This is what Love will look like if you're running it without a game, for example.

  • But in the instructions, there's a way for you to alias at the command line.

  • The word love to point to where you have it installed on a Mac.

  • And there's certain other ways you could get this done on Lennox and Windows.

  • Actually, clinic is very similar on Windows.

  • It's a little bit more complicated, but I don't like doing any of that necessarily is, if I'm quickly developing, I like to just sit command L or Alltel.

  • It's much easier for me.

  • So if anybody is interested in doing that super easy to Dio, I highly recommend that.

  • And actually, that's what we do for the Games course to, for example.

  • Um, let's go ahead now.

  • And why can't I create a new file?

  • Interesting.

  • Um, let's try that one more time.

  • Wouldn't let me create a new file in my project here.

  • Okay.

  • Um, interesting.

  • Let's say that is may or may not Lou.

  • Uh well, let me creating to file now.

  • Oh, interesting.

  • So I just learned now that if you don't have a source file in your project when it's loaded, I guess it doesn't recognize that it's a source repositories and won't let you add new files.

  • So if you ever experienced that, just make sure you have a new file.

  • You connect command end to bring up a new file, etcetera, etcetera.

  • So may not.

  • Lou is the file that you need in a love to de application in order to get it to work.

  • That's sort of the main entry point, um, of suggestion are the main entry point of execution for love the binary.

  • If it's sort of like in C rea, have it main void or in Python.

  • If you have underscore, Underscore Maine.

  • Same kind of idea.

  • Love just expects this file to exist and quick suggestion for later on.

  • If it's possible to change messages to Star Star star, would it not be better to disable printing that message on the screen all together that way, like chat skin doesn't get clogged with a bunch of people saying star, star star.

  • Interesting.

  • I'll take a look and see if the widget lets us do that.

  • I'm actually not familiar with whether that's a possibility.

  • I'm guessing it probably is.

  • Um, I actually didn't know prior to a few streams back that this the star star star thing was even a thing.

  • To be honest, eso itt's a cool feature.

  • I'll take a look at the widget and see if it's possible.

  • But back to maine dot Lewis.

  • This is sort of where your entry point is a, um uh, found by love to D and where you can actually start the application.

  • So I'm gonna write just a few simple functions here, Uh, that love to de expects to exist in order to get things running appropriately.

  • So loved out load, love dot update and love dot Draw and low just happens.

  • Wanted to start your program.

  • Update happens every frame.

  • So member of basically games are a sequence of frames.

  • Um usually 60 frames a second.

  • Just an image that gets displayed one after the other, depending on no faster computer is and how intensive the game is.

  • Excuse me and then draw.

  • It does the same.

  • It runs the same speed as update.

  • It happens every frame.

  • But this is used more for allocating drawing stuff.

  • And it doesn't get this d t passing to it by love, which has just dealt a time how much time has elapsed since the last frame.

  • So, actually, I'm going to just for cleanliness.

  • I'm going to say Slot machine game.

  • This I do a code or a comment block in Louis.

  • And if you're if you're looking at this in confused As to the language, the language is Lua.

  • So the library is love, but the language is Louis So Louis a game.

  • It's a programming language used all over the place in the games industry.

  • Uh, you see it typically used as an interface for compiled c++ game engine C or C Post post game mentions.

  • But love to D.

  • It doesn't sort of the same thing.

  • It has itself is written in c++, compiled down to the program.

  • You download onto your computer and then you write thes Lou Files, which love to de loads and then runs those and basically has the functions implemented in c++ that get called by your Louis code.

  • So it runs really, really fast, but it allows you to program in a dynamic scripting language as opposed to having the program in c++ or see or something.

  • We have to compile it down, which can be kind of tedious and yet not as fast for development.

  • Love today is a great environment for prototyping and for programming sort of simpler stuff.

  • So these air your core functions that you start off with.

  • I'm just going to say love dot window dot set mode.

  • And let's go ahead and say, uh, my creative confidence file.

  • I want to make this file so that I have a dedicated location for all of the constants, all the variables that shouldn't change all the pieces of information.

  • We're gonna stay the same state constant throughout my application.

  • I'm going to say, Ah, window with is gonna be equal to 12.

  • 80.

  • Window height is equal to 7 20 I'm gonna sit back in my Constance, not Louis.

  • And then up here I can say require constance dot lua.

  • And now I can say window with and window height If I run this, uh, oops.

  • Require Constance not constant start Lula.

  • Sorry, Lou assumes or love to de slash luau assumed that everything that you require is aloof File.

  • So by saying constance dot lua the dot is actually a folder.

  • It actually looks into a folder.

  • So in this case, it would look into the constants folder for a lua dot Louie file, which is now we wanted it.

  • Also, don't use dots in your require statements.

  • Use only the name of the file.

  • In this case, Constance gets maps to gets mapped to this constant stop blue file.

  • So I'm gonna do that.

  • So now we have our window.

  • It's the full width of the of the screen.

  • 7 20 p 12 18 by 7 20 This is gonna work.

  • Great.

  • Um, what I want to do now, just as a sanity check, I want to actually draw slot machine on the screen.

  • Just the raw slot machine, none of the wheels or anything like that.

  • So I'm gonna do that.

  • And in order to do that, what a typical like to Dio is all created dependencies files.

  • I'll say dependencies dot Lua And in here, I'm just gonna create a textures table.

  • I'm gonna create an index.

  • So this is how you do tables in Lua or in Python?

  • You might know them as dictionaries in Java script.

  • You might know them as objects, essentially just a way to associate keys with the values.

  • So in this case, I want to associate the key slot machine to an image love dog graphics dot new image command be that and this is gonna be graphics slash slot machine dot PNG.

  • And so now I have a notice that I have this lower case G.

  • I have a global textures table.

  • G textures.

  • It's why I prefaced it with the G, the lower case G.

  • I have this table that I can access anywhere in my application, and so what I can do there is now, even though this isn't my dependencies dot lou file in Maine, I can say require dependencies.

  • And I can say in my draw function member, this is where you should do all of your rendering.

  • All of your drawing.

  • I can say love dog graphic stop Draw G textures right?

  • Because now we have access to G textures.

  • It's global, and I'll say slot machine.

  • That's the key into which our value was that new image object created, right?

  • Um, and then we'll say we'll sign a draw, actually at the regular location.

  • So if I If I refresh this, we do indeed.

  • Now see our slot machine getting rendered to the screen.

  • Um, and I and I sort of a priori made sure that this would fit well on 7 20 p.

  • Because I I was a little bit of experimentation last night.

  • I wanted to make sure we sort of had a road map.

  • That was pretty clear.

  • And, uh, the default image for this was really big.

  • And it wouldn't have worked in the default resolution that it normally use my car.

  • It wouldn't have worked at 7 20 p, which is what we usually stream at their what I use my laptop at for streaming purposes because everything is nice and big by never warrior says, Have you tried the material theme for V s code?

  • It looks much better than the default, in my opinion.

  • Uh, I'm not sure.

  • Let's try it out, actually.

  • And thanks also to drag off 2003.

  • Katie grow and dives the dive shop, Tom or Dive said Tom, I'm not sure exactly how to pronounce that.

  • Um, I'm gonna quit this, actually.

  • How do you get I very rarely ever change my theme on your parents.

  • Um, how do you change the money?

  • Because I don't think I've ever I changed the name one time on my main account, and after that, I haven't actually changed it.

  • How would it be in appearance?

  • This doesn't look like it does that.

  • Maybe preferences.

  • Right Settings.

  • Color, theme, color theme.

  • Uh, do I have to install material?

  • Let's see material.

  • This one stall.

  • It's very, um, let's see darker.

  • Think that and then get rid of this.

  • It's one thing that I don't like is that it's, uh, 7 20 p.

  • Everything is so well, it's also my amplification.

  • It's a little bit, um, are my magnification.

  • Everything's a little bit.

  • It gets very cluttered very quickly, and all the windows start popping up.

  • But I think this is It's pretty good.

  • We'll use it for today.

  • Oh, Palin.

  • Pale Knight High contrast.

  • Is that a different material theme?

  • Let's let's see that.

  • Um, if I go back Thio Preferences, color theme.

  • Um, Pale Knight High contrast.

  • Let's try that, Boof, Um, I'm gonna be honest with the binary warrior.

  • I'm not a huge fan of the blue.

  • I'm not a huge fan of the blue.

  • I don't mind the other theme, though, So all I'll use the other one.

  • So that would be the material theme.

  • Darker, high contrast.

  • We'll use this one.

  • We'll use this one.

  • I am.

  • I'm happy to use this one.

  • And yeah, Adam, it looks a bit dim.

  • I agree.

  • I'm not a huge fan of the, uh it was a huge fan of the blue, but the folks like this theme, The material high contrast.

  • I'm digging this one.

  • I'm happy to use this one.

  • In the meantime, let's go ahead and actually add the ability to terminate the application with, um, a key press because I don't like having a command or press escape or I don't like having a command.

  • Q.

  • I would much rather be able to press, escape and quit the game So this love dot keep rest function takes in a key.

  • It gets passed AKI by Lua or by well, by Louis Love to d.

  • And this key is something that you can check for and then do stuff.

  • So I can basically say by now Where is Evan has their own preference?

  • Yeah, Everyone does have their own preference, and it's not meant to be a slight on you for having a preference for that.

  • I think this is a very subjective thing.

  • I personally don't like the like themes that are a little bit not contrast enough and are.

  • I don't like non black background, but that's just me.

  • Some people like lighter themes.

  • Some people like Blue.

  • Some people, like some people, like Brown text editor themes.

  • Everyone has their own preference.

  • Um, I think it's more important for the stream that we have some that's readable, and that's really the only concern aside from that.

  • I don't think it matters too much.

  • But I I do like this theme.

  • So thank you for suggesting this theme.

  • We'll use it for today.

  • Stream, um, keep rest key.

  • Let's go ahead now and say if key is equal to escape, then oh, nice.

  • They fixed the indentation.

  • This is great.

  • Okay, so that was excellent last week or two weeks three weeks ago, however long it was the version of the Esko that I had was messed up with the indentation.

  • Soviets codes fixed it so shut up.

  • TVs code for correcting that.

  • Um but you can see here.

  • I'm basically checking this key that gets passed in here.

  • And so basically, what I want to have happen is if I escape, I want to quit the game.

  • I don't have to hit command Q or click the Red X.

  • What not depend on your operating system?

  • So keys equal escape love dot event doc Quick, and you've probably seen this before if you paid attention of extremes.

  • But this is just a way of quitting an application and code using Luis using love to be someone something that lets you do it without necessarily needing thio manually.

  • Quit manually, command Q or go to your all time for what not?

  • And this is something that you could implement in a menu system.

  • For example, if you were implementing a menu in your game and you want the user to go down to quit game and then have that quit the game.

  • Same thing.

  • Same exact idea.

  • Loved art event dot quit.

  • So now it's cool.

  • If I hit that I can escape knows that I'm used using command l to bring my application up, which is super nice, super convenient.

  • I don't have to click and drag to Annie, except you don't go to my terminal.

  • I just use a shortcut in V s code so highly recommend this ecosystem for Lewis and left Trudy Development.

  • Andre says Hello.

  • Hi, Goldeneye.

  • Everyone.

  • Good to see you, Andre.

  • Thanks for joining us today on our slot machine stream.

  • So let's go ahead now.

  • And actually, I want to draw the slot machine right in the center.

  • It's it's kind of shifted off to the left, but I want this to be in the center of the board.

  • So what I can d'oh is I can say, um, let's say local and we'll say, uh, I should've school this be a constant right?

  • So we'll make this a constant.

  • So I'll say slot padding is equal to virtue or a window with the minus, and this is actually where we're going to need.

  • Um, this is where we're going to need to figure out how wide are slot machine is actually.

  • And so now I'm realizing that doesn't need to be a constant.

  • This should actually be a shock.

  • Should be a regular variable.

  • So we'll say local slot padding this slot padding is gonna be the amount of padding that we add to our, um, that we add to our, um when we draw the slot machine on the screen So you can normally right now what we're doing is we're just drawing it.

  • We're just saying loving graphics that draw the texture and that will assume everything gets drawn by the top left corner 00 mark.

  • Every two D object has ah x y coordinate.

  • If you're familiar with a coordinate system from geometry, everything has to be drawn somewhere in to tease who needs an X and a Y value.

  • And so, if you don't pass in an ex in a white value here, it'll just assume 00 which is in the two to coordinate space.

  • The top left, we can pass in and Exeter.

  • Why?

  • I can say, for example, 101 100 this will.

  • This will basically now knows that shifted to the right the bottom right, a little bit, right.

  • This is the effect of sort of offsetting everything from the top left going down 100 pixels and going right 100 pixels.

  • It has that same effect, but I want to essentially calculate how much we should move it to the right based on how white it ISS and what we can do is, we can say the padding for that is gonna be the window with minus.

  • And what we'll do is we'll se GI textures at slot machine.

  • Get with it.

  • Every texture has the dysfunction that you can call in it with this colon called Get With and Colin is usually how you access and objects functions as opposed to dot.

  • Dot is usually how you would access.

  • Um, not like an individual objects functions, but more like a space a class.

  • You know, something like that.

  • Something.

  • It doesn't have something that cannot spawn multiple Children.

  • Multiple because it basically Colin passes in this parameter called Self, which allows you use off sort of an object oriented programming style with Louis.

  • And that's what you get for the coal operator.

  • You can sort of assume that colon is how you would access and objects, fields or methods, sort of how you would do it in Java and dot would be how you had access static methods or static fields in job war c++ same sort of idea And then we can divide this by two.

  • And this is essentially what does this under doing?

  • Is it saying get the whole window with?

  • And then whatever the differences between the window with and the slot machine, which will be however much total padding there is Divide that by two.

  • And if we draw this, no at the slot padding and we'll still assume at zero for the wide value.

  • This will end up drawing our slot machine exactly in the middle of the screen.

  • I should go study for my exam tomorrow.

  • CNN Extreme also makes by nature warrior for tuning in Best of luck, with whatever you're studying for.

  • Sorry, this is too off topics is as Lee, but what is under the hood of love?

  • Dot event dot Quit interesting.

  • I'm not sure.

  • So it's a love dot even quit.

  • Let's go over to here and there is some source code.

  • So what I'm guessing is this probably sets a variable called Quit Call, an integer underneath the hood, and there's an infinite loop in love to D that's basically saying while not quit, right, whatever that variable is.

  • And as soon as you said it to falls.

  • Um, it'll just terminate your game loop, and then application just ends, but you can visit the source code.

  • So we were to go to, um, love to d source code.

  • I think it's a bit bucket.

  • I'm not mistaken.

  • Yeah, rude.

  • Such love route is the user under which it exists.

  • And let's see if we go over to source here.

  • I ended up having to look into the source code for some.

  • I forget exactly what it was.

  • I think I was looking to see why you needed to pass in the dimensions of a texture to the quad constructor.

  • If I'm not mistaken, I don't remember offhand why the exact reason was But if we go to, let's see good of modules and what the event and is an event dot CPP.

  • Maybe so.

  • Is there a quick function here?

  • So big search for quit?

  • No, it's not here.

  • Okay, it's maybe go over to the header.

  • Is it in the header file?

  • No, it's a rapid event.

  • CPP.

  • It's probably this w quit.

  • Um, so it looks like it.

  • It passes in a bully in two.

  • I'm not sure.

  • Oh, to the Louis ST Okay, Push, bully and true.

  • Yeah, this is this is dealing with the lieu of virtual machine and essentially pushing a variable to it from C R.

  • C plus plus, and I'm not entirely sure.

  • Okay, so constructs a new message called Quit.

  • Okay.

  • Oh, and then it pushes that quit message onto the stack.

  • And I'm assuming that in the infinite loop that runs underneath the hood for love to D that it's essentially looking in the state for this quick message so that there's probably a It's using this sort of broadcast model where you push messages onto a stack.

  • And then there's listeners that listen for these messages and perform functionality, and it's probably a function that's initialized somewhere else that says on quit.

  • So whenever we see the message, quit, um, terminate the infinite loop that surrounds the game engine.

  • And that might be a simple underneath.

  • Underneath all of that, there might be a simple integer, a simple Boolean that the wild loop is checking for, and if that bullying gets set, the faults will then everything just terminates at that point.

  • The what?

  • That while Luke that's responsible for the entire applications existence just stops running, and that has the effect of everything terminating.

  • And there might be some cleanup associated with that.

  • There might be a separate sort of clean up function that takes place after that while loop is terminated.

  • So after the wild loop going underneath all of that, there's another sort of block of code that says, Clean up all memory.

  • Do all this mobile law and then at the end of that is the proper sort of exit point for the applications.

  • So you would more intelligently engineer something like this because you don't want to just quit something immediately, sort of leapt memory right, because you have to free all the memory that you allocate.

  • Um, yeah, Andre was saying, There must be an event listener together.

  • It sounds like there is an event listener community source code is not publicly available.

  • That's correct.

  • They do have licenses where they make it available to companies that pay a certain fee for it, but it's not.

  • It's not open source event listeners were what we used to trigger events like start music, et cetera.

  • In our project event, listeners are key, and actually, we're we're not going to use event listeners here.

  • Actually, today we're approaching that territory with sort of a callback functions with.

  • We're gonna be using Tweens and timer dot after a timer.

  • Not Tween, which we do use in the game, of course, has the same sort of effect.

  • And thanks to waiting on 55 for letting hell for Sonny.

  • No, but the tools were using visual studio code.

  • Love to D.

  • Also, the pixel bite studios love to the plug.

  • It's super important if you wanna be able to execute your code very quickly from visual studio.

  • Good, Super nice.

  • I use it and I love it.

  • Super amazing.

  • All right, So we've covered now getting a slot machine rendering on the screen and centered right?

  • Everything's good.

  • We have images loading.

  • I'm gonna go ahead into my dependencies.

  • I want to be able to start drawing the slot reels won't actually have three separate reels of slots that scroll right.

  • They get rendered behind the slot machine facade.

  • And to do that, I need to have the actual icons right.

  • Shouts again to my dad for kindly making these image files for me because I sure as hell know that I would not have been able to do a good job of making these from scratch myself.

  • I'm not an artist.

  • Um, So what we can do is I can say, uh, well, first of all, local icons is gonna be equal to, and we have all of our all of our icons here, sort of in this directory.

  • So I have 50 apple banana.

  • So we'll say 50 Apple banana.

  • Um, Cherry, lemon, orange.

  • I also saw, uh, pineapple, right.

  • I'm making a list of strings which we're gonna be able to use to dynamically construct our textures table.

  • So pineapple and then strawberry anything.

  • That's it, actually.

  • So I have a list of strings here.

  • That's all this is.

  • We're using a table as an array here, so you can use tables as dictionaries slash um, objects.

  • And it can also use them as a race.

  • They function similarly.

  • They're very flexible in that regard, actually very similar to how PHP even does its own, um, array data structure.

  • And see what I can do now is I can say four every key and value in the pairs of icons I do and then G textures at value.

  • So this will take each individual string equals love docked graphics dot new image at graphics slash and the dot dot for strength and cat nation.

  • This is Louis Drink and Cat Nation operator and then V for the name of you know, whether it's 50 apple banana cetera can cabinet again dot uh, J Peg in this case.

  • And now I have, ah, list of our A table with a collection of all of our icons and actually make this global by saying G icons.

  • So now I can reference these icons this list of strings anywhere in my application, which I'm actually not sure if I need now that I think back on, um, I started a trial run of this.

  • I don't think you necessarily need it, but yeah.

  • Uh, answer Adam's question.

  • You know, my dad made the images from scratch.

  • Correct?

  • Yeah.

  • Um, if he's saying that is great.

  • Yeah, Andre, it's only the top, Terry.

  • Unfortunately, Unity's license for that is a little bit less than generous.

  • But unity as a platform, I think, is incredibly generous.

  • So I'm not apt to criticize them too much for that practice.

  • Having it relatively makes sense.

  • Um, I think I'm not mistaken.

  • UN riel source code is open.

  • Source Don't quote me on that.

  • But somebody When I taught the game scores last year last spring, somebody brought this up and I thought I remembered researching it and finding out that it was true that unreal engine does have some sort of open source license, but I don't know.

  • Um okay, let's go ahead.

  • And now let's just test just sandy check.

  • Let's make sure that all of these images are rendering.

  • Let's make a loop here.

  • So I'm gonna say for, um let's say, actually, four key value in pairs of G icons.

  • D'oh!

  • Um, loved art graphics, doc draw and then G textures at V at, actually.

  • Well, Kay will be a number in this case.

  • Will it?

  • No, it won't, actually.

  • Yes, it will.

  • Yes.

  • It will be a number because we're using it as an array.

  • This is a nice thing about using tables in lieu.

  • Uh, is that if you just if you just use them as a raise to get implicitly indexed by numbers, so they do work like a raise if you don't use them, um, like dictionaries or objects.

  • They do get that implicit functionality, which is super nice.

All right.

Subtitles and vocabulary

Click the word to look it up Click the word to find further inforamtion about it