built-in shellSpotlightGallery
Every clip below is a few seconds of real play: two or more browsers in one room on the demo server, filmed by scripts/record-gallery.ts. Each game is one HTML file in examples/games/.
built-in shellSpotlight
three.js
Phaser
built-in shell
built-in shell
PixiJS
built-in shell
built-in shell
built-in shell
built-in shell
built-in shellRun them
Section titled “Run them”npm install tickcli ws three phaser pixi.js # the engines are only needed for their examplesnpx tickcli node_modules/tickcli/examples/gamesOpen a game in two browser windows (or send the link to a friend) to play together.
What each one shows
Section titled “What each one shows”Spotlight: Star Squad, a bigger game
Section titled “Spotlight: Star Squad, a bigger game”space-squad.html, up to 4 players. A co-op side-scroller written as a folder of plain scripts (examples/space-squad/: art, audio, levels, rules, HUD) and bundled into the one page the server plays by node scripts/bundle-game.ts examples/space-squad examples/games/space-squad.html. The host runs the aliens, bosses and weather and decides trap damage (traps move on the shared clock, so they cost no traffic); each player shares only their hero’s position, pose and class. Heroes who join a planet already under way drop in next to a teammate.
Engine demos
Section titled “Engine demos”Sky Duel: Phaser air shooter
Section titled “Sky Duel: Phaser air shooter”sky-duel.html, 1 to 8 pilots. Phaser draws, moves and reads the keys; tickcli runs headless: the lobby over the page, the host’s drones and score. Drones are shared state the host moves (they glide smoothly on every screen); lasers are g.shoot() shots that every screen moves by itself; explosions are g.fx() effects. Textures are drawn in code, no image files.
Gem Run 3D: three.js
Section titled “Gem Run 3D: three.js”arena3d.html, 1 to 8 players. Game({context: "webgl"}) keeps the shell’s bar, screens and touch pad while three.js draws. Each player shares a position and a quaternion (TickcliThree.pose); others turn smoothly as one rotation. The host spins the gem with a quaternion too.
Neon Paint: PixiJS, draw together
Section titled “Neon Paint: PixiJS, draw together”neon-paint.html, 1 to 8 people. Strokes travel as effects (g.fx, sent once, never stored) and fade after 8 seconds; pens are each player’s own state, shown with g.sync. A small live-drawing toy, not a document editor: see when to use tickcli.
Own Engine: your own loop
Section titled “Own Engine: your own loop”own-engine.html: a plain canvas and requestAnimationFrame, the shape of any engine. Two marked lines are the whole room: g.me.set(...) and g.sync(...).
Shell games
Section titled “Shell games”chess.html: two seats, everyone else watches. A player asks the host to move (g.act("move", ...)); the host checks the full rules (check, castling, en passant, promotion) and runs the clocks.
More in the folder
Section titled “More in the folder”| File | Shows |
|---|---|
tag.html |
the smallest real game: players, host rules, timers |
tictactoe.html |
seats and turns |
cup.html |
a knockout tournament over a room |
race.html |
a world bigger than the screen, a camera, a 3-2-1 start |
shooter.html |
shots and hits with the plain shell |
arena.html |
two teams, minions and towers |
dungeon.html, delve.html |
co-op crawlers with saved profiles and worlds |