@fishjam-cloud/react-client 0.6.0 → 0.7.0

package/dist/hooks/setupMedia.js

@@ -1,200 +0,0 @@
-import { useEffect, useMemo, useRef } from "react";
-import { useFishjamContext } from "./fishjamContext";
-const isBroadcastedTrackChanged = (client, pending) => client.status === "joined" && !pending && !client.isReconnecting();
-const isBroadcastedTrackStopped = (status, stream) => status === "joined" && stream;
-export const useSetupMedia = (config) => {
-    const { state, videoTrackManager, audioTrackManager } = useFishjamContext();
-    const configRef = useRef(config);
-    useEffect(() => {
-        configRef.current = config;
-        state.client.setDeviceManagerConfig({
-            storage: config.storage,
-        });
-    }, [config, state.client]);
-    useEffect(() => {
-        if (!configRef.current.startOnMount)
-            return;
-        state.client.initializeDevices({
-            audioTrackConstraints: configRef?.current.microphone.trackConstraints,
-            videoTrackConstraints: configRef?.current.camera.trackConstraints,
-        });
-        // eslint-disable-next-line
-    }, []);
-    useEffect(() => {
-        let pending = false;
-        const broadcastOnCameraStart = async (client) => {
-            const config = configRef.current.camera;
-            const onDeviceChange = config.onDeviceChange ?? "replace";
-            const stream = videoTrackManager.getCurrentTrack()?.stream;
-            if (isBroadcastedTrackChanged(client, pending)) {
-                if (!stream && config.broadcastOnDeviceStart) {
-                    pending = true;
-                    await videoTrackManager
-                        .startStreaming(config.defaultSimulcastConfig, config.defaultMaxBandwidth)
-                        .finally(() => {
-                        pending = false;
-                    });
-                }
-                else if (stream && onDeviceChange === "replace") {
-                    pending = true;
-                    await videoTrackManager.refreshStreamedTrack().finally(() => {
-                        pending = false;
-                    });
-                }
-                else if (stream && onDeviceChange === "remove") {
-                    pending = true;
-                    await videoTrackManager.stopStreaming().finally(() => {
-                        pending = false;
-                    });
-                }
-            }
-        };
-        const managerInitialized = async (event, client) => {
-            if (event.video?.media?.stream) {
-                await broadcastOnCameraStart(client);
-            }
-        };
-        const devicesReady = async (event, client) => {
-            if (event.trackType === "video" && event.restarted && event?.media?.stream) {
-                await broadcastOnCameraStart(client);
-            }
-        };
-        const deviceReady = async (event, client) => {
-            if (event.trackType === "video") {
-                await broadcastOnCameraStart(client);
-            }
-        };
-        state.client.on("managerInitialized", managerInitialized);
-        state.client.on("devicesReady", devicesReady);
-        state.client.on("deviceReady", deviceReady);
-        return () => {
-            state.client.removeListener("managerInitialized", managerInitialized);
-            state.client.removeListener("devicesReady", devicesReady);
-            state.client.removeListener("deviceReady", deviceReady);
-        };
-    }, [state.client, videoTrackManager]);
-    useEffect(() => {
-        const removeOnCameraStopped = async (event, client) => {
-            const stream = videoTrackManager.getCurrentTrack()?.stream;
-            const onDeviceStop = configRef.current.camera.onDeviceStop ?? "mute";
-            if (event.mediaDeviceType === "userMedia" &&
-                event.trackType === "video" &&
-                isBroadcastedTrackStopped(client.status, stream)) {
-                if (onDeviceStop === "mute") {
-                    await videoTrackManager.pauseStreaming();
-                }
-                else {
-                    await videoTrackManager.stopStreaming();
-                }
-            }
-        };
-        state.client.on("deviceStopped", removeOnCameraStopped);
-        return () => {
-            state.client.removeListener("deviceStopped", removeOnCameraStopped);
-        };
-    }, [state.client, videoTrackManager]);
-    useEffect(() => {
-        const broadcastCameraOnConnect = async (_, client) => {
-            const camera = client.devices.camera;
-            const stream = camera.stream;
-            const config = configRef.current.camera;
-            if (stream && config.broadcastOnConnect) {
-                await videoTrackManager.startStreaming(config.defaultSimulcastConfig, config.defaultMaxBandwidth);
-            }
-        };
-        state.client.on("joined", broadcastCameraOnConnect);
-        return () => {
-            state.client.removeListener("joined", broadcastCameraOnConnect);
-        };
-    }, [state.client, videoTrackManager]);
-    useEffect(() => {
-        let pending = false;
-        const broadcastOnMicrophoneStart = async (client) => {
-            const stream = audioTrackManager.getCurrentTrack()?.stream;
-            const config = configRef.current.microphone;
-            const onDeviceChange = config.onDeviceChange ?? "replace";
-            if (isBroadcastedTrackChanged(client, pending)) {
-                if (!stream && config.broadcastOnDeviceStart) {
-                    pending = true;
-                    await audioTrackManager.startStreaming(undefined, config.defaultMaxBandwidth).finally(() => {
-                        pending = false;
-                    });
-                }
-                else if (stream && onDeviceChange === "replace") {
-                    pending = true;
-                    await audioTrackManager.refreshStreamedTrack().finally(() => {
-                        pending = false;
-                    });
-                }
-                else if (stream && onDeviceChange === "remove") {
-                    pending = true;
-                    await audioTrackManager.stopStreaming().finally(() => {
-                        pending = false;
-                    });
-                }
-            }
-        };
-        const managerInitialized = async (event, client) => {
-            if (event.audio?.media?.stream) {
-                await broadcastOnMicrophoneStart(client);
-            }
-        };
-        const devicesReady = async (event, client) => {
-            if (event.trackType === "audio" && event.restarted && event?.media?.stream) {
-                await broadcastOnMicrophoneStart(client);
-            }
-        };
-        const deviceReady = async (event, client) => {
-            if (event.trackType === "audio") {
-                await broadcastOnMicrophoneStart(client);
-            }
-        };
-        state.client.on("managerInitialized", managerInitialized);
-        state.client.on("deviceReady", deviceReady);
-        state.client.on("devicesReady", devicesReady);
-        return () => {
-            state.client.removeListener("managerInitialized", managerInitialized);
-            state.client.removeListener("deviceReady", deviceReady);
-            state.client.removeListener("devicesReady", devicesReady);
-        };
-    }, [state.client, audioTrackManager]);
-    useEffect(() => {
-        const onMicrophoneStopped = async (event, client) => {
-            const stream = audioTrackManager.getCurrentTrack()?.stream;
-            const onDeviceStop = configRef.current.microphone.onDeviceStop ?? "mute";
-            const isRightDeviceType = event.mediaDeviceType === "userMedia";
-            const isRightTrackType = event.trackType === "audio";
-            if (isRightDeviceType && isRightTrackType && isBroadcastedTrackStopped(client.status, stream)) {
-                if (onDeviceStop === "mute") {
-                    await audioTrackManager.pauseStreaming();
-                }
-                else {
-                    await audioTrackManager.stopStreaming();
-                }
-            }
-        };
-        state.client.on("deviceStopped", onMicrophoneStopped);
-        return () => {
-            state.client.removeListener("deviceStopped", onMicrophoneStopped);
-        };
-    }, [state.client, audioTrackManager]);
-    useEffect(() => {
-        const broadcastMicrophoneOnConnect = async (_, client) => {
-            const config = configRef.current.microphone;
-            const microphone = client.devices.microphone;
-            if (microphone.stream && config.broadcastOnConnect) {
-                await audioTrackManager.startStreaming(undefined, config.defaultMaxBandwidth);
-            }
-        };
-        state.client.on("joined", broadcastMicrophoneOnConnect);
-        return () => {
-            state.client.removeListener("joined", broadcastMicrophoneOnConnect);
-        };
-    }, [state.client, audioTrackManager]);
-    return useMemo(() => ({
-        init: () => state.client.initializeDevices({
-            audioTrackConstraints: configRef.current?.microphone?.trackConstraints,
-            videoTrackConstraints: configRef.current?.camera?.trackConstraints,
-        }),
-    }), [state.client]);
-};

