@nativewrappers/fivem 0.0.1

package/lib/client/ui/Scaleform.js

@@ -0,0 +1,234 @@
+/**
+ * Scaleforms will automatically load when calling any of the render functions.
+ *
+ * Example:
+ *
+ * ```typescript
+ * import { Scaleform } from '@nativewrappers/client/ui';
+ *
+ * const scaleform = new Cfx.Scaleform("MIDSIZED_MESSAGE");
+ *
+ * scaleform.callFunction("SHOW_MIDSIZED_MESSAGE", ["Title", "Message"]);
+ *
+ * setTick(() => {
+ *  await scaleform.render2D();
+ * });
+ * ```
+ */
+export class Scaleform {
+    static render2DMasked(scaleform1, scaleform2) {
+        return new Promise(async (resolve) => {
+            if (scaleform1.IsLoaded && scaleform2.IsLoaded) {
+                DrawScaleformMovieFullscreenMasked(scaleform1.Handle, scaleform2.Handle, 255, 255, 255, 255);
+            }
+            else {
+                await scaleform1.load();
+                await scaleform2.load();
+            }
+            resolve();
+        });
+    }
+    constructor(name) {
+        this.loaded = false;
+        this.name = name;
+        this.handle = RequestScaleformMovie(this.name);
+    }
+    /**
+     * Get the handle of the scaleform.
+     */
+    get Handle() {
+        return this.handle;
+    }
+    /**
+     * Get whether the handle is a valid handle.
+     */
+    get IsValid() {
+        return this.handle !== 0;
+    }
+    /**
+     * Get whether the scaleform is loaded.
+     */
+    get IsLoaded() {
+        if (!this.loaded) {
+            this.loaded = HasScaleformMovieLoaded(this.handle);
+        }
+        return this.loaded;
+    }
+    /**
+     * Dispose the scaleform allowing the GTA engine to free memory when wanted.
+     */
+    dispose() {
+        if (this.IsLoaded) {
+            SetScaleformMovieAsNoLongerNeeded(this.handle);
+            this.loaded = false;
+        }
+    }
+    /**
+     * Call a function on the scaleform.
+     *
+     * @param name Name of the function
+     * @param args Additional arguments
+     */
+    callFunction(name, ...args) {
+        BeginScaleformMovieMethod(this.handle, name);
+        args.forEach(arg => {
+            switch (typeof arg) {
+                case 'number':
+                    PushScaleformMovieFunctionParameterInt(arg);
+                    break;
+                case 'string':
+                    PushScaleformMovieFunctionParameterString(arg);
+                    break;
+                case 'boolean':
+                    PushScaleformMovieFunctionParameterBool(arg);
+                    break;
+                default:
+                    throw new Error(`Unknown argument type [${typeof arg}] passed to scaleform with handle [${this.handle}], had value of ${arg}`);
+            }
+        });
+        EndScaleformMovieMethod();
+    }
+    /**
+     * Calls a void method on the scaleform.
+     *
+     * @param name Name of the function
+     */
+    callVoidMethod(name) {
+        CallScaleformMovieMethod(this.handle, name);
+    }
+    /**
+     * Calls a string method on the scaleform.
+     *
+     * @param name Name of the function
+     * @param param1
+     * @param param2
+     * @param param3
+     * @param param4
+     * @param param5
+     */
+    callStringMethod(name, param1 = '', param2 = '', param3 = '', param4 = '', param5 = '') {
+        CallScaleformMovieMethodWithString(this.handle, name, param1, param2, param3, param4, param5);
+    }
+    /**
+     * Calls a number method on the scaleform.
+     *
+     * @param name Name of the function
+     * @param param1
+     * @param param2
+     * @param param3
+     * @param param4
+     * @param param5
+     */
+    callNumberMethod(name, param1 = -1.0, param2 = -1.0, param3 = -1.0, param4 = -1.0, param5 = -1.0) {
+        CallScaleformMovieMethodWithNumber(this.handle, name, param1, param2, param3, param4, param5);
+    }
+    /**
+     * Calls a number & string method on the scaleform.
+     *
+     * @param name Name of the function
+     * @param fParam1
+     * @param fParam2
+     * @param fParam3
+     * @param fParam4
+     * @param fParam5
+     * @param sParam1
+     * @param sParam2
+     * @param sParam3
+     * @param sParam4
+     * @param sParam5
+     */
+    callSharedMethod(name, fParam1 = -1.0, fParam2 = -1.0, fParam3 = -1.0, fParam4 = -1.0, fParam5 = -1.0, sParam1 = '', sParam2 = '', sParam3 = '', sParam4 = '', sParam5 = '') {
+        CallScaleformMovieMethodWithNumberAndString(this.handle, name, fParam1, fParam2, fParam3, fParam4, fParam5, sParam1, sParam2, sParam3, sParam4, sParam5);
+    }
+    /**
+     * Sets a duration the scaleform should be shown.
+     * Useful for showing a scaleform for a known amount of time, such as messages.
+     *
+     * This only works for any scaleform using {@linkcode render2D};
+     *
+     * @param duration Duration in milliseconds
+     */
+    setDuration(duration) {
+        if (duration <= 0) {
+            return;
+        }
+        const start = GetGameTimer();
+        const interval = setInterval(async () => {
+            if (GetGameTimer() - start < duration) {
+                await this.render2D();
+            }
+            else {
+                clearInterval(interval);
+            }
+        }, 0);
+    }
+    render2D() {
+        return new Promise(async (resolve) => {
+            if (this.IsLoaded) {
+                DrawScaleformMovieFullscreen(this.handle, 255, 255, 255, 255, 0);
+            }
+            else {
+                await this.load();
+            }
+            resolve();
+        });
+    }
+    render2DScreenSpace(location, size) {
+        return new Promise(async (resolve) => {
+            if (this.IsLoaded) {
+                const x = location.x; /* UI.Screen.Width*/
+                const y = location.y; /* UI.Screen.Height*/
+                const width = size.x; /* UI.Screen.Width*/
+                const height = size.y; /* UI.Screen.Height*/
+                DrawScaleformMovie(this.handle, x + width / 2, y + height / 2, width, height, 255, 255, 255, 255, 0);
+            }
+            else {
+                await this.load();
+            }
+            resolve();
+        });
+    }
+    render3D(position, rotation, scale) {
+        return new Promise(async (resolve) => {
+            if (this.IsLoaded) {
+                DrawScaleformMovie_3dNonAdditive(this.handle, position.x, position.y, position.z, rotation.x, rotation.y, rotation.z, 2, 2, 1, scale.x, scale.y, scale.z, 2);
+            }
+            else {
+                await this.load();
+            }
+            resolve();
+        });
+    }
+    render3DAdditive(position, rotation, scale) {
+        return new Promise(async (resolve) => {
+            if (this.IsLoaded) {
+                DrawScaleformMovie_3d(this.handle, position.x, position.y, position.z, rotation.x, rotation.y, rotation.z, 2, 2, 1, scale.x, scale.y, scale.z, 2);
+            }
+            else {
+                await this.load();
+            }
+            resolve();
+        });
+    }
+    load() {
+        return new Promise(resolve => {
+            if (this.IsLoaded) {
+                resolve(true);
+            }
+            else {
+                const start = GetGameTimer();
+                const interval = setInterval(() => {
+                    if (this.IsLoaded) {
+                        clearInterval(interval);
+                        resolve(true);
+                    }
+                    else if (GetGameTimer() - start > 5000) {
+                        clearInterval(interval);
+                        console.log(`^1[fivemjs/client] Could not load scaleform ${this.name}!^7`);
+                        resolve(false);
+                    }
+                }, 0);
+            }
+        });
+    }
+}

