add docs for loadSprite

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<Sprite>
 ```
 
-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`
 ```