ComunicWeb/assets/js/components/calls/callWindow.js

490 lines
11 KiB
JavaScript
Raw Normal View History

2019-01-24 13:40:36 +00:00
/**
* Single call window management
*
* @author Pierre HUBERT
*/
ComunicWeb.components.calls.callWindow = {
/**
* Initialize a call
*
* @param {Object} info Information about the call to initialize
*/
initCall: function(info){
/**
* Initialize call object
*/
var call = {
info: info,
2019-01-25 14:24:32 +00:00
/**
* @type {String}
*/
localPeerID: undefined,
/**
* @type {Boolean}
*/
2019-01-24 13:40:36 +00:00
open: true,
2019-01-25 14:24:32 +00:00
2019-01-24 13:50:03 +00:00
window: {},
2019-01-25 14:24:32 +00:00
streams: {},
/**
* @type {SignalExchangerClient}
*/
signalClient: undefined
2019-01-24 13:40:36 +00:00
};
2019-01-25 17:30:01 +00:00
/**
* Initialize utilities
*/
/**
* Get member information based on call ID
*
* @param {String} id The ID of the peer to process
* @return Information about the peer / empty object
* if no peer found
*/
call.getMemberByCallID = function(id){
var memberInfo = undefined;
call.info.members.forEach(function(member){
if(member.user_call_id == id)
memberInfo = member;
});
return memberInfo;
}
/**
* We have to begin to draw conversation UI
*/
2019-01-24 13:40:36 +00:00
var callContainer = createElem2({
appendTo: byId("callsTarget") ? byId("callsTarget") : byId("wrapper"), //If call target is not found, add call in page wrapper
type: "div",
class: "call-window"
});
call.window.container = callContainer;
//Add toolbar
call.window.toolbar = createElem2({
appendTo: callContainer,
type: "div",
class: "call-toolbar",
innerHTML: "<i class='fa fa-phone'>"
});
//Call title
call.window.title = createElem2({
appendTo: call.window.toolbar,
type: "div",
class: "call-title",
innerHTML: "Loading..."
});
/**
* Update the title of the call
*/
call.setTitle = function(title){
call.window.title.innerHTML = title;
}
//Add close button
call.window.closeButton = createElem2({
appendTo: call.window.toolbar,
type: "button",
class: "btn btn-box-tool close-btn",
innerHTML: "<i class='fa fa-times'></i>"
});
2019-01-24 13:50:03 +00:00
//Make close button lives
call.close = function(){
call.open = false;
callContainer.remove();
2019-01-25 14:24:32 +00:00
//Close sockets connections too
ComunicWeb.components.calls.callWindow.stop(call);
2019-01-24 13:50:03 +00:00
}
call.window.closeButton.addEventListener("click", function(){
call.close();
});
2019-01-24 13:40:36 +00:00
//Get information about related conversation to get the name of the call
2019-01-25 09:13:30 +00:00
ComunicWeb.components.conversations.utils.getNameForID(info.conversation_id, function(name){
2019-01-24 13:40:36 +00:00
2019-01-25 09:13:30 +00:00
if(!name)
2019-01-24 13:40:36 +00:00
return notify("Could not get information about related conversation!", "danger");
2019-01-25 09:13:30 +00:00
call.setTitle(name);
2019-01-24 13:40:36 +00:00
2019-01-25 09:13:30 +00:00
});
2019-01-24 13:40:36 +00:00
2019-01-25 14:34:40 +00:00
//Call box body
call.window.body = createElem2({
appendTo: callContainer,
type: "div",
class: "call-window-body"
});
2019-01-25 17:30:01 +00:00
2019-01-25 14:34:40 +00:00
/**
* Create loading message area
*/
call.window.loadingMessageContainer = createElem2({
appendTo: call.window.body,
type: "div",
class: "loading-message-container",
innerHTML: "<i class='fa fa-clock-o'></i>"
});
call.window.loadingMessageContent = createElem2({
appendTo: call.window.loadingMessageContainer,
type: "div",
class: "message",
innerHTML: "Loading..."
});
/**
* Set loading message visiblity
*
* @param {Boolean} visible TRUE to make it visible / FALSE else
*/
call.setLoadingMessageVisibility = function(visible){
call.window.loadingMessageContainer.style.display = visible ? "flex" : "none";
}
/**
* Update call loading message
*
* @param {String} message The new message to show to the
* users
*/
call.setLoadingMessage = function(message){
2019-01-25 17:30:01 +00:00
call.setLoadingMessageVisibility(true);
2019-01-25 14:34:40 +00:00
call.window.loadingMessageContent.innerHTML = message;
}
2019-01-24 13:40:36 +00:00
//Load user media
call.setLoadingMessage("Waiting for your microphone and camera...");
2019-01-24 13:50:03 +00:00
2019-01-25 17:30:01 +00:00
ComunicWeb.components.calls.userMedia.get().then(function(stream){
//Check if connection has already been closed
if(!call.open)
return;
2019-01-24 13:50:03 +00:00
//Mark as connecting
call.setLoadingMessage("Connecting...");
call.streams.local = stream;
2019-01-25 17:30:01 +00:00
//Initialize signaling server connection
ComunicWeb.components.calls.callWindow.initializeConnectionToSignalingServer(call);
2019-01-25 14:24:32 +00:00
return true;
2019-01-25 17:30:01 +00:00
}).catch(function(e){
2019-01-24 13:50:03 +00:00
console.error("Get user media error: ", e);
call.setLoadingMessageVisibility(false);
return notify("Could not get your microphone and camera!", "danger");
});
2019-01-24 13:40:36 +00:00
2019-01-25 17:30:01 +00:00
/**
* Start to automaticaly refresh information about the call
*/
var interval = setInterval(function(){
if(!call.open)
return clearInterval(interval);
ComunicWeb.components.calls.callWindow.refreshInfo(call);
2019-01-25 14:24:32 +00:00
2019-01-25 17:30:01 +00:00
}, 4000);
},
/**
* Initialize connection to signaling server
*
* @param {Object} call Information about the call
*/
initializeConnectionToSignalingServer: function(call) {
2019-01-25 14:24:32 +00:00
//Get current user call ID
call.info.members.forEach(function(member){
if(member.userID == userID())
call.localPeerID = member.user_call_id;
});
2019-01-25 17:30:01 +00:00
//Create client instance and connect to server
2019-01-25 14:24:32 +00:00
var config = ComunicWeb.components.calls.controller.getConfig();
call.signalClient = new SignalExchangerClient(
config.signal_server_name,
config.signal_server_port,
call.localPeerID
);
2019-01-25 17:30:01 +00:00
/**
* Error when connecting to signaling server
*/
call.signalClient.onError = function(){
call.setLoadingMessage("Could not connect to signaling server!");
call.open = false;
};
/**
* Connection to signaling server is not supposed to close
*/
call.signalClient.onClosed = function(){
call.setLoadingMessage("Connection to signaling server closed!");
call.open = false;
}
/**
* A remote peer sent a ready notice
*/
call.signalClient.onReadyMessage = function(peerID){
ComunicWeb.components.calls.callWindow.readyToInitialize(call, peerID);
}
/**
* A remote peer sent a signal
*/
call.signalClient.onSignal = function(signal, peerID){
ComunicWeb.components.calls.callWindow.receivedSignal(call, peerID, signal);
}
2019-01-25 14:24:32 +00:00
},
/**
* Refresh at a regular interval information about the call
*
* @param {Object} call Call Root object
*/
refreshInfo: function(call){
ComunicWeb.components.calls.interface.getInfo(call.info.id, function(result){
if(result.error)
return notify("Could not get information about the call!", "danger");
call.info = result;
ComunicWeb.components.calls.callWindow.gotNewCallInfo(call);
});
},
/**
* This method get called each time information about the call
* are refreshed on the server
*
* @param {Object} call Information about the call
*/
gotNewCallInfo: function(call) {
2019-01-25 17:30:01 +00:00
//Check if we are connected to signaling server and we have got local
//streams
if(!call.signalClient || !call.signalClient.isConnected() || !call.streams.local)
2019-01-25 14:24:32 +00:00
return;
//Check if all other members rejected call
var allRejected = true;
call.info.members.forEach(function(member){
if(member.accepted != "rejected" && member.userID != userID())
allRejected = false;
});
//Check if all call peer rejected the call
if(allRejected){
call.setLoadingMessage("All other peers rejected the call !");
setTimeout(function(){
call.close();
}, 20000);
return;
}
2019-01-25 17:30:01 +00:00
//Process the connection to each accepted member
call.info.members.forEach(function(member){
//Ignores all not accepted connection
if(member.userID == userID() || member.accepted !== "accepted")
return;
//Check if we have not peer information
if(!call.streams.hasOwnProperty("peer-" + member.userID)){
//If the ID of the current user is bigger than the remote
//peer user ID, we wait a ready signal from him
if(member.userID < userID())
return;
//Else we have to create peer
ComunicWeb.components.calls.callWindow.createPeerConnection(call, member, false);
}
});
},
/**
* Create a peer connection
*
* @param {Object} call Information about the peer
* @param {Object} member Information about the member
* @param {Boolean} isInitiator Specify whether current user is the
* initiator of the connection or not
*/
createPeerConnection: function(call, member, isInitiator){
var peerConnection = {
peer: undefined
};
call.streams["peer-" + member.userID] = peerConnection;
//Get call configuration
var config = ComunicWeb.components.calls.controller.getConfig();
//Create peer
var peer = new SimplePeer({
initiator: isInitiator,
stream: call.streams.local,
trickle: false,
config: {
'iceServers': [
{ urls: config.stun_server },
{"url": config.turn_server,
"credential": config.turn_username,
"username": config.turn_password}
]
}
});
peerConnection.peer = peer;
var removePeerConnection = function(){
peer.destroy();
delete call.streams["peer-" + member.userID];
}
peer.on("error", function(err){
console.error("Peer error !", err, member);
removePeerConnection();
});
peer.on("signal", function(data){
console.log('SIGNAL', JSON.stringify(data));
call.signalClient.sendSignal(member.user_call_id, JSON.stringify(data));
});
peer.on("message", message => {
console.log("Message from remote peer: " + message);
});
peer.on("close", function(){
removePeerConnection();
});
peer.on("stream", function(stream){
alert("Remote stream available!");
});
//If this peer does not initialize connection, inform other peer we are ready
if(!isInitiator)
call.signalClient.sendReadyMessage(member.user_call_id);
},
/**
* This method is called when a remote peers notify it is ready to
* establish connection
*
* @param {Object} call Information about the call
* @param {String} peerID Remote peer ID
*/
readyToInitialize: function(call, peerID){
var member = call.getMemberByCallID(peerID);
if(member == undefined)
return;
//It the user with the smallest ID who send the ready message
//else it would mess everything up
if(member.userID > userID())
return;
this.createPeerConnection(call, member, true);
},
/**
* This method is called when we received a remote signal
*
* @param {Object} call Information about the call
* @param {String} peerID Remote peer ID
* @param {String} signal Received signal
*/
receivedSignal: function(call, peerID, signal){
console.log("Received signal from " + peerID, signal);
var member = call.getMemberByCallID(peerID);
if(member == undefined)
return;
//Check we have got peer information
if(!call.streams.hasOwnProperty("peer-" + member.userID))
return;
call.streams["peer-" + member.userID].peer.signal(JSON.parse(signal));
},
/**
*
* @param {Object} call Information about remote call
* @param {*} stream
*/
streamAvailable: function(call, stream){
2019-01-25 14:24:32 +00:00
},
/**
* Stop the ongoing call
*
* @param {Object} call Information about the call
*/
stop: function(call){
//Remove the call from the opened list
ComunicWeb.components.calls.currentList.removeCallFromList(call.info.id);
//Close the connection to the server
if(call.signalClient.isConnected())
call.signalClient.close();
}
2019-01-24 13:40:36 +00:00
}