@arcware-cloud/pixelstreaming-websdk 1.2.17 → 1.2.18

package/types/lib/domain/ConnectionIdentifier.d.ts

@@ -0,0 +1,27 @@
+import { ArcwarePixelStreaming } from "../ArcwarePixelStreaming";
+export declare enum WebsocketState {
+    CONNECTING = 0,
+    OPEN = 1,
+    CLOSING = 2,
+    CLOSED = 3
+}
+export declare class ConnectionIdentifier {
+    private static instance;
+    static get Instance(): ConnectionIdentifier;
+    private interval;
+    private aps;
+    get WebsocketStates(): WebsocketState[];
+    private constructor();
+    register(ps: ArcwarePixelStreaming): void;
+    GetWebSocketStates(): WebsocketState[];
+    ActiveInstances(): number;
+    private enabled;
+    disable(): void;
+    /**
+     * The purpose of this method is to periodically tell the developer the amount of connected instances.
+     * This way the developer can figure out, when they messed up the implementation and there's shadow instances still running.
+     * Or when they accidentally set up multiple connections!
+     * Things like that can happen, for example if the React.useEffect was not setup perfectly!
+     */
+    private connectionWatcher;
+}

package/types/lib/domain/EventHandler.d.ts

@@ -0,0 +1,11 @@
+/** A helper class to spread the event to additional event handlers added from external sources. */
+export declare class EventHandler<Type> {
+    private callbacks;
+    /** Returns the added callback on success or null, if something went wrong. */
+    add<Callback extends (arg: Type) => void>(callback: Callback): Callback | null;
+    /** Returns true if the input callback has been found and removed and false if not. */
+    remove<Callback extends (arg: Type) => void>(callback: Callback): boolean;
+    constructor();
+    /** Emits the event-data for each of the existing handlers. */
+    static Emit<Type>(handler: EventHandler<Type>, event: Type): void;
+}

package/types/lib/domain/Session.d.ts

@@ -0,0 +1,29 @@
+import { z } from "zod";
+declare const ZOptions: z.ZodObject<{
+    localStorageKey: z.ZodDefault<z.ZodString>;
+    keepSession: z.ZodDefault<z.ZodNumber>;
+}, "strip", z.ZodTypeAny, {
+    localStorageKey?: string;
+    keepSession?: number;
+}, {
+    localStorageKey?: string;
+    keepSession?: number;
+}>;
+type Options = z.infer<typeof ZOptions>;
+/** The sessionId is stored in the localStorage to allow for reconnection and
+ * to prevent spamming start requests of instances, when smashing F5.
+ */
+export declare class Session {
+    private _current?;
+    get current(): string;
+    get noSession(): boolean;
+    get id(): string | null;
+    private options;
+    private get localStorageKey();
+    constructor(options?: Options);
+    /** Set's the session with creation date for the given storage key to the localStorage. */
+    set(sessionId: string): void;
+    /** Removes a session from the localStorage. */
+    unset(): void;
+}
+export {};

package/types/lib/domain/Stats.d.ts

