Skip to main content

Hotspots

A hotspot is a specific area in the game world that can be interacted with by clicking on it or hovering over it. They are essentially invisible buttons in the game world. Here are some examples of what you can do with hotspots:

  • Doors you can click on to exit the room
  • Items you can pick up by clicking on them
  • Units that you can select by clicking on them
  • Stat panels that appear when hovering over a unit

Minimal example

To make a hotspot, add a PolygonHotspot to an entity. You can give it an intent like PressIntent to respond to clicks, which you would then respond to in an on Pressed handler.

Below is an example of a hotspot that prints "Hello, world!" when clicked:

pub game fn World.Main() {
SpawnEachPlayer owner {
Spawn unit {
use body=this
let shape = Equilateral(radius=10)
Body(pos=@(0, 0))
PolygonSprite(shape=, color=#879)
PolygonHotspot(PressIntent<hello>, shape=)
}

on Pressed<hello> {
Print { "Hello, world!" }
}
}
}

Defining a hotspot

Use the PolygonHotspot function to add a hotspot component to an entity. A hotspot generally has 3 parts:

  1. Shape: You can think of a PolygonHotspot like a PolygonSprite, but instead of drawing a shape, it defines an area that can be interacted with. The shape parameter defines the area of the hotspot. For performance reasons, it is best to keep the shape as simple as possible, so a Circle, Rectangle or Capsule are good choices.

  2. Intent: Like a Button, the intent defines what happens when the hotspot is clicked on or hovered over. The most common intent is PressIntent, which simply lets you respond to the hotspot being clicked on. See Intents to learn more about what intents are available and how to use them.

  3. Strobe: Like a Strobe, the shine, growth and shift parameters temporarily modify all sprites on the entity when the hotspot is hovered over (unless they are set to strobe=false). The default values are shine=0.1 and growth=0.05, but you can override these by either passing in your own values, or changing the global defaults in the [graphics] section of your easel.toml file.

Cameras and hotspots

Because a hotspot is a like a sprite, it takes a camera parameter which defines which camera the hotspot applies to. For example, if your game has both a main camera and a minimap camera, you could have hotspots on the minimap to make quest markers that display further information when hovered over. Hovering over the same positions in the main camera would not trigger the hotspots.

Tip: Selectable units

A common use case for hotspots is to make units selectable, for example in a Real-time Strategy (RTS) game. If you attempt to do this, the first approach you might think of doing is to add a PolygonHotspot to each unit with a PressIntent. The PressIntent takes a payload parameter, which you might want to set to the unit so you can know which unit was clicked on in the on Pressed event. However, this does not work because Entities are not Sendable. This is because Easel is a multiplayer-first engine, and entities can sometimes be constructed in different orders on different clients and so there is no way to know whether the Entity IDs will match across all timelines.

The suggested approach is to still use a PressIntent like normal, but don't send any payload. Instead, when you receive the on Pressed event, simply use QueryNearest to find the nearest unit to the Pointer.