package/lib/client/ui/Screen.d.ts

@@ -0,0 +1,16 @@
+import { HudColor, NotificationType } from '../enums';
+import { Color, Size, Vector3 } from '../utils';
+import { Notification } from './';
+export declare abstract class Screen {
+    static get Resolution(): Size;
+    static get ScaledResolution(): Size;
+    static get Width(): number;
+    static get ScaledWidth(): number;
+    static get Height(): number;
+    static get AspectRatio(): number;
+    static showSubtitle(message: string, duration?: number): void;
+    static displayHelpTextThisFrame(message: string): void;
+    static showNotification(message: string, blinking?: boolean): Notification;
+    static showAdvancedNotification(message: string, title: string, subtitle: string, iconSet: string, icon: string, bgColor?: HudColor, flashColor?: Color, blinking?: boolean, type?: NotificationType, showInBrief?: boolean, sound?: boolean): Notification;
+    static worldToScreen(position: Vector3, scaleWidth?: boolean): Size;
+}

package/lib/client/ui/Screen.js

@@ -0,0 +1,72 @@
+import { Audio } from '../Audio';
+import { HudColor, NotificationType } from '../enums';
+import { Color, Size, String } from '../utils';
+import { Notification } from './';
+export class Screen {
+    static get Resolution() {
+        const [width, height] = GetScreenActiveResolution();
+        return new Size(width, height);
+    }
+    static get ScaledResolution() {
+        const height = this.Height;
+        return new Size(height * this.AspectRatio, height);
+    }
+    static get Width() {
+        return this.Resolution.width;
+    }
+    static get ScaledWidth() {
+        return this.Height * this.AspectRatio;
+    }
+    static get Height() {
+        return this.Resolution.height;
+    }
+    static get AspectRatio() {
+        return GetAspectRatio(false);
+    }
+    static showSubtitle(message, duration = 2500) {
+        const strings = String.stringToArray(message);
+        BeginTextCommandPrint('CELL_EMAIL_BCON');
+        strings.forEach(element => {
+            AddTextComponentSubstringPlayerName(element);
+        });
+        EndTextCommandPrint(duration, true);
+    }
+    static displayHelpTextThisFrame(message) {
+        const strings = String.stringToArray(message);
+        BeginTextCommandDisplayHelp('CELL_EMAIL_BCON');
+        strings.forEach(element => {
+            AddTextComponentSubstringPlayerName(element);
+        });
+        EndTextCommandDisplayHelp(0, false, false, -1);
+    }
+    static showNotification(message, blinking = false) {
+        const strings = String.stringToArray(message);
+        SetNotificationTextEntry('CELL_EMAIL_BCON');
+        strings.forEach(element => {
+            AddTextComponentSubstringPlayerName(element);
+        });
+        return new Notification(DrawNotification(blinking, true));
+    }
+    static showAdvancedNotification(message, title, subtitle, iconSet, icon, bgColor = HudColor.NONE, flashColor = Color.empty, blinking = false, type = NotificationType.Default, showInBrief = true, sound = true) {
+        const strings = String.stringToArray(message);
+        SetNotificationTextEntry('CELL_EMAIL_BCON');
+        strings.forEach(element => {
+            AddTextComponentSubstringPlayerName(element);
+        });
+        if (bgColor !== HudColor.NONE) {
+            SetNotificationBackgroundColor(Number(bgColor));
+        }
+        if (flashColor !== Color.empty && blinking) {
+            SetNotificationFlashColor(flashColor.r, flashColor.g, flashColor.b, flashColor.a);
+        }
+        if (sound) {
+            Audio.playSoundFrontEnd('DELETE', 'HUD_DEATHMATCH_SOUNDSET');
+        }
+        SetNotificationMessage(iconSet, icon, true, Number(type), title, subtitle);
+        return new Notification(DrawNotification(blinking, showInBrief));
+    }
+    static worldToScreen(position, scaleWidth = false) {
+        const coords = GetScreenCoordFromWorldCoord(position.x, position.y, position.z);
+        return new Size(coords[1] * (scaleWidth ? this.ScaledWidth : this.Width), coords[2] * this.Height);
+    }
+}

