samengine 1.9.0 → 1.10.0

package/dist/texture.d.ts

@@ -1,37 +1,137 @@
 import { Rect } from "./types/rectangle.js";
+/**
+ * Loaded texture image.
+ *
+ * `undefined` means the texture was not loaded or the cache key does not exist.
+ */
 export type Texture = HTMLImageElement | undefined;
+/**
+ * Optional drawing settings used by texture, atlas, and animation rendering.
+ */
 export type DrawOptions = {
+    /** Target width before `scale` is applied. Defaults to source width. */
     width?: number;
+    /** Target height before `scale` is applied. Defaults to source height. */
     height?: number;
+    /** Rotation in radians around the rendered image center. */
     rotation?: number;
+    /** Mirrors the image horizontally around its center. */
     flipX?: boolean;
+    /** Mirrors the image vertically around its center. */
     flipY?: boolean;
+    /** Multiplies the final rendered width and height. */
     scale?: number;
 };
+/**
+ * Loads an image and stores it in the texture cache.
+ *
+ * Normal builds load from `/resources/${src}`. Single-file exports can provide
+ * embedded resources through `window.__resources`; if a matching key exists,
+ * that data URL is used instead. The cache key always remains the original
+ * `src` string, so `getTexture(src)` works the same in both modes.
+ *
+ * @param src Resource path relative to the resources folder.
+ * @returns Promise resolving to the loaded `HTMLImageElement`.
+ */
 export declare function loadTextureAsync(src: string): Promise<HTMLImageElement>;
+/**
+ * Reads a texture from the cache.
+ *
+ * This does not start loading by itself. Call `loadTextureAsync` first or handle
+ * the `undefined` result.
+ */
 export declare function getTexture(src: string): Texture;
+/**
+ * Draws a texture to the canvas.
+ *
+ * The image is drawn around its center for rotation and flipping, but `x` and
+ * `y` still describe the top-left target position. If the texture is missing,
+ * a magenta fallback rectangle is drawn to make missing assets visible.
+ */
 export declare function drawTexture(ctx: CanvasRenderingContext2D, texture: Texture, x: number, y: number, options?: DrawOptions): void;
+/**
+ * A spritesheet image plus named frame rectangles inside that image.
+ */
 export type TextureAtlas = {
+    /** Spritesheet image. */
     image: HTMLImageElement;
+    /** Named source rectangles inside `image`. */
     frames: Record<string, Rect>;
 };
+/**
+ * Loads a texture atlas image and its JSON frame data.
+ *
+ * The JSON file is fetched from the resources folder and must contain a
+ * `frames` object with frame names mapped to rectangles:
+ *
+ * ```json
+ * {
+ *   "frames": {
+ *     "player_idle_0": { "x": 0, "y": 0, "width": 32, "height": 32 }
+ *   }
+ * }
+ * ```
+ */
 export declare function loadAtlas(imageSrc: string, dataSrc: string): Promise<TextureAtlas>;
+/**
+ * Draws one named frame from a texture atlas.
+ *
+ * Missing frame names are logged through `dlog` and skipped.
+ */
 export declare function drawAtlasFrame(ctx: CanvasRenderingContext2D, atlas: TextureAtlas, frameName: string, x: number, y: number, options?: DrawOptions): void;
+/**
+ * Keeps track of time and current frame for a named-frame animation.
+ *
+ * The player only stores animation state. It does not draw anything by itself;
+ * call `drawAnimation` after `update(dt)` to render the current atlas frame.
+ */
 export declare class AnimationPlayer {
     animation: Animation;
     private time;
     private currentFrameIndex;
     private finished;
+    /**
+     * Creates a player for the given animation definition.
+     */
     constructor(animation: Animation);
+    /**
+     * Advances the animation by `deltaTime` seconds.
+     *
+     * Looping animations wrap back to the first frame. Non-looping animations
+     * stop on their final frame and then report `isFinished() === true`.
+     */
     update(deltaTime: number): void;
+    /**
+     * Returns the frame name that should currently be rendered from the atlas.
+     */
     getCurrentFrame(): string;
+    /**
+     * Restarts the animation from the first frame.
+     */
     reset(): void;
+    /**
+     * Returns whether a non-looping animation reached its final frame.
+     */
     isFinished(): boolean;
 }
