Placeholder Image

字幕表 動画を再生する

  • All right.

  • Hello, world.

  • This is CS 50 on Twitch.

  • My name is Colton Ogden.

  • And today we're going Thio take a break away from Solitaire, which we've been spending two streams on so far.

  • And we're going to dive into a much simpler game.

  • But a game that's fairly new in a game that some of you might have played a very famous Web based game called Cookie Clicker.

  • I'll pull up the screen shot here in just a second, but thanks so much.

  • Everybody in the chat who, uh, wish me happy birthday before the stream started.

  • So as they started off and then started a trend here.

  • So thanks as Lisa Maher Babic, um Whip streak and all who wish me happy birthday several CS Otan Jobe Omega Togas I mus Colton sandwiches.

  • I believe that means Happy birthday.

  • I know I made it told means congratulations.

  • Both on Jobe, I do believe is birthday and Bella cures.

  • Thank you all so much.

  • Appreciate it.

  • Thank you very much for the birthday wishes.

  • 28 today, 22 years away from the magical 30 I'm gonna pull over to my screen here and I want to show everybody what cookie clicker looks like before we actually get into implementing it.

  • And to be fair, actually didn't test to see whether, um, we could play this, but it looks like we can.

  • This is cookie clicker.

  • So if I click this sort of cookie, you do see that I get a certain plus one.

  • I get a cookie animation and I can have a sort of a counter.

  • They're saying that I have 24 cookies thus far, so your goal is to accumulate cookies.

  • And I think there's a more macro level goal.

  • I think you're trying to take over the world or prevent, like, a candy invasion or something.

  • So if I keep clicking, you'll see that cookies do get increased over here on the right side.

  • And this is where the game play, you know, you see what we think you know.

  • This is kind of very simple, boring game.

  • Why, even why even have this game exist?

  • I'm just clicking cookies, you know, for the sake of clicking essentially on the screen, right?

  • But there's a bit of ah, larger scale, almost business aspect of the game, almost a tycoon aspect of the game whereby you can purchase these things in the store on the right hand side.

  • You're so I could buy a cursor and what that will do.

  • And it's kind of hard to see, but it's actually rotating around the cookie on the topside right here.

  • But what that cursor is doing is now it's actually clicking for me, or at least it should be.

  • It's looking like it's very slow 0.1.

  • Oh, it might be Oh, yes, either it is.

  • It just added one.

  • What's the rate on these, by the way?

  • Every 10 seconds.

  • So every 10 seconds will get one more cookie that I don't have to click myself so you can see that it went to 37 then to 38 by itself.

  • It should in a second here, go up to 39.

  • I'm not mistaken 39 cookies.

  • So the goal of the game isn't so much to click the cookies.

  • You know, indefinitely and sort of wasting your time is a human doing this, but rather well arguably.

  • But your goal is to amass sort of this empire of cookie generating structures, things like cursors, things like Grandma's, which is the next year of things that will bake cookies for you, things like factories and mines and much more.

  • I did a little bit of research into the game.

  • I just bought two more cursors.

  • So now I'll get a few more cookies per per second here, but you can see that you have a per second rate of cookies, which is 20.3.

  • So now I've increased my great generation by quite a bit.

  • By clicking.

  • I can keep buying more stuff up.

  • My rate, a generation that's ultimately your bulge up your rate of generation, get billions of cookies and take over the world with your cookie empire.

  • So we'll be doing a version similar to this today.

  • Our own version.

  • It's not gonna be wet.

  • Base is gonna be in love to D in Lieu, which have been doing in the past.

  • We could implement this as a Web based game, certainly, and that's the the version that the actual game itself is written.

  • But we're going to ourselves.

  • D'oh!

  • The, um do the framework that we've been using more recently.

  • So I'm just gonna read the chat here I own one was saying, Take the day off.

  • I enjoy doing these dreams.

  • I wouldn't want to take the day off.

  • To be honest, I don't do too much.

  • Remember days, actually, kind of Just take it easy and and, um, reflect on having grown a year older, I guess.

  • And Babbitt was saying that hey, hadn't been here for quite a Well, actually, I do remember.

  • I don't think I saw you in the last stream, so yeah, it has felt like it's been quite a while.

  • Send for exes.

  • Hello, Nano Machine or Happy Birthday.

  • Thank you very much.

  • Andre.

  • Sing every birthday.

  • True Guineas.

  • Thank you so much, baby togas.

  • I'm losses than a machine.

  • I appreciate it.

  • All is good that some good boats talk says hon JJ mu 999 Don't cause they're not a machine.

  • Er took his eye moss and some are gaming.

  • Happy birthday SMR gaming.

  • Interesting Is that eyes that the, um the sound like the like, the sensitive sound or whatever That you here with a special microphone?

  • I don't remember offhand, that's smr from Think of something else, but hello.

  • Later.

  • Happy birthday.

  • Thank you so much.

  • Um, smr gaming.

  • Oh, no.

  • Facebook cookies.

  • Me throughout my entire browser.

  • Usage everywhere.

  • Yeah, that's true.

  • That usually.

  • And this is a joke that I made.

  • And I think when I posted on Twitter was that usually in CS 50 we talk about cookies in a different context to cooking, being a sort of little file that websites gun store in your browser to keep track of some, you know, information to preserve a session or something for a website.

  • But we're actually today talking literally about cookies that you would bake in an oven or whatnot.

  • So it's a bit of a kn ironic and different change of pace.

  • Kloppenburg.

  • Good to see you.

  • Uh, let's appreciate how dedicated Colton is.

  • I mean, this is I mean, we're just making a fun game today.

  • This is this is this is no sort of exercise in and difficulty here, uh, am Kloppenburg saying, Actually, I don't know what language that is.

  • I apologize.

  • Invent hard toe get Phyllis Terracotta.

  • I'm gonna assume that probably says Happy birthday.

  • But if you can let me know what language that actually is every great Lovell, the emojis and whatnot, as he says, No, you have to enjoy your birthday.

  • Don't reflect on becoming older.

  • I think that's kind of unavoidable, girl say, says Ola.

  • Happy Birthday.

  • Thank you very much.

  • Let's Hello.

  • Are these games the same games that you make in your game day?

  • Of course, says l'm one.

  • Uh, no, it is not well, typically not we for a lab.

  • We did something similar to hangman and the tightening aim that we did in a prior stream.

  • But that's not public online.

  • That was for like, a summer version of the game score study teach.

  • This cookie clicker game is not actually a game that we've implemented.

  • Neither was solitaire.

  • Neither was snake or tick tack toe.

  • Even a lot of the games that were programming on streamer games that I have never made myself but know how to make conceptually.

  • I understand what needs to go on.

  • And you know, there's only enough time in the day.

  • You can't necessarily have expected to implement every possible game.

  • But, you know, doing these are fun exercises for me.

  • And there are fun teaching moment, I think, for other folks and Dutch got it.

  • Oh, actually, I did get your message that you were the first person, actually, uh to spur the Happy birthday messages.

  • So thank you very much for doing that.

  • I appreciate it.

  • Babak saying Internet problems Fiber cable broke a popped on Friday chat to wish, but it got repaired today afternoon.

  • Oh, that's rough.

  • I'm sorry to hear that Hope.

  • Hopefully, that's all solid now.

  • And the fiber cable won't break again in a different location.

  • But I can't imagine what it would be like to lose my Internet access.

  • I would feel lost and confused.

  • So, cookie clicker, Let's go ahead and set up a project.

  • So if your brand new to the stream, if you've never watched the stream before on twitch or if you never watched to see its 50 straight month, which I'm sure you've probably watched a twitch stream at some point.

  • But if you haven't watched a, um, CS 50 on twitch video, typically my videos on here, our game development of game projects that we develop from scratch.

  • Typically, what I like to use is love to deal that we have used the unity as well in the past.

  • But the framework that I like for using that I like using for teaching game development, particularly to the game development mostly out of necessity.

  • Love today is not a three framework, and therefore we can't use it for three development, but the framework that I enjoy using his love to do you go to love to d dot or GE and download it for your operating system is excellent lightweight to TM development framer that uses Lua as his programming language, which, if you're not familiar with Lou Lou, is a very sort of popular and ubiquitous programming language used in the context of games used for game engines all across all across the board.

  • But, yeah, it's good stuff.

  • I'm a big fan of it.

  • I use it in my game day, of course, and I use it on stream here.

  • It's very easy to get a project up and going quickly and to reiterate on it, it feels low level.

  • It feels like, Excuse me, feels you have a lot of control, even though there is a lot of abstraction for you and Lou itself as a language is fairly simple and lightweight and very flexible.

  • As a result, Police anniversary Oh says, Let's put a bar in forties, Thank you very much.

  • I appreciate I don't how to say.

  • I think it's a big Otto, which is Portuguese for thank you in Portuguese.

  • Correct me if I'm mistaken.

  • Um, thank you all so much for the very kind words.

  • I appreciate it.

  • So if you have love to need installed, the next step is going to be actually creating a project folder that is going to hold your games finals, your source code files and your graphic Xander sounds, et cetera, And the version to be clear, The version of cookie clicker that we're gonna be making today isn't gonna be as robust as cook it clicker because we only have a few hours.

  • But we're going to implement the core loop of being able to click the cookie, generate cookies and then buy things that will let you generate cookies over time and talk about how we actually get cookies per second implemented and things like that.

  • And, um, I like to use your cookies as currency to buy stuff from the store.

  • So we'll take a look at all that stuff and see what we can accomplish in just a few hours, because hopefully we don't want to make this two or three parts dream like solitary have enough of that going on already.

  • And solitary will probably resume either next week or the week after that.

  • So I'm gonna go to my Streams folder here, which I've set up for all of the streams you done so far.

  • I'm gonna create a folder called Cookie Clicker.

  • And then this is just gonna be my Lou A folder and can click and drag it over to V s code visual studio code.

  • If you're not using a text editor of Modern Text editor like V s Code or Adam or sublime text a highly recommended, you can technically program in a lot of different environments that aren't normally recommended, like Microsoft Word or WordPad or text at it.

  • And there are other smaller applications, like no pad plus plus and text Wrangler and certain many other programs can use vim.

  • You can e.

  • Max.

  • I'm a fan of V s code.

  • It's one of the newer ones.

  • It's got a lot of great plug ins, including one that lets you actually run your love to the games from the GS code environment itself, using a shortcut which is super handy, so highly recommend GS code, but you can use Adam.

  • You can use sublime use many other different programming environments.

  • So in every love to the application.

  • And many folks have seen this already if they've been tuning in.

  • But if your brand new you need to make a main dot Lulu, which, if you're familiar with CS 50 or programming in other languages, Maine is the sort of starting point of your application in here, I'm just gonna create a comment block at the very top with this particular syntax in to, say, cookie clicker.

  • You know the typical stuff we do in every stream just because it feels, you know, it feels official, right, even though this isn't super meaningful.

  • But if people decide to clone this repo and this will go on, get hub, you at least have my email address.

  • So let's go ahead and write a few functions that are super important.

  • Loved out load love dot update, loved art draw.

  • These were all functions that love to de expects to exist in maine dot Lou, and you have to define them yourself.

  • You have to actually tell Lu love to D what to do when it sees these functions for now, I'm just going to say love dot graphics Stop Prince Hello for rather cookie clicker.

  • And then in love dot load, I'm going to say love dot window dot set title to cookie clicker and set title.

  • What that does is it just sets the title bar at the very top of the program and loved a traffic stop print will just draw some text to my what will be a black window that we see very shortly.

  • If I command l on my Mac, which is the shortcut for actually running if you're using the s code If using the pixel bite studios love to de plug in which I recommend, then you'll see that it does indeed say cookie clicker in text.

  • It's all sort of small at this point because just at native resolution, I'm at 7 20 p.

  • But it does indeed work.

  • We have a very beginning sort of bootstrapped to me.

  • Okay, So much of a game.

  • There's not much going on, but, uh, where we have gotten started, Blue Booker says, Have you ever gotten a love to the game working on the web?

  • Yes, actually, using a m script in, um library called love J s.

  • You can take a look at that.

  • If you look it up on get hub.

  • It actually works pretty well.

  • There are some.

  • There are some problems that we encountered with it initially, but to my experimentation, much of the functionality that you would get does work.

  • It doesn't work.

  • I believe with version 11 onwards, it's only 0.10 point two.

  • So if you are expecting it to work, you're gonna have to make sure that you're using 0.10 point two.

  • Is your loo aversion your love to the version?

  • Rather.

  • And then that will be unscripted.

  • Compile a ble.

  • Um, Okay, Lou is also a wonderful pun for those who don't know Port Moon in Portuguese.

  • That s o l.

  • Which means, son.

  • Yes, indeed, says as Li Lu and I was one of the first point I think I even bring up in the Games course is that it's Portuguese for move.

  • And it's fitting that Lance was even speaking.

  • Portuguese just found out the median midterm for 1 24 was a 50% but medians grade was a minus last year, so I'm feeling pretty cheery this morning.

  • CS 50 is amazing, by the way, perhaps the best interview s class in the world.

  • Interesting s, um Are are you a Are you taking, um 1 24 at Harvard?

  • Actually, I apologize if we if we talked about this before, I don't, um 100%.

  • Remember?

  • Is there a Colton Wicky like David?

  • CS.

  • 50 r c s dot harvard dot edu slash malin.

  • That says asks Nate.

  • No, At the moment there is not.

  • I have not.

  • I don't have a CV.

  • So I don't have one to put up on C.

  • S about Harvard I gave you like David does.

  • And David is also officially faculty at Harvard, and I am not officially faculty.

  • He is a professor and tell a sense and CS 50 Intel a Sense and CS 50.

  • Best interest.

  • See?

  • Sorry.

  • Iost auto.

  • Correct.

  • Are you referring to V s code?

  • Ask him, or if you could elaborate on that.

  • I appreciate that.

  • And l'm one asks.

  • Can you talk about the use cases of Louis?

  • Absolutely.

  • So there's this game framework love to D, which is excellent, whether you're prototyping or even releasing commercial games.

  • There's a famous game called What's It called?

  • It's called, uh, Mover and Die.

  • I believe this game is written in love to tea At least Permai.

  • Yeah, it is engine.

  • It is love, as you can see here, this is Ah, pretty famous game.

  • It's on steam.

  • You can no limit on steam.

  • And I think other platforms.

  • This is a game that is officially, um, that is officially released on our sorry that is officially developed in love to be completely left titty.

  • Therefore, I imagine it probably is pretty easy to mod because Louis, just by the way that it works and love to D.

  • It's pretty easy.

  • Just add modules, little modules and changed the source code.

  • And even to see the source code is probably pretty model.

  • But you can absolutely release commercial games using love you can release.

  • You can prototype your game in love.

  • If you're, for example, developing something that you know, you're gonna have to maybe muse go dot or Unity Tootie or some other framework to create a game in two D and then release officially.

  • You can prototype it in love today because it's very easy to get up and running.

  • I would say it's love.

  • Today is a pretty fast binary.

  • It's a C plus, plus binary that just uses Louis that scripting layer, so it's pretty efficient.

  • I don't even necessarily know if if you're gonna prototype a full game and release it somewhere else, I would say maybe half the time, you probably don't even need to release it in some other framework.

  • You probably just released it in love to D.

  • But separate from love to de Lu is used in industry a lot for in C++ compiled game engines as the scripting layer.

  • Um, it was used for many years until unity came around because unity and now was kind of what I think.

  • I don't know what the numbers would be offhand, but I'm inclined to say by 40% at least of studios now raising unity in a smaller number using unrealized.

  • Then a smaller number are using an in house stack, and even in unity, you can still use Louis using something called Moon Sharp.

  • So it's possible to script in luau with unity.

  • But Unity uses C sharp as its scripting language, so it's a little bit different environment um, but Lou is a originally designed to be a sort of a language that you use thio prevent re compilation of ah, binary, essentially allow you to interact with the engine or our program and to just rapidly change things I need to re compile.

  • At least that was its original intended use case that ends up making it very suitable for games where re compilation can be expensive, especially back in the day where it was big C plus plus C code bases that could take many minutes to re compile.

  • And so now it's used a lot for lightweight engines like this is used for modern c++ or see or other game engines.

  • For example.

  • Recently I saw it used in the context of the game.

  • Don't start together.

  • I believe that was written in Lua are rather scripted, and Louis has a C plus.

  • Plus, I imagine Back End Star Bound is another game that I know personally used loo as its scripting layer.

  • So it's all over the place.

  • You'll see it all over the place.

  • Yes, Amar says.

  • I was just saying, I just found out you got a streaming on twitch.

  • Awesome was saying that sees food is probably the best interest CS class in the world.

  • Professor Maylin and a staff are amazing.

  • I was just looking about how intelligence might both help and confuse completely.

  • New programmer.

  • So thanks SMR gaming for tuning in.

  • Appreciate it.

  • It's cool that you're actually taking courses here on Harvard campus and tuning in until a sense can be.

  • I think maybe a beginning programmer can be kind of tricky.

  • The nice thing about intel a Sense and V S Cody, that's not too intrusive.

  • Uh, it's nice.

  • If you have the right plug ins, it'll actually help you out quite a bit.

  • I know that, For example, I can say function love dot and it'll actually tell me all of the name, spaces and stuff like that that are present in love to D without me having typed them before until a sense, Ah, lot of the time, we'll just kind of referred back to things you already typed in your program effort of variables that you've already seen.

  • But the nice thing about having V s code and having certain extensions installed is that you can actually see just by typing something you know the arguments that go into a function.

  • If you're in Python, this could be very helpful or Java script.

  • You can auto compile things and see which is great.

  • If you want that sort of behavior and not have to re compile, you can see their messages you get experience is very akin to a dynamically typed experience like Python.

  • But it's great.

  • Yeah, until a sense can be a bit of ah Hurdle.

  • But I think it probably does more harm than good are more good than harm, especially for folks getting started in a more dynamic environment.

  • Um, and then see a city for lawyers.

  • I think that is in the process of being produced.

  • But yeah, we we did shoot that earlier this year.

  • Awesome.

  • So let's go ahead now and get back into the actual flow of implementing the game.

  • Currently, we just have this black window.

  • It's a bit on the Dole side.

  • We've seen this a 1,000,000 times already, but it's you know, it's a fun, cool process, seeing the game implemented, you know, from this black box and then getting all this functionality.

  • What I'm doing here is I'm actually defining a function called love Ducky Press, which takes a key.

  • And what This what this is is a function that love today actually calls for you every single frame.

  • Whenever you press any key on your keyboard so it'll actually call this function now it's empty by default.

  • So it doesn't do anything.

  • It's up to you to actually define what should go on in the function and to, you know, tell love to D O when I press.

  • Uh, w I want my character to move forward.

  • If I press escape, I want to quit the game, which is actually what I'm gonna do here.

  • I'm gonna say if key is equal to escape and once again, I still haven't updated my love to t to be the right arm.

  • I haven't updated V s code since the last update where it messed up the loo auto formatting.

  • So it's a bit of a problem, but we'll get by it.

  • I'm actually getting used to it at this point.

  • But if he's able to escape, but I want to do is I want to quit the game so I could say love, don event, not quit.

  • And then now, if I run the game and I hit escape.

  • I don't have to press command to you and have to click the Red Circle anymore.

  • I could just hit command cute, so I can just hit escape and it quits the game.

  • So pretty nice saves me a little bit of effort.

  • I guess it adds a little bit to the you.

  • Why this lets me sanity check that input is working so we can actually start doing other inputs I will need for this game, a function called Loved up Mouse pressed, which takes an X o.

  • Why and a button.

  • As you can imagine, Mice typically have more than one button.

  • They have multiple.

  • Have a left collect, have a right click a middle click they had might have side clicks if you're using a fancy gaming mouse, so I care about whether we know which button I click on the mouse.

  • I want whether I wanted to be a left click or right click.

  • I also care about whether the where the X and y position of the mouse arm I want to check to see if I'm inside a box somewhere I want to see, For example, whether I'm clicking on the cookie.

  • So this will we will actually use here in just a little bit.

  • Um uh, yes.

  • Omar says I love how 50 starts with C on Lee.

  • You'll get confused by high level language is that way.

  • Then I wait to Mitch.

  • Functionality are implemented in lower level languages.

  • Such a C learning See first is absolutely perfect for obtaining a solid, fundamental understanding of how computers work.

  • Ah, yeah, I think I would agree.

  • I think David would definitely agree to.

  • I think that's Ah, huge part of the course is motivation definitely sort of lay this foundational layer upon which you can build the knowledge you need to understand dynamic languages and jump in wherever you feel like you want to Whatever domain you want to explore.

  • Um, I can see how see also can be a bit of a hump for a lot of beginners because of pointers and because of my memory management and a lot of very subtle bugs that are easier to handle in languages like Java or C P.

  • R.

  • Or Python or Java script.

  • A sort of managed memory for you and garbage collection, but definitely having that lower level understanding can be very helpful and seeing people obviously very important, even in the world of dynamic programming languages, because you need to have your sort of more efficient things built in those languages like Love, for example, is built in c++.

  • But it allows us to interact with the functionality we've defined using Luis so that we provide a good programming experience.

  • But we still get as much efficiency as we need.

  • Let's go ahead and think about what the first thing we want to see is, and that is probably a cookie, maybe right here in the center.

  • So if I, uh, look online, I could probably find a nice big image of a cookie.

  • So that might be what I want to dio.

  • Another thing that I want to do probably is make it more lower resolution.

  • But maybe we'll worry about that.

  • I don't know the time.

  • We'll just say I want a larger cookie.

  • Imported into my game are a large cookie image imported into my game so that I can click on it and have you know, Cem something more than just text, right?

  • So what I like to do is like to go to open game art dot organdy.

  • I briefly looked on here earlier just to see if there were any cookie sprites.

  • There was one what you might be able to use, and it's a little bit odd just because this one, I can't tell if it has a background or not.

  • It's not completely flush with the edges, which might cause a slight issue.

  • But, um, we can certainly use this.

  • I think so.

  • I'm actually gonna try it out.

  • It's open game art slash content such cookie Dash zero.

  • It's under a public domain license, so it's free to use.

  • So it's awesome.

  • So the great thing about open game, where everything is very generously sort of made available to the public for free, I'm gonna download this.

  • Go and click it.

  • It's gonna download into wherever my default downloads folder is.

  • Let's go ahead and figure out where that is.

  • Should be in here.

  • Cookie dough, PNG, right?

  • Excellent.

  • So it's 800 by 600 pixels.

  • I'm not entirely sure whether it's flush with the edges.

  • I don't think it might be so might need actually edit this, so I'm gonna bring it over hope into a a sprite, which is my, uh, sort of Sprite editing program.

  • And it is indeed not quite flush with the edges, which, if we were just to use the dimensions of the sprite of this cookie as being our, um where where we want to check for the X and y.

  • You could imagine that we could bring the cursor out here, for example, and it would still trigger a click on the cookie, which we don't want necessarily.

  • And we could all.

  • We will also get a little bit of this area even if we do use it as a box which will cause issues with our X y.

  • And we could probably write a function that checks to see whether a point is inside a circle.

  • I'd have to google that to find the exact algorithm, because I'm not sure, but well, for simplicity just used the bounding box of the cookie.

  • But we'll tighten the bounding box.

  • We're actually gonna crop this cookie image such that it is right on the edge now where its edge looks like it's right about here and here, I think.

  • Yep.

  • So that's perfect.

  • Who's go ahead and do that.

  • Bring it right to the edge there.

  • And now I can go up to I should be able to go to Sprite crop and then save.

  • And now everything is very tight.

  • That Sprite image, its boundary box is completely touching the cookie.

  • So it'll be roughly approximate to, you know, if we if we check the bounding box of the cookie for whether we've clicked on it, it'll be very close.

  • It will be able to sort of click on the on the edges, and that won't be entirely accurate, But it will be good enough to at least get us started.

  • If we wanted to, we could look up on Google.

  • We could say, How do I get a point inside of a circle point inside a circle?

  • Um algorithm.

  • And, um, yeah, so you What you could do is get the distance.

  • I believe it's a square root of like X two minus x one.

  • Uh uh plus X Y two minus y one or something like that.

  • I don't remember offhand, but there is a formula for it that you can check to see whether the point exists.

  • Actually, if we look in here.

  • We might even see it X minus center X squared.

  • Plus, um, why minus center?

  • Why squared less than the radius square?

  • There is an easier way.

  • I thought it was the all right.

  • That's the distance formula.

  • And you check to see whether the distance formula equates to, um the whether the distance of your ex wife is less than the distance of radius square radius, times two.

  • Is it right?

  • It's not radius squared is its radio isn't just radius times two.

  • Um, it looks like it's radius squared.

  • But anyway, we won't get too concerned about the math right now.

  • We can We can worry about that another time.

  • What I'm going to do is I'm going to take this cookie Sprite.

  • I'm actually gonna put it in the right location.

  • So now we have a very tight condensed cookie spring.

  • I'm gonna copy this over to where I have my Repo Dev streams cookie clicker, and what I'm gonna do is I'm gonna create a graphics folder, which this is conventionally put it in your project.

  • You're gonna want a file for all of your source.

  • Good files.

  • You want a project for our folder for your graphics, for your sounds and for your libraries, all kinds of things.

  • I'm gonna go ahead.

  • Just do this.

  • I'm gonna rename to lower case Cookie.

  • Just because the capital letter kind of bothers me a little bit, Um, I'm gonna quit a spread because I don't need it anymore.

  • So now we have an image that we could just draw in our scene.

  • So if I go over to back to my main dot lua and let's say I want to say cookie texture is equal to love dot graphics dot new image, and then we'll say graphics slash cookie dot p and G.

  • Now I have a graphics image, a new image that I can draw somewhere in my in my program, right?

  • I've loaded it into this variable called cookie texture, which is an object that's gonna store that texture information.

  • And if I go down here to love Doc, draw instead of love dot graphic stop print.

  • I'm just gonna say love dot graphics dot Draw that cookie texture.

  • And if I run it, you do indeed see that I have this cookie in the middle of my screen.

  • Now it's a little large Actually, I don't know if I wanted to be quite that large, so actually going to do, And this is more preferable to how I personally like to do things.

  • I'm gonna load up this cookie again into a sprite, and I'm gonna just shrink the sprite sized down by two is 4 78 I'm gonna make it would make it to 40 right?

  • It's gonna it's gonna filter it.

  • I'm going to save it.

  • And now, if I go ahead and I do this again, you do indeed see that we have a smaller cookie texture that will be, I think, a little bit more appropriate.

  • We don't want to be quite as massive.

  • And I also want to change the resolution of the window to get its kind of square at this point.

  • And that's not what you usually are gonna dry your game at.

  • But we're making our way there.

  • On Babak Knight says X squared plus y squared less than radius squared.

  • It's a great editor, but as a new program or definitely stick with 10 s.

  • First I tried to do Mac os you Bantu and Windows in parallel and failed miserably.

  • Yeah, it can be overwhelming.

  • Different operating systems have different programming environments.

  • The nice thing about Mac OS and at least Lennox is that they're kind of similar.

  • They're both UNIX based operating systems.

  • So you do get a very similar experience at the terminal at the command, prompt using things like l s and Cat and using command link text editors and and what not if you decide to do that, and the compilation process is generally consistent.

  • Using Windows is different because all of the shortcuts are changed, and there are a lot of idiosyncrasies with Windows.

  • The nice thing is, Windows now has the ability to actually integrate Lennox using Windows subsystem for Lennox.

  • So you can actually install a bun, too, and whatnot on your Windows machine as sort of a subsystem, and then use that.

  • So you get a native sort of Lennox environment, at least feeling like a limit native environment while you're on your Windows machines.

  • It's quite nice Whip streak, says Python.

  • Greater than job ascribe great that are greater than Louis.

  • Never study.

  • See?

  • Interesting.

  • Yeah, Um, I don't know if I agree with that whip streak.

  • I think it's important to understand.

  • See, because very, very close to the hardware of your machine um see is just kind of a light layer on top of assembly, which itself is a light layer on top of your CPU is instruction set and understanding how a CPU works.

  • Understanding how See an assembly work, I think are pretty valuable.

  • You don't necessarily need to know how it works, I think, to do modern development.

  • But I think having that ej certainly puts you at an advantage.

  • Um, could you not use an overlay or a stencil of some sort of hit box for a bit more accuracy?

  • Zzzz M Kloppenburg?

  • Uh, I'm not entirely sure that love to de supports the idea of just in click it plugging in an X y two a stencil on having that record a collision value.

  • I guess you could do it in some sort of way like that, but I think that's a bit over engineered.

  • At this point, I would probably use the distance formula, the X squared plus X wide, less than radius squared and use that.

  • I think that's probably better and easier and probably faster than honestly than using a stencil.

  • We used stencils in the Games course for a graphical effect.

  • When we had when we had doorways in the Legend of Zelda P set, we ended up needing to use a stencil so that you could walk in between different rooms different and then walk through a doorway and have part of that be visible and part of it be invisible stenciling.

  • I usually think of that kind of context, but yeah, I guess you could think of you could also use stencil in like this a stencil buffer and that sort of way and check for one and zero and whatnot.

  • I don't necessarily think I'd do it in this context.

  • Debbie.

  • Debbie feeling I just joined.

  • How far along are we in the project?

  • Not very far at all.

  • We've done so far this much code, we have our basic bootstrap up.

  • We're importing our cookie texture, which is basically just a cookie image I grabbed online starting our graphics folder.

  • Um, I have a load function just as the title aqui handler for escape, which just says if it press escape, quit the game on and they were just drawing love demographics not draw that cookie texture which just draws it by default at 00 the top left corner still don't, like, see so many semi colons.

  • Yeah, I don't like the syntax.

  • I think I don't like developing too much and see, but I think understanding how it works is as valuable.

  • Um, not Davis.

  • You are not a vision says why, Lou, I'm not really into this.

  • Just curious.

  • Um, Lewis is a pretty popular scripting language in game development.

  • It's also very light weight.

  • It's fast, especially amongst the dynamic languages, and we're using it in the context of love to D, which is a very nice lightweight, low level, it feeling, but still very powerful and fast to D game development framework, which makes it very easy to prototype games because I have a lot of control, but everything is very accessible.

  • Use polar coordinates for circle, but again, we're in similar to Cartesian coordinate system.

  • Uh, at that point, I would need a refresher on my own, my trigonometry havoc, But you might have ah lower.

  • You might have ah, better understanding of that than I do at this point that Chris is hello.

  • Python is literally translated to see at each implementation step and then compiled using a C compiler into machine code.

  • I wouldn't go so far as to say it's translated to see at each implementation step.

  • I would say that it is translated to python bite code, which is run in a virtual machine that is written in C andan.

  • Those get translated to machine that gets translated.

  • Thio your process of machine code Bye via the virtual machine.

  • You know, the virtual machine maps, those bike code instructions to your physical si pues instructions, but translating it to see I don't think it's necessarily accurate, but you can definitely use see, um, plug ins.

  • But those air compiled down to machine code.

  • I love semicolons because of Java script understanding is crucial.

  • Yes, so we have a cookie being drawn here on our screen.

  • Let's take care of a couple of other steps.

  • Let's go ahead and say love dot window dot set mode to 12 80 by 7 20 because I don't like the resolution that we were running out before it's by default.

  • A 808 100 or 606 100 or something?

  • Not terribly.

  • Um, not terribly great, at least for my I'm used to seeing 16 by nine resolution.

  • I'm not such a fan of square resolution.

  • And let's go ahead and draw our cookie at a slightly different position because it's kind of up to the top left.

  • But I wanted to be centered more or less.

  • And, um, what we can do is we can say, um so we know that we want to draw in a 12 80 by 7 20 So what I can say is, let's go ahead and implement some constants.

  • A window with is gonna be 12 80.

  • It's a window Heights is gonna be 7 20 And let's set these to the proper Constance.

  • And let's say that I want to draw the cookie texture right in the middle of the screen.

  • I can say draw it at, you know, given X y right here.

  • So the ex wife is gonna be window with divided by two and window height divided by two, for example, as a starting point.

  • And now if I if I do that, we can see that it gets kind of shifted to the to the lower right a little bit.

  • That's because everything does get drawn relative to its top left corner.

  • Not really up to it's centre, at least with regard to textures.

  • Right circles actually get drawn related to the center, which we could have implemented this using a circle, object or circle, uh, graphic with loved art graphics that circle.

  • Not quite what we're going for here.

  • So in order to sort of compensate for this fact, this shift, we actually just subtract some value from our X and why that were during the cook yet which we're going to subtract.

  • Half the width and half the height of the cookie.

  • Said it gets sort of drawn right at its center, so I could just subtract cookie texture, Get with divided by two and same thing here.

  • I can subtract cookie texture, get height divided by two.

  • And if I if I'm not mistaken, which it looks like I'm not we do indeed have our cookie drawn right in the middle of the screen.

  • Um, I'm actually gonna draw the cookie a little higher too.

  • I don't necessarily like exactly, um, how low it's been getting drawn.

  • So I just shoved it up.

  • Maybe a little bit more.

  • Maybe minus 64 on the Why, Yeah, that looks about right.

  • So things are moving along.

  • We now have a cookie in the middle of our screen.

  • It doesn't really do a whole lot on.

  • And for that, we're going to need to figure out how to how to click our cookie to generate some output.

  • Some textual output at least shows us that we are indeed clicking our cookie hence cookie clicker and doing some work.

  • Is this game going to be completed in this life?

  • Stream says not a vision completed in this far as we will have cookies that we can't click and cookies generating over time, We're not going.

  • Thio, um, implement the entirety of the cookie clicker game that you see in the Web browser because it's a very large project with a lot of polish, Um, where we only have three hours.

  • But we're gonna get us far as we can in that direction.

  • And by the end of the stream, I suspect that will have a fairly completed game or at least a fairly completed prototype for a game.

  • He's almost certainly right.

  • He's one of the reasons why Caesar, you so great.

  • I'm going to learn more about what he just talked.

  • He now says.

  • SMR gaming.

  • I appreciate that.

  • Thanks for the thanks for the kind words.

  • If anybody has any questions, go ahead and let me know.

  • Adam Fighter, Are we going to add a crunch sound effect?

  • We absolutely could.

  • We could definitely do that.

  • Adam asks.

  • Did you finish solitaire?

  • Not yet.

  • That's still ongoing.

  • We're taking a break away from that just to cover this game and to, you know, sort of a change of scenery.

  • Influence something from start to finish.

  • But solitaire will resume either next week or the week after that.

  • Details to come.

  • Can the game still be played if cookies are disabled?

  • So I am a dad.

  • I had to do it.

  • I'll see myself out now.

  • Excellent jokes is from Tux Man 29.

  • Everybody.

  • Let's give a virtual round of applause Getsem kappas in the chat for tux man.

  • Uh, love it.

  • Love the joke.

  • Let's go ahead now and say, um, because remember, loved up mouse pressed, we can test to see whether we're actually getting a presto work in and of itself.

  • The first thing that I want to do to get in that direction.

  • I'm actually going to do love dog graphics, stop prints, um, cookies, colon.

  • And then we want to keep track of how many cookies we've actually generated, how many we've clicked to obtain.

  • And so I can do this by saying, dot dot to string cookies and we haven't implemented.

  • We haven't added cookies yet toward to our game and dot dot you might not be familiar with dot dot just means add two strings together.

  • It's the contamination operator in Louis you can't use plus, like you couldn't Java, for example.

  • In Louis, you do need to use dot, dot to tell it that I'm adding strings together.

  • Add them one to the back and Java script issues.

  • Plus, for example, there's all kinds of bugs that come out of that, but you specifically need to use dot dot.

  • In this case, I'm going to go ahead and actually add that variable cookies equals zero, and better practice is going to be to actually make all of these local variables right?

  • So if you have top level variables in your little module and let's say you have other bits of code, other files and you don't want these variables accessible from within those other files.

  • You're gonna want to make sure these air set toe local, make sure they are local variables, local window with local window height.

  • They're still accessible in the same way that we've just been using them.

  • But now, if we have other Lou files in our code base, they won't be visible by default.

  • If we don't specify local, they will be visible from other files.

  • And we don't necessarily want that that can cause a lot of headaches.

  • I'm going to go ahead now, and let's just specify that this should be actually not printed.

  • But I'm gonna say print f for formatted print.

  • And now what this is going to do is I can specify a few different things I could say, Um, start relative on.

  • Uh, let's just say 00 It's so I'm gonna start relative to the top left corner, like before.

  • Um, what I'm gonna want to do is I'm gonna want to center this text on the screen.

  • And to do that, I'm gonna specify after the X y, I'm gonna specify how much padding in which to center it makes.

  • It was my column size between How much size should I center this text, right?

  • And I want I want it to center across the entire screen.

  • So I'm actually gonna specify that is window with and then I'm gonna say center, I want to make sure that that gets centred on and you can specify left.

  • You'd also specify, right?

  • And if I run this, you do indeed see very tiny at the top cookies.

  • Colon zero.

  • But the unfortunate thing about that is that now we're using such a tiny fun.

  • It's kind of hard to see.

  • I want to make this a little bit larger.

  • What I can do is, I can say, uh, local large font is equal to love the graphics dot new font and I should be able to just specify 32.

  • And what this will do is we'll just use my default font, which I think is Ariel and create a new font that's a larger than the default, which I think is 12 pixels.

  • Possibly.

  • And so now if I go down in my loved out load, and I just say, loved our graphics dot set default set font rather too large font.

  • If I'm not mistaken.

  • This should work.

  • Indeed it does.

  • Now cookies is set to zero, but it's large.

  • I can actually see it without having to squint my eyes.

  • Super tiny.

  • So I've made a bit of progress on.

  • And actually, I don't necessarily like how high that is, how close that is to the edge.

  • I'm actually gonna specify that 3 16 pixels from the top.

  • And now it's just a little bit of padding, which is nice.

  • Can you show what extensions you're using for a view of your V s code?

  • Asks Nip sis.

  • So I don't use a whole lot of extensions.

  • But the one that I am using for for love to D is called love to the support by pixel bite studios.

  • And if I go over here, you can see that I do indeed have love to the support by pixel bite studios.

  • It's pretty easy to search for in V s code.

  • It's got 16,000 downloads very highly reviewed.

  • All you can see, it's tribute five, roughly five stars.

  • This allows you if you're on a Mac to just press command.

  • L assuming that you have love installed in your applications folder you say command l And this will sort of just pull up love for you without you needing to click and drag to a folder or need Alias loving your terminal and then run it like I usually do Super nice.

  • If you're on Windows, you could just use all to hell.

  • And you will need to specify the path potentially depending on your set up.

  • But assuming assuming that you have specified the path for your, um, your love to the executable, it'll just pull it up and sort of act as if it's clicking and dragging your folder over to that executed before you.

  • So super nice quality of life improvement.

  • If you're developing and left today

All right.

字幕と単語

ワンタップで英和辞典検索 単語をクリックすると、意味が表示されます

B1 中級

COOKIE CLICKER FROM SCRATCH!- CS50 on Twitch, EP.42 (COOKIE CLICKER FROM SCRATCH! - CS50 on Twitch, EP. 42)

  • 0 0
    林宜悉 に公開 2021 年 01 月 14 日
動画の中の単語