package/lib/client/ui/Sprite.d.ts

@@ -0,0 +1,17 @@
+import { Color, Point, Size } from '../utils';
+export declare class Sprite {
+    textureName: string;
+    pos: Point;
+    size: Size;
+    heading: number;
+    color: Color;
+    visible: boolean;
+    private _textureDict;
+    constructor(textureDict: string, textureName: string, pos?: Point, size?: Size, heading?: number, color?: Color);
+    loadTextureDictionary(): void;
+    set TextureDict(v: string);
+    get TextureDict(): string;
+    get IsTextureDictionaryLoaded(): boolean;
+    draw(resolution?: Size): void;
+    draw(textureDictionary?: string, textureName?: string, pos?: Point, size?: Size, heading?: number, color?: Color, loadTexture?: boolean, resolution?: Size): void;
+}

package/lib/client/ui/Sprite.js

@@ -0,0 +1,53 @@
+import { Color, Point, Size } from '../utils';
+import { Screen } from './';
+export class Sprite {
+    constructor(textureDict, textureName, pos, size, heading = 0, color = Color.white) {
+        this._textureDict = textureDict;
+        this.textureName = textureName;
+        this.pos = pos || new Point();
+        this.size = size || new Size();
+        this.heading = heading || 0;
+        this.color = color || Color.white;
+        this.visible = true;
+    }
+    loadTextureDictionary() {
+        RequestStreamedTextureDict(this._textureDict, true);
+        const interval = setInterval(() => {
+            if (this.IsTextureDictionaryLoaded) {
+                clearInterval(interval);
+            }
+        }, 0);
+    }
+    set TextureDict(v) {
+        this._textureDict = v;
+        if (!this.IsTextureDictionaryLoaded) {
+            this.loadTextureDictionary();
+        }
+    }
+    get TextureDict() {
+        return this._textureDict;
+    }
+    get IsTextureDictionaryLoaded() {
+        return HasStreamedTextureDictLoaded(this._textureDict);
+    }
+    draw(arg1, textureName, pos, size, heading, color, loadTexture = true, resolution) {
+        const textureDictionary = arg1 && typeof arg1 === 'string' ? arg1 : this.TextureDict;
+        textureName = textureName || this.textureName;
+        pos = pos || this.pos;
+        size = size || this.size;
+        heading = heading || this.heading;
+        color = color || this.color;
+        if (loadTexture) {
+            if (!HasStreamedTextureDictLoaded(textureDictionary)) {
+                RequestStreamedTextureDict(textureDictionary, false);
+            }
+        }
+        resolution = arg1 instanceof Size ? arg1 : resolution;
+        resolution = resolution || new Size(Screen.ScaledWidth, Screen.Height);
+        const w = size.width / resolution.width;
+        const h = size.height / resolution.height;
+        const x = pos.X / resolution.width + w * 0.5;
+        const y = pos.Y / resolution.height + h * 0.5;
+        DrawSprite(textureDictionary, textureName, x, y, w, h, heading, color.r, color.g, color.b, color.a);
+    }
+}