@@ -0,0 +1,36 @@
+import { AggregatedStats, CandidatePairStats } from "@epicgames-ps/lib-pixelstreamingfrontend-ue5.5";
+export declare function Stats(stats: AggregatedStats): import("zod").objectOutputType<{
+    codecs: import("zod").ZodOptional<import("zod").ZodType<Map<string, import("@epicgames-ps/lib-pixelstreamingfrontend-ue5.5/dist/types/PeerConnectionController/CodecStats").CodecStats>, import("zod").ZodTypeDef, Map<string, import("@epicgames-ps/lib-pixelstreamingfrontend-ue5.5/dist/types/PeerConnectionController/CodecStats").CodecStats>>>;
+    candidatePair: import("zod").ZodOptional<import("zod").ZodType<CandidatePairStats[], import("zod").ZodTypeDef, CandidatePairStats[]>>;
+    localCandidates: import("zod").ZodOptional<import("zod").ZodType<import("@epicgames-ps/lib-pixelstreamingfrontend-ue5.5").CandidateStat[], import("zod").ZodTypeDef, import("@epicgames-ps/lib-pixelstreamingfrontend-ue5.5").CandidateStat[]>>;
+    remoteCandidates: import("zod").ZodOptional<import("zod").ZodType<import("@epicgames-ps/lib-pixelstreamingfrontend-ue5.5").CandidateStat[], import("zod").ZodTypeDef, import("@epicgames-ps/lib-pixelstreamingfrontend-ue5.5").CandidateStat[]>>;
+    DataChannelStats: import("zod").ZodOptional<import("zod").ZodType<import("@epicgames-ps/lib-pixelstreamingfrontend-ue5.5").DataChannelStats, import("zod").ZodTypeDef, import("@epicgames-ps/lib-pixelstreamingfrontend-ue5.5").DataChannelStats>>;
+    bytesReceived: import("zod").ZodOptional<import("zod").ZodNumber>;
+    packetsLost: import("zod").ZodOptional<import("zod").ZodNumber>;
+    frameWidth: import("zod").ZodOptional<import("zod").ZodNumber>;
+    frameHeight: import("zod").ZodOptional<import("zod").ZodNumber>;
+    framesDecoded: import("zod").ZodOptional<import("zod").ZodNumber>;
+    framesPerSecond: import("zod").ZodOptional<import("zod").ZodNumber>;
+    framesDropped: import("zod").ZodOptional<import("zod").ZodNumber>;
+    videoCodec: import("zod").ZodOptional<import("zod").ZodString>;
+    audioCodec: import("zod").ZodOptional<import("zod").ZodString>;
+    browserInfo: import("zod").ZodOptional<import("zod").ZodObject<{
+        userAgent: import("zod").ZodOptional<import("zod").ZodString>;
+        platform: import("zod").ZodOptional<import("zod").ZodNullable<import("zod").ZodString>>;
+        language: import("zod").ZodOptional<import("zod").ZodString>;
+    }, "passthrough", import("zod").ZodTypeAny, import("zod").objectOutputType<{
+        userAgent: import("zod").ZodOptional<import("zod").ZodString>;
+        platform: import("zod").ZodOptional<import("zod").ZodNullable<import("zod").ZodString>>;
+        language: import("zod").ZodOptional<import("zod").ZodString>;
+    }, import("zod").ZodTypeAny, "passthrough">, import("zod").objectInputType<{
+        userAgent: import("zod").ZodOptional<import("zod").ZodString>;
+        platform: import("zod").ZodOptional<import("zod").ZodNullable<import("zod").ZodString>>;
+        language: import("zod").ZodOptional<import("zod").ZodString>;
+    }, import("zod").ZodTypeAny, "passthrough">>>;
+    currentRTT: import("zod").ZodOptional<import("zod").ZodNumber>;
+    sessionRunTime: import("zod").ZodOptional<import("zod").ZodString>;
+    controlsStreamInput: import("zod").ZodOptional<import("zod").ZodEffects<import("zod").ZodString, string, string>>;
+    videoEncoderAvgQP: import("zod").ZodOptional<import("zod").ZodNumber>;
+    videoBitrate: import("zod").ZodOptional<import("zod").ZodNumber>;
+    audioBitrate: import("zod").ZodOptional<import("zod").ZodNumber>;
+}, import("zod").ZodTypeAny, "passthrough">;

package/types/lib/domain/debounce.d.ts

@@ -0,0 +1 @@
+export default function debounce<T extends (...args: any[]) => void>(func: T, wait: number): (...args: Parameters<T>) => void;

package/types/lib/index.d.ts

@@ -0,0 +1,6 @@
+export * from "./ArcwareApplication";
+export * from "./ArcwareConfig";
+export * from "./ArcwarePixelStreaming";
+export * from "./ArcwareInit";
+export type * from "./MessageTypes";
+export * from "./styles/ArcwarePixelStreamingApplicationStyles";

package/types/lib/styles/ArcwarePixelStreamingApplicationStyles.d.ts

