2021-05-12 09:13:25 +02:00
|
|
|
import type * as SimplePeerNamespace from "simple-peer";
|
2020-08-20 16:56:10 +02:00
|
|
|
import {mediaManager} from "./MediaManager";
|
2021-02-08 20:46:26 +01:00
|
|
|
import {STUN_SERVER, TURN_PASSWORD, TURN_SERVER, TURN_USER} from "../Enum/EnvironmentVariable";
|
2021-05-12 09:13:25 +02:00
|
|
|
import type {RoomConnection} from "../Connexion/RoomConnection";
|
2021-02-02 18:19:51 +01:00
|
|
|
import {blackListManager} from "./BlackListManager";
|
2021-05-12 09:13:25 +02:00
|
|
|
import type {Subscription} from "rxjs";
|
|
|
|
import type {UserSimplePeerInterface} from "./SimplePeer";
|
2021-06-15 14:45:01 +02:00
|
|
|
import {get, readable, Readable} from "svelte/store";
|
2021-05-19 11:17:43 +02:00
|
|
|
import {obtainedMediaConstraintStore} from "../Stores/MediaStore";
|
2021-06-11 11:29:36 +02:00
|
|
|
import {DivImportance} from "./LayoutManager";
|
2021-06-15 15:40:35 +02:00
|
|
|
import {discussionManager} from "./DiscussionManager";
|
2020-08-20 16:56:10 +02:00
|
|
|
|
|
|
|
const Peer: SimplePeerNamespace.SimplePeer = require('simple-peer');
|
|
|
|
|
2020-10-25 21:59:14 +01:00
|
|
|
export const MESSAGE_TYPE_CONSTRAINT = 'constraint';
|
|
|
|
export const MESSAGE_TYPE_MESSAGE = 'message';
|
2021-02-02 18:19:51 +01:00
|
|
|
export const MESSAGE_TYPE_BLOCKED = 'blocked';
|
|
|
|
export const MESSAGE_TYPE_UNBLOCKED = 'unblocked';
|
2020-08-20 16:56:10 +02:00
|
|
|
/**
|
|
|
|
* A peer connection used to transmit video / audio signals between 2 peers.
|
|
|
|
*/
|
|
|
|
export class VideoPeer extends Peer {
|
2020-10-20 18:02:44 +02:00
|
|
|
public toClose: boolean = false;
|
|
|
|
public _connected: boolean = false;
|
2021-02-02 18:19:51 +01:00
|
|
|
private remoteStream!: MediaStream;
|
|
|
|
private blocked: boolean = false;
|
2021-06-11 11:29:36 +02:00
|
|
|
public readonly userId: number;
|
|
|
|
public readonly uniqueId: string;
|
2021-02-02 18:19:51 +01:00
|
|
|
private onBlockSubscribe: Subscription;
|
|
|
|
private onUnBlockSubscribe: Subscription;
|
2021-06-11 11:29:36 +02:00
|
|
|
public readonly streamStore: Readable<MediaStream | null>;
|
|
|
|
public readonly statusStore: Readable<"connecting" | "connected" | "error" | "closed">;
|
|
|
|
public readonly constraintsStore: Readable<MediaStreamConstraints|null>;
|
2021-02-02 18:19:51 +01:00
|
|
|
|
2021-06-11 11:29:36 +02:00
|
|
|
constructor(public user: UserSimplePeerInterface, initiator: boolean, public readonly userName: string, private connection: RoomConnection, localStream: MediaStream | null) {
|
2020-08-20 16:56:10 +02:00
|
|
|
super({
|
|
|
|
initiator: initiator ? initiator : false,
|
2021-04-19 13:28:17 +02:00
|
|
|
//reconnectTimer: 10000,
|
2020-08-20 16:56:10 +02:00
|
|
|
config: {
|
|
|
|
iceServers: [
|
|
|
|
{
|
2021-02-08 20:46:26 +01:00
|
|
|
urls: STUN_SERVER.split(',')
|
2020-08-20 16:56:10 +02:00
|
|
|
},
|
2021-02-16 18:13:30 +01:00
|
|
|
TURN_SERVER !== '' ? {
|
2020-08-28 16:29:21 +02:00
|
|
|
urls: TURN_SERVER.split(','),
|
2021-02-16 09:58:08 +01:00
|
|
|
username: user.webRtcUser || TURN_USER,
|
|
|
|
credential: user.webRtcPassword || TURN_PASSWORD
|
2021-02-16 18:13:30 +01:00
|
|
|
} : undefined,
|
|
|
|
].filter((value) => value !== undefined)
|
2020-08-20 16:56:10 +02:00
|
|
|
}
|
|
|
|
});
|
2021-02-16 18:13:30 +01:00
|
|
|
|
2021-02-02 18:19:51 +01:00
|
|
|
this.userId = user.userId;
|
2021-06-11 11:29:36 +02:00
|
|
|
this.uniqueId = 'video_'+this.userId;
|
|
|
|
|
|
|
|
this.streamStore = readable<MediaStream|null>(null, (set) => {
|
|
|
|
const onStream = (stream: MediaStream|null) => {
|
|
|
|
set(stream);
|
|
|
|
};
|
|
|
|
const onData = (chunk: Buffer) => {
|
|
|
|
this.on('data', (chunk: Buffer) => {
|
|
|
|
const message = JSON.parse(chunk.toString('utf8'));
|
|
|
|
if (message.type === MESSAGE_TYPE_CONSTRAINT) {
|
|
|
|
if (!message.video) {
|
|
|
|
set(null);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
this.on('stream', onStream);
|
|
|
|
this.on('data', onData);
|
|
|
|
|
|
|
|
return () => {
|
|
|
|
this.off('stream', onStream);
|
|
|
|
this.off('data', onData);
|
|
|
|
};
|
|
|
|
});
|
|
|
|
|
|
|
|
this.constraintsStore = readable<MediaStreamConstraints|null>(null, (set) => {
|
|
|
|
const onData = (chunk: Buffer) => {
|
|
|
|
const message = JSON.parse(chunk.toString('utf8'));
|
|
|
|
if(message.type === MESSAGE_TYPE_CONSTRAINT) {
|
|
|
|
set(message);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
this.on('data', onData);
|
|
|
|
|
|
|
|
return () => {
|
|
|
|
this.off('data', onData);
|
|
|
|
};
|
|
|
|
});
|
|
|
|
|
|
|
|
this.statusStore = readable<"connecting" | "connected" | "error" | "closed">("connecting", (set) => {
|
|
|
|
const onConnect = () => {
|
|
|
|
set('connected');
|
|
|
|
};
|
|
|
|
const onError = () => {
|
|
|
|
set('error');
|
|
|
|
};
|
|
|
|
const onClose = () => {
|
|
|
|
set('closed');
|
|
|
|
};
|
|
|
|
|
|
|
|
this.on('connect', onConnect);
|
|
|
|
this.on('error', onError);
|
|
|
|
this.on('close', onClose);
|
|
|
|
|
|
|
|
return () => {
|
|
|
|
this.off('connect', onConnect);
|
|
|
|
this.off('error', onError);
|
|
|
|
this.off('close', onClose);
|
|
|
|
};
|
|
|
|
});
|
2020-08-28 16:29:21 +02:00
|
|
|
|
2020-08-20 16:56:10 +02:00
|
|
|
//start listen signal for the peer connection
|
|
|
|
this.on('signal', (data: unknown) => {
|
|
|
|
this.sendWebrtcSignal(data);
|
|
|
|
});
|
|
|
|
|
2021-02-02 18:19:51 +01:00
|
|
|
this.on('stream', (stream: MediaStream) => this.stream(stream));
|
2020-08-20 16:56:10 +02:00
|
|
|
|
|
|
|
this.on('close', () => {
|
2020-10-20 18:02:44 +02:00
|
|
|
this._connected = false;
|
|
|
|
this.toClose = true;
|
2020-08-20 22:23:22 +02:00
|
|
|
this.destroy();
|
2020-08-20 16:56:10 +02:00
|
|
|
});
|
|
|
|
|
|
|
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
|
|
this.on('error', (err: any) => {
|
|
|
|
console.error(`error => ${this.userId} => ${err.code}`, err);
|
2021-02-02 18:19:51 +01:00
|
|
|
mediaManager.isError("" + this.userId);
|
2020-08-20 16:56:10 +02:00
|
|
|
});
|
|
|
|
|
|
|
|
this.on('connect', () => {
|
2020-10-20 18:02:44 +02:00
|
|
|
this._connected = true;
|
2020-08-20 16:56:10 +02:00
|
|
|
});
|
|
|
|
|
|
|
|
this.on('data', (chunk: Buffer) => {
|
2020-10-25 21:59:14 +01:00
|
|
|
const message = JSON.parse(chunk.toString('utf8'));
|
|
|
|
if(message.type === MESSAGE_TYPE_CONSTRAINT) {
|
2020-11-27 14:51:50 +01:00
|
|
|
if (message.audio) {
|
2020-10-25 21:59:14 +01:00
|
|
|
mediaManager.enabledMicrophoneByUserId(this.userId);
|
|
|
|
} else {
|
|
|
|
mediaManager.disabledMicrophoneByUserId(this.userId);
|
|
|
|
}
|
|
|
|
|
2020-11-27 14:51:50 +01:00
|
|
|
if (message.video || message.screen) {
|
2020-10-25 21:59:14 +01:00
|
|
|
mediaManager.enabledVideoByUserId(this.userId);
|
|
|
|
} else {
|
|
|
|
mediaManager.disabledVideoByUserId(this.userId);
|
|
|
|
}
|
2021-02-02 18:19:51 +01:00
|
|
|
} else if(message.type === MESSAGE_TYPE_MESSAGE) {
|
|
|
|
if (!blackListManager.isBlackListed(message.userId)) {
|
|
|
|
mediaManager.addNewMessage(message.name, message.message);
|
|
|
|
}
|
|
|
|
} else if(message.type === MESSAGE_TYPE_BLOCKED) {
|
2021-02-16 09:58:08 +01:00
|
|
|
//FIXME when A blacklists B, the output stream from A is muted in B's js client. This is insecure since B can manipulate the code to unmute A stream.
|
2021-02-02 18:19:51 +01:00
|
|
|
// Find a way to block A's output stream in A's js client
|
|
|
|
//However, the output stream stream B is correctly blocked in A client
|
|
|
|
this.blocked = true;
|
|
|
|
this.toggleRemoteStream(false);
|
|
|
|
} else if(message.type === MESSAGE_TYPE_UNBLOCKED) {
|
|
|
|
this.blocked = false;
|
|
|
|
this.toggleRemoteStream(true);
|
2020-08-20 16:56:10 +02:00
|
|
|
}
|
|
|
|
});
|
|
|
|
|
2020-10-20 18:02:44 +02:00
|
|
|
this.once('finish', () => {
|
|
|
|
this._onFinish();
|
|
|
|
});
|
|
|
|
|
2021-05-29 22:34:38 +02:00
|
|
|
this.pushVideoToRemoteUser(localStream);
|
2021-02-02 18:19:51 +01:00
|
|
|
this.onBlockSubscribe = blackListManager.onBlockStream.subscribe((userId) => {
|
|
|
|
if (userId === this.userId) {
|
|
|
|
this.toggleRemoteStream(false);
|
|
|
|
this.sendBlockMessage(true);
|
|
|
|
}
|
|
|
|
});
|
|
|
|
this.onUnBlockSubscribe = blackListManager.onUnBlockStream.subscribe((userId) => {
|
|
|
|
if (userId === this.userId) {
|
|
|
|
this.toggleRemoteStream(true);
|
|
|
|
this.sendBlockMessage(false);
|
|
|
|
}
|
|
|
|
});
|
2021-02-16 09:58:08 +01:00
|
|
|
|
2021-02-02 18:19:51 +01:00
|
|
|
if (blackListManager.isBlackListed(this.userId)) {
|
|
|
|
this.sendBlockMessage(true)
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
private sendBlockMessage(blocking: boolean) {
|
|
|
|
this.write(new Buffer(JSON.stringify({type: blocking ? MESSAGE_TYPE_BLOCKED : MESSAGE_TYPE_UNBLOCKED, name: this.userName.toUpperCase(), userId: this.userId, message: ''})));
|
|
|
|
}
|
|
|
|
|
|
|
|
private toggleRemoteStream(enable: boolean) {
|
|
|
|
this.remoteStream.getTracks().forEach(track => track.enabled = enable);
|
|
|
|
mediaManager.toggleBlockLogo(this.userId, !enable);
|
2020-08-20 16:56:10 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
private sendWebrtcSignal(data: unknown) {
|
|
|
|
try {
|
|
|
|
this.connection.sendWebrtcSignal(data, this.userId);
|
|
|
|
}catch (e) {
|
|
|
|
console.error(`sendWebrtcSignal => ${this.userId}`, e);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Sends received stream to screen.
|
|
|
|
*/
|
2020-11-27 14:51:50 +01:00
|
|
|
private stream(stream: MediaStream) {
|
|
|
|
try {
|
2021-02-02 18:19:51 +01:00
|
|
|
this.remoteStream = stream;
|
|
|
|
if (blackListManager.isBlackListed(this.userId) || this.blocked) {
|
|
|
|
this.toggleRemoteStream(false);
|
|
|
|
}
|
2020-11-27 14:51:50 +01:00
|
|
|
}catch (err){
|
|
|
|
console.error(err);
|
2020-08-20 16:56:10 +02:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* This is triggered twice. Once by the server, and once by a remote client disconnecting
|
|
|
|
*/
|
2020-08-20 22:23:22 +02:00
|
|
|
public destroy(error?: Error): void {
|
2020-08-20 16:56:10 +02:00
|
|
|
try {
|
2020-10-20 18:02:44 +02:00
|
|
|
this._connected = false
|
|
|
|
if(!this.toClose){
|
|
|
|
return;
|
|
|
|
}
|
2021-02-02 18:19:51 +01:00
|
|
|
this.onBlockSubscribe.unsubscribe();
|
|
|
|
this.onUnBlockSubscribe.unsubscribe();
|
2021-06-15 15:40:35 +02:00
|
|
|
discussionManager.removeParticipant(this.userId);
|
2020-08-20 16:56:10 +02:00
|
|
|
// FIXME: I don't understand why "Closing connection with" message is displayed TWICE before "Nb users in peerConnectionArray"
|
|
|
|
// I do understand the method closeConnection is called twice, but I don't understand how they manage to run in parallel.
|
2020-08-20 22:23:22 +02:00
|
|
|
super.destroy(error);
|
2020-08-20 16:56:10 +02:00
|
|
|
} catch (err) {
|
2020-08-20 22:23:22 +02:00
|
|
|
console.error("VideoPeer::destroy", err)
|
2020-08-20 16:56:10 +02:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2020-10-20 18:02:44 +02:00
|
|
|
_onFinish () {
|
|
|
|
if (this.destroyed) return
|
|
|
|
const destroySoon = () => {
|
|
|
|
this.destroy();
|
|
|
|
}
|
|
|
|
if (this._connected) {
|
|
|
|
destroySoon();
|
|
|
|
} else {
|
|
|
|
this.once('connect', destroySoon);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2021-05-29 22:34:38 +02:00
|
|
|
private pushVideoToRemoteUser(localStream: MediaStream | null) {
|
2020-08-20 16:56:10 +02:00
|
|
|
try {
|
2021-05-19 11:17:43 +02:00
|
|
|
this.write(new Buffer(JSON.stringify({type: MESSAGE_TYPE_CONSTRAINT, ...get(obtainedMediaConstraintStore)})));
|
2020-08-20 16:56:10 +02:00
|
|
|
|
|
|
|
if(!localStream){
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
|
|
|
for (const track of localStream.getTracks()) {
|
|
|
|
this.addTrack(track, localStream);
|
|
|
|
}
|
|
|
|
}catch (e) {
|
|
|
|
console.error(`pushVideoToRemoteUser => ${this.userId}`, e);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|