package/lib/client/ui/Text.d.ts

@@ -0,0 +1,31 @@
+import { Alignment, Font } from '../enums';
+import { Color, Point, Size } from '../utils';
+import { IDrawable } from './';
+export declare class Text implements IDrawable {
+    static draw(caption: string, pos: Point, scale?: number, color?: Color, font?: Font, alignment?: Alignment, dropShadow?: boolean, outline?: boolean, wordWrap?: Size, resolution?: Size): void;
+    static addLongString(str: string): void;
+    caption: string;
+    pos: Point;
+    scale: number;
+    color: Color;
+    font: Font;
+    alignment: Alignment;
+    dropShadow: boolean;
+    outline: boolean;
+    wordWrap: Size;
+    /**
+     *
+     * @param caption Text to display
+     * @param pos Position of text relative to alignment. In pixels.
+     * @param scale Size of text. Default 1.0
+     * @param color Color of text. Default black.
+     * @param font Font of text. Default Chalet London.
+     * @param alignment Alignment of text. Default Left.
+     * @param dropShadow
+     * @param outline
+     * @param wordWrap
+     */
+    constructor(caption: string, pos: Point, scale?: number, color?: Color, font?: Font, alignment?: Alignment, dropShadow?: boolean, outline?: boolean, wordWrap?: Size);
+    draw(offset?: Size, resolution?: Size): void;
+    draw(caption: string, pos: Point, scale: number, color?: Color, font?: Font, alignment?: Alignment, dropShadow?: boolean, outline?: boolean, wordWrap?: Size, resolution?: Size): void;
+}

package/lib/client/ui/Text.js

