new StatusBar()
- Source:
Extends
Members
currentImage :number
Index of the current frame in the animation image sequence.
Used by playAnimation.
Type:
- number
- Inherited From:
- Source:
height :number
Height of the status bar in pixels.
Type:
- number
- Source:
imageCache :Object.<string, HTMLImageElement>
A cache of preloaded images for animation or performance.
Keys are image paths, values are HTMLImageElement instances.
Type:
- Object.<string, HTMLImageElement>
- Inherited From:
- Source:
img :HTMLImageElement|undefined
The currently displayed image of the object.
Set by loadImage or animation logic.
Type:
- HTMLImageElement | undefined
- Overrides:
- Source:
offset :Object
Defines the hitbox offset for the object.
Useful for shrinking or expanding collision boundaries relative to the image.
Type:
- Object
- Inherited From:
- Source:
otherDirection :boolean
Whether the object is facing left instead of the default right.
Used for mirroring the image in rendering logic.
Type:
- boolean
- Inherited From:
- Source:
percentage :number
Current percentage value represented by the bar (0–100).
Determines which image is displayed.
Type:
- number
- Source:
width :number
Width of the status bar in pixels.
Type:
- number
- Source:
x :number
Horizontal position of the status bar on the screen.
Type:
- number
- Source:
Methods
draw(ctx)
Draws the current image of the object onto the canvas.
This is the standard rendering function used by all drawable game objects.
Parameters:
| Name | Type | Description |
|---|---|---|
ctx |
CanvasRenderingContext2D | The canvas 2D rendering context. |
- Inherited From:
- Source:
drawFrame(ctx)
Draws a red outline representing the object's collision hitbox.
Only applies to certain object types (Character, Chicken, etc.).
Useful for debugging and visualizing hitboxes.
Parameters:
| Name | Type | Description |
|---|---|---|
ctx |
CanvasRenderingContext2D | The canvas 2D rendering context. |
- Inherited From:
- Source:
getHitboxBorderBottom() → {number}
Calculates the bottom boundary of the object's hitbox.
- Inherited From:
- Source:
Returns:
Bottom edge including offset.
- Type
- number
getHitboxBorderLeft() → {number}
Calculates the left boundary of the object's hitbox.
- Inherited From:
- Source:
Returns:
Left edge including offset.
- Type
- number
getHitboxBorderRight() → {number}
Calculates the right boundary of the object's hitbox.
- Inherited From:
- Source:
Returns:
Right edge including offset.
- Type
- number
getHitboxBorderTop() → {number}
Calculates the top boundary of the object's hitbox.
- Inherited From:
- Source:
Returns:
Top edge including offset.
- Type
- number
isColliding(other) → {boolean}
Checks whether this object is colliding with another object.
Uses axis-aligned bounding box (AABB) collision detection with hitbox offsets.
Parameters:
| Name | Type | Description |
|---|---|---|
other |
DrawableObject | The object to check collision against. |
- Inherited From:
- Source:
Returns:
True if this object overlaps with the other object.
- Type
- boolean
loadImage(path)
Loads a single image and assigns it to the `img` property.
Used to display a static image or initialize an animation frame.
Parameters:
| Name | Type | Description |
|---|---|---|
path |
string | The path to the image file. |
- Inherited From:
- Source:
loadImages(arr)
Preloads an array of image paths and stores them in the image cache.
Used for animations or quick access to different states.
Calls the global `countLoadedImages` function on each load.
Parameters:
| Name | Type | Description |
|---|---|---|
arr |
Array.<string> | Array of image file paths to preload. |
- Inherited From:
- Source:
playAnimation(images)
Cycles through the given image array to create an animation effect.
Updates the `img` property to the next frame in the sequence.
Parameters:
| Name | Type | Description |
|---|---|---|
images |
Array.<string> | An array of image paths used for animation frames. |
- Inherited From:
- Source:
resolveImageIndex() → {number}
Resolves the image index based on the current percentage value.
Used to determine which visual state of the bar to display.
- Source:
Returns:
Index of the image corresponding to the percentage.
- Type
- number
setPercentage(percentage)
Updates the current percentage and sets the corresponding image.
The image is chosen based on the percentage value using resolveImageIndex().
Parameters:
| Name | Type | Description |
|---|---|---|
percentage |
number | The new percentage value (0–100). |
- Source: