Engine hooks

A game declares once which functions the client runs for world-map element events, and which assets it loads at start-up.

One declaration

src/engine-hooks.ts2

export default defineEngineHooks({
  worldmapElementHover: (e) => mapElementHovered(e.element, e.x, e.y),
  worldmapElementLeave: (e) => mapElementLeft(e.element),
  worldmapElementOp1: (e) => mapElementTravelled(e.element, e.coord),
  assets: {
    music: { title: 'scape main' },
    sprites: { logo: 'logo' },
  },
});

Write it as export default at module scope, with an object literal; there is one per project. A hook left out runs nothing, and an asset left out keeps its usual name. The eight hooks are worldmapElementOp1 to worldmapElementOp5, plus worldmapElementEnter, worldmapElementHover and worldmapElementLeave. The event carries:

Field
element	the map element the event fired on
coord	the element’s Coord, with .x, .z and .plane
x, y	the pointer, on enter, hover and leave only

Assets are grouped as binary, scripts, sprites, fonts, worldmap and music. Each value is a string, or null where the asset may be skipped.

What a hook may do

Have a hook call a function that writes cells, and let a component read them:

src/map-tooltip.ts2

export const mapElementHovered = (element: Int, x: Int, y: Int): void => {
  const [, setElement] = useState(hoveredElement);
  const [, setX] = useState(hoveredX);
  const [, setY] = useState(hoveredY);
  setElement(element);
  setX(x);
  setY(y);
};