In Part I, we wrote a special Elixir GenServer that allows us to replace any GenServer in our Elixir apps with an Extism Plug-in. Our goal was to build a version of this turn-based game system that allows users of the platform to create and upload their own games.
Today we’re announcing the result, GameBox!
If you want to see GameBox in action, we played a live game of Trivia with the entire audience at Wasm/IO in Barcelona this year. See the first few minutes of Steve’s talk here:
How it works
The primary technical concept behind GameBox is, as lifted from the previous post, about replacing a key GenServer implementation with an Extism plug-in. Like its inspiration, GameBox is built with the Phoenix framework and the GenServer we targeted to extend is LiveView. The LiveView module has a pretty simple API:
- LiveView.mount/3 is called when a user connects to the module
- LiveView.handle_info/3 is called when an event is triggered in the client
- LiveView.render/1 is called when the system needs to re-render the client
It's important to learn about LiveView to understand how the system works and how a game can be created.
mount/3 is hand coded for the most part, but
render/1 are proxied to the game plug-in to handle. You can think of the game as a single state machine. Events come in through
handle_info and may or may not mutate the state. When the system needs to be redrawn,
render is called and the game outputs some HTML.
When the user clicks this button, an event is sent to the handle_info callback of this shape:
The game logic can interpret this message and mutate the state of the board by placing the player’s character (
O) at cell index
As mentioned before, the game developer creates a game by satisfying these callbacks. We provide an interface, a number of functions, that the game must export to plug-in to the GameBox system. Thanks to Extism, this interface can be implemented in any language we support.
Jump over to Part III of this series to get the details on how to make a game as a plug-in.
We got a lot of help from the community on this project and we want to thank all the individuals who put so much work into it:
- Brian Berlin When we came up with the idea, We were a bit overwhelmed jumping back into Phoenix, but luckily Brian's expertise with Elixir got us far. After a week of hacking we had a solid protoype.
- Revelry When we decided we wanted to step this up and make this a professional app, we turned to Revelry for help. In a few short weeks they were able to polish it into something we can be proud of.
- Amy Murphy We also want to callout Amy on the Revelry team who went above and beyond making what are the coolest games on the platform.