Coding a Street Fighter game | JavaScript, HTML Canvas | Adding Keyboard & Gamepad controls (Part 6)

Part 6 of my tutorial series on making a Street Fighter game using web technologies. In this video, we'll learn how to use keyboard and gamepad controls within the browser so that we can configure the fighters to move around the screen independently for the first time. Complete Playlist: https://www.youtube.com/playlist?list=PLf9yt-2olqyLxr-vouWl-qk4toUfjF2LC Patreon Page: https://www.patreon.com/shezzor #canvas #gamedevelopment #javascript Timestamps: 0:00 Title 0:18 Intro 1:48 Re-cap 2:24 Waving goodbye to the form 3:12 Understanding keyboard events 6:50 Adding keyboard controls to the fighters 9:59 Building a configurable control scheme 11:22 Extending the keyboard helper functions based on the control scheme 11:55 Giving the fighters an unique id 12:50 Extending the keyboard helper controls for the fighters 14:28 Connecting the fighters moves/states to the keyboard control scheme 16:43 Adding a shadow underneath the fighters 21:42 Understanding how gamepads work in the browser 26:15 Extending the control scheme to accommodate gamepads 27:53 Extending the input handler to accommodate gamepads 30:20 Extending the control helper functions to accommodate gamepads 33:12 Fixing the keyboard "preventDefault" issue 33:49 Summary 34:39 End