package/dist/hooks/state.d.ts

@@ -1,6 +0,0 @@
-import type { Selector } from "../state.types";
-export declare function useSelector<Result>(selector: Selector<Result>): Result;
-export declare function useStatus(): import("../state.types").PeerStatus;
-export declare function useTracks(): Record<string, import("../state.types").TrackWithOrigin>;
-export declare function useClient(): import("..").Client;
-//# sourceMappingURL=state.d.ts.map

package/dist/hooks/state.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"state.d.ts","sourceRoot":"","sources":["../../src/hooks/state.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAE/C,wBAAgB,WAAW,CAAC,MAAM,EAAE,QAAQ,EAAE,QAAQ,CAAC,MAAM,CAAC,GAAG,MAAM,CAItE;AAED,wBAAgB,SAAS,wCAExB;AAED,wBAAgB,SAAS,6DAExB;AAED,wBAAgB,SAAS,wBAExB"}

package/dist/hooks/state.js

@@ -1,15 +0,0 @@
-import { useMemo } from "react";
-import { useFishjamContext } from "./fishjamContext";
-export function useSelector(selector) {
-    const { state } = useFishjamContext();
-    return useMemo(() => selector(state), [selector, state]);
-}
-export function useStatus() {
-    return useSelector((s) => s.status);
-}
-export function useTracks() {
-    return useSelector((s) => s.tracks);
-}
-export function useClient() {
-    return useSelector((s) => s.client);
-}

