Book Image

Hands-On Game Development with WebAssembly

By : Rick Battagline
Book Image

Hands-On Game Development with WebAssembly

By: Rick Battagline

Overview of this book

Within the next few years, WebAssembly will change the web as we know it. It promises a world where you can write an application for the web in any language, and compile it for native platforms as well as the web. This book is designed to introduce web developers and game developers to the world of WebAssembly by walking through the development of a retro arcade game. You will learn how to build a WebAssembly application using C++, Emscripten, JavaScript, WebGL, SDL, and HTML5. This book covers a lot of ground in both game development and web application development. When creating a game or application that targets WebAssembly, developers need to learn a plethora of skills and tools. This book is a sample platter of those tools and skills. It covers topics including Emscripten, C/C++, WebGL, OpenGL, JavaScript, HTML5, and CSS. The reader will also learn basic techniques for game development, including 2D sprite animation, particle systems, 2D camera design, sound effects, 2D game physics, user interface design, shaders, debugging, and optimization. By the end of the book, you will be able to create simple web games and web applications targeting WebAssembly.
Table of Contents (18 chapters)

JavaScript keyboard input

The first thing we will do is learn how to listen for JavaScript keyboard events and make calls into our WebAssembly module based on those events. We will be reusing a lot of the code we wrote for Chapter 2, HTML5 and WebAssembly, so the first thing we should do is grab that code from the Chapter02 folder and copy it into our new Chapter05 folder. Copy the new_shell.html file from inside the Chapter02 directory to the Chapter05 directory, then rename that file jskey_shell.html. Next, copy shell.c from the Chapter02 directory to the Chapter05 directory and rename that file jskey.c. Finally, copy the shell.css file from the Chapter02 directory into the Chapter05 directory, but do not rename it. These three files will give us a starting point for writing the JavaScript keyboard input code.

First, let's take a look at the jskey.c file that we have just...