@@ -0,0 +1,478 @@
+export declare const ArcwareStyles: {
+    customStyles: {
+        ":root": {
+            "--color0": string;
+            "--color1": string;
+            "--color2": string;
+            "--color3": string;
+            "--color4": string;
+            "--color5": string;
+            "--color6": string;
+            "--color7": string;
+            "--color8": string;
+            "--color9": string;
+            "--color10": string;
+            "--color11": string;
+            "--color12": string;
+            "--color13": string;
+            "--colorBoxShadow": string;
+        };
+        "#playerUI *": {
+            fontFamily: string;
+        };
+        "#shared-stream-container": {
+            boxSizing: string;
+        };
+        "#shared-stream-container::-webkit-scrollbar": {
+            width: string;
+        };
+        "#shared-stream-container::-webkit-scrollbar-track": {
+            background: string;
+            opacity: string;
+            borderRadius: string;
+            borderTop: string;
+            borderRight: string;
+            borderBottom: string;
+            borderLeft: string;
+        };
+        "#shared-stream-container::-webkit-scrollbar-track-piece": {
+            background: string;
+        };
+        "#shared-stream-container::-webkit-scrollbar-thumb": {
+            background: string;
+            width: string;
+            borderRight: string;
+            borderLeft: string;
+            transition: string;
+            borderRadius: string;
+        };
+        "#shared-stream-container::-webkit-scrollbar-thumb:hover": {
+            transition: string;
+            background: string;
+        };
+        "#playerUI, #videoElementParent": {
+            position: string;
+            width: string;
+            height: string;
+            maxWidth: string;
+            maxHeight: string;
+            top: number;
+            right: number;
+            bottom: number;
+            left: number;
+            margin: string;
+            boxSizing: string;
+            pointerEvents: string;
+        };
+        "#streamingVideo": {
+            maxWidth: string;
+            maxHeight: string;
+            boxSizing: string;
+            background: string;
+        };
+        "#uiFeatures #controls": {
+            top: string;
+            left: string;
+            bottom: string;
+            right: string;
+            display: string;
+            flexDirection: string;
+        };
+        "#uiFeatures #connection": {
+            bottom: string;
+            left: string;
+            width: string;
+            heihgt: string;
+        };
+        "#uiFeatures button": {
+            backgroundColor: string;
+            border: string;
+            position: string;
+            width: string;
+            height: string;
+            padding: string;
+            textAlign: string;
+            cursor: string;
+            display: string;
+            flexDirection: string;
+            justifyContent: string;
+            alignItems: string;
+            boxShadow: string;
+            borderRadius: string;
+            outline: string;
+        };
+        "#uiFeatures button:hover, #uiFeatures button:active": {
+            padding: string;
+            border: string;
+        };
+        "#uiFeatures button #audioIconMuted, #uiFeatures button #audioIconUnmuted, #uiFeatures button #micIconMuted, #uiFeatures button #micIconUnmuted": {
+            width: string;
+            height: string;
+        };
+        "#uiFeatures button #maximizeIcon, #uiFeatures button #minimizeIcon": {
+            width: string;
+            height: string;
+        };
+        "#stopIcon, #playIcon": {
+            width: string;
+            height: string;
+        };
+        "#uiFeatures button .tooltiptext": {
+            right: string;
+            left: string;
+            boxShadow: string;
+            borderRadius: string;
+            backgroundColor: string;
+            width: string;
+            visibility: string;
+        };
+        "@media (hover: hover) and (pointer: fine)": {
+            "#uiFeatures button:hover .tooltiptext": {
+                visibility: string;
+            };
+        };
+        "#controls>*": {
+            marginBottom: string;
+            display: string;
+            lineHeight: string;
+            padding: string;
+            backgroundColor: string;
+        };
+        "#uiFeatures #settingsIcon, #uiFeatures #statsIcon": {
+            width: string;
+            height: string;
+        };
+        ".svgIcon": {
+            fill: string;
+        };
+        "#uiFeatures button:hover .svgIcon, #uiFeatures button:active .svgIcon": {
+            fill: string;
+        };
+        ".tgl-switch .tgl-slider, .tgl-flat:checked+.tgl-slider": {
+            border: string;
+        };
+        ".tgl-switch .tgl-slider": {
+            background: string;
+        };
+        ".tgl-switch .tgl-slider::before": {
+            content: string;
+            display: string;
+            background: string;
+            position: string;
+            height: string;
+            width: string;
+            borderRadius: string;
+            margin: string;
+            top: string;
+            bottom: string;
+            left: string;
+            right: string;
+        };
+        ".tgl-switch .tgl-slider::after": {
+            height: string;
+            width: string;
+            borderRadius: string;
+            top: string;
+            left: string;
+        };
+        ".tgl-flat:checked+.tgl-slider:after": {
+            left: string;
+            background: string;
+        };
+        ".form-control": {
+            backgroundColor: string;
+            border: string;
+            borderRadius: string;
+            color: string;
+            textAlign: string;
+            fontFamily: string;
+            padding: string;
+        };
+        ".btn-flat": {
+            background: string;
+            color: string;
+            border: string;
+            padding: string;
+            cursor: string;
+            borderRadius: string;
+            textTransform: string;
+            minWidth: string;
+        };
+        ".btn-flat:disabled": {
+            background: string;
+            borderColor: string;
+            color: string;
+            cursor: string;
+        };
+        ".btn-flat:focus": {
+            outline: string;
+        };
+        ".arcware-logo-loader": {
+            position: string;
+            display: string;
+            width: string;
+            height: string;
+        };
+        "#playOverlay img#playButton": {
+            width: string;
+        };
+        "#disconnectOverlay, #errorOverlay": {
+            textTransform: string;
+            textAlign: string;
+            fontSize: string;
+            lineHeight: number;
+        };
+        "#disconnectOverlay .clickableState": {
+            textTransform: string;
+            textAlign: string;
+            color: string;
+            padding: string;
+            fontSize: string;
+            border: string;
+            margin: string;
+            width: string;
+        };
+        "#afkOverlay": {
+            background: string;
+            transition: string;
+            opacity: number;
+            pointerEvents: string;
+        };
+        "#afkOverlayInner": {
+            textTransform: string;
+            background: string;
+            padding: string;
+            fontSize: string;
+            width: string;
+            textAlign: string;
+            lineHeight: number;
+        };
+        "#afkOverlayInner center::first-line": {
+            textTransform: string;
+            color: string;
+            fontWeight: string;
+            fontSize: string;
+        };
+        "#afkOverlayInner #afkCountDownNumber": {
+            color: string;
+            fontSize: string;
+            lineHeight: string;
+        };
+        "#afkOverlayInner center .retry-button": {
+            textTransform: string;
+            textAlign: string;
+            color: string;
+            padding: string;
+            fontSize: string;
+            border: string;
+            margin: string;
+            width: string;
+        };
+        "#connectOverlay #connectButton": {
+            textTransform: string;
+            textAlign: string;
+            color: string;
+            padding: string;
+            fontSize: string;
+            border: string;
+            margin: string;
+            width: string;
+        };
+        "#connectOverlay .connection-text": {
+            textTransform: string;
+            textAlign: string;
+            margin: string;
+        };
+        "#connectOverlay .connection-text .title": {
+            color: string;
+            fontSize: string;
+            margin: string;
+        };
+        "#connectOverlay .connection-text .subtitle": {
+            color: string;
+            opacity: number;
+            fontSize: string;
+            margin: string;
+        };
+        "#infoOverlay.hiddenState": {
+            display: string;
+        };
+        "#disconnectOverlay, #playOverlay, #errorOverlay, #microphoneOverlay, #connectOverlay": {
+            background: string;
+            display: string;
+            transition: string;
+            opacity: number;
+            pointerEvents: string;
+        };
+        "#microphoneOverlay": {
+            textTransform: string;
+            padding: string;
+            fontSize: string;
+            height: string;
+            width: string;
+            textAlign: string;
+            lineHeight: number;
+            position: string;
+            margin: string;
+            top: string;
+            bottom: string;
+            left: string;
+            right: string;
+            justifyContent: string;
+            alignItems: string;
+            flexDirection: string;
+            zIndex: number;
+        };
+        "#microphoneOverlay .title": {
+            fontSize: string;
+            position: string;
+            marginBottom: string;
+            color: string;
+        };
+        "#microphoneOverlay .title:after": {
+            content: string;
+            display: string;
+            animation: string;
+            position: string;
+        };
+        "#microphoneOverlay p": {
+            margin: number;
+            color: string;
+        };
+        "#microphoneOverlay svg": {
+            height: string;
+            marginBottom: string;
+            marginTop: string;
+        };
+        "#microphoneOverlay .svgIcon": {
+            fill: string;
+        };
+        "#disconnectOverlay.hiddenState, #playOverlay.hiddenState, #errorOverlay.hiddenState, #afkOverlay.hiddenState, #microphoneOverlay.hiddenState": {
+            opacity: number;
+            pointerEvents: string;
+        };
+        "#disconnectOverlay.mic-overlay-is-visible, #errorOverlay.mic-overlay-is-visible, #infoOverlay.mic-overlay-is-visible": {
+            opacity: number;
+            pointerEvents: string;
+        };
+        "#infoOverlay.hiddenState, #connectOverlay.hiddenState": {
+            display: string;
+        };
+        "#connectOverlay": {
+            display: string;
+            flexDirection: string;
+            alignItems: string;
+            justifyContent: string;
+        };
+        "#infoOverlay": {
+            display: string;
+        };
+        ".love-letters-box-root": {
+            display: string;
+            position: string;
+            width: string;
+            height: string;
+            color: string;
+            justifyContent: string;
+            alignItems: string;
+            flexDirection: string;
+            background: string;
+            zIndex: number;
+        };
+        ".love-letters-box-root.fade-out": {
+            opacity: number;
+            transition: string;
+        };
+        "#letters-block": {
+            position: string;
+            top: number;
+            left: number;
+            right: number;
+            bottom: number;
+            margin: string;
+            color: string;
+            zIndex: number;
+            display: string;
+            flexDirection: string;
+            justifyContent: string;
+            alignItems: string;
+            fontSize: string;
+            textTransform: string;
+            textAlign: string;
+        };
+        "#letters-wrapper": {
+            height: string;
+            overflow: string;
+            position: string;
+            display: string;
+            flexDirection: string;
+            alignItems: string;
+            justifyContent: string;
+            marginTop: string;
+            paddingBottom: string;
+        };
+        "#letters-wrapper p": {
+            textAlign: string;
+            lineHeight: number;
+            fontSize: string;
+        };
+        ".letter-animation:nth-last-of-type(1)::after": {
+            display: string;
+            animation: string;
+            content: string;
+            position: string;
+        };
+        ".letter-animation": {
+            transition: string;
+            transformOrigin: string;
+            margin: string;
+        };
+        ".letter-animation-enter": {
+            animation: string;
+        };
+        ".letter-animation-exit": {
+            opacity: number;
+            scale: number;
+            transition: string;
+            margin: number;
+        };
+        "@keyframes dotty": {
+            "0%": {
+                content: string;
+            };
+            "25%": {
+                content: string;
+            };
+            "50%": {
+                content: string;
+            };
+            "75%": {
+                content: string;
+            };
+            "100%": {
+                content: string;
+            };
+        };
+        "@keyframes fadeInUp": {
+            from: {
+                opacity: number;
+                transform: string;
+                scale: number;
+            };
+            to: {
+                opacity: number;
+                transform: string;
+                scale: number;
+            };
+        };
+        ".hidden": {
+            display: string;
+            opacity: number;
+        };
+        ".visible": {
+            display: string;
+            opacity: number;
+            transition: string;
+        };
+    };
+};

