File size: 3,571 Bytes
246efdb
ff9325e
cb60b56
3207814
246efdb
 
 
ff9325e
246efdb
 
 
ff9325e
3207814
 
 
ff9325e
 
fe66ec6
 
 
 
 
246efdb
 
 
fe66ec6
 
 
 
 
 
 
 
 
 
 
246efdb
fe66ec6
 
246efdb
fe66ec6
246efdb
 
fe66ec6
ff9325e
fe66ec6
 
 
 
 
 
 
 
 
 
 
 
 
 
 
246efdb
fe66ec6
 
246efdb
fe66ec6
12ffaf3
fe66ec6
12ffaf3
fe66ec6
246efdb
 
fe66ec6
cb60b56
246efdb
fe66ec6
246efdb
fe66ec6
 
 
12ffaf3
fe66ec6
 
246efdb
fe66ec6
 
 
 
 
246efdb
fe66ec6
 
 
 
 
 
 
246efdb
fe66ec6
 
246efdb
fe66ec6
246efdb
 
fe66ec6
246efdb
fe66ec6
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
246efdb
fe66ec6
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
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
import { get, writable, type Writable } from "svelte/store";

const BASE_HEIGHT = 720;
export enum MediaStreamStatusEnum {
  INIT = "init",
  CONNECTED = "connected",
  DISCONNECTED = "disconnected",
}
export const onFrameChangeStore: Writable<{ blob: Blob }> = writable({
  blob: new Blob(),
});

export const mediaDevices = writable<MediaDeviceInfo[]>([]);
export const mediaStreamStatus = writable(MediaStreamStatusEnum.INIT);
export const mediaStream = writable<MediaStream | null>(null);

export const mediaStreamActions = {
  async enumerateDevices() {
    // console.log("Enumerating devices");
    await navigator.mediaDevices
      .enumerateDevices()
      .then((devices) => {
        const cameras = devices.filter(
          (device) => device.kind === "videoinput",
        );
        mediaDevices.set(cameras);
      })
      .catch((err) => {
        console.error(err);
      });
  },
  async start(mediaDevicedID?: string, aspectRatio: number = 1) {
    const constraints = {
      audio: false,
      video: {
        width: {
          ideal: BASE_HEIGHT * aspectRatio,
        },
        height: {
          ideal: BASE_HEIGHT,
        },
        deviceId: mediaDevicedID,
      },
    };

    await navigator.mediaDevices
      .getUserMedia(constraints)
      .then((stream) => {
        mediaStreamStatus.set(MediaStreamStatusEnum.CONNECTED);
        mediaStream.set(stream);
      })
      .catch((err) => {
        console.error(`${err.name}: ${err.message}`);
        mediaStreamStatus.set(MediaStreamStatusEnum.DISCONNECTED);
        mediaStream.set(null);
      });
  },
  async startScreenCapture() {
    const displayMediaOptions = {
      video: {
        displaySurface: "window",
      },
      audio: false,
      surfaceSwitching: "include",
    };

    let captureStream = null;

    try {
      captureStream =
        await navigator.mediaDevices.getDisplayMedia(displayMediaOptions);
      const videoTrack = captureStream.getVideoTracks()[0];

      console.log("Track settings:");
      console.log(JSON.stringify(videoTrack.getSettings(), null, 2));
      console.log("Track constraints:");
      console.log(JSON.stringify(videoTrack.getConstraints(), null, 2));
      mediaStreamStatus.set(MediaStreamStatusEnum.CONNECTED);
      mediaStream.set(captureStream);

      const capabilities = videoTrack.getCapabilities();
      const aspectRatio = capabilities.aspectRatio;
      console.log("Aspect Ratio Constraints:", aspectRatio);
    } catch (err) {
      console.error(err);
    }
  },
  async switchCamera(mediaDevicedID: string, aspectRatio: number) {
    console.log("Switching camera");
    if (get(mediaStreamStatus) !== MediaStreamStatusEnum.CONNECTED) {
      return;
    }
    const constraints = {
      audio: false,
      video: {
        width: {
          ideal: BASE_HEIGHT * aspectRatio,
        },
        height: {
          ideal: BASE_HEIGHT,
        },
        deviceId: mediaDevicedID,
      },
    };
    console.log("Switching camera", constraints);
    await navigator.mediaDevices
      .getUserMedia(constraints)
      .then((stream) => {
        mediaStreamStatus.set(MediaStreamStatusEnum.CONNECTED);
        mediaStream.set(stream);
      })
      .catch((err) => {
        console.error(`${err.name}: ${err.message}`);
      });
  },
  async stop() {
    navigator.mediaDevices.getUserMedia({ video: true }).then((stream) => {
      stream.getTracks().forEach((track) => track.stop());
    });
    mediaStreamStatus.set(MediaStreamStatusEnum.DISCONNECTED);
    mediaStream.set(null);
  },
};