Skip to main content

Asset

The Asset type represents an asset file such as an image or sound. Assets can be specified using a @ symbol followed by the filename. If there are multiple files with the same filename, the file which is closest to the current file will be selected.

// Refer to assets by their filename with an @ prefix before the string
// This will be resolved at compile time and will error at compile time if it does not exist
Image(@fireball.svg) // displays the image in the UI
ImageSprite(@fireball.svg) // renders the image as a sprite in-game

Sing(@fireball.esfx) // plays the sound but stops if this entity dies
Hear(@fireball.esfx) // plays the sound to completion

Folders​

You can include folders in your asset path to help disambiguate between assets with the same name. For example, in a project where @image.svg could refer to multiple files, you could use @fireball/image.svg or @thunderbolt/image.svg to be more specific.

Wildcards​

You can use wildcard patterns to match multiple files, for example @fireball-*.svg will match fireball-1.svg and fireball-2.svg. A constant Array containing all matching files will be returned. Wildcard patterns are resolved at compile time and so are an efficient way of handling large numbers of similar assets.

Like any other Array, you can access each element by index:

let fireballImages = @fireball-*.svg
ImageSprite(fireballImages[0])

You can iterate over the array of assets to create animations:

for image in @fireball-*.svg {
    ImageSprite(image)
    await Tick
}

Alternatively, the Array can be passed directly to the ImageSprite function to create an animation:

ImageSprite(@images/fireball-*.svg, frameInterval=0.1s)

At present, wildcards are not supported in the middle of a path, only at the end. They only match filenames, not folder names.

Preloading​

tip

Use the @defer: prefix to defer loading of large assets like music files until they are needed.

To eliminate waiting times, Easel loads assets in the background while the game is playing. The game begins preloading assets as soon as the game starts, and so normally all assets should be available within the first few seconds of play.

If you have some quite large files like some music files, you can use the @defer: prefix to defer loading them until they are needed. This can improve the performance of your game as downloading these large assets unnecessarily can consume a lot of network resources, which may be needed to download other assets or for multiplayer.

Music(@defer:AllTooWell.mp3)
Image(@defer:victory.jpg, height=40)

Video files are never preloaded and are always loaded on demand, so there is no need to use the @defer: prefix for them.