package/types/lib/ui/ArcwareLogoLoader/index.d.ts

@@ -0,0 +1,6 @@
+export declare class ArcwareLogoLoader {
+    arcwareLogoLoader: HTMLDivElement;
+    constructor();
+    private createArcwareLogoLoader;
+    private getSvg;
+}

package/types/lib/ui/AudioButton/AudioIcon.d.ts

@@ -0,0 +1,7 @@
+export declare class AudioIcon {
+    audioIconUnmuted: SVGElement;
+    audioIconMuted: SVGElement;
+    constructor();
+    private createAudioIconUnmuted;
+    private createAudioIconMuted;
+}

package/types/lib/ui/AudioButton/index.d.ts

@@ -0,0 +1,15 @@
+import { ArcwarePixelStreaming } from "../../ArcwarePixelStreaming";
+export declare class AudioButton {
+    private button;
+    private stream;
+    private audioIcon;
+    private tooltipText;
+    constructor(stream: ArcwarePixelStreaming);
+    private setAudioMutedByDefault;
+    private createButton;
+    private createTooltipText;
+    private toggleAudio;
+    private updateAudioIcon;
+    get element(): HTMLButtonElement;
+    private onVolumeChange;
+}

package/types/lib/ui/LoveLetters/index.d.ts

@@ -0,0 +1,6 @@
+export declare class LoveLetters {
+    loveLettersRoot: HTMLElement | null;
+    constructor();
+    addLetter(letter: string, listLength: number): void;
+    updateOpacity(listLength: number): void;
+}

