@vrspace/babylonjs

/** HUD stands for head-up display - a UI container mounted on users head. Typically we have some buttons around 50 cm front, 10-20 cm below line of sight. This is common UI supposed to be usefull on VR devices, PC and mobiles, but likely to be suboptimal - UI specifically designed for a device should be more ergonomic. By default it tracks active camera, and binds to new camera whenever active camera changes, e.g. upon entering/exiting VR. Constructed with a camera parameter, it does not rebind to a new one. This allows to have multiple HUDs attached to different cameras, e.g. switching from first-person view to god mode activates a different HUD. But in XR, it can be attached to left or right controller instead of camera: just grab any hud element and squeeze, i.e. use squeeze button. Press both squeeze buttons to attach hud back to the camera. Typically HUD is just a collection of buttons, but it can also contain different UI elements, e.g. sliders, and even forms. It takes input from mouse, touch screen, VR controllers and even gamepad, and delegates it to underlying UI elements as appropriate. It can contain multiple rows, each containing multiple buttons, but a row can contain only one Form. */ export class HUD { /** @param scene babylonjs scene */ /** @param camera to track, by default tracks active camera */ constructor(scene: any, camera: any); scene: any; onlyCamera: any; buttonSize: number; buttonSpacing: number; alpha: number; distanceWeb: number; distanceXR: number; verticalWeb: number; verticalXR: number; scaleWeb: number; scaleXR: number; rowOffset: any; colorEnabled: any; colorDisabled: any; colorActive: any; /** set by World.InitXR() */ vrHelper: any; allowSelection: boolean; speechInput: SpeechInput; currentController: string; scale: number; activeControl: any; guiManager: any; elements: any[]; controls: any[]; textures: any[]; /** Root of all buttons and everything else attached to HUD */ root: any; rowRoot: any; rows: { root: any; elements: any[]; controls: any[]; textures: any[]; speechInput: SpeechInput; activeControl: any; }[]; /** Handles camera change events, typically while entering/exiting VR. */ trackCamera(): void; camera: any; /** * Attach HUD to camera it was created with. */ attachToCamera(): void; /** Returns true if XR mode is active (current camera is WebXRCamera) */ inXR(): boolean; /** Returns vertical position of the HUD */ vertical(): number; /** Returns distance of the HUD from the camera*/ distance(): number; /** Returns scaling of the HUD */ scaling(): number; /** Window.resize event handler, rescales the HUD if aspect ratio is too small for all buttons to fit. */ rescaleHUD(): void; /** * Called before adding a new button to reposition existing ones */ makeRoomForMore(): number; /** * Called when removing a button to update all buttons positions */ recalculateWidth(): number; /** Create a button with given text and image and add it to the HUD @param text description to display @param imageUrl image to display @param onPointerDown callback function activated when pressed @param shareMaterial optional, defaults to true, use shared material for all buttons or create a new one @returns a BabylonJS HolographicButton */ addButton(text: any, imageUrl: any, onPointerDown: any, shareMaterial?: boolean): any; /** * A button can be activated if * - visible * - enabled or active (so it can be deactivated) * - is in the last or previous row (handling more rows than that requires too much bookkeeping) */ canActivate(button: any): any; /** * Remove and dispose a button created by addButton */ removeButton(button: any): void; /** Activates given button, if it's visible */ activateButton(button: any): void; /** * Input delegate method, returns controls available in the current row or form. */ getControls(): any; /** * Input delegate method, returns active control current in row or form. */ getActiveControl(): any; /** * Input delegate method, sets active control current in row or form. */ setActiveControl(control: any): void; /** * Input delegate method, returns index of control current in row or form. */ getControlIndex(control: any): number; /** * Input delegate method, deselects current control. */ unselectCurrent(): void; /** * Input delegate method, selects current control (button or Form element) at given index. */ selectCurrent(index: any): void; /** * Input delegate method, selects the control at given index, keeps track of bounds and wraps around. */ selectControl(index: any): void; /** * Input delegate method, activates the current control (as if clicked on) */ activate(): void; /** * Input delegate method, process a gamepad up button event: activate a button or delegate it to the Form. */ up(): void; /** * Input delegate method, process a gamepad up button event: go back to previous row, or forward to the Form. */ down(): void; /** * Input delegate method, internal state management. Activates next or previous element, ignoring invisible ones. * @param increment -1 or 1 for previous/next */ next(increment: any): any; /** * Activates previous element (gamepad left button) */ left(): void; /** * Activates next element (gamepad right button) */ right(): void; /** * Adds a Form to the hud. Creates and returns AdvancedDynamicTexture to render the form. * @param form to add * @param textureWidth width in pixels * @param textureHeight height in pixels */ addForm(form: any, textureWidth: any, textureHeight: any): any; /** Adds a slider to the HUD. @return babylon Slider object */ addSlider(text: string, min: any, max: any, value: any): any; /** Adds color picker to the HUD. @return babylon ColorPicker object */ addColorPicker(text?: string, color?: any): any; /** Show or hide all HUD elements (buttons) @param show show or hide @param except optional element(s) to skip */ showButtons(show: any, ...except: any[]): void; /** Returns the current row */ currentRow(): { root: any; elements: any[]; controls: any[]; textures: any[]; speechInput: SpeechInput; activeControl: any; }; /** * Creates a new empty row. Current row is scaled down and moved a bit down. */ newRow(): void; /** * Clears and disposes of all controls in the current row */ clearControls(): void; /** * Clears the current row. Previous row is scaled back to original size and brought back into position. */ clearRow(): void; /** * Enable/disable speech input. * @param enable true/false to enable/disable */ enableSpeech(enable: any): void; /** * Initialize XR - allows to grab hud in left or right hand * @param vrHelper VRHelper */ initXR(vrHelper: any): void; squeezeConsumer: (value: any, side: any) => boolean; processSqueeze(value: any, side: any): boolean; /** * Attach hud to left hand */ attachToLeftController(): void; /** * Attach hud to right hand */ attachToRightController(): void; /** * Returns VR controller this HUD is attached to, or null */ attachedController(): any; /** * If attached to a hand, returns the other hand, or null otherwise */ otherController(): any; /** * Returns true if mesh intersects any of hud elements. Allows to 'grab' the hud with a VR controller. */ intersects(mesh: any): boolean; pointIsInside(point: any, mesh: any): boolean; /** * Helper method to set button color, note that button needs it's own material. */ markEnabled(button: any, keepTooltip?: boolean): void; /** * Helper method to set button color to red, note that button needs it's own material. */ markDisabled(button: any, keepTooltip?: boolean): void; /** * Helper method to set button color to green, note that button needs it's own material. */ markActive(button: any, keepTooltip?: boolean): void; /** * Returns true if button color matches colorEnabled */ isEnabled(button: any): boolean; /** * Returns true if button color matches colorActive */ isActive(button: any): boolean; /** * Common code for markEnabled/Disabled/Active */ markButton(button: any, color: any, keepTooltip?: boolean): void; } import { SpeechInput } from '../core/speech-input.js';