+/**
+ * Animation definition based on named frames inside a `TextureAtlas`.
+ */
 export type Animation = {
+    /** Frame names in playback order. */
     frames: string[];
+    /** Playback speed in frames per second. */
     fps: number;
+    /** Whether playback should wrap to the first frame. Defaults to false-like. */
     loop?: boolean;
 };
+/**
+ * Draws the current frame of an `AnimationPlayer`.
+ */
 export declare function drawAnimation(ctx: CanvasRenderingContext2D, atlas: TextureAtlas, player: AnimationPlayer, x: number, y: number, options?: DrawOptions): void;
+/**
+ * Helper for side-view sprites.
+ *
+ * Returns `true` when a negative direction should flip a sprite horizontally.
+ */
 export declare function getFlipFromDirection(dir: number): boolean;

package/dist/texture.js

@@ -3,7 +3,17 @@ const textures = {};
 function getresourcepath(path) {
     return "/resources/" + path;
 }
-// Function to load a Texture Async
+/**
+ * Loads an image and stores it in the texture cache.
+ *
+ * Normal builds load from `/resources/${src}`. Single-file exports can provide
+ * embedded resources through `window.__resources`; if a matching key exists,
+ * that data URL is used instead. The cache key always remains the original
+ * `src` string, so `getTexture(src)` works the same in both modes.
+ *
+ * @param src Resource path relative to the resources folder.
+ * @returns Promise resolving to the loaded `HTMLImageElement`.
+ */
 export function loadTextureAsync(src) {
     return new Promise((resolve, reject) => {
         // Wenn schon geladen
@@ -32,11 +42,22 @@ export function loadTextureAsync(src) {
         img.src = finalSrc;
     });
 }
-// Function to get the Texture
+/**
+ * Reads a texture from the cache.
+ *
+ * This does not start loading by itself. Call `loadTextureAsync` first or handle
+ * the `undefined` result.
+ */
 export function getTexture(src) {
     return textures[src];
 }
-// Function to draw a texture to the Screen
+/**
+ * Draws a texture to the canvas.
+ *
+ * The image is drawn around its center for rotation and flipping, but `x` and
+ * `y` still describe the top-left target position. If the texture is missing,
+ * a magenta fallback rectangle is drawn to make missing assets visible.
+ */
 export function drawTexture(ctx, texture, x, y, options = {}) {
     const { width, height, rotation = 0, flipX = false, flipY = false, scale = 1 } = options;
     if (!texture) {
@@ -56,17 +77,20 @@ export function drawTexture(ctx, texture, x, y, options = {}) {
     ctx.drawImage(texture, -w / 2, -h / 2, w, h);
     ctx.restore();
 }
-// Funtion to load an Atlas
-//
-// JSON Format for the LoadAtlas Function
-//
-// {
-//   "frames": {
-//     "player_idle_0": { "x": 0, "y": 0, "w": 32, "h": 32 },
-//     "player_idle_1": { "x": 32, "y": 0, "w": 32, "h": 32 }
-//   }
-// }
-//
+/**
+ * Loads a texture atlas image and its JSON frame data.
+ *
+ * The JSON file is fetched from the resources folder and must contain a
+ * `frames` object with frame names mapped to rectangles:
+ *
+ * ```json
+ * {
+ *   "frames": {
+ *     "player_idle_0": { "x": 0, "y": 0, "width": 32, "height": 32 }
+ *   }
+ * }
+ * ```
+ */
 export async function loadAtlas(imageSrc, dataSrc) {
     const [image, data] = await Promise.all([
         loadTextureAsync(imageSrc),
@@ -77,6 +101,11 @@ export async function loadAtlas(imageSrc, dataSrc) {
         frames: data.frames
     };
 }
+/**
+ * Draws one named frame from a texture atlas.
+ *
+ * Missing frame names are logged through `dlog` and skipped.
+ */
 export function drawAtlasFrame(ctx, atlas, frameName, x, y, options = {}) {
     const { width, height, rotation = 0, flipX = false, flipY = false, scale = 1 } = options;
     const frame = atlas.frames[frameName];
@@ -95,40 +124,28 @@ export function drawAtlasFrame(ctx, atlas, frameName, x, y, options = {}) {
     ctx.drawImage(atlas.image, frame.x, frame.y, frame.width, frame.height, -w / 2, -h / 2, w, h);
     ctx.restore();
 }
-//
-//
-// Animation Player
-//
-//
-//
-// // Define Animation
-// const walkAnimation: Animation = {
-//     frames: ["walk_0", "walk_1", "walk_2", "walk_3"],
-//     fps: 8,
-//     loop: true
-// };
-//
-// const player = new AnimationPlayer(walkAnimation);
-//
-// // Game Loop
-// function update(dt: number) {
-//     player.update(dt);
-// }
-//
-// function render(ctx: CanvasRenderingContext2D) {
-//     drawAnimation(ctx, atlas, player, 100, 100, 64, 64);
-// }
-//
-//
-// Animation Player Class
+/**
+ * Keeps track of time and current frame for a named-frame animation.
+ *
+ * The player only stores animation state. It does not draw anything by itself;
+ * call `drawAnimation` after `update(dt)` to render the current atlas frame.
+ */
 export class AnimationPlayer {
-    // Konstruktor Function
+    /**
+     * Creates a player for the given animation definition.
+     */
     constructor(animation) {
         this.animation = animation;
         this.time = 0;
         this.currentFrameIndex = 0;
         this.finished = false;
     }
+    /**
+     * Advances the animation by `deltaTime` seconds.
+     *
+     * Looping animations wrap back to the first frame. Non-looping animations
+     * stop on their final frame and then report `isFinished() === true`.
+     */
     update(deltaTime) {
         if (this.finished)
             return;
@@ -148,22 +165,39 @@ export class AnimationPlayer {
             }
         }
     }
+    /**
+     * Returns the frame name that should currently be rendered from the atlas.
+     */
     getCurrentFrame() {
         return this.animation.frames[this.currentFrameIndex];
     }
+    /**
+     * Restarts the animation from the first frame.
+     */
     reset() {
         this.time = 0;
         this.currentFrameIndex = 0;
         this.finished = false;
     }
+    /**
+     * Returns whether a non-looping animation reached its final frame.
+     */
     isFinished() {
         return this.finished;
     }
 }
+/**
+ * Draws the current frame of an `AnimationPlayer`.
+ */
 export function drawAnimation(ctx, atlas, player, x, y, options = {}) {
     const frame = player.getCurrentFrame();
     drawAtlasFrame(ctx, atlas, frame, x, y, options);
 }
+/**
+ * Helper for side-view sprites.
+ *
+ * Returns `true` when a negative direction should flip a sprite horizontally.
+ */
 export function getFlipFromDirection(dir) {
     return dir < 0; // links = true
 }

package/dist/types/button.d.ts

@@ -1,9 +1,34 @@
 import { Rect } from "./rectangle.js";
 import { Mouse } from "../input.js";
+/**
+ * Simple canvas button model.
+ *
+ * The button is not a DOM element. It is drawn on the canvas and checked with
+ * mouse hit testing.
+ */
 export type Button = {
+    /** Rectangle that defines the button position and size. */
     form: Rect;
+    /** Text label drawn in the button center. */
     text: string;
 };
+/**
+ * Creates a canvas button description.
+ */
 export declare function makeButton(form: Rect, text: string): Button;
+/**
+ * Returns true when the button rectangle was clicked during the current frame.
+ */
 export declare function clickedButton(btn: Button, mouse: Mouse): boolean;
+/**
+ * Draws a simple filled rectangle button with centered text.
+ */
 export declare function drawButton(btn: Button, ctx: CanvasRenderingContext2D, color?: string, textColor?: string, font?: string): void;
+/**
+ * Check if the Button is hovered
+ */
+export declare function isButtonhovered(btn: Button, mouse: Mouse): boolean;
+/**
+ * Check if the Button is pressed!
+ */
+export declare function isButtonpressed(btn: Button, mouse: Mouse): boolean;

package/dist/types/button.js

@@ -1,8 +1,12 @@
 // Button
+import { isMouseInRect } from "./rectangle.js";
 import { isRectClicked } from "./rectangle.js";
 import { drawRect } from "../renderer.js";
 import { renderText } from "../renderer.js";
 // Function to create a new Button Type
+/**
+ * Creates a canvas button description.
+ */
 export function makeButton(form, text) {
     return {
         form: form,
@@ -10,10 +14,16 @@ export function makeButton(form, text) {
     };
 }
 // Prüft, ob der Button geklickt wurde
+/**
+ * Returns true when the button rectangle was clicked during the current frame.
+ */
 export function clickedButton(btn, mouse) {
     return isRectClicked(mouse, btn.form);
 }
 // Zeichnet den Button (Rechteck + Text)
+/**
+ * Draws a simple filled rectangle button with centered text.
+ */
 export function drawButton(btn, ctx, color = "#444", textColor = "white", font = "20px Arial") {
     drawRect(ctx, btn.form, color);
     // Text mittig im Button platzieren
@@ -23,3 +33,15 @@ export function drawButton(btn, ctx, color = "#444", textColor = "white", font =
     ctx.textBaseline = "middle";
     renderText(ctx, btn.text, textX, textY, textColor, font);
 }
+/**
+ * Check if the Button is hovered
+ */
+export function isButtonhovered(btn, mouse) {
+    return isMouseInRect(mouse, btn.form);
+}
+/**
+ * Check if the Button is pressed!
+ */
+export function isButtonpressed(btn, mouse) {
+    return isRectClicked(mouse, btn.form);
+}

package/dist/types/circle.d.ts

@@ -1,14 +1,40 @@
 import { Mouse } from "../input.js";
 import { type Vector2d } from "./vector2d.js";
+/**
+ * Circle shape used for drawing, hit tests, and simple collision checks.
+ *
+ * `x` and `y` are the center of the circle.
+ */
 export type Circle = {
     x: number;
     y: number;
     radius: number;
 };
+/**
+ * Creates a circle object.
+ */
 export declare function makeCircle(x: number, y: number, radius: number): Circle;
+/**
+ * Returns the center of the circle as a `Vector2d`.
+ */
 export declare function centerCircle(circle: Circle): Vector2d;
+/**
+ * Checks whether a point is inside or on the border of a circle.
+ */
 export declare function isPointInCircle(x: number, y: number, circle: Circle): boolean;
+/**
+ * Checks whether the current mouse position is inside a circle.
+ */
 export declare function isMouseInCircle(mouse: Mouse, circle: Circle): boolean;
+/**
+ * Checks whether a circle was clicked during the current frame.
+ */
 export declare function isCircleClicked(mouse: Mouse, circle: Circle): boolean;
+/**
+ * Checks whether two circles overlap or touch.
+ */
 export declare function isCircleColliding(circle1: Circle, circle2: Circle): boolean;
+/**
+ * Returns the center-to-center distance between two circles.
+ */
 export declare function getCircleDistance(circle1: Circle, circle2: Circle): number;

package/dist/types/circle.js

@@ -1,5 +1,7 @@
 // Circle Type for Hitboxes
-// Function to create an Object of Type Circle
+/**
+ * Creates a circle object.
+ */
 export function makeCircle(x, y, radius) {
     return {
         x: x,
@@ -7,31 +9,43 @@ export function makeCircle(x, y, radius) {
         radius: radius,
     };
 }
-// Function to get the Center of the Circle as Vector2d
+/**
+ * Returns the center of the circle as a `Vector2d`.
+ */
 export function centerCircle(circle) {
     return { x: circle.x, y: circle.y };
 }
-// Check if a Point is in the Circle
+/**
+ * Checks whether a point is inside or on the border of a circle.
+ */
 export function isPointInCircle(x, y, circle) {
     const distance = Math.sqrt((x - circle.x) * (x - circle.x) +
         (y - circle.y) * (y - circle.y));
     return distance <= circle.radius;
 }
-// Check if Mouse is in the Circle
+/**
+ * Checks whether the current mouse position is inside a circle.
+ */
 export function isMouseInCircle(mouse, circle) {
     return isPointInCircle(mouse.x, mouse.y, circle);
 }
-// Function to check if a Circle is clicked
+/**
+ * Checks whether a circle was clicked during the current frame.
+ */
 export function isCircleClicked(mouse, circle) {
     return isMouseInCircle(mouse, circle) && mouse.justPressed;
 }
-// Check if two Circles collide
+/**
+ * Checks whether two circles overlap or touch.
+ */
 export function isCircleColliding(circle1, circle2) {
     const distance = Math.sqrt((circle1.x - circle2.x) * (circle1.x - circle2.x) +
         (circle1.y - circle2.y) * (circle1.y - circle2.y));
     return distance <= (circle1.radius + circle2.radius);
 }
-// Check if Circle collides with Rectangle (imported from rectangle.ts would cause circular dependency)
+/**
+ * Returns the center-to-center distance between two circles.
+ */
 export function getCircleDistance(circle1, circle2) {
     return Math.sqrt((circle1.x - circle2.x) * (circle1.x - circle2.x) +
         (circle1.y - circle2.y) * (circle1.y - circle2.y));

package/dist/types/color.d.ts

@@ -1,9 +1,26 @@
+/**
+ * RGBA color object.
+ *
+ * `r`, `g`, and `b` are expected in the 0-255 range. `a` is optional and can be
+ * used by callers as an alpha channel value.
+ */
 export type Color = {
     r: number;
     g: number;
     b: number;
     a?: number;
 };
+/**
+ * Creates a color object.
+ */
 export declare function makeColor(r: number, g: number, b: number, a?: number): Color;
+/**
+ * Returns the RGB inverse of a color while preserving alpha if it exists.
+ */
 export declare function invertcolor(color: Color): Color;
+/**
+ * Inverts a hex color in `#rrggbb` or `rrggbb` format.
+ *
+ * The returned value always starts with `#`.
+ */
 export declare function invertHexColor(hex: string): string;

package/dist/types/color.js

@@ -1,4 +1,6 @@
-// Function to create an Object of Type Color
+/**
+ * Creates a color object.
+ */
 export function makeColor(r, g, b, a) {
     return {
         r: r,
@@ -7,6 +9,9 @@ export function makeColor(r, g, b, a) {
         a: a
     };
 }
+/**
+ * Returns the RGB inverse of a color while preserving alpha if it exists.
+ */
 export function invertcolor(color) {
     return {
         r: 255 - color.r,
@@ -15,6 +20,11 @@ export function invertcolor(color) {
         ...(color.a !== undefined ? { a: color.a } : {}) // optional alpha behalten
     };
 }
+/**
+ * Inverts a hex color in `#rrggbb` or `rrggbb` format.
+ *
+ * The returned value always starts with `#`.
+ */
 export function invertHexColor(hex) {
     // Entferne das führende #
     const cleanHex = hex.replace('#', '');

package/dist/types/index.d.ts

@@ -4,4 +4,4 @@ export { type Color, makeColor, invertcolor, invertHexColor } from "./color.js";
 export { type Rect, makeRect, centerRectX, centerRectY, centerRect, isPointInRect, isMouseInRect, isRectClicked } from "./rectangle.js";
 export { type Circle, makeCircle, centerCircle, isPointInCircle, isMouseInCircle, isCircleClicked, isCircleColliding, getCircleDistance } from "./circle.js";
 export { type Triangle, makeTriangle, centerTriangle, isPointInTriangle, isMouseInTriangle, isTriangleClicked, getTrianglePerimeter, } from "./triangle.js";
-export { type Button, makeButton, clickedButton, drawButton } from "./button.js";
+export { type Button, makeButton, clickedButton, drawButton, isButtonhovered, isButtonpressed } from "./button.js";

package/dist/types/index.js

@@ -12,4 +12,4 @@ export { makeCircle, centerCircle, isPointInCircle, isMouseInCircle, isCircleCli
 // Triangle Type
 export { makeTriangle, centerTriangle, isPointInTriangle, isMouseInTriangle, isTriangleClicked, getTrianglePerimeter, } from "./triangle.js";
 // Button Type
-export { makeButton, clickedButton, drawButton } from "./button.js";
+export { makeButton, clickedButton, drawButton, isButtonhovered, isButtonpressed } from "./button.js";

package/dist/types/rectangle.d.ts

@@ -1,5 +1,11 @@
 import { type Mouse } from "../input.js";
 import { type Vector2d } from "./vector2d.js";
+/**
+ * Axis-aligned rectangle used for drawing, UI, and simple hit tests.
+ *
+ * `x` and `y` describe the top-left corner. `width` and `height` extend to the
+ * right and downward in normal canvas coordinates.
+ */
 export type Rect = {
     x: number;
     y: number;
@@ -7,10 +13,33 @@ export type Rect = {
     height: number;
     borderRadius?: number;
 };
+/**
+ * Creates a rectangle object.
+ */
 export declare function makeRect(x: number, y: number, width: number, height: number, borderRadius?: number): Rect;
+/**
+ * Returns the horizontal center coordinate of a rectangle.
+ */
 export declare function centerRectX(rect: Rect): number;
+/**
+ * Returns the vertical center coordinate of a rectangle.
+ */
 export declare function centerRectY(rect: Rect): number;
+/**
+ * Returns the rectangle center as a `Vector2d`.
+ */
 export declare function centerRect(rect: Rect): Vector2d;
+/**
+ * Checks whether a point is inside or on the border of a rectangle.
+ */
 export declare function isPointInRect(x: number, y: number, rect: Rect): boolean;
+/**
+ * Checks whether the current mouse position is inside a rectangle.
+ */
 export declare function isMouseInRect(mouse: Mouse, rect: Rect): boolean;
+/**
+ * Checks whether a rectangle was clicked during the current frame.
+ *
+ * This depends on `mouse.justPressed`, so call it before `resetInput()`.
+ */
 export declare function isRectClicked(mouse: Mouse, rect: Rect): boolean;

package/dist/types/rectangle.js

@@ -1,5 +1,7 @@
 // Rectangle Type for Hitboxes
-// Function to create an Object of Type rect
+/**
+ * Creates a rectangle object.
+ */
 export function makeRect(x, y, width, height, borderRadius = 0) {
     return {
         x: x,
@@ -9,33 +11,48 @@ export function makeRect(x, y, width, height, borderRadius = 0) {
         borderRadius: borderRadius
     };
 }
-// Function to get the Center of the Width of the Object
+/**
+ * Returns the horizontal center coordinate of a rectangle.
+ */
 export function centerRectX(rect) {
     return (rect.x + (rect.width / 2));
 }
-// Function to get the Center of the Height of the Object
+/**
+ * Returns the vertical center coordinate of a rectangle.
+ */
 export function centerRectY(rect) {
     return (rect.y + (rect.height / 2));
 }
-// Get the Center of a Rectangle
+/**
+ * Returns the rectangle center as a `Vector2d`.
+ */
 export function centerRect(rect) {
     let vector = { x: centerRectX(rect), y: centerRectY(rect) };
     return vector;
 }
-// Check if a Point in the Rectangle
+/**
+ * Checks whether a point is inside or on the border of a rectangle.
+ */
 export function isPointInRect(x, y, rect) {
     return (x >= rect.x &&
         x <= rect.x + rect.width &&
         y >= rect.y &&
         y <= rect.y + rect.height);
 }
+/**
+ * Checks whether the current mouse position is inside a rectangle.
+ */
 export function isMouseInRect(mouse, rect) {
     return (mouse.x >= rect.x &&
         mouse.x <= rect.x + rect.width &&
         mouse.y >= rect.y &&
         mouse.y <= rect.y + rect.height);
 }
-// Function to check if a Rectangle is clicked  
+/**
+ * Checks whether a rectangle was clicked during the current frame.
+ *
+ * This depends on `mouse.justPressed`, so call it before `resetInput()`.
+ */
 export function isRectClicked(mouse, rect) {
     return isMouseInRect(mouse, rect) && mouse.justPressed;
 }