mirror of https://github.com/OpenVidu/openvidu.git
Simplify testapp with a simple OpenVidu browser API
Micael Gallego
parent
31389e683c
commit
47b6a979bd
|
|
@ -1,4 +1,4 @@
|
|||
export { Room } from './Room';
|
||||
export { Session } from './Session';
|
||||
export { Participant } from './Participant';
|
||||
export { Stream } from './Stream';
|
||||
export { OpenVidu } from './OpenVidu';
|
||||
|
|
@ -15,25 +15,32 @@
|
|||
*
|
||||
*/
|
||||
|
||||
import { Room } from './Room';
|
||||
import { Session, SessionOptions } from './Session';
|
||||
import { Stream } from './Stream';
|
||||
|
||||
declare var RpcBuilder: any;
|
||||
|
||||
type Callback<T> = ( error?: any, openVidu?: T ) => void;
|
||||
export type Callback<T> = ( error?: any, openVidu?: T ) => void;
|
||||
|
||||
export class OpenVidu {
|
||||
|
||||
private room: Room;
|
||||
private userName: string;
|
||||
private session: Session;
|
||||
private jsonRpcClient: any;
|
||||
private rpcParams: any;
|
||||
private callback: Callback<OpenVidu>;
|
||||
|
||||
constructor( private wsUri: string ) { }
|
||||
private camera: Stream;
|
||||
|
||||
constructor( private wsUri: string ) {
|
||||
if(this.wsUri.charAt(wsUri.length-1) != '/'){
|
||||
this.wsUri = '/';
|
||||
}
|
||||
this.wsUri += 'room';
|
||||
|
||||
this.session = new Session(this);
|
||||
}
|
||||
|
||||
getRoom() {
|
||||
return this.room;
|
||||
return this.session;
|
||||
}
|
||||
|
||||
connect( callback: Callback<OpenVidu> ): void {
|
||||
|
|
@ -77,7 +84,7 @@ export class OpenVidu {
|
|||
|
||||
private customNotification( params ) {
|
||||
if ( this.isRoomAvailable() ) {
|
||||
this.room.emitEvent( "custom-message-received", [{ params: params }] );
|
||||
this.session.emitEvent( "custom-message-received", [{ params: params }] );
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -90,7 +97,7 @@ export class OpenVidu {
|
|||
}
|
||||
|
||||
private isRoomAvailable() {
|
||||
if ( this.room !== undefined && this.room instanceof Room ) {
|
||||
if ( this.session !== undefined && this.session instanceof Session ) {
|
||||
return true;
|
||||
} else {
|
||||
console.warn( 'Room instance not found' );
|
||||
|
|
@ -101,7 +108,7 @@ export class OpenVidu {
|
|||
private disconnectCallback() {
|
||||
console.log( 'Websocket connection lost' );
|
||||
if ( this.isRoomAvailable() ) {
|
||||
this.room.onLostConnection();
|
||||
this.session.onLostConnection();
|
||||
} else {
|
||||
alert( 'Connection error. Please reload page.' );
|
||||
}
|
||||
|
|
@ -110,7 +117,7 @@ export class OpenVidu {
|
|||
private reconnectingCallback() {
|
||||
console.log( 'Websocket connection lost (reconnecting)' );
|
||||
if ( this.isRoomAvailable() ) {
|
||||
this.room.onLostConnection();
|
||||
this.session.onLostConnection();
|
||||
} else {
|
||||
alert( 'Connection error. Please reload page.' );
|
||||
}
|
||||
|
|
@ -122,49 +129,49 @@ export class OpenVidu {
|
|||
|
||||
private onParticipantJoined( params ) {
|
||||
if ( this.isRoomAvailable() ) {
|
||||
this.room.onParticipantJoined( params );
|
||||
this.session.onParticipantJoined( params );
|
||||
}
|
||||
}
|
||||
|
||||
private onParticipantPublished( params ) {
|
||||
if ( this.isRoomAvailable() ) {
|
||||
this.room.onParticipantPublished( params );
|
||||
this.session.onParticipantPublished( params );
|
||||
}
|
||||
}
|
||||
|
||||
private onParticipantLeft( params ) {
|
||||
if ( this.isRoomAvailable() ) {
|
||||
this.room.onParticipantLeft( params );
|
||||
this.session.onParticipantLeft( params );
|
||||
}
|
||||
}
|
||||
|
||||
private onParticipantEvicted( params ) {
|
||||
if ( this.isRoomAvailable() ) {
|
||||
this.room.onParticipantEvicted( params );
|
||||
this.session.onParticipantEvicted( params );
|
||||
}
|
||||
}
|
||||
|
||||
private onNewMessage( params ) {
|
||||
if ( this.isRoomAvailable() ) {
|
||||
this.room.onNewMessage( params );
|
||||
this.session.onNewMessage( params );
|
||||
}
|
||||
}
|
||||
|
||||
private iceCandidateEvent( params ) {
|
||||
if ( this.isRoomAvailable() ) {
|
||||
this.room.recvIceCandidate( params );
|
||||
this.session.recvIceCandidate( params );
|
||||
}
|
||||
}
|
||||
|
||||
private onRoomClosed( params ) {
|
||||
if ( this.isRoomAvailable() ) {
|
||||
this.room.onRoomClosed( params );
|
||||
this.session.onRoomClosed( params );
|
||||
}
|
||||
}
|
||||
|
||||
private onMediaError( params ) {
|
||||
if ( this.isRoomAvailable() ) {
|
||||
this.room.onMediaError( params );
|
||||
this.session.onMediaError( params );
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -198,31 +205,44 @@ export class OpenVidu {
|
|||
|
||||
close( forced ) {
|
||||
if ( this.isRoomAvailable() ) {
|
||||
this.room.leave( forced, this.jsonRpcClient );
|
||||
this.session.leave( forced, this.jsonRpcClient );
|
||||
}
|
||||
};
|
||||
|
||||
disconnectParticipant( stream ) {
|
||||
if ( this.isRoomAvailable() ) {
|
||||
this.room.disconnect( stream );
|
||||
this.session.disconnect( stream );
|
||||
}
|
||||
}
|
||||
|
||||
Stream( room, options ) {
|
||||
getCamera(options?) {
|
||||
|
||||
if(this.camera){
|
||||
return this.camera;
|
||||
}
|
||||
|
||||
options = options || {
|
||||
audio: true,
|
||||
video: true,
|
||||
data: true
|
||||
}
|
||||
|
||||
options.participant = room.getLocalParticipant();
|
||||
return new Stream( this, true, room, options );
|
||||
options.participant = this.session.getLocalParticipant();
|
||||
this.camera = new Stream( this, true, this.session, options );
|
||||
return this.camera;
|
||||
};
|
||||
|
||||
Room( options ) {
|
||||
let room = new Room( this, options );
|
||||
return room;
|
||||
joinSession(options: SessionOptions, callback: Callback<Session>) {
|
||||
|
||||
this.session.configure(options);
|
||||
|
||||
this.session.connect();
|
||||
|
||||
this.session.addEventListener('room-connected', roomEvent => callback(undefined,this.session));
|
||||
|
||||
this.session.addEventListener('error-room', error => callback(error));
|
||||
|
||||
return this.session;
|
||||
};
|
||||
|
||||
//CHAT
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
// Participant --------------------------------
|
||||
import { Stream, StreamOptions } from './Stream';
|
||||
import { OpenVidu } from './OpenVidu';
|
||||
import { Room } from './Room';
|
||||
import { Session } from './Session';
|
||||
|
||||
type ObjMap<T> = { [s: string]: T; }
|
||||
|
||||
|
|
@ -16,43 +16,44 @@ export class Participant {
|
|||
private streams: ObjMap<Stream> = {};
|
||||
private streamsOpts: StreamOptions[] = [];
|
||||
|
||||
constructor( private openVidu: OpenVidu, private local: boolean, private room: Room, private options: ParticipantOptions ) {
|
||||
constructor( private openVidu: OpenVidu, private local: boolean, private room: Session, private options?: ParticipantOptions ) {
|
||||
|
||||
this.id = options.id;
|
||||
if ( options ) {
|
||||
|
||||
if ( options.streams ) {
|
||||
this.id = options.id;
|
||||
|
||||
for ( let streamOptions of options.streams ) {
|
||||
if ( options.streams ) {
|
||||
|
||||
let streamOpts = {
|
||||
id: streamOptions.id,
|
||||
participant: this,
|
||||
recvVideo: ( streamOptions.recvVideo == undefined ? true : streamOptions.recvVideo ),
|
||||
recvAudio: ( streamOptions.recvAudio == undefined ? true : streamOptions.recvAudio ),
|
||||
audio: streamOptions.audio,
|
||||
video: streamOptions.video,
|
||||
data: streamOptions.data
|
||||
for ( let streamOptions of options.streams ) {
|
||||
|
||||
let streamOpts = {
|
||||
id: streamOptions.id,
|
||||
participant: this,
|
||||
recvVideo: ( streamOptions.recvVideo == undefined ? true : streamOptions.recvVideo ),
|
||||
recvAudio: ( streamOptions.recvAudio == undefined ? true : streamOptions.recvAudio ),
|
||||
audio: streamOptions.audio,
|
||||
video: streamOptions.video,
|
||||
data: streamOptions.data
|
||||
}
|
||||
let stream = new Stream( openVidu, false, room, streamOpts );
|
||||
|
||||
this.addStream( stream );
|
||||
this.streamsOpts.push( streamOpts );
|
||||
}
|
||||
let stream = new Stream( openVidu, false, room, streamOpts );
|
||||
|
||||
this.addStream( stream );
|
||||
this.streamsOpts.push( streamOpts );
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
console.log( "New " + ( local ? "local " : "remote " ) + "participant " + this.id
|
||||
+ ", streams opts: ", this.streamsOpts );
|
||||
|
||||
|
||||
}
|
||||
|
||||
setId( newId ) {
|
||||
this.id = newId;
|
||||
}
|
||||
|
||||
addStream( stream ) {
|
||||
this.streams[stream.getID()] = stream;
|
||||
this.room.getStreams()[stream.getID()] = stream;
|
||||
addStream( stream: Stream ) {
|
||||
this.streams[stream.getIdInParticipant()] = stream;
|
||||
this.room.getStreams()[stream.getIdInParticipant()] = stream;
|
||||
}
|
||||
|
||||
getStreams() {
|
||||
|
|
@ -65,17 +66,17 @@ export class Participant {
|
|||
}
|
||||
}
|
||||
|
||||
getID() {
|
||||
getId() {
|
||||
return this.id;
|
||||
}
|
||||
|
||||
sendIceCandidate( candidate ) {
|
||||
|
||||
console.debug(( this.local ? "Local" : "Remote" ), "candidate for",
|
||||
this.getID(), JSON.stringify( candidate ) );
|
||||
|
||||
this.getId(), JSON.stringify( candidate ) );
|
||||
|
||||
this.openVidu.sendRequest( "onIceCandidate", {
|
||||
endpointName: this.getID(),
|
||||
endpointName: this.getId(),
|
||||
candidate: candidate.candidate,
|
||||
sdpMid: candidate.sdpMid,
|
||||
sdpMLineIndex: candidate.sdpMLineIndex
|
||||
|
|
|
|||
|
|
@ -4,37 +4,43 @@ import { Participant, ParticipantOptions } from './Participant';
|
|||
|
||||
declare let EventEmitter;
|
||||
|
||||
export interface RoomOptions {
|
||||
room: string;
|
||||
user: string;
|
||||
subscribeToStreams: boolean;
|
||||
updateSpeakerInterval: number;
|
||||
thresholdSpeaker: number;
|
||||
export interface SessionOptions {
|
||||
sessionId: string;
|
||||
participantId: string;
|
||||
subscribeToStreams?: boolean;
|
||||
updateSpeakerInterval?: number;
|
||||
thresholdSpeaker?: number;
|
||||
}
|
||||
|
||||
export class Room {
|
||||
export class Session {
|
||||
|
||||
private name: string;
|
||||
private id: string;
|
||||
private ee = new EventEmitter();
|
||||
private streams = {};
|
||||
private participants = {};
|
||||
private participantsSpeaking: Participant[] = [];
|
||||
private connected = false;
|
||||
private localParticipant;
|
||||
private localParticipant: Participant;
|
||||
private subscribeToStreams: boolean;
|
||||
private updateSpeakerInterval: number;
|
||||
public thresholdSpeaker: number;
|
||||
private options: SessionOptions
|
||||
|
||||
constructor( private openVidu: OpenVidu, private options: RoomOptions ) {
|
||||
constructor( private openVidu: OpenVidu ) {
|
||||
this.localParticipant = new Participant( this.openVidu, true, this );
|
||||
}
|
||||
|
||||
this.name = options.room;
|
||||
configure( options: SessionOptions ) {
|
||||
|
||||
this.options = options;
|
||||
this.id = options.sessionId;
|
||||
this.subscribeToStreams = options.subscribeToStreams || true;
|
||||
this.updateSpeakerInterval = options.updateSpeakerInterval || 1500;
|
||||
this.thresholdSpeaker = options.thresholdSpeaker || -50;
|
||||
|
||||
this.localParticipant.setId( options.participantId );
|
||||
this.activateUpdateMainSpeaker();
|
||||
this.localParticipant = new Participant(openVidu, true, this, { id: options.user });
|
||||
this.participants[options.user] = this.localParticipant;
|
||||
|
||||
this.participants[options.participantId] = this.localParticipant;
|
||||
}
|
||||
|
||||
private activateUpdateMainSpeaker() {
|
||||
|
|
@ -63,8 +69,8 @@ export class Room {
|
|||
connect() {
|
||||
|
||||
let joinParams = {
|
||||
user: this.options.user,
|
||||
room: this.options.room,
|
||||
user: this.options.participantId,
|
||||
room: this.options.sessionId,
|
||||
dataChannels: false
|
||||
}
|
||||
|
||||
|
|
@ -101,7 +107,7 @@ export class Room {
|
|||
let participant = new Participant( this.openVidu, false, this,
|
||||
exParticipants[i] );
|
||||
|
||||
this.participants[participant.getID()] = participant;
|
||||
this.participants[participant.getId()] = participant;
|
||||
|
||||
roomEvent.participants.push( participant );
|
||||
|
||||
|
|
@ -115,6 +121,12 @@ export class Room {
|
|||
}
|
||||
|
||||
this.ee.emitEvent( 'room-connected', [roomEvent] );
|
||||
|
||||
if ( this.subscribeToStreams ) {
|
||||
for ( let stream of roomEvent.streams ) {
|
||||
this.ee.emitEvent( 'stream-added', [{ stream }] );
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
|
@ -128,7 +140,7 @@ export class Room {
|
|||
|
||||
let participant = new Participant( this.openVidu, false, this, options );
|
||||
|
||||
let pid = participant.getID();
|
||||
let pid = participant.getId();
|
||||
if ( !( pid in this.participants ) ) {
|
||||
console.info( "Publisher not found in participants list by its id", pid );
|
||||
} else {
|
||||
|
|
@ -137,9 +149,7 @@ export class Room {
|
|||
//replacing old participant (this one has streams)
|
||||
this.participants[pid] = participant;
|
||||
|
||||
this.ee.emitEvent( 'participant-published', [{
|
||||
participant: participant
|
||||
}] );
|
||||
this.ee.emitEvent( 'participant-published', [{ participant }] );
|
||||
|
||||
let streams = participant.getStreams();
|
||||
for ( let key in streams ) {
|
||||
|
|
@ -147,9 +157,7 @@ export class Room {
|
|||
|
||||
if ( this.subscribeToStreams ) {
|
||||
stream.subscribe();
|
||||
this.ee.emitEvent( 'stream-added', [{
|
||||
stream: stream
|
||||
}] );
|
||||
this.ee.emitEvent( 'stream-added', [{ stream }] );
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -158,7 +166,7 @@ export class Room {
|
|||
|
||||
let participant = new Participant( this.openVidu, false, this, msg );
|
||||
|
||||
let pid = participant.getID();
|
||||
let pid = participant.getId();
|
||||
if ( !( pid in this.participants ) ) {
|
||||
console.log( "New participant to participants list with id", pid );
|
||||
this.participants[pid] = participant;
|
||||
|
|
@ -274,10 +282,10 @@ export class Room {
|
|||
return;
|
||||
}
|
||||
|
||||
console.log( 'Lost connection in room ' + this.name );
|
||||
let room = this.name;
|
||||
console.log( 'Lost connection in room ' + this.id );
|
||||
let room = this.id;
|
||||
if ( room !== undefined ) {
|
||||
this.ee.emitEvent( 'lost-connection', [{room}] );
|
||||
this.ee.emitEvent( 'lost-connection', [{ room }] );
|
||||
} else {
|
||||
console.error( 'Room undefined when lost connection' );
|
||||
}
|
||||
|
|
@ -324,7 +332,7 @@ export class Room {
|
|||
}
|
||||
}
|
||||
|
||||
disconnect( stream ) {
|
||||
disconnect( stream: Stream ) {
|
||||
|
||||
let participant = stream.getParticipant();
|
||||
if ( !participant ) {
|
||||
|
|
@ -332,12 +340,12 @@ export class Room {
|
|||
return;
|
||||
}
|
||||
|
||||
delete this.participants[participant.getID()];
|
||||
delete this.participants[participant.getId()];
|
||||
participant.dispose();
|
||||
|
||||
if ( participant === this.localParticipant ) {
|
||||
|
||||
console.log( "Unpublishing my media (I'm " + participant.getID() + ")" );
|
||||
|
||||
console.log( "Unpublishing my media (I'm " + participant.getId() + ")" );
|
||||
delete this.localParticipant;
|
||||
this.openVidu.sendRequest( 'unpublishVideo', function( error, response ) {
|
||||
if ( error ) {
|
||||
|
|
@ -349,15 +357,15 @@ export class Room {
|
|||
|
||||
} else {
|
||||
|
||||
console.log( "Unsubscribing from " + stream.getGlobalID() );
|
||||
console.log( "Unsubscribing from " + stream.getId() );
|
||||
this.openVidu.sendRequest( 'unsubscribeFromVideo', {
|
||||
sender: stream.getGlobalID()
|
||||
sender: stream.getId()
|
||||
},
|
||||
function( error, response ) {
|
||||
if ( error ) {
|
||||
console.error( error );
|
||||
} else {
|
||||
console.info( "Unsubscribed correctly from " + stream.getGlobalID() );
|
||||
console.info( "Unsubscribed correctly from " + stream.getId() );
|
||||
}
|
||||
});
|
||||
}
|
||||
|
|
@ -6,8 +6,8 @@
|
|||
* stream.hasAudio(); stream.hasVideo(); stream.hasData();
|
||||
*/
|
||||
import { Participant } from './Participant';
|
||||
import { Room } from './Room';
|
||||
import { OpenVidu } from './OpenVidu';
|
||||
import { Session } from './Session';
|
||||
import { OpenVidu, Callback } from './OpenVidu';
|
||||
|
||||
declare type JQuery = any;
|
||||
declare var $: JQuery;
|
||||
|
|
@ -54,7 +54,7 @@ export class Stream {
|
|||
private dataChannel: boolean;
|
||||
private dataChannelOpened = false;
|
||||
|
||||
constructor( private openVidu: OpenVidu, private local: boolean, private room: Room, options: StreamOptions ) {
|
||||
constructor( private openVidu: OpenVidu, private local: boolean, private room: Session, options: StreamOptions ) {
|
||||
|
||||
if ( options.id ) {
|
||||
this.id = options.id;
|
||||
|
|
@ -98,7 +98,7 @@ export class Stream {
|
|||
}
|
||||
|
||||
getChannelName() {
|
||||
return this.getGlobalID() + '_' + this.chanId++;
|
||||
return this.getId() + '_' + this.chanId++;
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -146,7 +146,7 @@ export class Stream {
|
|||
|
||||
showSpinner( spinnerParentId: string ) {
|
||||
let progress = document.createElement( 'div' );
|
||||
progress.id = 'progress-' + this.getGlobalID();
|
||||
progress.id = 'progress-' + this.getId();
|
||||
progress.style.background = "center transparent url('img/spinner.gif') no-repeat";
|
||||
let spinnerParent = document.getElementById( spinnerParentId );
|
||||
if(spinnerParent){
|
||||
|
|
@ -155,14 +155,14 @@ export class Stream {
|
|||
}
|
||||
|
||||
hideSpinner( spinnerId?: string ) {
|
||||
spinnerId = ( spinnerId === undefined ) ? this.getGlobalID() : spinnerId;
|
||||
spinnerId = ( spinnerId === undefined ) ? this.getId() : spinnerId;
|
||||
$( jq( 'progress-' + spinnerId ) ).hide();
|
||||
}
|
||||
|
||||
playOnlyVideo( parentElement, thumbnailId ) {
|
||||
this.video = document.createElement( 'video' );
|
||||
|
||||
this.video.id = 'native-video-' + this.getGlobalID();
|
||||
this.video.id = 'native-video-' + this.getId();
|
||||
this.video.autoplay = true;
|
||||
this.video.controls = false;
|
||||
if ( this.wrStream ) {
|
||||
|
|
@ -170,7 +170,7 @@ export class Stream {
|
|||
$( jq( thumbnailId ) ).show();
|
||||
this.hideSpinner();
|
||||
} else {
|
||||
console.log( "No wrStream yet for", this.getGlobalID() );
|
||||
console.log( "No wrStream yet for", this.getId() );
|
||||
}
|
||||
|
||||
this.videoElements.push( {
|
||||
|
|
@ -198,7 +198,7 @@ export class Stream {
|
|||
|
||||
let container = document.createElement( 'div' );
|
||||
container.className = "participant";
|
||||
container.id = this.getGlobalID();
|
||||
container.id = this.getId();
|
||||
let thumbnail = document.getElementById( thumbnailId );
|
||||
if(thumbnail){
|
||||
thumbnail.appendChild( container );
|
||||
|
|
@ -208,21 +208,21 @@ export class Stream {
|
|||
|
||||
let name = document.createElement( 'div' );
|
||||
container.appendChild( name );
|
||||
let userName = this.getGlobalID().replace( '_webcam', '' );
|
||||
let userName = this.getId().replace( '_webcam', '' );
|
||||
if ( userName.length >= 16 ) {
|
||||
userName = userName.substring( 0, 16 ) + "...";
|
||||
}
|
||||
name.appendChild( document.createTextNode( userName ) );
|
||||
name.id = "name-" + this.getGlobalID();
|
||||
name.id = "name-" + this.getId();
|
||||
name.className = "name";
|
||||
name.title = this.getGlobalID();
|
||||
name.title = this.getId();
|
||||
|
||||
this.showSpinner( thumbnailId );
|
||||
|
||||
return this.playOnlyVideo( container, thumbnailId );
|
||||
}
|
||||
|
||||
getID() {
|
||||
getIdInParticipant() {
|
||||
return this.id;
|
||||
}
|
||||
|
||||
|
|
@ -230,15 +230,15 @@ export class Stream {
|
|||
return this.participant;
|
||||
}
|
||||
|
||||
getGlobalID() {
|
||||
getId() {
|
||||
if ( this.participant ) {
|
||||
return this.participant.getID() + "_" + this.id;
|
||||
return this.participant.getId() + "_" + this.id;
|
||||
} else {
|
||||
return this.id + "_webcam";
|
||||
}
|
||||
}
|
||||
|
||||
init() {
|
||||
requestCameraAccess(callback: Callback<Stream>) {
|
||||
|
||||
this.participant.addStream( this );
|
||||
|
||||
|
|
@ -256,21 +256,22 @@ export class Stream {
|
|||
|
||||
getUserMedia( constraints, userStream => {
|
||||
this.wrStream = userStream;
|
||||
this.ee.emitEvent( 'access-accepted', null );
|
||||
callback(undefined, this);
|
||||
}, error => {
|
||||
console.error( "Access denied", error );
|
||||
this.ee.emitEvent( 'access-denied', null );
|
||||
callback(error, undefined);
|
||||
});
|
||||
}
|
||||
|
||||
publishVideoCallback( error, sdpOfferParam, wp ) {
|
||||
|
||||
if ( error ) {
|
||||
return console.error( "(publish) SDP offer error: "
|
||||
+ JSON.stringify( error ) );
|
||||
}
|
||||
|
||||
console.log( "Sending SDP offer to publish as "
|
||||
+ this.getGlobalID(), sdpOfferParam );
|
||||
+ this.getId(), sdpOfferParam );
|
||||
|
||||
this.openVidu.sendRequest( "publishVideo", {
|
||||
sdpOffer: sdpOfferParam,
|
||||
|
|
@ -293,9 +294,9 @@ export class Stream {
|
|||
+ JSON.stringify( error ) );
|
||||
}
|
||||
console.log( "Sending SDP offer to subscribe to "
|
||||
+ this.getGlobalID(), sdpOfferParam );
|
||||
+ this.getId(), sdpOfferParam );
|
||||
this.openVidu.sendRequest( "receiveVideoFrom", {
|
||||
sender: this.getGlobalID(),
|
||||
sender: this.getId(),
|
||||
sdpOffer: sdpOfferParam
|
||||
}, ( error, response ) => {
|
||||
if ( error ) {
|
||||
|
|
@ -359,7 +360,7 @@ export class Stream {
|
|||
});
|
||||
}
|
||||
console.log( "Waiting for SDP offer to be generated ("
|
||||
+ ( this.local ? "local" : "remote" ) + " peer: " + this.getGlobalID() + ")" );
|
||||
+ ( this.local ? "local" : "remote" ) + " peer: " + this.getId() + ")" );
|
||||
}
|
||||
|
||||
publish() {
|
||||
|
|
@ -389,9 +390,9 @@ export class Stream {
|
|||
type: 'answer',
|
||||
sdp: sdpAnswer,
|
||||
});
|
||||
console.log( this.getGlobalID() + ": set peer connection with recvd SDP answer",
|
||||
console.log( this.getId() + ": set peer connection with recvd SDP answer",
|
||||
sdpAnswer );
|
||||
let participantId = this.getGlobalID();
|
||||
let participantId = this.getId();
|
||||
let pc = this.wp.peerConnection;
|
||||
pc.setRemoteDescription( answer, () => {
|
||||
// Avoids to subscribe to your own stream remotely
|
||||
|
|
@ -423,9 +424,9 @@ export class Stream {
|
|||
let video = videoElement.video;
|
||||
video.src = URL.createObjectURL( this.wrStream );
|
||||
video.onplay = () => {
|
||||
console.log( this.getGlobalID() + ': ' + 'Video playing' );
|
||||
console.log( this.getId() + ': ' + 'Video playing' );
|
||||
$( jq( thumbnailId ) ).show();
|
||||
this.hideSpinner( this.getGlobalID() );
|
||||
this.hideSpinner( this.getId() );
|
||||
};
|
||||
}
|
||||
this.room.emitEvent( 'stream-subscribed', [{
|
||||
|
|
@ -433,7 +434,7 @@ export class Stream {
|
|||
}] );
|
||||
}
|
||||
}, error => {
|
||||
console.error( this.getGlobalID() + ": Error setting SDP to the peer connection: "
|
||||
console.error( this.getId() + ": Error setting SDP to the peer connection: "
|
||||
+ JSON.stringify( error ) );
|
||||
});
|
||||
}
|
||||
|
|
@ -456,7 +457,7 @@ export class Stream {
|
|||
this.speechEvent.stop();
|
||||
}
|
||||
|
||||
console.log( this.getGlobalID() + ": Stream '" + this.id + "' unpublished" );
|
||||
console.log( this.getId() + ": Stream '" + this.id + "' unpublished" );
|
||||
}
|
||||
|
||||
dispose() {
|
||||
|
|
@ -471,7 +472,7 @@ export class Stream {
|
|||
|
||||
this.videoElements.forEach( ve => disposeElement( ve ) );
|
||||
|
||||
disposeElement( "progress-" + this.getGlobalID() );
|
||||
disposeElement( "progress-" + this.getId() );
|
||||
|
||||
if ( this.wp ) {
|
||||
this.wp.dispose();
|
||||
|
|
@ -490,6 +491,6 @@ export class Stream {
|
|||
this.speechEvent.stop();
|
||||
}
|
||||
|
||||
console.log( this.getGlobalID() + ": Stream '" + this.id + "' disposed" );
|
||||
console.log( this.getId() + ": Stream '" + this.id + "' disposed" );
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -14,15 +14,15 @@
|
|||
* limitations under the License.
|
||||
*
|
||||
*/
|
||||
System.register("OpenVidu", ["Room", "Stream"], function(exports_1, context_1) {
|
||||
System.register("OpenVidu", ["Session", "Stream"], function(exports_1, context_1) {
|
||||
"use strict";
|
||||
var __moduleName = context_1 && context_1.id;
|
||||
var Room_1, Stream_1;
|
||||
var Session_1, Stream_1;
|
||||
var OpenVidu;
|
||||
return {
|
||||
setters:[
|
||||
function (Room_1_1) {
|
||||
Room_1 = Room_1_1;
|
||||
function (Session_1_1) {
|
||||
Session_1 = Session_1_1;
|
||||
},
|
||||
function (Stream_1_1) {
|
||||
Stream_1 = Stream_1_1;
|
||||
|
|
@ -31,9 +31,14 @@ System.register("OpenVidu", ["Room", "Stream"], function(exports_1, context_1) {
|
|||
OpenVidu = (function () {
|
||||
function OpenVidu(wsUri) {
|
||||
this.wsUri = wsUri;
|
||||
if (this.wsUri.charAt(wsUri.length - 1) != '/') {
|
||||
this.wsUri = '/';
|
||||
}
|
||||
this.wsUri += 'room';
|
||||
this.session = new Session_1.Session(this);
|
||||
}
|
||||
OpenVidu.prototype.getRoom = function () {
|
||||
return this.room;
|
||||
return this.session;
|
||||
};
|
||||
OpenVidu.prototype.connect = function (callback) {
|
||||
this.callback = callback;
|
||||
|
|
@ -69,7 +74,7 @@ System.register("OpenVidu", ["Room", "Stream"], function(exports_1, context_1) {
|
|||
};
|
||||
OpenVidu.prototype.customNotification = function (params) {
|
||||
if (this.isRoomAvailable()) {
|
||||
this.room.emitEvent("custom-message-received", [{ params: params }]);
|
||||
this.session.emitEvent("custom-message-received", [{ params: params }]);
|
||||
}
|
||||
};
|
||||
OpenVidu.prototype.connectCallback = function (error) {
|
||||
|
|
@ -81,7 +86,7 @@ System.register("OpenVidu", ["Room", "Stream"], function(exports_1, context_1) {
|
|||
}
|
||||
};
|
||||
OpenVidu.prototype.isRoomAvailable = function () {
|
||||
if (this.room !== undefined && this.room instanceof Room_1.Room) {
|
||||
if (this.session !== undefined && this.session instanceof Session_1.Session) {
|
||||
return true;
|
||||
}
|
||||
else {
|
||||
|
|
@ -92,7 +97,7 @@ System.register("OpenVidu", ["Room", "Stream"], function(exports_1, context_1) {
|
|||
OpenVidu.prototype.disconnectCallback = function () {
|
||||
console.log('Websocket connection lost');
|
||||
if (this.isRoomAvailable()) {
|
||||
this.room.onLostConnection();
|
||||
this.session.onLostConnection();
|
||||
}
|
||||
else {
|
||||
alert('Connection error. Please reload page.');
|
||||
|
|
@ -101,7 +106,7 @@ System.register("OpenVidu", ["Room", "Stream"], function(exports_1, context_1) {
|
|||
OpenVidu.prototype.reconnectingCallback = function () {
|
||||
console.log('Websocket connection lost (reconnecting)');
|
||||
if (this.isRoomAvailable()) {
|
||||
this.room.onLostConnection();
|
||||
this.session.onLostConnection();
|
||||
}
|
||||
else {
|
||||
alert('Connection error. Please reload page.');
|
||||
|
|
@ -112,42 +117,42 @@ System.register("OpenVidu", ["Room", "Stream"], function(exports_1, context_1) {
|
|||
};
|
||||
OpenVidu.prototype.onParticipantJoined = function (params) {
|
||||
if (this.isRoomAvailable()) {
|
||||
this.room.onParticipantJoined(params);
|
||||
this.session.onParticipantJoined(params);
|
||||
}
|
||||
};
|
||||
OpenVidu.prototype.onParticipantPublished = function (params) {
|
||||
if (this.isRoomAvailable()) {
|
||||
this.room.onParticipantPublished(params);
|
||||
this.session.onParticipantPublished(params);
|
||||
}
|
||||
};
|
||||
OpenVidu.prototype.onParticipantLeft = function (params) {
|
||||
if (this.isRoomAvailable()) {
|
||||
this.room.onParticipantLeft(params);
|
||||
this.session.onParticipantLeft(params);
|
||||
}
|
||||
};
|
||||
OpenVidu.prototype.onParticipantEvicted = function (params) {
|
||||
if (this.isRoomAvailable()) {
|
||||
this.room.onParticipantEvicted(params);
|
||||
this.session.onParticipantEvicted(params);
|
||||
}
|
||||
};
|
||||
OpenVidu.prototype.onNewMessage = function (params) {
|
||||
if (this.isRoomAvailable()) {
|
||||
this.room.onNewMessage(params);
|
||||
this.session.onNewMessage(params);
|
||||
}
|
||||
};
|
||||
OpenVidu.prototype.iceCandidateEvent = function (params) {
|
||||
if (this.isRoomAvailable()) {
|
||||
this.room.recvIceCandidate(params);
|
||||
this.session.recvIceCandidate(params);
|
||||
}
|
||||
};
|
||||
OpenVidu.prototype.onRoomClosed = function (params) {
|
||||
if (this.isRoomAvailable()) {
|
||||
this.room.onRoomClosed(params);
|
||||
this.session.onRoomClosed(params);
|
||||
}
|
||||
};
|
||||
OpenVidu.prototype.onMediaError = function (params) {
|
||||
if (this.isRoomAvailable()) {
|
||||
this.room.onMediaError(params);
|
||||
this.session.onMediaError(params);
|
||||
}
|
||||
};
|
||||
OpenVidu.prototype.setRpcParams = function (params) {
|
||||
|
|
@ -172,28 +177,36 @@ System.register("OpenVidu", ["Room", "Stream"], function(exports_1, context_1) {
|
|||
};
|
||||
OpenVidu.prototype.close = function (forced) {
|
||||
if (this.isRoomAvailable()) {
|
||||
this.room.leave(forced, this.jsonRpcClient);
|
||||
this.session.leave(forced, this.jsonRpcClient);
|
||||
}
|
||||
};
|
||||
;
|
||||
OpenVidu.prototype.disconnectParticipant = function (stream) {
|
||||
if (this.isRoomAvailable()) {
|
||||
this.room.disconnect(stream);
|
||||
this.session.disconnect(stream);
|
||||
}
|
||||
};
|
||||
OpenVidu.prototype.Stream = function (room, options) {
|
||||
OpenVidu.prototype.getCamera = function (options) {
|
||||
if (this.camera) {
|
||||
return this.camera;
|
||||
}
|
||||
options = options || {
|
||||
audio: true,
|
||||
video: true,
|
||||
data: true
|
||||
};
|
||||
options.participant = room.getLocalParticipant();
|
||||
return new Stream_1.Stream(this, true, room, options);
|
||||
options.participant = this.session.getLocalParticipant();
|
||||
this.camera = new Stream_1.Stream(this, true, this.session, options);
|
||||
return this.camera;
|
||||
};
|
||||
;
|
||||
OpenVidu.prototype.Room = function (options) {
|
||||
var room = new Room_1.Room(this, options);
|
||||
return room;
|
||||
OpenVidu.prototype.joinSession = function (options, callback) {
|
||||
var _this = this;
|
||||
this.session.configure(options);
|
||||
this.session.connect();
|
||||
this.session.addEventListener('room-connected', function (roomEvent) { return callback(undefined, _this.session); });
|
||||
this.session.addEventListener('error-room', function (error) { return callback(error); });
|
||||
return this.session;
|
||||
};
|
||||
;
|
||||
//CHAT
|
||||
|
|
@ -238,22 +251,24 @@ System.register("Participant", ["Stream"], function(exports_2, context_2) {
|
|||
this.options = options;
|
||||
this.streams = {};
|
||||
this.streamsOpts = [];
|
||||
this.id = options.id;
|
||||
if (options.streams) {
|
||||
for (var _i = 0, _a = options.streams; _i < _a.length; _i++) {
|
||||
var streamOptions = _a[_i];
|
||||
var streamOpts = {
|
||||
id: streamOptions.id,
|
||||
participant: this,
|
||||
recvVideo: (streamOptions.recvVideo == undefined ? true : streamOptions.recvVideo),
|
||||
recvAudio: (streamOptions.recvAudio == undefined ? true : streamOptions.recvAudio),
|
||||
audio: streamOptions.audio,
|
||||
video: streamOptions.video,
|
||||
data: streamOptions.data
|
||||
};
|
||||
var stream = new Stream_2.Stream(openVidu, false, room, streamOpts);
|
||||
this.addStream(stream);
|
||||
this.streamsOpts.push(streamOpts);
|
||||
if (options) {
|
||||
this.id = options.id;
|
||||
if (options.streams) {
|
||||
for (var _i = 0, _a = options.streams; _i < _a.length; _i++) {
|
||||
var streamOptions = _a[_i];
|
||||
var streamOpts = {
|
||||
id: streamOptions.id,
|
||||
participant: this,
|
||||
recvVideo: (streamOptions.recvVideo == undefined ? true : streamOptions.recvVideo),
|
||||
recvAudio: (streamOptions.recvAudio == undefined ? true : streamOptions.recvAudio),
|
||||
audio: streamOptions.audio,
|
||||
video: streamOptions.video,
|
||||
data: streamOptions.data
|
||||
};
|
||||
var stream = new Stream_2.Stream(openVidu, false, room, streamOpts);
|
||||
this.addStream(stream);
|
||||
this.streamsOpts.push(streamOpts);
|
||||
}
|
||||
}
|
||||
}
|
||||
console.log("New " + (local ? "local " : "remote ") + "participant " + this.id
|
||||
|
|
@ -263,8 +278,8 @@ System.register("Participant", ["Stream"], function(exports_2, context_2) {
|
|||
this.id = newId;
|
||||
};
|
||||
Participant.prototype.addStream = function (stream) {
|
||||
this.streams[stream.getID()] = stream;
|
||||
this.room.getStreams()[stream.getID()] = stream;
|
||||
this.streams[stream.getIdInParticipant()] = stream;
|
||||
this.room.getStreams()[stream.getIdInParticipant()] = stream;
|
||||
};
|
||||
Participant.prototype.getStreams = function () {
|
||||
return this.streams;
|
||||
|
|
@ -274,13 +289,13 @@ System.register("Participant", ["Stream"], function(exports_2, context_2) {
|
|||
this.streams[key].dispose();
|
||||
}
|
||||
};
|
||||
Participant.prototype.getID = function () {
|
||||
Participant.prototype.getId = function () {
|
||||
return this.id;
|
||||
};
|
||||
Participant.prototype.sendIceCandidate = function (candidate) {
|
||||
console.debug((this.local ? "Local" : "Remote"), "candidate for", this.getID(), JSON.stringify(candidate));
|
||||
console.debug((this.local ? "Local" : "Remote"), "candidate for", this.getId(), JSON.stringify(candidate));
|
||||
this.openVidu.sendRequest("onIceCandidate", {
|
||||
endpointName: this.getID(),
|
||||
endpointName: this.getId(),
|
||||
candidate: candidate.candidate,
|
||||
sdpMid: candidate.sdpMid,
|
||||
sdpMLineIndex: candidate.sdpMLineIndex
|
||||
|
|
@ -353,7 +368,7 @@ System.register("Stream", [], function(exports_3, context_3) {
|
|||
return this.localMirrored;
|
||||
};
|
||||
Stream.prototype.getChannelName = function () {
|
||||
return this.getGlobalID() + '_' + this.chanId++;
|
||||
return this.getId() + '_' + this.chanId++;
|
||||
};
|
||||
Stream.prototype.isDataChannelEnabled = function () {
|
||||
return this.dataChannel;
|
||||
|
|
@ -390,7 +405,7 @@ System.register("Stream", [], function(exports_3, context_3) {
|
|||
};
|
||||
Stream.prototype.showSpinner = function (spinnerParentId) {
|
||||
var progress = document.createElement('div');
|
||||
progress.id = 'progress-' + this.getGlobalID();
|
||||
progress.id = 'progress-' + this.getId();
|
||||
progress.style.background = "center transparent url('img/spinner.gif') no-repeat";
|
||||
var spinnerParent = document.getElementById(spinnerParentId);
|
||||
if (spinnerParent) {
|
||||
|
|
@ -398,12 +413,12 @@ System.register("Stream", [], function(exports_3, context_3) {
|
|||
}
|
||||
};
|
||||
Stream.prototype.hideSpinner = function (spinnerId) {
|
||||
spinnerId = (spinnerId === undefined) ? this.getGlobalID() : spinnerId;
|
||||
spinnerId = (spinnerId === undefined) ? this.getId() : spinnerId;
|
||||
$(jq('progress-' + spinnerId)).hide();
|
||||
};
|
||||
Stream.prototype.playOnlyVideo = function (parentElement, thumbnailId) {
|
||||
this.video = document.createElement('video');
|
||||
this.video.id = 'native-video-' + this.getGlobalID();
|
||||
this.video.id = 'native-video-' + this.getId();
|
||||
this.video.autoplay = true;
|
||||
this.video.controls = false;
|
||||
if (this.wrStream) {
|
||||
|
|
@ -412,7 +427,7 @@ System.register("Stream", [], function(exports_3, context_3) {
|
|||
this.hideSpinner();
|
||||
}
|
||||
else {
|
||||
console.log("No wrStream yet for", this.getGlobalID());
|
||||
console.log("No wrStream yet for", this.getId());
|
||||
}
|
||||
this.videoElements.push({
|
||||
thumb: thumbnailId,
|
||||
|
|
@ -435,7 +450,7 @@ System.register("Stream", [], function(exports_3, context_3) {
|
|||
Stream.prototype.playThumbnail = function (thumbnailId) {
|
||||
var container = document.createElement('div');
|
||||
container.className = "participant";
|
||||
container.id = this.getGlobalID();
|
||||
container.id = this.getId();
|
||||
var thumbnail = document.getElementById(thumbnailId);
|
||||
if (thumbnail) {
|
||||
thumbnail.appendChild(container);
|
||||
|
|
@ -443,32 +458,32 @@ System.register("Stream", [], function(exports_3, context_3) {
|
|||
this.elements.push(container);
|
||||
var name = document.createElement('div');
|
||||
container.appendChild(name);
|
||||
var userName = this.getGlobalID().replace('_webcam', '');
|
||||
var userName = this.getId().replace('_webcam', '');
|
||||
if (userName.length >= 16) {
|
||||
userName = userName.substring(0, 16) + "...";
|
||||
}
|
||||
name.appendChild(document.createTextNode(userName));
|
||||
name.id = "name-" + this.getGlobalID();
|
||||
name.id = "name-" + this.getId();
|
||||
name.className = "name";
|
||||
name.title = this.getGlobalID();
|
||||
name.title = this.getId();
|
||||
this.showSpinner(thumbnailId);
|
||||
return this.playOnlyVideo(container, thumbnailId);
|
||||
};
|
||||
Stream.prototype.getID = function () {
|
||||
Stream.prototype.getIdInParticipant = function () {
|
||||
return this.id;
|
||||
};
|
||||
Stream.prototype.getParticipant = function () {
|
||||
return this.participant;
|
||||
};
|
||||
Stream.prototype.getGlobalID = function () {
|
||||
Stream.prototype.getId = function () {
|
||||
if (this.participant) {
|
||||
return this.participant.getID() + "_" + this.id;
|
||||
return this.participant.getId() + "_" + this.id;
|
||||
}
|
||||
else {
|
||||
return this.id + "_webcam";
|
||||
}
|
||||
};
|
||||
Stream.prototype.init = function () {
|
||||
Stream.prototype.requestCameraAccess = function (callback) {
|
||||
var _this = this;
|
||||
this.participant.addStream(this);
|
||||
var constraints = {
|
||||
|
|
@ -484,10 +499,10 @@ System.register("Stream", [], function(exports_3, context_3) {
|
|||
};
|
||||
getUserMedia(constraints, function (userStream) {
|
||||
_this.wrStream = userStream;
|
||||
_this.ee.emitEvent('access-accepted', null);
|
||||
callback(undefined, _this);
|
||||
}, function (error) {
|
||||
console.error("Access denied", error);
|
||||
_this.ee.emitEvent('access-denied', null);
|
||||
callback(error, undefined);
|
||||
});
|
||||
};
|
||||
Stream.prototype.publishVideoCallback = function (error, sdpOfferParam, wp) {
|
||||
|
|
@ -497,7 +512,7 @@ System.register("Stream", [], function(exports_3, context_3) {
|
|||
+ JSON.stringify(error));
|
||||
}
|
||||
console.log("Sending SDP offer to publish as "
|
||||
+ this.getGlobalID(), sdpOfferParam);
|
||||
+ this.getId(), sdpOfferParam);
|
||||
this.openVidu.sendRequest("publishVideo", {
|
||||
sdpOffer: sdpOfferParam,
|
||||
doLoopback: this.displayMyRemote() || false
|
||||
|
|
@ -520,9 +535,9 @@ System.register("Stream", [], function(exports_3, context_3) {
|
|||
+ JSON.stringify(error));
|
||||
}
|
||||
console.log("Sending SDP offer to subscribe to "
|
||||
+ this.getGlobalID(), sdpOfferParam);
|
||||
+ this.getId(), sdpOfferParam);
|
||||
this.openVidu.sendRequest("receiveVideoFrom", {
|
||||
sender: this.getGlobalID(),
|
||||
sender: this.getId(),
|
||||
sdpOffer: sdpOfferParam
|
||||
}, function (error, response) {
|
||||
if (error) {
|
||||
|
|
@ -585,7 +600,7 @@ System.register("Stream", [], function(exports_3, context_3) {
|
|||
});
|
||||
}
|
||||
console.log("Waiting for SDP offer to be generated ("
|
||||
+ (this.local ? "local" : "remote") + " peer: " + this.getGlobalID() + ")");
|
||||
+ (this.local ? "local" : "remote") + " peer: " + this.getId() + ")");
|
||||
};
|
||||
Stream.prototype.publish = function () {
|
||||
// FIXME: Throw error when stream is not local
|
||||
|
|
@ -606,8 +621,8 @@ System.register("Stream", [], function(exports_3, context_3) {
|
|||
type: 'answer',
|
||||
sdp: sdpAnswer,
|
||||
});
|
||||
console.log(this.getGlobalID() + ": set peer connection with recvd SDP answer", sdpAnswer);
|
||||
var participantId = this.getGlobalID();
|
||||
console.log(this.getId() + ": set peer connection with recvd SDP answer", sdpAnswer);
|
||||
var participantId = this.getId();
|
||||
var pc = this.wp.peerConnection;
|
||||
pc.setRemoteDescription(answer, function () {
|
||||
// Avoids to subscribe to your own stream remotely
|
||||
|
|
@ -635,9 +650,9 @@ System.register("Stream", [], function(exports_3, context_3) {
|
|||
var video = videoElement.video;
|
||||
video.src = URL.createObjectURL(_this.wrStream);
|
||||
video.onplay = function () {
|
||||
console.log(_this.getGlobalID() + ': ' + 'Video playing');
|
||||
console.log(_this.getId() + ': ' + 'Video playing');
|
||||
$(jq(thumbnailId)).show();
|
||||
_this.hideSpinner(_this.getGlobalID());
|
||||
_this.hideSpinner(_this.getId());
|
||||
};
|
||||
};
|
||||
for (var _i = 0, _a = _this.videoElements; _i < _a.length; _i++) {
|
||||
|
|
@ -649,7 +664,7 @@ System.register("Stream", [], function(exports_3, context_3) {
|
|||
}]);
|
||||
}
|
||||
}, function (error) {
|
||||
console.error(_this.getGlobalID() + ": Error setting SDP to the peer connection: "
|
||||
console.error(_this.getId() + ": Error setting SDP to the peer connection: "
|
||||
+ JSON.stringify(error));
|
||||
});
|
||||
};
|
||||
|
|
@ -670,7 +685,7 @@ System.register("Stream", [], function(exports_3, context_3) {
|
|||
if (this.speechEvent) {
|
||||
this.speechEvent.stop();
|
||||
}
|
||||
console.log(this.getGlobalID() + ": Stream '" + this.id + "' unpublished");
|
||||
console.log(this.getId() + ": Stream '" + this.id + "' unpublished");
|
||||
};
|
||||
Stream.prototype.dispose = function () {
|
||||
function disposeElement(element) {
|
||||
|
|
@ -680,7 +695,7 @@ System.register("Stream", [], function(exports_3, context_3) {
|
|||
}
|
||||
this.elements.forEach(function (e) { return disposeElement(e); });
|
||||
this.videoElements.forEach(function (ve) { return disposeElement(ve); });
|
||||
disposeElement("progress-" + this.getGlobalID());
|
||||
disposeElement("progress-" + this.getId());
|
||||
if (this.wp) {
|
||||
this.wp.dispose();
|
||||
}
|
||||
|
|
@ -697,7 +712,7 @@ System.register("Stream", [], function(exports_3, context_3) {
|
|||
if (this.speechEvent) {
|
||||
this.speechEvent.stop();
|
||||
}
|
||||
console.log(this.getGlobalID() + ": Stream '" + this.id + "' disposed");
|
||||
console.log(this.getId() + ": Stream '" + this.id + "' disposed");
|
||||
};
|
||||
return Stream;
|
||||
}());
|
||||
|
|
@ -705,35 +720,38 @@ System.register("Stream", [], function(exports_3, context_3) {
|
|||
}
|
||||
}
|
||||
});
|
||||
System.register("Room", ["Participant"], function(exports_4, context_4) {
|
||||
System.register("Session", ["Participant"], function(exports_4, context_4) {
|
||||
"use strict";
|
||||
var __moduleName = context_4 && context_4.id;
|
||||
var Participant_1;
|
||||
var Room;
|
||||
var Session;
|
||||
return {
|
||||
setters:[
|
||||
function (Participant_1_1) {
|
||||
Participant_1 = Participant_1_1;
|
||||
}],
|
||||
execute: function() {
|
||||
Room = (function () {
|
||||
function Room(openVidu, options) {
|
||||
Session = (function () {
|
||||
function Session(openVidu) {
|
||||
this.openVidu = openVidu;
|
||||
this.options = options;
|
||||
this.ee = new EventEmitter();
|
||||
this.streams = {};
|
||||
this.participants = {};
|
||||
this.participantsSpeaking = [];
|
||||
this.connected = false;
|
||||
this.name = options.room;
|
||||
this.localParticipant = new Participant_1.Participant(this.openVidu, true, this);
|
||||
}
|
||||
Session.prototype.configure = function (options) {
|
||||
this.options = options;
|
||||
this.id = options.sessionId;
|
||||
this.subscribeToStreams = options.subscribeToStreams || true;
|
||||
this.updateSpeakerInterval = options.updateSpeakerInterval || 1500;
|
||||
this.thresholdSpeaker = options.thresholdSpeaker || -50;
|
||||
this.localParticipant.setId(options.participantId);
|
||||
this.activateUpdateMainSpeaker();
|
||||
this.localParticipant = new Participant_1.Participant(openVidu, true, this, { id: options.user });
|
||||
this.participants[options.user] = this.localParticipant;
|
||||
}
|
||||
Room.prototype.activateUpdateMainSpeaker = function () {
|
||||
this.participants[options.participantId] = this.localParticipant;
|
||||
};
|
||||
Session.prototype.activateUpdateMainSpeaker = function () {
|
||||
var _this = this;
|
||||
setInterval(function () {
|
||||
if (_this.participantsSpeaking.length > 0) {
|
||||
|
|
@ -743,20 +761,20 @@ System.register("Room", ["Participant"], function(exports_4, context_4) {
|
|||
}
|
||||
}, this.updateSpeakerInterval);
|
||||
};
|
||||
Room.prototype.getLocalParticipant = function () {
|
||||
Session.prototype.getLocalParticipant = function () {
|
||||
return this.localParticipant;
|
||||
};
|
||||
Room.prototype.addEventListener = function (eventName, listener) {
|
||||
Session.prototype.addEventListener = function (eventName, listener) {
|
||||
this.ee.addListener(eventName, listener);
|
||||
};
|
||||
Room.prototype.emitEvent = function (eventName, eventsArray) {
|
||||
Session.prototype.emitEvent = function (eventName, eventsArray) {
|
||||
this.ee.emitEvent(eventName, eventsArray);
|
||||
};
|
||||
Room.prototype.connect = function () {
|
||||
Session.prototype.connect = function () {
|
||||
var _this = this;
|
||||
var joinParams = {
|
||||
user: this.options.user,
|
||||
room: this.options.room,
|
||||
user: this.options.participantId,
|
||||
room: this.options.sessionId,
|
||||
dataChannels: false
|
||||
};
|
||||
if (this.localParticipant) {
|
||||
|
|
@ -783,7 +801,7 @@ System.register("Room", ["Participant"], function(exports_4, context_4) {
|
|||
var length_1 = exParticipants.length;
|
||||
for (var i = 0; i < length_1; i++) {
|
||||
var participant = new Participant_1.Participant(_this.openVidu, false, _this, exParticipants[i]);
|
||||
_this.participants[participant.getID()] = participant;
|
||||
_this.participants[participant.getId()] = participant;
|
||||
roomEvent.participants.push(participant);
|
||||
var streams = participant.getStreams();
|
||||
for (var key in streams) {
|
||||
|
|
@ -794,15 +812,21 @@ System.register("Room", ["Participant"], function(exports_4, context_4) {
|
|||
}
|
||||
}
|
||||
_this.ee.emitEvent('room-connected', [roomEvent]);
|
||||
if (_this.subscribeToStreams) {
|
||||
for (var _i = 0, _a = roomEvent.streams; _i < _a.length; _i++) {
|
||||
var stream = _a[_i];
|
||||
_this.ee.emitEvent('stream-added', [{ stream: stream }]);
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
};
|
||||
Room.prototype.subscribe = function (stream) {
|
||||
Session.prototype.subscribe = function (stream) {
|
||||
stream.subscribe();
|
||||
};
|
||||
Room.prototype.onParticipantPublished = function (options) {
|
||||
Session.prototype.onParticipantPublished = function (options) {
|
||||
var participant = new Participant_1.Participant(this.openVidu, false, this, options);
|
||||
var pid = participant.getID();
|
||||
var pid = participant.getId();
|
||||
if (!(pid in this.participants)) {
|
||||
console.info("Publisher not found in participants list by its id", pid);
|
||||
}
|
||||
|
|
@ -811,23 +835,19 @@ System.register("Room", ["Participant"], function(exports_4, context_4) {
|
|||
}
|
||||
//replacing old participant (this one has streams)
|
||||
this.participants[pid] = participant;
|
||||
this.ee.emitEvent('participant-published', [{
|
||||
participant: participant
|
||||
}]);
|
||||
this.ee.emitEvent('participant-published', [{ participant: participant }]);
|
||||
var streams = participant.getStreams();
|
||||
for (var key in streams) {
|
||||
var stream = streams[key];
|
||||
if (this.subscribeToStreams) {
|
||||
stream.subscribe();
|
||||
this.ee.emitEvent('stream-added', [{
|
||||
stream: stream
|
||||
}]);
|
||||
this.ee.emitEvent('stream-added', [{ stream: stream }]);
|
||||
}
|
||||
}
|
||||
};
|
||||
Room.prototype.onParticipantJoined = function (msg) {
|
||||
Session.prototype.onParticipantJoined = function (msg) {
|
||||
var participant = new Participant_1.Participant(this.openVidu, false, this, msg);
|
||||
var pid = participant.getID();
|
||||
var pid = participant.getId();
|
||||
if (!(pid in this.participants)) {
|
||||
console.log("New participant to participants list with id", pid);
|
||||
this.participants[pid] = participant;
|
||||
|
|
@ -842,7 +862,7 @@ System.register("Room", ["Participant"], function(exports_4, context_4) {
|
|||
participant: participant
|
||||
}]);
|
||||
};
|
||||
Room.prototype.onParticipantLeft = function (msg) {
|
||||
Session.prototype.onParticipantLeft = function (msg) {
|
||||
var participant = this.participants[msg.name];
|
||||
if (participant !== undefined) {
|
||||
delete this.participants[msg.name];
|
||||
|
|
@ -864,13 +884,13 @@ System.register("Room", ["Participant"], function(exports_4, context_4) {
|
|||
}
|
||||
};
|
||||
;
|
||||
Room.prototype.onParticipantEvicted = function (msg) {
|
||||
Session.prototype.onParticipantEvicted = function (msg) {
|
||||
this.ee.emitEvent('participant-evicted', [{
|
||||
localParticipant: this.localParticipant
|
||||
}]);
|
||||
};
|
||||
;
|
||||
Room.prototype.onNewMessage = function (msg) {
|
||||
Session.prototype.onNewMessage = function (msg) {
|
||||
console.log("New message: " + JSON.stringify(msg));
|
||||
var room = msg.room;
|
||||
var user = msg.user;
|
||||
|
|
@ -886,7 +906,7 @@ System.register("Room", ["Participant"], function(exports_4, context_4) {
|
|||
console.error("User undefined in new message:", msg);
|
||||
}
|
||||
};
|
||||
Room.prototype.recvIceCandidate = function (msg) {
|
||||
Session.prototype.recvIceCandidate = function (msg) {
|
||||
var candidate = {
|
||||
candidate: msg.candidate,
|
||||
sdpMid: msg.sdpMid,
|
||||
|
|
@ -913,7 +933,7 @@ System.register("Room", ["Participant"], function(exports_4, context_4) {
|
|||
_loop_2(key);
|
||||
}
|
||||
};
|
||||
Room.prototype.onRoomClosed = function (msg) {
|
||||
Session.prototype.onRoomClosed = function (msg) {
|
||||
console.log("Room closed: " + JSON.stringify(msg));
|
||||
var room = msg.room;
|
||||
if (room !== undefined) {
|
||||
|
|
@ -925,13 +945,13 @@ System.register("Room", ["Participant"], function(exports_4, context_4) {
|
|||
console.error("Room undefined in on room closed", msg);
|
||||
}
|
||||
};
|
||||
Room.prototype.onLostConnection = function () {
|
||||
Session.prototype.onLostConnection = function () {
|
||||
if (!this.connected) {
|
||||
console.warn('Not connected to room, ignoring lost connection notification');
|
||||
return;
|
||||
}
|
||||
console.log('Lost connection in room ' + this.name);
|
||||
var room = this.name;
|
||||
console.log('Lost connection in room ' + this.id);
|
||||
var room = this.id;
|
||||
if (room !== undefined) {
|
||||
this.ee.emitEvent('lost-connection', [{ room: room }]);
|
||||
}
|
||||
|
|
@ -939,7 +959,7 @@ System.register("Room", ["Participant"], function(exports_4, context_4) {
|
|||
console.error('Room undefined when lost connection');
|
||||
}
|
||||
};
|
||||
Room.prototype.onMediaError = function (params) {
|
||||
Session.prototype.onMediaError = function (params) {
|
||||
console.error("Media error: " + JSON.stringify(params));
|
||||
var error = params.error;
|
||||
if (error) {
|
||||
|
|
@ -954,7 +974,7 @@ System.register("Room", ["Participant"], function(exports_4, context_4) {
|
|||
/*
|
||||
* forced means the user was evicted, no need to send the 'leaveRoom' request
|
||||
*/
|
||||
Room.prototype.leave = function (forced, jsonRpcClient) {
|
||||
Session.prototype.leave = function (forced, jsonRpcClient) {
|
||||
forced = !!forced;
|
||||
console.log("Leaving room (forced=" + forced + ")");
|
||||
if (this.connected && !forced) {
|
||||
|
|
@ -976,16 +996,16 @@ System.register("Room", ["Participant"], function(exports_4, context_4) {
|
|||
}
|
||||
}
|
||||
};
|
||||
Room.prototype.disconnect = function (stream) {
|
||||
Session.prototype.disconnect = function (stream) {
|
||||
var participant = stream.getParticipant();
|
||||
if (!participant) {
|
||||
console.error("Stream to disconnect has no participant", stream);
|
||||
return;
|
||||
}
|
||||
delete this.participants[participant.getID()];
|
||||
delete this.participants[participant.getId()];
|
||||
participant.dispose();
|
||||
if (participant === this.localParticipant) {
|
||||
console.log("Unpublishing my media (I'm " + participant.getID() + ")");
|
||||
console.log("Unpublishing my media (I'm " + participant.getId() + ")");
|
||||
delete this.localParticipant;
|
||||
this.openVidu.sendRequest('unpublishVideo', function (error, response) {
|
||||
if (error) {
|
||||
|
|
@ -997,26 +1017,26 @@ System.register("Room", ["Participant"], function(exports_4, context_4) {
|
|||
});
|
||||
}
|
||||
else {
|
||||
console.log("Unsubscribing from " + stream.getGlobalID());
|
||||
console.log("Unsubscribing from " + stream.getId());
|
||||
this.openVidu.sendRequest('unsubscribeFromVideo', {
|
||||
sender: stream.getGlobalID()
|
||||
sender: stream.getId()
|
||||
}, function (error, response) {
|
||||
if (error) {
|
||||
console.error(error);
|
||||
}
|
||||
else {
|
||||
console.info("Unsubscribed correctly from " + stream.getGlobalID());
|
||||
console.info("Unsubscribed correctly from " + stream.getId());
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
Room.prototype.getStreams = function () {
|
||||
Session.prototype.getStreams = function () {
|
||||
return this.streams;
|
||||
};
|
||||
Room.prototype.addParticipantSpeaking = function (participantId) {
|
||||
Session.prototype.addParticipantSpeaking = function (participantId) {
|
||||
this.participantsSpeaking.push(participantId);
|
||||
};
|
||||
Room.prototype.removeParticipantSpeaking = function (participantId) {
|
||||
Session.prototype.removeParticipantSpeaking = function (participantId) {
|
||||
var pos = -1;
|
||||
for (var i = 0; i < this.participantsSpeaking.length; i++) {
|
||||
if (this.participantsSpeaking[i] == participantId) {
|
||||
|
|
@ -1028,20 +1048,20 @@ System.register("Room", ["Participant"], function(exports_4, context_4) {
|
|||
this.participantsSpeaking.splice(pos, 1);
|
||||
}
|
||||
};
|
||||
return Room;
|
||||
return Session;
|
||||
}());
|
||||
exports_4("Room", Room);
|
||||
exports_4("Session", Session);
|
||||
}
|
||||
}
|
||||
});
|
||||
System.register("Main", ["Room", "Participant", "Stream", "OpenVidu"], function(exports_5, context_5) {
|
||||
System.register("Main", ["Session", "Participant", "Stream", "OpenVidu"], function(exports_5, context_5) {
|
||||
"use strict";
|
||||
var __moduleName = context_5 && context_5.id;
|
||||
return {
|
||||
setters:[
|
||||
function (Room_2_1) {
|
||||
function (Session_2_1) {
|
||||
exports_5({
|
||||
"Room": Room_2_1["Room"]
|
||||
"Session": Session_2_1["Session"]
|
||||
});
|
||||
},
|
||||
function (Participant_2_1) {
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -18,7 +18,7 @@
|
|||
<script src="./js/stats.js"></script>
|
||||
|
||||
<script>
|
||||
System.import('Main').then(function(m){ Main = m; }, console.error.bind(console));
|
||||
System.import('Main').then(function(m){ OpenVidu = m.OpenVidu; }, console.error.bind(console));
|
||||
</script>
|
||||
|
||||
</head>
|
||||
|
|
@ -27,13 +27,13 @@
|
|||
<div id="wrapper">
|
||||
<div id="join" class="animate join">
|
||||
<h1>Join a Room</h1>
|
||||
<form onsubmit="register(); return false;" accept-charset="UTF-8">
|
||||
<form onsubmit="joinRoom(); return false;" accept-charset="UTF-8">
|
||||
<p>
|
||||
<input type="text" name="name" value="" id="name"
|
||||
placeholder="Username" required>
|
||||
<input type="text" name="user" value="" id="userId"
|
||||
placeholder="User" required>
|
||||
</p>
|
||||
<p>
|
||||
<input type="text" name="room" value="" id="roomName"
|
||||
<input type="text" name="room" value="" id="roomId"
|
||||
placeholder="Room" required>
|
||||
</p>
|
||||
<p class="submit">
|
||||
|
|
|
|||
|
|
@ -15,86 +15,86 @@
|
|||
*
|
||||
*/
|
||||
var openVidu;
|
||||
var room;
|
||||
var session;
|
||||
|
||||
window.onload = function() {
|
||||
console = new Console('console', console);
|
||||
}
|
||||
|
||||
function playVideo(stream) {
|
||||
|
||||
var elementId = "video-" + stream.getGlobalID();
|
||||
function addVideoTag(stream) {
|
||||
|
||||
var elementId = "video-" + stream.getId();
|
||||
var div = document.createElement('div');
|
||||
div.setAttribute("id", elementId);
|
||||
document.getElementById("participants").appendChild(div);
|
||||
|
||||
|
||||
stream.playThumbnail(elementId);
|
||||
|
||||
// Check color
|
||||
var videoTag = document.getElementById("native-" + elementId);
|
||||
var userId = stream.getGlobalID();
|
||||
var userId = stream.getId();
|
||||
var canvas = document.createElement('CANVAS');
|
||||
checkColor(videoTag, canvas, userId);
|
||||
}
|
||||
|
||||
function register() {
|
||||
|
||||
var userId = document.getElementById('name').value;
|
||||
var roomId = document.getElementById('roomName').value;
|
||||
|
||||
var wsUri = 'wss://' + location.host + '/room';
|
||||
|
||||
openVidu = new Main.OpenVidu(wsUri);
|
||||
function removeVideoTag(stream){
|
||||
|
||||
var elementId = "video-" + stream.getId();
|
||||
var element = document.getElementById(elementId);
|
||||
if (element) {
|
||||
element.parentNode.removeChild(element);
|
||||
}
|
||||
}
|
||||
|
||||
function joinRoom() {
|
||||
|
||||
var sessionId = document.getElementById('roomId').value;
|
||||
var participantId = document.getElementById('userId').value;
|
||||
|
||||
openVidu = new OpenVidu('wss://' + location.host + '/');
|
||||
|
||||
openVidu.connect(function(error, openVidu) {
|
||||
|
||||
if (error)
|
||||
return console.log(error);
|
||||
|
||||
room = openVidu.Room({
|
||||
room : roomId,
|
||||
user : userId,
|
||||
subscribeToStreams : true
|
||||
});
|
||||
var camera = openVidu.getCamera();
|
||||
|
||||
var camera = openVidu.Stream(room);
|
||||
camera.requestCameraAccess(function(error, camera) {
|
||||
|
||||
camera.addEventListener("access-accepted", function() {
|
||||
if (error)
|
||||
return console.log(error);
|
||||
|
||||
room.addEventListener("room-connected", function(roomEvent) {
|
||||
var sessionOptions = {
|
||||
sessionId : sessionId,
|
||||
participantId : participantId
|
||||
}
|
||||
|
||||
openVidu.joinSession(sessionOptions, function(error, session) {
|
||||
|
||||
if (error)
|
||||
return console.log(error);
|
||||
|
||||
document.getElementById('room-header').innerText = 'ROOM \"'
|
||||
+ room.name + '\"';
|
||||
+ session.name + '\"';
|
||||
|
||||
document.getElementById('join').style.display = 'none';
|
||||
document.getElementById('room').style.display = 'block';
|
||||
|
||||
addVideoTag(camera);
|
||||
|
||||
camera.publish();
|
||||
|
||||
session.addEventListener("stream-added", function(streamEvent) {
|
||||
addVideoTag(streamEvent.stream);
|
||||
});
|
||||
|
||||
var streams = roomEvent.streams;
|
||||
for (var i = 0; i < streams.length; i++) {
|
||||
playVideo(streams[i]);
|
||||
}
|
||||
});
|
||||
|
||||
room.addEventListener("stream-added", function(streamEvent) {
|
||||
playVideo(streamEvent.stream);
|
||||
});
|
||||
|
||||
room.addEventListener("stream-removed", function(streamEvent) {
|
||||
var element = document.getElementById("video-"
|
||||
+ streamEvent.stream.getGlobalID());
|
||||
if (element !== undefined) {
|
||||
element.parentNode.removeChild(element);
|
||||
}
|
||||
});
|
||||
|
||||
playVideo(camera);
|
||||
|
||||
room.connect();
|
||||
session.addEventListener("stream-removed", function(streamEvent) {
|
||||
removeVideoTag(streamEvent.stream);
|
||||
});
|
||||
|
||||
});
|
||||
});
|
||||
|
||||
camera.init();
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
|
|
@ -103,15 +103,6 @@ function leaveRoom() {
|
|||
document.getElementById('join').style.display = 'block';
|
||||
document.getElementById('room').style.display = 'none';
|
||||
|
||||
var streams = room.getStreams();
|
||||
for (var index in streams) {
|
||||
var stream = streams[index];
|
||||
var element = document.getElementById("video-" + stream.getGlobalID());
|
||||
if (element) {
|
||||
element.parentNode.removeChild(element);
|
||||
}
|
||||
}
|
||||
|
||||
openVidu.close();
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue