diff --git a/docs/src/gamelib/index.md b/docs/src/gamelib/index.md index 6d7e12c..a5a2d56 100644 --- a/docs/src/gamelib/index.md +++ b/docs/src/gamelib/index.md @@ -308,41 +308,62 @@ lib.startGameLoop(function () { }); ``` -### `drawSprite` +### `loadSprite` ```ts -lib.drawSprite(x: number, y: number, width: number, height: number, name: string) -> void +lib.loadSprite(name: string, width: number, height: number) -> Promise ``` -Draws a sprite imported in the asset editor. +Loads a sprite from the asset editor with a specified width and height. -/* todo: link to sprite editor docs */ +The `name` parameter is the file name as it is shown in the asset editor. + +Setting the `width` and `height` to anything other than those of the original image will cause the sprite to be resized take up that size. + +The loading is asynchronous, so you will have to add `await` for it to work. Example: ```ts +const mySprite = await lib.loadSprite("sprite.png", 50, 50); +``` + +After loading, the sprite is ready to be drawn. + +See also: [`lib.drawSprite()`](#Lib-drawSprite) + +### `drawSprite` + +```ts +lib.drawSprite(x: number, y: number, sprite: Sprite) -> void +``` + +Draws a loaded sprite at the specified coordinates. + +Example: + +```ts +const cloudSprite = await loadSprite("cloud.png", 20, 10); + lib.startGameLoop(function () { lib.clear("blue"); - lib.drawSprite(20, 30, 20, 10, "cloud.png"); + lib.drawSprite(20, 30, cloudSprite); }); ``` -Note: Sprite images have to be loaded. This is done asynchronously, meaning a sprite might not -appear on the canvas after the first call to `drawSprite`. +Before drawing, the sprite must be loaded into a variable. -Note: The sprite images are cached internally on it's `name`, `width` and `height` property. If -these are values are different between calls, new sprite images will be loaded. This means that -after a resize, the sprite may not appear immediately. +See also: [`lib.loadSprite()`](#Lib-loadSprite) ### `drawSpriteRotated` ```ts lib.drawSpriteRotated( - x: number, - y: number, - width: number, - height: number, - name: string, + x: number, + y: number, + width: number, + height: number, + name: string, angle: number ) -> void ``` @@ -383,9 +404,9 @@ lib.startGameLoop(function () { ```ts lib.drawLine( - x0: number, y0: number, - x1: number, y1: number, - thickness: number, + x0: number, y0: number, + x1: number, y1: number, + thickness: number, color: Color ) -> void ``` @@ -502,7 +523,7 @@ lib.startGameLoop(function (deltaT) { ```ts lib.onClick( - handlerFunction: MouseButtonEventFunc, + handlerFunction: MouseButtonEventFunc, button: MouseButton = lib.MouseButton.Left ) -> void ``` @@ -536,7 +557,7 @@ lib.onClick(function () { ```ts lib.onClickRelease( - handlerFunction: MouseButtonEventFunc, + handlerFunction: MouseButtonEventFunc, button: MouseButton = lib.MouseButton.Left ) -> void` ```