package/dist/trackManager.d.ts

@@ -1,9 +0,0 @@
-import type { FishjamClient } from "@fishjam-cloud/ts-client";
-import type { MediaManager, PeerMetadata, TrackManager, TrackMetadata } from "./types";
-interface TrackManagerConfig {
-    mediaManager: MediaManager;
-    tsClient: FishjamClient<PeerMetadata, TrackMetadata>;
-}
-export declare const useTrackManager: ({ mediaManager, tsClient }: TrackManagerConfig) => TrackManager;
-export {};
-//# sourceMappingURL=trackManager.d.ts.map

package/dist/trackManager.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"trackManager.d.ts","sourceRoot":"","sources":["../src/trackManager.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAwC,MAAM,0BAA0B,CAAC;AACpG,OAAO,KAAK,EAAE,YAAY,EAAE,YAAY,EAAE,YAAY,EAAE,aAAa,EAAmB,MAAM,SAAS,CAAC;AAKxG,UAAU,kBAAkB;IAC1B,YAAY,EAAE,YAAY,CAAC;IAC3B,QAAQ,EAAE,aAAa,CAAC,YAAY,EAAE,aAAa,CAAC,CAAC;CACtD;AAOD,eAAO,MAAM,eAAe,+BAAgC,kBAAkB,KAAG,YA6IhF,CAAC"}

package/dist/trackManager.js

