workadventure/front/src/WebRtc/SimplePeer.ts

205 lines
5.9 KiB
TypeScript
Raw Normal View History

2020-04-25 16:05:33 +02:00
import {ConnexionInterface} from "../Connexion";
import {MediaManager} from "./MediaManager";
let Peer = require('simple-peer');
export interface SimplePeerInterface {
}
2020-05-02 20:46:02 +02:00
2020-04-25 16:05:33 +02:00
export class SimplePeer {
private Connexion: ConnexionInterface;
private WebRtcRoomId: string;
private Users: Array<any>;
2020-05-02 20:46:02 +02:00
private MediaManager: MediaManager;
2020-04-25 16:05:33 +02:00
2020-05-02 20:46:02 +02:00
private PeerConnexionArray: Array<any> = new Array<any>();
2020-04-25 16:05:33 +02:00
2020-04-29 17:49:40 +02:00
constructor(Connexion: ConnexionInterface, WebRtcRoomId: string = "test-webrtc") {
2020-04-25 16:05:33 +02:00
this.Connexion = Connexion;
2020-04-29 17:49:40 +02:00
this.WebRtcRoomId = WebRtcRoomId;
2020-04-26 20:55:20 +02:00
this.MediaManager = new MediaManager();
2020-05-02 20:46:02 +02:00
this.PeerConnexionArray = new Array<any>();
2020-04-29 01:40:32 +02:00
this.initialise();
}
/**
* permit to listen when user could start visio
*/
2020-05-02 20:46:02 +02:00
private initialise() {
2020-04-25 16:05:33 +02:00
//receive signal by gemer
this.Connexion.receiveWebrtcSignal((message: string) => {
this.receiveWebrtcSignal(message);
});
2020-04-25 16:05:33 +02:00
2020-05-02 20:46:02 +02:00
this.MediaManager.activeVisio();
this.MediaManager.getCamera().then(() => {
//receive message start
this.Connexion.receiveWebrtcStart((message: string) => {
this.receiveWebrtcStart(message);
});
}).catch((err) => {
console.error("err", err);
2020-04-25 16:05:33 +02:00
});
2020-05-02 20:46:02 +02:00
//receive signal by gemer
this.Connexion.disconnectMessage((message: string) => {
let data = JSON.parse(message);
this.closeConnexion(data.userId);
});
2020-04-25 16:05:33 +02:00
}
/**
*
2020-04-26 17:42:49 +02:00
* @param message
2020-04-25 16:05:33 +02:00
*/
private receiveWebrtcStart(message: string) {
2020-04-25 16:05:33 +02:00
let data = JSON.parse(message);
2020-04-29 17:49:40 +02:00
this.WebRtcRoomId = data.roomId;
2020-04-29 01:40:32 +02:00
this.Users = data.clients;
2020-04-25 16:05:33 +02:00
//start connexion
this.startWebRtc();
2020-04-25 16:05:33 +02:00
}
2020-05-02 20:46:02 +02:00
/**
* server has two person connected, start the meet
*/
private startWebRtc() {
2020-04-29 01:40:32 +02:00
this.Users.forEach((user: any) => {
2020-05-02 20:46:02 +02:00
//if it's not an initiator, peer connexion will be created when gamer will receive offer signal
if(!user.initiator){
2020-04-25 17:14:05 +02:00
return;
}
2020-05-02 20:46:02 +02:00
this.createPeerConnexion(user);
});
}
2020-04-25 20:29:03 +02:00
2020-05-02 20:46:02 +02:00
/**
* create peer connexion to bind users
*/
private createPeerConnexion(user : any) {
if(this.PeerConnexionArray[user.userId]) {
return;
}
2020-05-02 20:46:02 +02:00
this.MediaManager.removeActiveVideo(user.userId);
this.MediaManager.addActiveVideo(user.userId);
this.PeerConnexionArray[user.userId] = new Peer({
initiator: user.initiator ? user.initiator : false,
reconnectTimer: 10000,
config: {
iceServers: [
{
urls: 'stun:stun.l.google.com:19302'
},
{
urls: 'turn:numb.viagenie.ca',
username: 'g.parant@thecodingmachine.com',
credential: 'Muzuvo$6'
},
]
},
});
2020-04-25 17:14:05 +02:00
2020-05-02 20:46:02 +02:00
//start listen signal for the peer connexion
this.PeerConnexionArray[user.userId].on('signal', (data: any) => {
this.sendWebrtcSignal(data, user.userId);
});
2020-04-25 16:05:33 +02:00
2020-05-02 20:46:02 +02:00
this.PeerConnexionArray[user.userId].on('stream', (stream: MediaStream) => {
this.stream(user.userId, stream);
});
2020-04-25 16:05:33 +02:00
2020-05-02 20:46:02 +02:00
this.PeerConnexionArray[user.userId].on('track', (track: MediaStreamTrack, stream: MediaStream) => {
this.stream(user.userId, stream);
});
this.PeerConnexionArray[user.userId].on('close', () => {
this.closeConnexion(user.userId);
});
2020-05-02 20:46:02 +02:00
this.PeerConnexionArray[user.userId].on('error', (err: any) => {
console.error(`error => ${user.userId} => ${err.code}`, err);
2020-04-25 16:05:33 +02:00
});
2020-05-02 20:46:02 +02:00
this.PeerConnexionArray[user.userId].on('connect', () => {
console.info(`connect => ${user.userId}`);
});
this.addMedia(user.userId);
}
2020-05-02 20:46:02 +02:00
private closeConnexion(userId : string) {
try {
this.MediaManager.removeActiveVideo(userId);
if (!this.PeerConnexionArray[(userId as any)]) {
return;
}
// @ts-ignore
this.PeerConnexionArray[(userId as any)].destroy();
this.PeerConnexionArray[(userId as any)] = null;
delete this.PeerConnexionArray[(userId as any)];
} catch (err) {
console.error("closeConnexion", err)
}
2020-04-25 16:05:33 +02:00
}
/**
2020-04-26 17:42:49 +02:00
*
* @param userId
2020-04-25 16:05:33 +02:00
* @param data
*/
private sendWebrtcSignal(data: any, userId : string) {
2020-05-02 20:46:02 +02:00
try {
this.Connexion.sendWebrtcSignal(data, this.WebRtcRoomId, null, userId);
}catch (e) {
console.error(`sendWebrtcSignal => ${userId}`, e);
}
2020-04-25 16:05:33 +02:00
}
/**
*
* @param message
*/
private receiveWebrtcSignal(message: string) {
2020-04-25 16:05:33 +02:00
let data = JSON.parse(message);
2020-05-02 20:46:02 +02:00
try {
//if offer type, create peer connexion
if(data.signal.type === "offer"){
this.createPeerConnexion(data);
}
this.PeerConnexionArray[data.userId].signal(data.signal);
} catch (e) {
console.error(`receiveWebrtcSignal => ${data.userId}`, e);
2020-04-25 16:05:33 +02:00
}
}
/**
2020-04-25 20:29:03 +02:00
*
* @param userId
2020-04-25 16:05:33 +02:00
* @param stream
*/
private stream(userId : any, stream: MediaStream) {
2020-05-02 20:46:02 +02:00
this.MediaManager.addStreamRemoteVideo(userId, stream);
2020-04-25 16:05:33 +02:00
}
/**
2020-04-25 20:29:03 +02:00
*
* @param userId
2020-04-25 16:05:33 +02:00
*/
private addMedia (userId : any = null) {
2020-05-02 20:46:02 +02:00
try {
let transceiver : any = null;
this.MediaManager.localStream.getTracks().forEach(
transceiver = (track: MediaStreamTrack) => this.PeerConnexionArray[userId].addTrack(track, this.MediaManager.localStream)
)
}catch (e) {
console.error(`addMedia => addMedia => ${userId}`, e);
}
2020-04-26 20:55:20 +02:00
}
2020-04-25 16:05:33 +02:00
}