Excalibur.js

@excaliburjs.com

102 Followers 20 Following

Your friendly TypeScript 2D game engine for the web! ⚔️ https://excaliburjs.com

Walking through the features mentioned in the excalibur dev tools extension ECS system timing sparklines for perf debugging! Color blindness simulation for a11y testing! Change debug draw colors on everything! Scene navigation buttons! Screen & camera details panel! Tweak Physics Settings on the Fly!
const actor = new ex.Actor({ graphic: cloudSprite, material: swirlMaterial });
4 different types of stickers, sword logo, text logo, May-trix from Sum-Monsters Game, and Cal the robot
https://excaliburjs.com sticker link for purchase
Screenshot of VSCode running the new excalibur dev container ```json // .devcontainer/devcontainer.json { "name": "Node.js & TypeScript (Playwright)", "image": "mcr.microsoft.com/playwright:v1.55.1-noble", // Install browsers "postCreateCommand": "npm install; npx playwright install", // Start virtual Xserver for tests and leave running "postStartCommand": "nohup bash -c 'Xvfb $DISPLAY -screen 0 1280x720x16 &'", "containerEnv": { "DISPLAY": ":99" }, "portsAttributes": { "51204": { "label": "Vitest UI" }, "5173": { "label": "Vite Dev Server" }, "6006": { "label": "Storybook" }, "3000": { "label": "Docs Site" } } } ```
```typescript const query = new Query({ // all fields are optional components: { all: [ComponentA, ComponentB] as const, // important for type safety! any: [ComponentC, ComponentD] as const, // important for type safety! not: [ComponentE] }, tags: { all: ['tagA', 'tagB'], any: ['tagC', 'tagD'], not: ['tagE'] } }) // previous constructor type still works and is shorthand for components.all new Query([ComponentA, ComponentB] as const) ```
```typescript import * as ex from 'excalibur' const soundManager = new ex.SoundManger({ channels: ['fx', 'music', 'background'], sounds: { jumpSnd: { sound: jumpSnd, volume: 0.4, channels: ['fx'] }, forestSnd: { sound: forestSnd, volume: 0.2, channels: ['music', 'background'] }, challengeMusic: { sound: challengeMusic, volume: 0.2, channels: ['music'] }, guitarLoop: { sound: guitarLoop, volume: 0.2, channels: ['music'] } } }); // play a specific sound soundManager.play('jumpSnd'); // mute a specific channel with all member sounds soundManager.channel.mute('music'); // mute all sound soundManager.mute(); // unmute all sound that was previously muted, and resume playing from the current location soundManager.unmute(); // unmute a specific channel that was muted soundManager.channel.unmute('music'); // play a specific channel soundManager.channel.play('music'); // set the max volume of an entire channel soundManager.channel.setVolume('music', 0.9); ```
Video of Excalitris (tetris clone) being played poorly
Code Snippet ```typescript import { Graph } from 'excalibur'; // Create an empty graph of strings const graph = new Graph<string>(); // Add a few nodes with string data const nodeA = graph.addNode("A"); const nodeB = graph.addNode("B"); const nodeC = graph.addNode("C"); // Connect nodes with bidirectional edges (default) graph.addEdge(nodeA, nodeB); graph.addEdge(nodeB, nodeC); graph.addEdge(nodeC, nodeD); graph.addEdge(nodeD, nodeE); // Check if nodes are connected const connected = graph.areNodesConnected(nodeA, nodeB); // true // Get neighbors of a node const neighbors = graph.getNeighbors(nodeA); // [nodeB] // Find shortest path from A to C const { path, distance } = graph.shortestPathDijkstra(nodeA, nodeC); const aStarResults = graph.astar(nodeA, nodeB); ```
Code Snippet: ```typescript const query = new Query({ // all fields are optional components: { all: [ComponentA, ComponentB] as const, // important for type safety! any: [ComponentC, ComponentD] as const, // important for type safety! not: [ComponentE] }, tags: { all: ['tagA', 'tagB'], any: ['tagC', 'tagD'], not: ['tagE'] } }) ```
Futurama character, Professor Farnsworth saying "Good news, Everyone!"
Excalibur.js 2DCon booth
Integrate MassiveRealm with playcanvas, excalibur, react, and vue.js examples
Cellular Automata procedural generation