package/types/lib/ui/MicButton/index.d.ts

@@ -0,0 +1,14 @@
+import { ArcwarePixelStreaming } from "../../ArcwarePixelStreaming";
+export declare class MicButton {
+    private button;
+    private stream;
+    private micIcon;
+    private tooltipText;
+    constructor(stream: ArcwarePixelStreaming);
+    private setMicMutedByDefault;
+    private createButton;
+    private createTooltipText;
+    private toggleMic;
+    private updateMicIcon;
+    get element(): HTMLButtonElement;
+}

package/types/lib/ui/MicIcon/index.d.ts

@@ -0,0 +1,7 @@
+export declare class MicIcon {
+    micIconUnmuted: SVGElement;
+    micIconMuted: SVGElement;
+    constructor();
+    private createMicIconUnmuted;
+    private createMicIconMuted;
+}

package/types/lib/ui/MicrophoneOverlay/index.d.ts

@@ -0,0 +1,11 @@
+import { ArcwarePixelStreaming } from "../../ArcwarePixelStreaming";
+export declare class MicrophoneOverlay {
+    private overlay;
+    private parentElement;
+    private micIcon;
+    private stream;
+    constructor(stream: ArcwarePixelStreaming);
+    createOverlay(): void;
+    toggleMessage(enabled: boolean): void;
+    toggleVisibility(visible: boolean): void;
+}

package/types/lib/ui/PlayIcon/index.d.ts

@@ -0,0 +1,5 @@
+export declare class PlayIcon {
+    playIcon: SVGElement;
+    constructor();
+    private createPlayIcon;
+}