1.0.2 • Published 4 years ago

ngafr-communication v1.0.2

Weekly downloads
3
License
MIT
Repository
github
Last release
4 years ago

NgafrCommunication

This library can be used to add WebRTC based video conferencing functionalities to your app using structural directives

Dependencies

* [ngafr-authentication](https://www.npmjs.com/package/ngafr-authentication) : For authentication
* [hark](https://www.npmjs.com/package/hark) : For events whether the user is speaking or not
* [@angular/material](https://www.npmjs.com/package/@angular/material) : For MatIcons

Install

ngafr-authentication package installation

```cmd
npm i ngafr-communication  --save
```

Installation with dependencies

```cmd
npm i firebase firebaseui @angular/fire firebaseui-angular ngafr-authentication ngafr-communication hark --save
ng add @angular/material
```

Usage

APIs :

  • connect
    • Starts the webcam
    • Use ngafr-authentication library to login into the firebase before calling this method.
          connect(): Observable<boolean>;
  • onUserUpdate
    • Gives the firebase logged in user. Null if the user is not logged in
          onUserUpdate(): BehaviorSubject<IUserOnline>;
  • onPeersOnline
    • Gives the peers who are currently logged in.
          onPeersOnline(): Observable<IUserOnline[]>;
  • call
    • Starts the call with all the online peers
          call(): void;
  • disconnect
    • Disconnects the current ongoing call.
          disconnect(): void;

Basic usage:

  • AppModule:

        import { NgafrAuthenticationModule,
            IFirebaseConf, IFirebaseAuthProviders } from 'ngafr-authentication';
        import { NgafrCommunicationModule } from 'ngafr-communication';
        @NgModule( {
            imports: [
                ...,
                NgafrAuthenticationModule   // Refer ngafr-authentication
                .forRoot(firebaseConfig, authProviders),
                NgafrCommunicationModule.forRoot(communicationConfig)
                ...
            ]
        })
  • Component:

        constructor( private comm: NgafrCommunicationService ) { }
        ngAfterViewInit() {
            this.comm.onUserUpdate().subscribe(user => {
                this.comm.connect().subscribe();
            });
        }
        call() { this.comm.call(); }
  • Template:

      <div *ngafrVideoSelf></div>
      <div *ngafrVideoPeers></div>
      <button (click)="call()"/>

Get the logged in user:

```ts
    public user: any = { avatar: '' };
        this.comm.onUserUpdate().subscribe(user => {
        if (!user) { return; }
        this.user = user;
        this.connect();
        });
```

Get all the online peers

```ts
    public onlinePeers: any = [];
        this.comm.onPeersOnline().subscribe(peers => {
            this.onlinePeers = peers;
        });
```

Disconnect with all peers

```ts
    ngOnDestroy(): void {
        this.comm.disconnect();
    }
```
1.0.2

4 years ago

1.0.1

4 years ago

0.0.1

4 years ago