File size: 3,110 Bytes
ff9325e
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
import { writable, type Writable } from 'svelte/store';

export enum MediaStreamStatus {
    INIT = "init",
    CONNECTED = "connected",
    DISCONNECTED = "disconnected",
}
export const onFrameChangeStore: Writable<{ now: Number, metadata: VideoFrameCallbackMetadata, blob: Blob }> = writable();
export const isMediaStreaming = writable(MediaStreamStatus.INIT);

interface mediaStream {
    mediaStream: MediaStream | null;
    status: MediaStreamStatus
    devices: MediaDeviceInfo[];
}

const initialState: mediaStream = {
    mediaStream: null,
    status: MediaStreamStatus.INIT,
    devices: [],
};

export const mediaStreamState = writable(initialState);

export const mediaStreamActions = {
    async enumerateDevices() {
        console.log("Enumerating devices");
        await navigator.mediaDevices.enumerateDevices()
            .then(devices => {
                const cameras = devices.filter(device => device.kind === 'videoinput');
                console.log("Cameras: ", cameras);
                mediaStreamState.update((state) => ({
                    ...state,
                    devices: cameras,
                }));
            })
            .catch(err => {
                console.error(err);
            });
    },
    async start(mediaDevicedID?: string) {
        const constraints = {
            audio: false,
            video: {
                width: 1024, height: 1024, deviceId: mediaDevicedID
            }
        };

        await navigator.mediaDevices
            .getUserMedia(constraints)
            .then((mediaStream) => {
                mediaStreamState.update((state) => ({
                    ...state,
                    mediaStream: mediaStream,
                    status: MediaStreamStatus.CONNECTED,
                }));
                isMediaStreaming.set(MediaStreamStatus.CONNECTED);
            })
            .catch((err) => {
                console.error(`${err.name}: ${err.message}`);
                isMediaStreaming.set(MediaStreamStatus.DISCONNECTED);
            });
    },
    async switchCamera(mediaDevicedID: string) {
        const constraints = {
            audio: false,
            video: { width: 1024, height: 1024, deviceId: mediaDevicedID }
        };
        await navigator.mediaDevices
            .getUserMedia(constraints)
            .then((mediaStream) => {
                mediaStreamState.update((state) => ({
                    ...state,
                    mediaStream: mediaStream,
                    status: MediaStreamStatus.CONNECTED,
                }));
            })
            .catch((err) => {
                console.error(`${err.name}: ${err.message}`);
            });
    },
    async stop() {
        navigator.mediaDevices.getUserMedia({ video: true }).then((mediaStream) => {
            mediaStream.getTracks().forEach((track) => track.stop());
        });
        mediaStreamState.update((state) => ({
            ...state,
            mediaStream: null,
            status: MediaStreamStatus.DISCONNECTED,
        }));
        isMediaStreaming.set(MediaStreamStatus.DISCONNECTED);
    },
};