queue working?
This commit is contained in:
@@ -1,9 +1,7 @@
|
|||||||
import {
|
import {
|
||||||
ConnectToLineRequest,
|
ConnectToLineRequest,
|
||||||
RtcAnswerRequest,
|
RtcReceiveSignalResponse,
|
||||||
RtcCallRequest,
|
RtcSendSignalRequest,
|
||||||
RtcNewUserResponse,
|
|
||||||
RtcReceiveAnswerResponse,
|
|
||||||
ServerRequestChannels,
|
ServerRequestChannels,
|
||||||
ServerResponseChannels,
|
ServerResponseChannels,
|
||||||
SomeoneConnectedResponse,
|
SomeoneConnectedResponse,
|
||||||
@@ -154,21 +152,12 @@ export default function InitializeWs(io: any) {
|
|||||||
});
|
});
|
||||||
|
|
||||||
// tell the proper other user to create a local peer object for the one on one mesh connection
|
// tell the proper other user to create a local peer object for the one on one mesh connection
|
||||||
socket.on(ServerRequestChannels.RTC_CALL_REQUEST, (req: RtcCallRequest) => {
|
socket.on(ServerRequestChannels.RTC_SEND_SIGNAL, (req: RtcSendSignalRequest) => {
|
||||||
const userSocketId = userIdsToSocketIds[req.userIdToCall];
|
const userSocketId = userIdsToSocketIds[req.userToCall];
|
||||||
|
|
||||||
io.to(userSocketId).emit(
|
io.to(userSocketId).emit(
|
||||||
ServerResponseChannels.RTC_NEW_USER_JOINED_RESPONSE,
|
ServerResponseChannels.RTC_RECEIVING_SIGNAL,
|
||||||
new RtcNewUserResponse(userInfo.userId, req.simplePeerSignal),
|
new RtcReceiveSignalResponse(userInfo.userId, req.simplePeerSignal),
|
||||||
);
|
|
||||||
});
|
|
||||||
|
|
||||||
socket.on(ServerRequestChannels.RTC_ANSWER_REQUEST, (req: RtcAnswerRequest) => {
|
|
||||||
const userSocketId = userIdsToSocketIds[req.userIdToCall];
|
|
||||||
|
|
||||||
io.to(userSocketId).emit(
|
|
||||||
ServerResponseChannels.RTC_RECEIVING_ANSWER_RESPONSE,
|
|
||||||
new RtcReceiveAnswerResponse(userInfo.userId, req.simplePeerSignal),
|
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
@@ -42,8 +42,7 @@ export enum ServerRequestChannels {
|
|||||||
BROADCAST_TO_LINE = 'BROADCAST_TO_LINE',
|
BROADCAST_TO_LINE = 'BROADCAST_TO_LINE',
|
||||||
STOP_BROADCAST_TO_LINE = 'STOP_BROADCAST_TO_LINE',
|
STOP_BROADCAST_TO_LINE = 'STOP_BROADCAST_TO_LINE',
|
||||||
|
|
||||||
RTC_CALL_REQUEST = 'RTC_CALL_PREFIX',
|
RTC_SEND_SIGNAL = 'RTC_SEND_SIGNAL',
|
||||||
RTC_ANSWER_REQUEST = 'RTC_ANSWER_REQUEST_PREFIX',
|
|
||||||
|
|
||||||
GOING_INTO_FLOW_STATE = 'GOING_INTO_FLOW_STATE',
|
GOING_INTO_FLOW_STATE = 'GOING_INTO_FLOW_STATE',
|
||||||
}
|
}
|
||||||
@@ -59,8 +58,7 @@ export enum ServerResponseChannels {
|
|||||||
SOMEONE_STOPPED_BROADCASTING = 'SOMEONE_STOPPED_BROADCASTING', // stop showing their stream tracks
|
SOMEONE_STOPPED_BROADCASTING = 'SOMEONE_STOPPED_BROADCASTING', // stop showing their stream tracks
|
||||||
|
|
||||||
// sending to the correct room of tunedin folks AND also making sure it's the right event handler in the right handler for this component
|
// sending to the correct room of tunedin folks AND also making sure it's the right event handler in the right handler for this component
|
||||||
RTC_NEW_USER_JOINED_RESPONSE = 'RTC_NEW_USER_JOINED_RESPONSE',
|
RTC_RECEIVING_SIGNAL = 'RTC_RECEIVING_SIGNAL',
|
||||||
RTC_RECEIVING_ANSWER_RESPONSE = 'RTC_RECEIVING_ANSWER_RESPONSE',
|
|
||||||
|
|
||||||
SOMEONE_GOING_INTO_FLOW_STATE = 'SOMEONE_GOING_INTO_FLOW_STATE',
|
SOMEONE_GOING_INTO_FLOW_STATE = 'SOMEONE_GOING_INTO_FLOW_STATE',
|
||||||
}
|
}
|
||||||
@@ -109,20 +107,12 @@ export class SocketEmitter<T> {
|
|||||||
constructor(public channel: SocketChannels, data: T) {}
|
constructor(public channel: SocketChannels, data: T) {}
|
||||||
}
|
}
|
||||||
|
|
||||||
export class RtcCallRequest {
|
export class RtcSendSignalRequest {
|
||||||
constructor(public userIdToCall: string, public simplePeerSignal: any) {}
|
constructor(public userToCall: string, public simplePeerSignal: any) {}
|
||||||
}
|
}
|
||||||
|
|
||||||
export class RtcNewUserResponse {
|
export class RtcReceiveSignalResponse {
|
||||||
constructor(public newUserId: string, public simplePeerSignal: any) {}
|
constructor(public senderUserId: string, public simplePeerSignal: any) {}
|
||||||
}
|
|
||||||
|
|
||||||
export class RtcAnswerRequest {
|
|
||||||
constructor(public userIdToCall: string, public simplePeerSignal: any) {}
|
|
||||||
}
|
|
||||||
|
|
||||||
export class RtcReceiveAnswerResponse {
|
|
||||||
constructor(public answererUserId: string, public simplePeerSignal: any) {}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export class FlowStateRequest {
|
export class FlowStateRequest {
|
||||||
|
|||||||
@@ -26,13 +26,11 @@ import useAuth from './AuthProvider';
|
|||||||
import { Updater, useImmer } from 'use-immer';
|
import { Updater, useImmer } from 'use-immer';
|
||||||
import useSockets from './SocketProvider';
|
import useSockets from './SocketProvider';
|
||||||
import {
|
import {
|
||||||
RtcAnswerRequest,
|
RtcReceiveSignalResponse,
|
||||||
RtcCallRequest,
|
RtcSendSignalRequest,
|
||||||
RtcNewUserResponse,
|
|
||||||
RtcReceiveAnswerResponse,
|
|
||||||
ServerRequestChannels,
|
ServerRequestChannels,
|
||||||
|
ServerResponseChannels,
|
||||||
} from '@nirvana/core/sockets/channels';
|
} from '@nirvana/core/sockets/channels';
|
||||||
import { ServerResponseChannels } from '../../../core/sockets/channels';
|
|
||||||
import toast from 'react-hot-toast';
|
import toast from 'react-hot-toast';
|
||||||
import { usePrevious } from 'react-use';
|
import { usePrevious } from 'react-use';
|
||||||
|
|
||||||
@@ -54,6 +52,7 @@ export function StreamProvider({ children }: { children: React.ReactChild }) {
|
|||||||
const { $ws } = useSockets();
|
const { $ws } = useSockets();
|
||||||
|
|
||||||
const [peerMap, updatePeerMap] = useImmer<PeerMap>({});
|
const [peerMap, updatePeerMap] = useImmer<PeerMap>({});
|
||||||
|
const [incomingSignals, updateIncomingSignals] = useImmer<{ [peerUserId: string]: any }>({});
|
||||||
|
|
||||||
const [userLocalStream, setUserLocalStream] = useState<MediaStream>();
|
const [userLocalStream, setUserLocalStream] = useState<MediaStream>();
|
||||||
const localStreamRef = useRef<HTMLVideoElement>(null);
|
const localStreamRef = useRef<HTMLVideoElement>(null);
|
||||||
@@ -103,54 +102,33 @@ export function StreamProvider({ children }: { children: React.ReactChild }) {
|
|||||||
|
|
||||||
console.log(`peer map: `, peerMap);
|
console.log(`peer map: `, peerMap);
|
||||||
|
|
||||||
|
// on changes of the peer map ("we called someone and created local peer connection"), see if we have an incoming signal
|
||||||
|
// and set signal if we have already gotten it and remove from the signals if used
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
$ws.on(
|
if (Object.keys(incomingSignals).length > 0) {
|
||||||
ServerResponseChannels.RTC_RECEIVING_ANSWER_RESPONSE,
|
Object.entries(peerMap).map(([userId, peer]) => {
|
||||||
(res: RtcReceiveAnswerResponse) => {
|
if (incomingSignals[userId]) {
|
||||||
console.log(`oooo some master received my call and accepted it ${JSON.stringify(res)}`);
|
peer.signal(incomingSignals[userId]);
|
||||||
|
|
||||||
// find the peer we created earlier for this master
|
updateIncomingSignals((draft) => {
|
||||||
// ?is this okay? using the setter to get the current state?
|
delete draft[userId];
|
||||||
updatePeerMap((draft) => {
|
});
|
||||||
const peerForAnswerer = draft[res.answererUserId];
|
}
|
||||||
|
|
||||||
if (peerForAnswerer) {
|
|
||||||
peerForAnswerer.signal(res.simplePeerSignal);
|
|
||||||
} else {
|
|
||||||
toast.error('could not find the peer we created before for this master');
|
|
||||||
}
|
|
||||||
});
|
|
||||||
},
|
|
||||||
);
|
|
||||||
|
|
||||||
$ws.on(ServerResponseChannels.RTC_NEW_USER_JOINED_RESPONSE, (res: RtcNewUserResponse) => {
|
|
||||||
console.log('ooo newbie joined room, I guess I will accept it and send him my signal');
|
|
||||||
|
|
||||||
const peerForMeAndNewbie = new Peer({
|
|
||||||
initiator: false,
|
|
||||||
trickle: false, // prevents the multiple tries on different ice servers and signal from getting called a bunch of times
|
|
||||||
});
|
});
|
||||||
|
}
|
||||||
|
}, [peerMap, incomingSignals, updateIncomingSignals]);
|
||||||
|
|
||||||
peerForMeAndNewbie.on('signal', (signal) => {
|
useEffect(() => {
|
||||||
console.log(
|
$ws.on(ServerResponseChannels.RTC_RECEIVING_SIGNAL, (res: RtcReceiveSignalResponse) => {
|
||||||
'as the answerer, I am going to send back my signal so that the newbie can update his local peer for me',
|
console.log(`getting signal from someone`, res);
|
||||||
);
|
|
||||||
$ws.emit(
|
|
||||||
ServerRequestChannels.RTC_ANSWER_REQUEST,
|
|
||||||
new RtcAnswerRequest(res.newUserId, signal),
|
|
||||||
);
|
|
||||||
});
|
|
||||||
|
|
||||||
peerForMeAndNewbie.signal(res.simplePeerSignal);
|
updateIncomingSignals((draft) => {
|
||||||
|
draft[res.senderUserId] = res.simplePeerSignal;
|
||||||
updatePeerMap((draft) => {
|
|
||||||
draft[res.newUserId] = peerForMeAndNewbie;
|
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
return () => {
|
return () => {
|
||||||
$ws.removeListener(ServerResponseChannels.RTC_RECEIVING_ANSWER_RESPONSE);
|
$ws.removeListener(ServerResponseChannels.RTC_RECEIVING_SIGNAL);
|
||||||
$ws.removeListener(ServerResponseChannels.RTC_NEW_USER_JOINED_RESPONSE);
|
|
||||||
};
|
};
|
||||||
}, [$ws]);
|
}, [$ws]);
|
||||||
|
|
||||||
@@ -218,7 +196,10 @@ function StreamConnector({
|
|||||||
|
|
||||||
localPeerConnection.on('signal', (signal) => {
|
localPeerConnection.on('signal', (signal) => {
|
||||||
console.log('going to call someone');
|
console.log('going to call someone');
|
||||||
$ws.emit(ServerRequestChannels.RTC_CALL_REQUEST, new RtcCallRequest(peerUserId, signal));
|
$ws.emit(
|
||||||
|
ServerRequestChannels.RTC_SEND_SIGNAL,
|
||||||
|
new RtcSendSignalRequest(peerUserId, signal),
|
||||||
|
);
|
||||||
});
|
});
|
||||||
|
|
||||||
// sending back the connection to the parent for everyone
|
// sending back the connection to the parent for everyone
|
||||||
|
|||||||
Reference in New Issue
Block a user