Back to Browse

Coding a Street Fighter game | JavaScript, HTML Canvas | Adding basic moves through states (Part 5)

7.5K views
Jun 30, 2022
34:58

Part 5 of my tutorial series on making a Street Fighter game using web technologies. In this video, we'll implement a state machine and learn how to use it to cleanly build our basic move set. We'll then attach it to a from so we can make our fighters dance to our will! Complete Playlist: https://www.youtube.com/playlist?list=PLf9yt-2olqyLxr-vouWl-qk4toUfjF2LC Patreon Page: https://www.patreon.com/shezzor #canvas #streetfighter #javascript Timestamps: 0:00 Title 0:23 Intro 2:18 Prep work for the state machine 3:52 Understanding entity state 4:38 Understanding the state machine concept 5:50 Adding the initial state machine structure 6:45 Migrating the forward and backwards moves to the state machine 11:22 Adding a form to control the states 14:58 Adding the idle state 16:58 Adding the jump up state 20:44 Updating the animations with frame delays 23:09 Adding the jump forward and backwards states 26:43 Applying a safe guard to the state machine 28:05 Adding the crouching state(s) 30:24 Refactoring the index file 33:02 Summary 33:24 End

Download

0 formats

No download links available.

Coding a Street Fighter game | JavaScript, HTML Canvas | Adding basic moves through states (Part 5) | NatokHD