Created
June 3, 2019 22:22
-
-
Save drew-thompson/4d93be95a82d054924dad311ed1e26fe to your computer and use it in GitHub Desktop.
Basic lib-jitsi-meet Angular Implementation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { Component, OnInit } from '@angular/core'; | |
@Component({ | |
selector: 'app-root', | |
templateUrl: './app.component.html', | |
styleUrls: ['./app.component.scss'] | |
}) | |
export class AppComponent implements OnInit { | |
title = 'jitsi'; | |
private jitsi: any; | |
private connection: any; | |
private room: any; | |
private options = { | |
hosts: { | |
domain: 'jitsi-meet.example.com', | |
muc: 'conference.jitsi-meet.example.com' // FIXME: use XEP-0030 | |
}, | |
bosh: '//jitsi-meet.example.com/http-bind', // FIXME: use xep-0156 for that | |
// The name of client node advertised in XEP-0115 'c' stanza | |
clientNode: 'http://jitsi.org/jitsimeet' | |
}; | |
private confOptions = { | |
openBridgeChannel: true | |
}; | |
private initOptions = { | |
disableAudioLevels: true, | |
// The ID of the jidesha extension for Chrome. | |
desktopSharingChromeExtId: 'mbocklcggfhnbahlnepmldehdhpjfcjp', | |
// Whether desktop sharing should be disabled on Chrome. | |
desktopSharingChromeDisabled: false, | |
// The media sources to use when using screen sharing with the Chrome | |
// extension. | |
desktopSharingChromeSources: ['screen', 'window'], | |
// Required version of Chrome extension | |
desktopSharingChromeMinExtVersion: '0.1', | |
// Whether desktop sharing should be disabled on Firefox. | |
desktopSharingFirefoxDisabled: true | |
}; | |
constructor() { | |
this.jitsi = (window as any).JitsiMeetJS; | |
} | |
ngOnInit() { | |
this.jitsi.init(this.initOptions); | |
this.connection = this.createConnection(this.options); | |
this.setConnectionListeners(this.connection); | |
this.room = this.createRoom(this.connection, this.confOptions); | |
this.setRoomListeners(this.room); | |
this.room.join(); | |
} | |
private createConnection(options: { bosh?: any; hosts: object; useStunTurn?: boolean; enableLipSync?: boolean }): any { | |
return new this.jitsi.JitsiConnection(null, null, options); | |
} | |
private setConnectionListeners(connection: any): void { | |
connection.addEventListener(this.jitsi.events.connection.CONNECTION_ESTABLISHED, this.onConnectionSuccess); | |
connection.addEventListener(this.jitsi.events.connection.CONNECTION_FAILED, this.onConnectionFailed); | |
connection.addEventListener(this.jitsi.events.connection.CONNECTION_DISCONNECTED, this.disconnect); | |
} | |
private createRoom(connection: any, options: object): void { | |
const room = connection.initJitsiConference('conference', options); | |
return room; | |
} | |
private setRoomListeners(room: any): void { | |
room.on(this.jitsi.events.conference.TRACK_ADDED, this.onRemoteTrack); | |
room.on(this.jitsi.events.conference.CONFERENCE_JOINED, this.onConferenceJoined); | |
} | |
private onConnectionSuccess(data: any): void { | |
console.log(data); | |
} | |
private onConnectionFailed(data: any): void { | |
console.log(data); | |
} | |
private disconnect(): void { | |
console.log('disconnecting?'); | |
} | |
private onRemoteTrack(data: any): void { | |
console.log(data); | |
} | |
private onConferenceJoined(data: any): void { | |
console.log(data); | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Hi @timwaldron
Yes, I reviewed the lib-jitsi-meet solution from the JS example from
https://github.com/jitsi/lib-jitsi-meet/blob/master/doc/example/example.js
I got that JS example working but considering the Time I don't have am following your iFrame API example instead.
Just can't imagine creating a whole Angular Implementation just right now.
Big Thanks @timwaldron for the iFrame API Implementation which headed me to the right direction.
And when that works anyone can basically just follow the official dev guide
https://jitsi.github.io/handbook/docs/dev-guide/dev-guide-iframe