@@ -1,116 +0,0 @@
-import { getRemoteOrLocalTrack } from "./utils/track";
-import { useEffect, useState } from "react";
-const TRACK_TYPE_TO_DEVICE = {
-    video: "camera",
-    audio: "microphone",
-};
-export const useTrackManager = ({ mediaManager, tsClient }) => {
-    const [currentTrackId, setCurrentTrackId] = useState(null);
-    const [paused, setPaused] = useState(false);
-    const [currentTrackMiddleware, setCurrentTrackMiddleware] = useState(null);
-    const type = TRACK_TYPE_TO_DEVICE[mediaManager.getDeviceType()];
-    const metadata = { type, paused };
-    useEffect(() => {
-        const disconnectedHandler = () => {
-            setCurrentTrackId(null);
-        };
-        tsClient.on("disconnected", disconnectedHandler);
-        return () => {
-            tsClient.off("disconnected", disconnectedHandler);
-        };
-    }, [tsClient]);
-    function getPreviousTrack() {
-        if (!currentTrackId)
-            throw Error("There is no current track id");
-        const prevTrack = getRemoteOrLocalTrack(tsClient, currentTrackId);
-        if (!prevTrack)
-            throw Error("There is no previous track");
-        return prevTrack;
-    }
-    async function setTrackMiddleware(middleware) {
-        const currentTrack = getCurrentTrack();
-        const mediaTrack = mediaManager.getTracks()[0];
-        if (!currentTrack || !mediaTrack)
-            return;
-        const trackToSet = middleware ? middleware(mediaTrack) : mediaTrack;
-        await tsClient.replaceTrack(currentTrack.trackId, trackToSet);
-        setCurrentTrackMiddleware(() => middleware);
-    }
-    function getCurrentTrack() {
-        return getRemoteOrLocalTrack(tsClient, currentTrackId);
-    }
-    function initialize(deviceId) {
-        return mediaManager?.start(deviceId ?? true);
-    }
-    function stop() {
-        return mediaManager?.stop();
-    }
-    async function startStreaming(simulcastConfig, maxBandwidth) {
-        if (currentTrackId)
-            throw Error("Track already added");
-        const media = mediaManager.getMedia();
-        if (!media || !media.stream || !media.track)
-            throw Error("Device is unavailable");
-        const track = getRemoteOrLocalTrack(tsClient, currentTrackId);
-        if (track)
-            return track.trackId;
-        // see `getRemoteOrLocalTrackContext()` explanation
-        setCurrentTrackId(media.track.id);
-        const trackMetadata = { ...metadata, paused: false };
-        const remoteTrackId = await tsClient.addTrack(media.track, trackMetadata, simulcastConfig, maxBandwidth);
-        setCurrentTrackId(remoteTrackId);
-        setPaused(false);
-        return remoteTrackId;
-    }
-    function refreshStreamedTrack() {
-        const prevTrack = getPreviousTrack();
-        const newTrack = mediaManager.getTracks()[0];
-        if (!newTrack)
-            throw Error("New track is empty");
-        return tsClient.replaceTrack(prevTrack.trackId, newTrack);
-    }
-    function stopStreaming() {
-        const prevTrack = getPreviousTrack();
-        setCurrentTrackId(null);
-        setPaused(true);
-        return tsClient.removeTrack(prevTrack.trackId);
-    }
-    async function pauseStreaming() {
-        const prevTrack = getPreviousTrack();
-        setPaused(true);
-        await tsClient.replaceTrack(prevTrack.trackId, null);
-        const trackMetadata = { ...metadata, paused: true };
-        return tsClient.updateTrackMetadata(prevTrack.trackId, trackMetadata);
-    }
-    async function resumeStreaming() {
-        const prevTrack = getPreviousTrack();
-        const media = mediaManager.getMedia();
-        if (!media)
-            throw Error("Device is unavailable");
-        setPaused(false);
-        await tsClient.replaceTrack(prevTrack.trackId, media.track);
-        const trackMetadata = { ...metadata, paused: false };
-        return tsClient.updateTrackMetadata(prevTrack.trackId, trackMetadata);
-    }
-    function disableTrack() {
-        mediaManager.disable();
-    }
-    function enableTrack() {
-        mediaManager.enable();
-    }
-    return {
-        getCurrentTrack,
-        setTrackMiddleware,
-        initialize,
-        stop,
-        startStreaming,
-        stopStreaming,
-        pauseStreaming,
-        resumeStreaming,
-        disableTrack,
-        enableTrack,
-        currentTrackMiddleware,
-        refreshStreamedTrack,
-        paused,
-    };
-};