@@ -0,0 +1,102 @@
+import { Alignment, Font } from '../enums';
+import { Color, Point, Size } from '../utils';
+import { Screen } from './';
+export class Text {
+    static draw(caption, pos, scale = 1, color = Color.white, font = Font.ChaletLondon, alignment = Alignment.Left, dropShadow = false, outline = false, wordWrap, resolution) {
+        resolution = resolution || new Size(Screen.ScaledWidth, Screen.Height);
+        const x = pos.X / resolution.width;
+        const y = pos.Y / resolution.height;
+        SetTextFont(Number(font));
+        SetTextScale(1.0, scale);
+        SetTextColour(color.r, color.g, color.b, color.a);
+        if (dropShadow) {
+            SetTextDropshadow(2, 0, 0, 0, 0);
+        }
+        if (outline) {
+            SetTextOutline();
+        }
+        switch (alignment) {
+            case Alignment.Centered:
+                SetTextCentre(true);
+                break;
+            case Alignment.Right:
+                SetTextRightJustify(true);
+                if (!wordWrap) {
+                    SetTextWrap(0.0, x);
+                }
+                break;
+        }
+        if (wordWrap) {
+            SetTextWrap(x, (pos.X + wordWrap.width) / resolution.width);
+        }
+        SetTextEntry('STRING');
+        Text.addLongString(caption);
+        DrawText(x, y);
+    }
+    static addLongString(str) {
+        const strLen = 99;
+        for (let i = 0; i < str.length; i += strLen) {
+            const substr = str.substr(i, Math.min(strLen, str.length - i));
+            AddTextComponentSubstringPlayerName(substr);
+        }
+    }
+    /**
+     *
+     * @param caption Text to display
+     * @param pos Position of text relative to alignment. In pixels.
+     * @param scale Size of text. Default 1.0
+     * @param color Color of text. Default black.
+     * @param font Font of text. Default Chalet London.
+     * @param alignment Alignment of text. Default Left.
+     * @param dropShadow
+     * @param outline
+     * @param wordWrap
+     */
+    constructor(caption, pos, scale = 1, color = Color.white, font = Font.ChaletLondon, alignment = Alignment.Left, dropShadow = false, outline = false, wordWrap = new Size(500, 300)) {
+        this.caption = caption;
+        this.pos = pos;
+        this.scale = scale;
+        this.color = color;
+        this.font = font;
+        this.alignment = alignment;
+        this.dropShadow = dropShadow;
+        this.outline = outline;
+        this.wordWrap = wordWrap;
+    }
+    draw(arg1, arg2, scale, color, font, alignment, dropShadow, outline, wordWrap, resolution) {
+        resolution = arg2 instanceof Size ? arg2 : resolution;
+        if (scale === undefined) {
+            if (arg1 && arg1 instanceof Size) {
+                arg2 = new Point(this.pos.X + arg1.width, this.pos.Y + arg1.height);
+            }
+            else {
+                arg2 = this.pos;
+            }
+            arg1 = this.caption;
+            scale = this.scale;
+            color = this.color;
+            font = this.font;
+            alignment = this.alignment;
+            dropShadow = this.dropShadow;
+            outline = this.outline;
+            wordWrap = this.wordWrap;
+        }
+        else {
+            arg1 = arg1 || this.caption;
+            if (!arg2) {
+                arg2 = this.pos;
+            }
+            else {
+                arg2 = arg2;
+            }
+            scale = scale !== undefined && scale !== null ? scale : this.scale;
+            color = color || this.color;
+            font = font !== undefined && font !== null ? font : this.font;
+            alignment = alignment !== undefined && alignment !== null ? alignment : this.alignment;
+            dropShadow = typeof dropShadow === 'boolean' ? dropShadow : dropShadow;
+            outline = typeof outline === 'boolean' ? outline : outline;
+            wordWrap = wordWrap || this.wordWrap;
+        }
+        Text.draw(arg1, arg2, scale, color, font, alignment, dropShadow, outline, wordWrap, resolution);
+    }
+}

package/lib/client/ui/Timerbar.d.ts

@@ -0,0 +1,44 @@
+import { Sprite } from './Sprite';
+/**
+ * Create a Timerbar. It's automatically added to the internal Timerbar array and drawn in a FIFO (first in, first out) way.
+ *
+ * ```typescript
+ * // Create simple Timerbar
+ * const myTimerbar = new Cfx.Timerbar("Hello");
+ * myTimerbar.Text = "World";
+ *
+ * // Disable Timerbar later on
+ * myTimerbar.Visible = false;
+ * ```
+ */
+export declare class Timerbar {
+    private sprite;
+    private title;
+    private text;
+    private useProgressBar;
+    private usePlayerStyle;
+    private isVisible;
+    private pbarValue;
+    private textColor;
+    private pbarBgColor;
+    private pbarFgColor;
+    constructor(title: string, useProgressBar?: boolean);
+    get Title(): string;
+    set Title(value: string);
+    get Text(): string;
+    set Text(value: string);
+    get UseProgressBar(): boolean;
+    get Progress(): number;
+    set Progress(value: number);
+    get Visible(): boolean;
+    set Visible(value: boolean);
+    get TextColor(): number | number[];
+    set TextColor(value: number | number[]);
+    get ProgressbarBgColor(): number[] | number;
+    set ProgressbarBgColor(value: number[] | number);
+    get ProgressbarFgColor(): number[] | number;
+    set ProgressbarFgColor(value: number[] | number);
+    set PlayerStyle(value: boolean);
+    get PlayerStyle(): boolean;
+    get Sprite(): Sprite | null;
+}