littlejsengine 1.15.3 → 1.15.9

package/dist/littlejs.d.ts

@@ -133,6 +133,7 @@ declare module "littlejsengine" {
      *  @memberof Engine */
     export function engineInit(gameInit: GameInitCallback, gameUpdate: GameCallback, gameUpdatePost: GameCallback, gameRender: GameCallback, gameRenderPost: GameCallback, imageSources?: Array<string>, rootElement?: HTMLElement): Promise<void>;
     /** Update each engine object, remove destroyed objects, and update time
+     * can be called manually if objects need to be updated outside of main loop
      *  @memberof Engine */
     export function engineObjectsUpdate(): void;
     /** Destroy and remove all objects
@@ -266,7 +267,7 @@ declare module "littlejsengine" {
      *  @memberof Debug */
     export function debugOverlap(posA: Vector2, sizeA: Vector2, posB: Vector2, sizeB: Vector2, color?: Color | string, time?: number, screenSpace?: boolean): void;
     /** Draw a debug axis aligned bounding box in world space
-     *  @param {string} text
+     *  @param {string|number} text
      *  @param {Vector2} pos
      *  @param {number} [size]
      *  @param {Color|string} [color]
@@ -275,7 +276,7 @@ declare module "littlejsengine" {
      *  @param {string} [font]
      *  @param {boolean} [screenSpace]
      *  @memberof Debug */
-    export function debugText(text: string, pos: Vector2, size?: number, color?: Color | string, time?: number, angle?: number, font?: string, screenSpace?: boolean): void;
+    export function debugText(text: string | number, pos: Vector2, size?: number, color?: Color | string, time?: number, angle?: number, font?: string, screenSpace?: boolean): void;
     /** Clear all debug primitives in the list
      *  @memberof Debug */
     export function debugClear(): void;
@@ -348,6 +349,18 @@ declare module "littlejsengine" {
      *  @default Vector2(1920,1080)
      *  @memberof Settings */
     export let canvasMaxSize: Vector2;
+    /** Minimum aspect ratio of the canvas (width/height), unused if 0
+     *  Can be used with canvasMaxAspect to limit aspect ratio
+     *  @type {number}
+     *  @default
+     *  @memberof Settings */
+    export let canvasMinAspect: number;
+    /** Maximum aspect ratio of the canvas (width/height), unused if 0
+     *  Can be used with canvasMinAspect to limit aspect ratio
+     *  @type {number}
+     *  @default
+     *  @memberof Settings */
+    export let canvasMaxAspect: number;
     /** Fixed size of the canvas, if enabled canvas size never changes
      * - you may also need to set mainCanvasSize if using screen space coords in startup
      *  @type {Vector2}
@@ -557,6 +570,14 @@ declare module "littlejsengine" {
      *  @param {Vector2} size
      *  @memberof Settings */
     export function setCanvasMaxSize(size: Vector2): void;
+    /** Set minimum aspect ratio of the canvas (width/height), unused if 0
+     *  @param {number} aspect
+     *  @memberof Settings */
+    export function setCanvasMinAspect(aspect: number): void;
+    /** Set maximum aspect ratio of the canvas (width/height), unused if 0
+     *  @param {number} aspect
+     *  @memberof Settings */
+    export function setCanvasMaxAspect(aspect: number): void;
     /** Set fixed size of the canvas
      *  @param {Vector2} size
      *  @memberof Settings */
@@ -661,6 +682,10 @@ declare module "littlejsengine" {
      *  @param {boolean} enable
      *  @memberof Settings */
     export function setTouchGamepadCenterButton(enable: boolean): void;
+    /** Set number of buttons on touch gamepad (0-4), if 1 also acts as right analog stick
+     *  @param {number} count
+     *  @memberof Settings */
+    export function setTouchGamepadButtonCount(count: number): void;
     /** Set if touch gamepad should be analog stick or 8 way dpad
      *  @param {boolean} analog
      *  @memberof Settings */
@@ -1023,6 +1048,10 @@ declare module "littlejsengine" {
          *  @param {number} [y] - Y axis location
          *  @return {Vector2} */
         set(x?: number, y?: number): Vector2;
+        /** Sets this vector from another vector and returns self
+         *  @param {Vector2} v - other vector
+         *  @return {Vector2} */
+        setFrom(v: Vector2): Vector2;
         /** Returns a new vector that is a copy of this
          *  @return {Vector2} */
         copy(): Vector2;
@@ -1114,6 +1143,9 @@ declare module "littlejsengine" {
         /** Returns the area this vector covers as a rectangle
          * @return {number} */
         area(): number;
+        /** Returns true if this vector is (0,0)
+         * @return {boolean} */
+        isZero(): boolean;
         /** Returns a new vector that is p percent between this and the vector passed in
          * @param {Vector2} v - other vector
          * @param {number}  percent
@@ -1163,6 +1195,10 @@ declare module "littlejsengine" {
          *  @param {number} [a] - alpha
          *  @return {Color} */
         set(r?: number, g?: number, b?: number, a?: number): Color;
+        /** Sets this color from another color and returns self
+         * @param {Color} c - other color
+         * @return {Color} */
+        setFrom(c: Color): Color;
         /** Returns a new color that is a copy of this
          * @return {Color} */
         copy(): Color;
@@ -1430,7 +1466,7 @@ declare module "littlejsengine" {
         padding: number;
         /** @property {TextureInfo} - The texture info for this tile */
         textureInfo: TextureInfo;
-        /** @property {float} - Shrinks tile by this many pixels to prevent neighbors bleeding */
+        /** @property {number} - Shrinks tile by this many pixels to prevent neighbors bleeding */
         bleedScale: number;
         /** Returns a copy of this tile offset by a vector
         *  @param {Vector2} offset - Offset to apply in pixels
@@ -1663,7 +1699,7 @@ declare module "littlejsengine" {
     export function drawCanvas2D(pos: Vector2, size: Vector2, angle?: number, mirror?: boolean, drawFunction?: Canvas2DDrawFunction, screenSpace?: boolean, context?: CanvasRenderingContext2D | OffscreenCanvasRenderingContext2D): void;
     /** Draw text on main canvas in world space
      *  Automatically splits new lines into rows
-     *  @param {string}  text
+     *  @param {string|number}  text
      *  @param {Vector2} pos
      *  @param {number}  [size]
      *  @param {Color}   [color=(1,1,1,1)]
@@ -1676,10 +1712,10 @@ declare module "littlejsengine" {
      *  @param {number}  [angle]
      *  @param {CanvasRenderingContext2D|OffscreenCanvasRenderingContext2D} [context=drawContext]
      *  @memberof Draw */
-    export function drawText(text: string, pos: Vector2, size?: number, color?: Color, lineWidth?: number, lineColor?: Color, textAlign?: CanvasTextAlign, font?: string, fontStyle?: string, maxWidth?: number, angle?: number, context?: CanvasRenderingContext2D | OffscreenCanvasRenderingContext2D): void;
+    export function drawText(text: string | number, pos: Vector2, size?: number, color?: Color, lineWidth?: number, lineColor?: Color, textAlign?: CanvasTextAlign, font?: string, fontStyle?: string, maxWidth?: number, angle?: number, context?: CanvasRenderingContext2D | OffscreenCanvasRenderingContext2D): void;
     /** Draw text on overlay canvas in world space
      *  Automatically splits new lines into rows
-     *  @param {string}  text
+     *  @param {string|number}  text
      *  @param {Vector2} pos
      *  @param {number}  [size]
      *  @param {Color}   [color=(1,1,1,1)]
@@ -1691,10 +1727,10 @@ declare module "littlejsengine" {
      *  @param {number}  [maxWidth]
      *  @param {number}  [angle]
      *  @memberof Draw */
-    export function drawTextOverlay(text: string, pos: Vector2, size?: number, color?: Color, lineWidth?: number, lineColor?: Color, textAlign?: CanvasTextAlign, font?: string, fontStyle?: string, maxWidth?: number, angle?: number): void;
+    export function drawTextOverlay(text: string | number, pos: Vector2, size?: number, color?: Color, lineWidth?: number, lineColor?: Color, textAlign?: CanvasTextAlign, font?: string, fontStyle?: string, maxWidth?: number, angle?: number): void;
     /** Draw text on overlay canvas in screen space
      *  Automatically splits new lines into rows
-     *  @param {string}  text
+     *  @param {string|number}  text
      *  @param {Vector2} pos
      *  @param {number}  [size]
      *  @param {Color}   [color=(1,1,1,1)]
@@ -1707,7 +1743,7 @@ declare module "littlejsengine" {
      *  @param {number}  [angle]
      *  @param {CanvasRenderingContext2D|OffscreenCanvasRenderingContext2D} [context=overlayContext]
      *  @memberof Draw */
-    export function drawTextScreen(text: string, pos: Vector2, size?: number, color?: Color, lineWidth?: number, lineColor?: Color, textAlign?: CanvasTextAlign, font?: string, fontStyle?: string, maxWidth?: number, angle?: number, context?: CanvasRenderingContext2D | OffscreenCanvasRenderingContext2D): void;
+    export function drawTextScreen(text: string | number, pos: Vector2, size?: number, color?: Color, lineWidth?: number, lineColor?: Color, textAlign?: CanvasTextAlign, font?: string, fontStyle?: string, maxWidth?: number, angle?: number, context?: CanvasRenderingContext2D | OffscreenCanvasRenderingContext2D): void;
     /** Enable normal or additive blend mode
      *  @param {boolean} [additive]
      *  @param {CanvasRenderingContext2D|OffscreenCanvasRenderingContext2D} [context]
@@ -1742,28 +1778,28 @@ declare module "littlejsengine" {
         tileSize: Vector2;
         paddingSize: Vector2;
         /** Draw text in world space using the image font
-         *  @param {string}  text
+         *  @param {string|number}  text
          *  @param {Vector2} pos
          *  @param {number}  [scale=.25]
          *  @param {boolean} [center]
          *  @param {CanvasRenderingContext2D|OffscreenCanvasRenderingContext2D} [context=drawContext]
          */
-        drawText(text: string, pos: Vector2, scale?: number, center?: boolean, context?: CanvasRenderingContext2D | OffscreenCanvasRenderingContext2D): void;
+        drawText(text: string | number, pos: Vector2, scale?: number, center?: boolean, context?: CanvasRenderingContext2D | OffscreenCanvasRenderingContext2D): void;
         /** Draw text on overlay canvas in world space using the image font
-         *  @param {string}  text
+         *  @param {string|number}  text
          *  @param {Vector2} pos
          *  @param {number}  [scale]
          *  @param {boolean} [center]
          */
-        drawTextOverlay(text: string, pos: Vector2, scale?: number, center?: boolean): void;
+        drawTextOverlay(text: string | number, pos: Vector2, scale?: number, center?: boolean): void;
         /** Draw text on overlay canvas in screen space using the image font
-         *  @param {string}  text
+         *  @param {string|number}  text
          *  @param {Vector2} pos
          *  @param {number}  [scale]
          *  @param {boolean} [center]
          *  @param {CanvasRenderingContext2D|OffscreenCanvasRenderingContext2D} [context=drawContext]
          */
-        drawTextScreen(text: string, pos: Vector2, scale?: number, center?: boolean, context?: CanvasRenderingContext2D | OffscreenCanvasRenderingContext2D): void;
+        drawTextScreen(text: string | number, pos: Vector2, scale?: number, center?: boolean, context?: CanvasRenderingContext2D | OffscreenCanvasRenderingContext2D): void;
     }
     /** Returns true if fullscreen mode is active
      *  @return {boolean}
@@ -1776,7 +1812,7 @@ declare module "littlejsengine" {
      *  @param {string}  [cursorStyle] - CSS cursor style (auto, none, crosshair, etc)
      *  @memberof Draw */
     export function setCursor(cursorStyle?: string): void;
-    /** Get the camera's visible area in world space
+    /** Get the size of the camera window in world space
      *  @return {Vector2}
      *  @memberof Draw */
     export function getCameraSize(): Vector2;
@@ -1910,15 +1946,6 @@ declare module "littlejsengine" {
     export let glPositionData: any;
     export let glColorData: any;
     export let glBatchCount: any;
-    /**
-     * LittleJS Input System
-     * - Tracks keyboard down, pressed, and released
-     * - Tracks mouse buttons, position, and wheel
-     * - Tracks multiple analog gamepads
-     * - Touch input is handled as mouse input
-     * - Virtual gamepad for touch devices
-     * @namespace Input
-     */
     /** Returns true if device key is down
      *  @param {string|number} key
      *  @param {number} [device]
@@ -1938,6 +1965,10 @@ declare module "littlejsengine" {
      *  @memberof Input */
     export function keyWasReleased(key: string | number, device?: number): boolean;
     /** Returns input vector from arrow keys or WASD if enabled
+     *  @param {string} [up]
+     *  @param {string} [down]
+     *  @param {string} [left]
+     *  @param {string} [right]
      *  @return {Vector2}
      *  @memberof Input */
     export function keyDirection(up?: string, down?: string, left?: string, right?: string): Vector2;
@@ -1970,6 +2001,15 @@ declare module "littlejsengine" {
      *  @return {boolean}
      *  @memberof Input */
     export function mouseWasReleased(button: number): boolean;
+    /**
+     * LittleJS Input System
+     * - Tracks keyboard down, pressed, and released
+     * - Tracks mouse buttons, position, and wheel
+     * - Tracks multiple analog gamepads
+     * - Touch input is handled as mouse input
+     * - Virtual gamepad for touch devices
+     * @namespace Input
+     */
     /** Mouse pos in world space
      *  @type {Vector2}
      *  @memberof Input */
@@ -2002,6 +2042,10 @@ declare module "littlejsengine" {
      *  @type {boolean}
      *  @memberof Input */
     export let inputPreventDefault: boolean;
+    /** Primary gamepad index, automatically set to first gamepad with input
+     *  @type {number}
+     *  @memberof Input */
+    export let gamepadPrimary: number;
     /** Prevents input continuing to the default browser handling
      *  This is useful to disable for html menus so the browser can handle input normally
      *  @param {boolean} preventDefault
@@ -2031,7 +2075,16 @@ declare module "littlejsengine" {
      *  @return {Vector2}
      *  @memberof Input */
     export function gamepadStick(stick: number, gamepad?: number): Vector2;
-    export function gamepadsUpdate(): void;
+    /** Returns gamepad dpad value
+     *  @param {number} [gamepad]
+     *  @return {Vector2}
+     *  @memberof Input */
+    export function gamepadDpad(gamepad?: number): Vector2;
+    /** Returns true if passed in gamepad is connected
+     *  @param {number} [gamepad]
+     *  @return {boolean}
+     *  @memberof Input */
+    export function gamepadConnected(gamepad?: number): boolean;
     /** Pulse the vibration hardware if it exists
      *  @param {number|Array} [pattern] - single value in ms or vibration interval array
      *  @memberof Input */
@@ -2414,7 +2467,7 @@ declare module "littlejsengine" {
         collideRaycast: boolean;
         /** Update the object transform, called automatically by engine even when paused */
         updateTransforms(): void;
-        /** Update the object physics, called automatically by engine once each frame */
+        /** Update the object physics, called automatically by engine once each frame. Can be overridden to stop or change how physics works for an object. */
         updatePhysics(): void;
         /** Update the object, called automatically by engine once each frame. Does nothing by default. */
         update(): void;
@@ -2526,7 +2579,7 @@ declare module "littlejsengine" {
      *  @return {TileCollisionLayer}
      *  @memberof TileLayers */
     export function tileCollisionTest(pos: Vector2, size?: Vector2, object?: EngineObject, solidOnly?: boolean): TileCollisionLayer;
-    /** Return the exact position of the boudnary of first tile hit, undefined if nothing was hit.
+    /** Return the exact position of the boundary of first tile hit, undefined if nothing was hit.
      *  The point will be inside the colliding tile if it hits (may have a tiny shift)
      *  @param {Vector2}      posStart
      *  @param {Vector2}      posEnd
@@ -2720,7 +2773,7 @@ declare module "littlejsengine" {
         *  @param {EngineObject} [object]
         *  @return {boolean} */
         collisionTest(pos: Vector2, size?: Vector2, object?: EngineObject): boolean;
-        /** Return the exact position of the boudnary of first tile hit, undefined if nothing was hit.
+        /** Return the exact position of the boundary of first tile hit, undefined if nothing was hit.
         *  The point will be inside the colliding tile if it hits (may have a tiny shift)
         *  @param {Vector2}      posStart
         *  @param {Vector2}      posEnd
@@ -3103,17 +3156,31 @@ declare module "littlejsengine" {
     /**
      * LittleJS User Interface Plugin
      * - call new UISystemPlugin() to setup the UI system
+     * - Gamepad and keyboard navigation support
      * - Nested Menus
      * - Text
      * - Buttons
      * - Checkboxes
      * - Images
+     * - Scrollbars
+     * - Video
      * @namespace UISystem
      */
     /** Global UI system plugin object
      *  @type {UISystemPlugin}
      *  @memberof UISystem */
     export let uiSystem: UISystemPlugin;
+    /** Enable UI system debug drawing
+     *  0=off, 1=normal, 2=show invisible
+     *  @type {number}
+     *  @default
+     *  @memberof UISystem */
+    export let uiDebug: number;
+    /** Enable UI system debug drawing
+     *  0=off, 1=normal, 2=show invisible
+     *  @param {number|boolean} enable
+     *  @memberof UISystem */
+    export function uiSetDebug(debugMode: any): void;
     /**
      * UI System Global Object
      * @memberof UISystem
@@ -3145,7 +3212,7 @@ declare module "littlejsengine" {
         /** @property {number} - Default rounded rect corner radius for UI elements */
         defaultCornerRadius: number;
         /** @property {number} - Default scale to use for fitting text to object */
-        defaultTextScale: number;
+        defaultTextFitScale: number;
         /** @property {string} - Default font for UI elements */
         defaultFont: string;
         /** @property {Sound} - Default sound when interactive UI element is pressed */
@@ -3160,6 +3227,18 @@ declare module "littlejsengine" {
         defaultShadowBlur: number;
         /** @property {Vector2} - Offset of shadow blur */
         defaultShadowOffset: Vector2;
+        /** @property {number} - If set ui coords will be renormalized to this canvas height */
+        nativeHeight: number;
+        /** @property {UIObject} - Object currently selected by navigation (gamepad or keyboard) */
+        navigationObject: any;
+        /** @property {Timer} - Cooldown timer for navigation inputs */
+        navigationTimer: Timer;
+        /** @property {number} - Time between navigation inputs in seconds */
+        navigationDelay: number;
+        /** @property {boolean} - should the navigation be horizontal, vertical, or both? */
+        navigationDirection: number;
+        /** @property {boolean} - True if user last used navigation instead of mouse */
+        navigationMode: boolean;
         /** @property {Array<UIObject>} - List of all UI elements */
         uiObjects: any[];
         /** @property {CanvasRenderingContext2D|OffscreenCanvasRenderingContext2D} - Context to render UI elements to */
@@ -3170,8 +3249,8 @@ declare module "littlejsengine" {
         hoverObject: any;
         /** @property {UIObject} - Hover object at start of update */
         lastHoverObject: any;
-        /** @property {number} - If set ui coords will be renormalized to this canvas height */
-        nativeHeight: number;
+        /** @property {UIObject} - Current confirm menu being shown */
+        confirmDialog: any;
         /** Draw a rectangle to the UI context
         *  @param {Vector2} pos
         *  @param {Vector2} size
@@ -3196,8 +3275,11 @@ declare module "littlejsengine" {
         *  @param {TileInfo} tileInfo
         *  @param {Color}    [color=uiSystem.defaultColor]
         *  @param {number}   [angle]
-        *  @param {boolean}  [mirror] */
-        drawTile(pos: Vector2, size: Vector2, tileInfo: TileInfo, color?: Color, angle?: number, mirror?: boolean): void;
+        *  @param {boolean}  [mirror]
+        *  @param {Color}    [shadowColor]
+        *  @param {number}   [shadowBlur]
+        *  @param {Color}    [shadowOffset] */
+        drawTile(pos: Vector2, size: Vector2, tileInfo: TileInfo, color?: Color, angle?: number, mirror?: boolean, shadowColor?: Color, shadowBlur?: number, shadowOffset?: Color): void;
         /** Draw text to the UI context
         *  @param {string}  text
         *  @param {Vector2} pos
@@ -3210,8 +3292,10 @@ declare module "littlejsengine" {
         *  @param {string}  [fontStyle]
         *  @param {boolean} [applyMaxWidth=true]
         *  @param {Vector2} [textShadow]
-         */
-        drawText(text: string, pos: Vector2, size: Vector2, color?: Color, lineWidth?: number, lineColor?: Color, align?: string, font?: string, fontStyle?: string, applyMaxWidth?: boolean, textShadow?: Vector2): void;
+        *  @param {Color}   [shadowColor]
+        *  @param {number}  [shadowBlur]
+        *  @param {Color}   [shadowOffset] */
+        drawText(text: string, pos: Vector2, size: Vector2, color?: Color, lineWidth?: number, lineColor?: Color, align?: string, font?: string, fontStyle?: string, applyMaxWidth?: boolean, textShadow?: Vector2, shadowColor?: Color, shadowBlur?: number, shadowOffset?: Color): void;
         /**
          * @callback DragAndDropCallback - Callback for drag and drop events
          * @param {DragEvent} event - The drag event
@@ -3222,16 +3306,37 @@ declare module "littlejsengine" {
         *  @param {DragAndDropCallback} [onDrop] - when a file is dropped
         *  @param {DragAndDropCallback} [onDragEnter] - when a file is dragged onto the window
         *  @param {DragAndDropCallback} [onDragLeave] - when a file is dragged off the window
-        *  @param {DragAndDropCallback} [onDragOver] - continously when dragging over */
+        *  @param {DragAndDropCallback} [onDragOver] - continuously when dragging over */
         setupDragAndDrop(onDrop?: (event: DragEvent) => any, onDragEnter?: (event: DragEvent) => any, onDragLeave?: (event: DragEvent) => any, onDragOver?: (event: DragEvent) => any): void;
         /** Convert a screen space position to native UI position
          *  @param {Vector2} pos
-         *  @return {Vector2}
-         */
+         *  @return {Vector2} */
         screenToNative(pos: Vector2): Vector2;
         /** Destroy and remove all objects
         *  @memberof Engine */
         destroyObjects(): void;
+        /** Get all navigable UI objects sorted by navigationIndex
+         *  @return {Array<UIObject>} */
+        getNavigableObjects(): Array<UIObject>;
+        /** Get navigation direction from gamepad or keyboard
+         *  @return {number} */
+        getNavigationDirection(): number;
+        /** Get other axis navigation direction from gamepad or keyboard
+         *  @return {Vector2} */
+        getNavigationOtherDirection(): Vector2;
+        /** Get if navigation button was pressed from gamepad or keyboard
+         *  @return {boolean} */
+        getNavigationWasPressed(): boolean;
+        /** Show a confirmation dialog with Yes/No buttons
+         *  Centers the dialog on the screen with darkened background
+         *  @param {string} [text] - The message to display
+         *  @param {Function} [yesCallback] - Called when Yes is clicked
+         *  @param {Function} [noCallback] - Called when No is clicked
+         *  @param {Vector2} [size] - Size of the confirmation dialog
+         *  @param {string} [exitKey] - Key that can exit the menu
+         *  @return {UIObject} The confirmation menu object
+         */
+        showConfirmDialog(text?: string, yesCallback?: Function, noCallback?: Function, size?: Vector2, exitKey?: string): UIObject;
     }
     /**
      * UI Object - Base level object for all UI elements
@@ -3279,7 +3384,13 @@ declare module "littlejsengine" {
         /** @property {number} - Override for text height */
         textHeight: any;
         /** @property {number} - Scale text to fit in the object */
-        textScale: number;
+        textFitScale: number;
+        /** @property {Vector2} - How much to offset the text shadow or undefined */
+        textShadow: any;
+        /** @property {number} - Color for text line drawing  */
+        textLineColor: Color;
+        /** @property {number} - Width for text line drawing */
+        textLineWidth: number;
         /** @property {boolean} - Should this object be drawn */
         visible: boolean;
         /** @property {Array<UIObject>} - A list of this object's children */
@@ -3306,39 +3417,49 @@ declare module "littlejsengine" {
         shadowBlur: number;
         /** @property {Vector2} - Offset of shadow blur */
         shadowOffset: Vector2;
-        /** @property {Vector2} - How much to offset the text shadow or undefined */
-        textShadow: any;
+        /** @property {number} - Optional navigation order index, lower values are selected first */
+        navigationIndex: any;
+        /** @property {boolean} - Should this be auto selected by navigation? Must also have valid navigation index. */
+        navigationAutoSelect: boolean;
         /** Add a child UIObject to this object
-         *  @param {UIObject} child
-         */
+         *  @param {UIObject} child */
         addChild(child: UIObject): void;
         /** Remove a child UIObject from this object
-         *  @param {UIObject} child
-         */
+         *  @param {UIObject} child */
         removeChild(child: UIObject): void;
         /** Destroy this object, destroy its children, detach its parent, and mark it for removal */
         destroy(): void;
         destroyed: number;
         /** Check if the mouse is overlapping a box in screen space
-         *  @return {boolean} - True if overlapping
-         */
+         *  @return {boolean} - True if overlapping */
         isMouseOverlapping(): boolean;
         /** Update the object, called automatically by plugin once each frame */
         update(): void;
         /** Render the object, called automatically by plugin once each frame */
         render(): void;
-        /** Special update when object is not visible */
-        updateInvisible(): void;
         /** Get the size for text with overrides and scale
-         *  @return {Vector2}
-         */
+         *  @return {Vector2} */
         getTextSize(): Vector2;
+        /** Called when the navigation button is pressed on this object */
+        navigatePressed(): void;
         /** @return {boolean} - Is the mouse hovering over this element */
         isHoverObject(): boolean;
         /** @return {boolean} - Is the mouse held onto this element */
         isActiveObject(): boolean;
-        /** Called each frame when object updates */
+        /** @return {boolean} - Is the gamepad or keyboard navigation object */
+        isNavigationObject(): boolean;
+        /** @return {boolean} - Can it be interacted with */
+        isInteractive(): boolean;
+        /** Returns string containing info about this object for debugging
+         *  @return {string} */
+        toString(): string;
+        /** Called if uiDebug is enabled
+         *  @param {boolean} visible */
+        renderDebug(visible?: boolean): void;
+        /** Called each frame before object updates */
         onUpdate(): void;
+        /** Called each frame before object renders */
+        onRender(): void;
         /** Called when the mouse enters the object */
         onEnter(): void;
         /** Called when the mouse leaves the object */
@@ -3404,6 +3525,8 @@ declare module "littlejsengine" {
          *  @param {Color}   [color=uiSystem.defaultButtonColor]
          */
         constructor(pos?: Vector2, size?: Vector2, text?: string, color?: Color);
+        /** @property {Vector2} - Text offset for the button */
+        textOffset: Vector2;
         text: string;
     }
     /**
@@ -3464,7 +3587,7 @@ declare module "littlejsengine" {
          *  @param {number} [volume=1] - Volume percent scaled by global volume (0-1)
          */
         constructor(pos?: Vector2, size?: Vector2, src: string, autoplay?: boolean, loop?: boolean, volume?: number);
-        /** @property {float} - The video volume */
+        /** @property {number} - The video volume */
         volume: number;
         /** @property {HTMLVideoElement} - The video player */
         video: HTMLVideoElement;
@@ -3477,7 +3600,7 @@ declare module "littlejsengine" {
         stop(): void;
         /** Check if video is currently loading
          *  @return {boolean} */
-        isLoadng(): boolean;
+        isLoading(): boolean;
         /** Check if video is currently paused
          *  @return {boolean} */
         isPaused(): boolean;