Are there plans on making events enums as opposed to strings?

[ryaino]

Just something I've noticed when working through examples and the docs. I understand why it might be like this while the library is still in it's early stages but just wanted to know if it might be possible to see this change in the future? Some examples from the breakout game:

currently:
ball.on("collisionend", () => {

What I'm suggesting (or something similar):
ball.on(Events.ColissionEnd, () => {

Where Events would look something like:
export enum Events { CollisionEnd = 'collisionend', ExitViewPort = 'exitviewport', ...etc }

I think this would help a lot with type safety and avoiding typos in strings while also allowing the library to alter the spelling of strings across releases without any consumers needing to update their code accordingly.

[eonarheim]

Hi @ryaino! Great suggestion!

We've totally been thinking about this, we have a new typed event emitter implementation that hasn't propagated to the whole codebase yet in the latest alpha (should be everywhere by v0.28, no promises tho) https://github.com/excaliburjs/Excalibur/blob/main/src/engine/EventEmitter.ts

You can give it a type that hints all of the .on(), .off(), .once() https://github.com/excaliburjs/Excalibur/blob/main/src/engine/Graphics/Animation.ts#L131

export type AnimationEvents = {
  frame: FrameEvent;
  loop: Animation;
  ended: Animation;
};

public events = new EventEmitter<AnimationEvents>();

The downside is this approach doesn't have enum literals you can reference like Events.CollisionEnd, but the VS Code type hints are still pretty good.

I'll definitely experiment with adding literals that can be referenced like you suggest, it would be nice to have those especially in the vanilla js case or in the case your editor doesn't provide type hints.

Something like:

export const AnimationEventsEnum = {
  Frame: 'frame',
  Loop: 'loop',
  Ended: 'ended'
} as const;

[eonarheim]

Oh just discovered TypeScript will infer this based on the usage! So we could use the same name

/**
 * Built in events supported by all entities
 */
export type EntityEvents = {
  'initialize': InitializeEvent;
  'preupdate': PreUpdateEvent;
  'postupdate': PostUpdateEvent;
};

export const EntityEvents = {
  Initialize: 'initialize',
  PreUpdate: 'preupdate',
  PostUpdate: 'postupdate'
} as const;

this.events.on(EntityEvents.Initialize, ...)