Euskit (pronounced you-skit) is a game engine for HTML5/Web games. It is specifically made for making retro-looking 2D games with pixel art. Growing up in 80s in Japan, those arcade games have always a special place in me. This is my attempt to headstart in several game jams that I participated. The engine is designed to be lightweight and self-contained in that it doesn't depend on any external library except TypeScript. It is licensed under MIT License.
The following instruction applies both Windows and Unix (or Mac).
> npm install -g typescript
skel directory as your working directory:
index.html Main HTML file.
tsconfig.json TypeScript compiler settings.
base/*.ts Euskit base library code.
src/game.ts Game source code.
assets/ Game assets.
(On Unix, this can be also done by running the following script.)
$ ./tools/setup.sh /path/to/project
tsc at the working directory.
> tsc
index.html file.
Here are the important concepts in Euskit:
App:
Resource management and event loop.Scene:
Game state management and event handling.World:
Container where Entities are placed in.Entity:
In-game character.Sprite:
Graphical object to be shown.App object. It does the
basic pluming and resource management (images and sounds); it has
an event loop and connect all the external parts (i.e. a browser)
to the game. Typically, you don't have to change this part.
Scene can be thought of a mini-app or "mode" within the App.
It's pretty much an event handler that manages the in-game states.
This is primarily what a Euskit user will write. Euskit supports
multiple Scenes, but it's possible to create an entire game with just
one Scene.
Entity is a bit like a GameObject in Unity.
(Unlike Unity, however, Euskit uses a traditional hierarchical model
instead of components.)
Each Entity has its own process, Collider and one or more
Sprites.
Once you place an Entity in the game world, it moves on its own.
A Rect is typically used for Collider in 2D games.
World is where Entitys belong to.
It is basically a container that manages the state of each Entity
and performs basic collision handling.
Sprite is something to be displayed.
It has a location, rotation and the reference to its content.
Unlike some other engines, Sprite doesn't know how to move itself.
It is just sitting at a certain location on screen. Scene or
Entity is responsible to change/move its position.
Entity is a subclass of Task.
A Task is an independent object that runs by itself.
It is often convenient to create a short-lived task for a delayed action
(see the examples).
Signal is much like C# events, but it is renamed here
to avoid confusing with HTML5 events. Unlike EventListener class in HTML5,
Each Signals are distinguished not by strings but by variables
(see the examples).
TODO
TODO