abner/for-legacy-web
1
0
Fork 1
mirror of https://github.com/stoatchat/for-legacy-web.git synced 2026-03-06 17:11:55 +00:00
Code Issues Packages Projects Releases Wiki Activity

Re-write voice context. Working towards #21

Browse Source
This commit is contained in:
Paul
2021-08-07 16:15:55 +01:00
parent 0fe154c651
commit 4ec1ff5c59
7 changed files with 195 additions and 325 deletions
Download Patch File Download Diff File Expand all files Collapse all files

213
src/context/Voice.tsx
View File

@@ -1,213 +0,0 @@
import { Channel } from "revolt.js/dist/maps/Channels";
import { createContext } from "preact";
import {
useCallback,
useContext,
useEffect,
useMemo,
useRef,
useState,
} from "preact/hooks";
import type { ProduceType, VoiceUser } from "../lib/vortex/Types";
import type VoiceClient from "../lib/vortex/VoiceClient";
import { Children } from "../types/Preact";
import { SoundContext } from "./Settings";
export enum VoiceStatus {
LOADING = 0,
UNAVAILABLE,
ERRORED,
READY = 3,
CONNECTING = 4,
AUTHENTICATING,
RTC_CONNECTING,
CONNECTED,
// RECONNECTING
}
export interface VoiceOperations {
connect: (channel: Channel) => Promise<Channel>;
disconnect: () => void;
isProducing: (type: ProduceType) => boolean;
startProducing: (type: ProduceType) => Promise<void>;
stopProducing: (type: ProduceType) => Promise<void> | undefined;
}
export interface VoiceState {
roomId?: string;
status: VoiceStatus;
participants?: Readonly<Map<string, VoiceUser>>;
}
// They should be present from first render. - insert's words
export const VoiceContext = createContext<VoiceState>(null!);
export const VoiceOperationsContext = createContext<VoiceOperations>(null!);
type Props = {
children: Children;
};
export default function Voice({ children }: Props) {
const [client, setClient] = useState<VoiceClient | undefined>(undefined);
const [state, setState] = useState<VoiceState>({
status: VoiceStatus.LOADING,
participants: new Map(),
});
const setStatus = useCallback(
(status: VoiceStatus, roomId?: string) => {
setState({
status,
roomId: roomId ?? client?.roomId,
participants: client?.participants ?? new Map(),
});
},
// eslint-disable-next-line
[],
);
useEffect(() => {
import("../lib/vortex/VoiceClient")
.then(({ default: VoiceClient }) => {
const client = new VoiceClient();
setClient(client);
if (!client?.supported()) {
setStatus(VoiceStatus.UNAVAILABLE);
} else {
setStatus(VoiceStatus.READY);
}
})
.catch((err) => {
console.error("Failed to load voice library!", err);
setStatus(VoiceStatus.UNAVAILABLE);
});
// eslint-disable-next-line
}, []);
const isConnecting = useRef(false);
const operations: VoiceOperations = useMemo(() => {
return {
connect: async (channel) => {
if (!client?.supported()) throw new Error("RTC is unavailable");
isConnecting.current = true;
setStatus(VoiceStatus.CONNECTING, channel._id);
try {
const call = await channel.joinCall();
if (!isConnecting.current) {
setStatus(VoiceStatus.READY);
return channel;
}
// ! TODO: use configuration to check if voso is enabled
// await client.connect("wss://voso.revolt.chat/ws");
await client.connect(
"wss://voso.revolt.chat/ws",
channel._id,
);
setStatus(VoiceStatus.AUTHENTICATING);
await client.authenticate(call.token);
setStatus(VoiceStatus.RTC_CONNECTING);
await client.initializeTransports();
} catch (error) {
console.error(error);
setStatus(VoiceStatus.READY);
return channel;
}
setStatus(VoiceStatus.CONNECTED);
isConnecting.current = false;
return channel;
},
disconnect: () => {
if (!client?.supported()) throw new Error("RTC is unavailable");
// if (status <= VoiceStatus.READY) return;
// this will not update in this context
isConnecting.current = false;
client.disconnect();
setStatus(VoiceStatus.READY);
},
isProducing: (type: ProduceType) => {
switch (type) {
case "audio":
return client?.audioProducer !== undefined;
}
},
startProducing: async (type: ProduceType) => {
switch (type) {
case "audio": {
if (client?.audioProducer !== undefined)
return console.log("No audio producer."); // ! TODO: let the user know
if (navigator.mediaDevices === undefined)
return console.log("No media devices."); // ! TODO: let the user know
const mediaStream =
await navigator.mediaDevices.getUserMedia({
audio: true,
});
await client?.startProduce(
mediaStream.getAudioTracks()[0],
"audio",
);
return;
}
}
},
stopProducing: (type: ProduceType) => {
return client?.stopProduce(type);
},
};
// eslint-disable-next-line
}, [client]);
const playSound = useContext(SoundContext);
useEffect(() => {
if (!client?.supported()) return;
// ! TODO: message for fatal:
// ! get rid of these force updates
// ! handle it through state or smth
function stateUpdate() {
setStatus(state.status);
}
client.on("startProduce", stateUpdate);
client.on("stopProduce", stateUpdate);
client.on("userJoined", stateUpdate);
client.on("userLeft", stateUpdate);
client.on("userStartProduce", stateUpdate);
client.on("userStopProduce", stateUpdate);
client.on("close", stateUpdate);
return () => {
client.removeListener("startProduce", stateUpdate);
client.removeListener("stopProduce", stateUpdate);
client.removeListener("userJoined", stateUpdate);
client.removeListener("userLeft", stateUpdate);
client.removeListener("userStartProduce", stateUpdate);
client.removeListener("userStopProduce", stateUpdate);
client.removeListener("close", stateUpdate);
};
}, [client, state, playSound, setStatus]);
return (
<VoiceContext.Provider value={state}>
<VoiceOperationsContext.Provider value={operations}>
{children}
</VoiceOperationsContext.Provider>
</VoiceContext.Provider>
);
}

5
src/context/index.tsx
View File

@@ -6,7 +6,6 @@ import { Children } from "../types/Preact";
import Locale from "./Locale";
import Settings from "./Settings";
import Theme from "./Theme";
import Voice from "./Voice";
import Intermediate from "./intermediate/Intermediate";
import Client from "./revoltjs/RevoltClient";
@@ -18,9 +17,7 @@ export default function Context({ children }: { children: Children }) {
<Settings>
<Locale>
<Intermediate>
<Client>
<Voice>{children}</Voice>
</Client>
<Client>{children}</Client>
</Intermediate>
</Locale>
</Settings>