HTML5 2D and isometric scenegraph-based game engine written entirely in TypeScript / JavaScript.
From version 3.0.1 the engine expects to be installed into a project and used as a module via npm:
npm i @irrelon/igeYou should use the engine via an import statement:
import { ige } from "@irrelon/ige";The stream code has been updated so any transform data (translate, rotate and scale)
sent to the client/s by the server are no longer directly assigned via
this._translate.x = streamData.x and instead are passed to the transform method
related to the data e.g. this.translateTo(streamData.x, streamData.y, streamData.z);
The same goes for rotateTo() and scaleTo(). This is so that code is written that overrides those base class methods will get called correctly when the streamed entity is transformed. Previously there was no way to detect that a transform had changed by streaming data.
The optional modules you can call uses() for are currently:
network,audio,box2d,tweeningandui
The engine expects you to specify some of the previously auto-included modules that are now optional, then wait for them to load. For instance, if your app is using networking you should tell the engine about that up front via
ige.uses("network");You should call this for each module you wish to use before calling ige.init();.
After you've specified all the modules via uses() calls, you need to call init()
and then wait for the isReady signal before proceeding further:
ige.uses("network");
ige.uses("ui");
// Now tell the engine we are OK to proceed, having declared what we want to use
ige.init();
// Now wait for the engine
ige.isReady().then(() => {
// Proceed with the rest of your code
});The original engine was written over 12 years ago, and it is a testament to that work that it is still by far the most feature-rich browser-based game engine available today. There is still NO OTHER engine that supports realtime multiplayer streaming out of the box written purely in JavaScript in a 2d and isometric rendering engine.
With all that said, it's 2024 and back in 2011, ES classes, ES modules, TypeScript, webpack etc did not exist. As such, language functionality such as classes were custom-created to facilitate an inheritance-style codebase. This was great, as was the magic of using ES classes years before they even existed, but now we have native functionality in JavaScript, a rewrite of the engine needs to happen to make use of that new functionality.
Minor changes exist as well as some breaking changes (such as the removal of ClientConfig and ServerConfig files) that were ultimately made to increase functionality or update anachronistic coding patterns to more modern expectations.
The major changes are:
The built-in compiler is no longer required since import now exists in browsers natively,
so it is no longer a requirement to compile using the engine's compiler to get a runnable
project / game. You should code with ES modules import and export, not CommonJS require
and module.exports (although CommonJS is still currently supported).
The node.js server-side executable system that ran IGE on your server for multiplayer support has been removed as the isomorphic JavaScript output runs natively in Node.js - again due to the support for ES modules, ES classes and there is no need to "package" projects / games anymore! :)
The ClientConfig.js and ServerConfig.js are no longer required and can be removed everywhere.
The engine simply uses ES module imports and exports now, directly in the files that need them.
Many of the examples in the examples folder have been converted to TypeScript and ES modules
although this work is still ongoing. You can tell which ones can be run because there will be an
index.ts rather than only an index.js file. Examples might be in a broken state for a while
but focus has been on the core functionality of the engine and bringing it up to modern standards
of code rather than updating example code for the moment.
This is only required if you intend to make changes to the core engine. If you only want to use the engine in a project, you do not need to clone the repo from GitHub since you can use the engine via
npm i @irrelon/igeand then import it normally.
After downloading or cloning this repository, please change to the folder you cloned the repository to and then run:
npm iYou must have Node.js installed for the installation to work. This version of the engine has been tested against Node.js 16.13.1 and higher.
Run the
buildnpm command will compile the TypeScript to JavaScript files. Thebuildcommand also runsnpx @irrelon/fix-pathsto automatically resolve TypeScript paths e.g.@/engine/somethingin .js files to their relative equivalents like../engine/something.
npm run buildThe resulting build will be available in the dist folder. The docs folder will
also update during the build to output JSDoc compatible documentation.
There are a lot of examples in the ./examples folder. Please see the ./examples/readme.md file for more information about running the examples.
https://www.isogenicengine.com/docs-manual.html
If you have any comments, questions, requests etc. you can post on the GitHub issue tracker.
A create-ige-app npx script is on the way as well, almost ready! This will
create a basic app with the webpack and Node.js setup to create games with
this version of the engine without configuring all the things yourself.
This will also support templates, so we can get started on something faster.
When working with the provided UI classes (IgeUiEntity and IgeUiElement) it's important to understand the differences. IgeUiElement instances stop pointer even propagation by default. This means if you mount one IgeUiElement inside another one, only the parent will get pointer events like pointerDown and pointerUp.
IgeUiEntity instances have the same general capabilities but are considered graphical rather than interactive so don't hook or interfere with pointer events by default.
MIT
(C)opyright 2023 Irrelon Software Limited https://www.irrelon.com