mirror of https://github.com/OpenVidu/openvidu.git
openvidu-components: Updated docs
Updated build scripts docs Added description for token parameterpull/766/head
Carlos Santos
parent
d19a8406bf
commit
170c835e3b
|
|
@ -1,79 +1,79 @@
|
|||
{
|
||||
"dependencies": {
|
||||
"@angular/animations": "14.2.8",
|
||||
"@angular/cdk": "14.2.6",
|
||||
"@angular/common": "14.2.8",
|
||||
"@angular/core": "14.2.8",
|
||||
"@angular/flex-layout": "14.0.0-beta.41",
|
||||
"@angular/forms": "14.2.8",
|
||||
"@angular/material": "14.2.6",
|
||||
"@angular/platform-browser": "14.2.8",
|
||||
"@angular/platform-browser-dynamic": "14.2.8",
|
||||
"@angular/router": "14.2.8",
|
||||
"autolinker": "4.0.0",
|
||||
"openvidu-browser": "2.24.0",
|
||||
"rxjs": "7.5.7",
|
||||
"tslib": "2.3.1",
|
||||
"@angular/animations": "14.2.8",
|
||||
"@angular/cdk": "14.2.6",
|
||||
"@angular/common": "14.2.8",
|
||||
"@angular/core": "14.2.8",
|
||||
"@angular/flex-layout": "14.0.0-beta.41",
|
||||
"@angular/forms": "14.2.8",
|
||||
"@angular/material": "14.2.6",
|
||||
"@angular/platform-browser": "14.2.8",
|
||||
"@angular/platform-browser-dynamic": "14.2.8",
|
||||
"@angular/router": "14.2.8",
|
||||
"autolinker": "4.0.0",
|
||||
"openvidu-browser": "2.24.0",
|
||||
"rxjs": "7.5.7",
|
||||
"tslib": "2.3.1",
|
||||
"zone.js": "0.11.4"
|
||||
},
|
||||
},
|
||||
"devDependencies": {
|
||||
"@angular-devkit/build-angular": "14.2.7",
|
||||
"@angular/cli": "14.2.7",
|
||||
"@angular/compiler": "14.2.8",
|
||||
"@angular/compiler-cli": "14.2.8",
|
||||
"@angular/elements": "14.2.8",
|
||||
"@compodoc/compodoc": "^1.1.19",
|
||||
"@types/chai": "4.3.0",
|
||||
"@types/mocha": "9.1.0",
|
||||
"@types/node": "16.11.6",
|
||||
"@types/selenium-webdriver": "4.1.5",
|
||||
"chai": "4.3.6",
|
||||
"chromedriver": "106.0.1",
|
||||
"codelyzer": "6.0.2",
|
||||
"concat": "^1.0.3",
|
||||
"cross-env": "^7.0.3",
|
||||
"http-server": "14.1.1",
|
||||
"jasmine-core": "3.10.1",
|
||||
"jasmine-spec-reporter": "7.0.0",
|
||||
"karma": "^6.3.9",
|
||||
"karma-chrome-launcher": "3.1.1",
|
||||
"karma-coverage": "^2.0.3",
|
||||
"karma-coverage-istanbul-reporter": "3.0.3",
|
||||
"karma-jasmine": "4.0.1",
|
||||
"karma-jasmine-html-reporter": "1.7.0",
|
||||
"karma-junit-reporter": "2.0.1",
|
||||
"karma-mocha-reporter": "2.2.5",
|
||||
"karma-notify-reporter": "1.3.0",
|
||||
"mocha": "9.2.2",
|
||||
"ng-packagr": "14.2.2",
|
||||
"selenium-webdriver": "4.5.0",
|
||||
"ts-node": "10.4.0",
|
||||
"tslint": "6.1.3",
|
||||
"typescript": "4.8.4",
|
||||
"@angular-devkit/build-angular": "14.2.7",
|
||||
"@angular/cli": "14.2.7",
|
||||
"@angular/compiler": "14.2.8",
|
||||
"@angular/compiler-cli": "14.2.8",
|
||||
"@angular/elements": "14.2.8",
|
||||
"@compodoc/compodoc": "^1.1.19",
|
||||
"@types/chai": "4.3.0",
|
||||
"@types/mocha": "9.1.0",
|
||||
"@types/node": "16.11.6",
|
||||
"@types/selenium-webdriver": "4.1.5",
|
||||
"chai": "4.3.6",
|
||||
"chromedriver": "106.0.1",
|
||||
"codelyzer": "6.0.2",
|
||||
"concat": "^1.0.3",
|
||||
"cross-env": "^7.0.3",
|
||||
"http-server": "14.1.1",
|
||||
"jasmine-core": "3.10.1",
|
||||
"jasmine-spec-reporter": "7.0.0",
|
||||
"karma": "^6.3.9",
|
||||
"karma-chrome-launcher": "3.1.1",
|
||||
"karma-coverage": "^2.0.3",
|
||||
"karma-coverage-istanbul-reporter": "3.0.3",
|
||||
"karma-jasmine": "4.0.1",
|
||||
"karma-jasmine-html-reporter": "1.7.0",
|
||||
"karma-junit-reporter": "2.0.1",
|
||||
"karma-mocha-reporter": "2.2.5",
|
||||
"karma-notify-reporter": "1.3.0",
|
||||
"mocha": "9.2.2",
|
||||
"ng-packagr": "14.2.2",
|
||||
"selenium-webdriver": "4.5.0",
|
||||
"ts-node": "10.4.0",
|
||||
"tslint": "6.1.3",
|
||||
"typescript": "4.8.4",
|
||||
"webpack-bundle-analyzer": "^4.5.0"
|
||||
},
|
||||
"name": "openvidu-components-testapp",
|
||||
"private": true,
|
||||
},
|
||||
"name": "openvidu-components-testapp",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"build": "ng build openvidu-components-testapp --configuration production",
|
||||
"bundle-report": "ng build openvidu-webcomponent --stats-json --configuration production && webpack-bundle-analyzer dist/openvidu-webcomponent/stats.json",
|
||||
"doc:build": "cd projects/openvidu-angular && npx compodoc -p ./doc/tsconfig.doc.json -c ./doc/.compodocrc.json",
|
||||
"doc:clean-copy": "rm -rf ../../openvidu.io-docs/docs/api/openvidu-angular && cp -r ./docs/openvidu-angular/ ../../openvidu.io-docs/docs/api/openvidu-angular",
|
||||
"doc:serve": "cd projects/openvidu-angular && npx compodoc -p ./doc/tsconfig.doc.json --watch --serve -c ./doc/.compodocrc.json",
|
||||
"lib:build": "ng build openvidu-angular --configuration production && cd ./dist/openvidu-angular && npm pack",
|
||||
"lib:copy": "cp dist/openvidu-angular/openvidu-angular-*.tgz ../../openvidu-tutorials/openvidu-call/openvidu-call-front",
|
||||
"lib:e2e": "tsc --project ./e2e && npx mocha --recursive --timeout 30000 ./e2e/dist/angular.test.js",
|
||||
"lib:e2e-ci": "cross-env LAUNCH_MODE=CI npm run lib:e2e",
|
||||
"lib:serve": "ng build openvidu-angular --watch",
|
||||
"lib:test": "ng test openvidu-angular --no-watch --code-coverage",
|
||||
"lint": "ng lint",
|
||||
"start": "ng serve --configuration development",
|
||||
"start-prod": "npx http-server ./dist/openvidu-components-testapp/ --port 4200",
|
||||
"start:ssl": "ng serve --ssl --configuration development --host 0.0.0.0 --port 4200 --ssl-cert /path/to/cert.pem --ssl-key /path/to/key.pem",
|
||||
"webcomponent:build": "./node_modules/@angular/cli/bin/ng.js build openvidu-webcomponent --configuration production && node ./openvidu-webcomponent-build.js",
|
||||
"webcomponent:e2e": "tsc --project ./e2e && npx mocha --recursive --timeout 30000 ./e2e/dist/webcomponent.test.js",
|
||||
"webcomponent:e2e-ci": "cross-env LAUNCH_MODE=CI npm run webcomponent:e2e",
|
||||
"build": "ng build openvidu-components-testapp --configuration production",
|
||||
"bundle-report": "ng build openvidu-webcomponent --stats-json --configuration production && webpack-bundle-analyzer dist/openvidu-webcomponent/stats.json",
|
||||
"doc:build": "npx compodoc -p ./projects/openvidu-angular/doc/tsconfig.doc.json -c ./projects/openvidu-angular/doc/.compodocrc.json",
|
||||
"doc:clean-copy": "rm -rf ../../openvidu.io-docs/docs/api/openvidu-angular && cp -r ./docs/openvidu-angular/ ../../openvidu.io-docs/docs/api/openvidu-angular",
|
||||
"doc:serve": "npx compodoc --watch --serve --includes ./projects/openvidu-angular/doc/extends -c ./projects/openvidu-angular/doc/.compodocrc.json",
|
||||
"lib:build": "ng build openvidu-angular --configuration production && cd ./dist/openvidu-angular && npm pack",
|
||||
"lib:copy": "cp dist/openvidu-angular/openvidu-angular-*.tgz ../../openvidu-tutorials/openvidu-call/openvidu-call-front",
|
||||
"lib:e2e": "tsc --project ./e2e && npx mocha --recursive --timeout 30000 ./e2e/dist/angular.test.js",
|
||||
"lib:e2e-ci": "cross-env LAUNCH_MODE=CI npm run lib:e2e",
|
||||
"lib:serve": "ng build openvidu-angular --watch",
|
||||
"lib:test": "ng test openvidu-angular --no-watch --code-coverage",
|
||||
"lint": "ng lint",
|
||||
"start": "ng serve --configuration development",
|
||||
"start-prod": "npx http-server ./dist/openvidu-components-testapp/ --port 4200",
|
||||
"start:ssl": "ng serve --ssl --configuration development --host 0.0.0.0 --port 4200 --ssl-cert /path/to/cert.pem --ssl-key /path/to/key.pem",
|
||||
"webcomponent:build": "./node_modules/@angular/cli/bin/ng.js build openvidu-webcomponent --configuration production && node ./openvidu-webcomponent-build.js",
|
||||
"webcomponent:e2e": "tsc --project ./e2e && npx mocha --recursive --timeout 30000 ./e2e/dist/webcomponent.test.js",
|
||||
"webcomponent:e2e-ci": "cross-env LAUNCH_MODE=CI npm run webcomponent:e2e",
|
||||
"webcomponent:serve-testapp": "npx http-server ./e2e/webcomponent-app/"
|
||||
},
|
||||
},
|
||||
"version": "2.24.0"
|
||||
}
|
||||
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "OpenVidu Angular Documentation",
|
||||
"output": "../../docs/openvidu-angular",
|
||||
"output": "./docs/openvidu-angular",
|
||||
"hideGenerator": true,
|
||||
"disableLifeCycleHooks": true,
|
||||
"disableProtected": true,
|
||||
|
|
@ -14,7 +14,7 @@
|
|||
"disableStyleTab": true,
|
||||
"disableDependencies": true,
|
||||
"theme": "gitbook",
|
||||
"customFavicon": "doc/favicon.ico",
|
||||
"extTheme": "doc/"
|
||||
|
||||
"customFavicon": "./projects/openvidu-angular/doc/favicon.ico",
|
||||
"extTheme": "./projects/openvidu-angular/doc/",
|
||||
"tsconfig": "./projects/openvidu-angular/doc/tsconfig.doc.json"
|
||||
}
|
||||
|
|
|
|||
|
|
@ -264,32 +264,45 @@ export class VideoconferenceComponent implements OnInit, OnDestroy, AfterViewIni
|
|||
openviduAngularStreamTemplate: TemplateRef<any>;
|
||||
|
||||
/**
|
||||
* @param {TokenModel} tokens The tokens parameter must be an object with `webcam` and `screen` fields.
|
||||
* Both of them are `string` type. See {@link TokenModel}
|
||||
* Tokens parameter is required to grant a participant access to a Session.
|
||||
* This OpenVidu token will be use by each participant when connecting to a Session.
|
||||
*
|
||||
* This input accepts a {@link TokenModel} object type.
|
||||
*
|
||||
* @param {TokenModel} tokens The tokens parameter must be a {@link TokenModel} object.
|
||||
*
|
||||
*/
|
||||
@Input()
|
||||
set tokens(tokens: TokenModel) {
|
||||
let openviduEdition;
|
||||
if (!tokens || !tokens.webcam) {
|
||||
this.log.w('No tokens received');
|
||||
} else {
|
||||
this.log.w('Tokens received');
|
||||
this.openviduService.setWebcamToken(tokens.webcam);
|
||||
|
||||
const openviduEdition = new URL(tokens.webcam).searchParams.get('edition');
|
||||
if (!!openviduEdition) {
|
||||
this.openviduService.setOpenViduEdition(OpenViduEdition.PRO);
|
||||
} else {
|
||||
this.openviduService.setOpenViduEdition(OpenViduEdition.CE);
|
||||
}
|
||||
|
||||
if (tokens.screen) {
|
||||
this.openviduService.setScreenToken(tokens.screen);
|
||||
} else {
|
||||
this.log.w('No screen token found. Screenshare feature will be disabled');
|
||||
}
|
||||
|
||||
this.start();
|
||||
this.log.e('No tokens received');
|
||||
throw new Error("No token(s) received.");
|
||||
}
|
||||
|
||||
try {
|
||||
openviduEdition = new URL(tokens.webcam).searchParams.get('edition');
|
||||
} catch (error) {
|
||||
this.log.e('Token received does not seem to be valid: ', tokens.webcam);
|
||||
throw new Error(`Error validating token parameter ${error}`);
|
||||
}
|
||||
|
||||
this.log.d('Tokens received');
|
||||
if (!!openviduEdition) {
|
||||
this.openviduService.setOpenViduEdition(OpenViduEdition.PRO);
|
||||
} else {
|
||||
this.openviduService.setOpenViduEdition(OpenViduEdition.CE);
|
||||
}
|
||||
|
||||
this.openviduService.setWebcamToken(tokens.webcam);
|
||||
if (tokens.screen) {
|
||||
this.openviduService.setScreenToken(tokens.screen);
|
||||
} else {
|
||||
this.log.w('No screen token found. Screenshare feature will be disabled');
|
||||
}
|
||||
|
||||
this.start();
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
|
|||
|
|
@ -1,3 +1,12 @@
|
|||
|
||||
/**
|
||||
*
|
||||
* TokenModel type must be contain a `webcam` property (it will be used by a standart participant).
|
||||
* It also optionally can contain a `screen` property.
|
||||
*
|
||||
* If TokenModel contains the `screen` token, the participant will be able to share a screen and camera at the same time.
|
||||
* Otherwise, the participant will not be able to share a screen.
|
||||
*/
|
||||
export interface TokenModel {
|
||||
webcam: string;
|
||||
screen?: string;
|
||||
|
|
|
|||
|
|
@ -1,20 +1,20 @@
|
|||
import { BrowserModule } from '@angular/platform-browser';
|
||||
import { MatCheckboxModule } from '@angular/material/checkbox';
|
||||
import { NgModule } from '@angular/core';
|
||||
import { MatCheckboxModule } from '@angular/material/checkbox';
|
||||
import { BrowserModule } from '@angular/platform-browser';
|
||||
|
||||
import { AppRoutingModule } from './app.routing.module';
|
||||
import { AppComponent } from './app.component';
|
||||
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
|
||||
import { MatButtonModule } from '@angular/material/button';
|
||||
import { MatIconModule } from '@angular/material/icon';
|
||||
import { MatMenuModule } from '@angular/material/menu';
|
||||
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
|
||||
import { AppComponent } from './app.component';
|
||||
import { AppRoutingModule } from './app.routing.module';
|
||||
|
||||
import { environment } from 'src/environments/environment';
|
||||
|
||||
import { CallComponent } from './openvidu-call/call.component';
|
||||
import { DashboardComponent } from './dashboard/dashboard.component';
|
||||
import { TestingComponent } from './testing-app/testing.component';
|
||||
import { AdminDashboardComponent } from './admin/admin-dashboard/admin-dashboard.component';
|
||||
import { DashboardComponent } from './dashboard/dashboard.component';
|
||||
import { CallComponent } from './openvidu-call/call.component';
|
||||
import { TestingComponent } from './testing-app/testing.component';
|
||||
// openvidu-angular
|
||||
import { OpenViduAngularModule } from 'openvidu-angular';
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
import { Component, ElementRef, Input, OnInit, Output, EventEmitter } from '@angular/core';
|
||||
import { OpenViduService, TokenModel, ParticipantAbstractModel, RecordingInfo } from 'openvidu-angular';
|
||||
import { Component, ElementRef, EventEmitter, Input, OnInit, Output } from '@angular/core';
|
||||
import { OpenViduService, ParticipantAbstractModel, RecordingInfo, TokenModel } from 'openvidu-angular';
|
||||
import { Session } from 'openvidu-browser';
|
||||
|
||||
/**
|
||||
|
|
@ -345,7 +345,7 @@ export class OpenviduWebComponentComponent implements OnInit {
|
|||
* @example
|
||||
* <openvidu-webcomponent toolbar-captions-button="false"></openvidu-webcomponent>
|
||||
*/
|
||||
@Input() set toolbarCaptionsButton(value: string | boolean) {
|
||||
@Input() set toolbarCaptionsButton(value: string | boolean) {
|
||||
this._toolbarCaptionsButton = this.castToBoolean(value);
|
||||
}
|
||||
/**
|
||||
|
|
@ -542,27 +542,33 @@ export class OpenviduWebComponentComponent implements OnInit {
|
|||
ngOnInit(): void {}
|
||||
|
||||
/**
|
||||
* Tokens parameter is required to grant a participant access to a Session.
|
||||
* This OpenVidu token will be use by each participant when connecting to a Session.
|
||||
*
|
||||
* This input accepts a {@link TokenModel} object type or a string type.
|
||||
*
|
||||
* @example
|
||||
* <openvidu-webcomponent tokens='{"webcam":"TOKEN1", "screen":"TOKEN2"}'></openvidu-webcomponent>
|
||||
*
|
||||
* or
|
||||
*
|
||||
* @example
|
||||
* <openvidu-webcomponent tokens='TOKEN1'></openvidu-webcomponent>
|
||||
*
|
||||
*/
|
||||
@Input('tokens')
|
||||
set tokens(value: TokenModel | string) {
|
||||
console.debug('Webcomponent tokens: ', value);
|
||||
// console.debug('Webcomponent tokens: ', value);
|
||||
try {
|
||||
this._tokens = this.castToJson(value);
|
||||
this.success = !!this._tokens?.webcam && !!this._tokens?.screen;
|
||||
} catch (error) {
|
||||
if (typeof value === 'string' && value !== '') {
|
||||
console.debug('Sigle token received.');
|
||||
console.debug('Single token received.');
|
||||
this._tokens = { webcam: value };
|
||||
this.success = true;
|
||||
} else {
|
||||
console.error(error);
|
||||
console.error('Parameters received are incorrect: ', value);
|
||||
console.error('Tokens parameter received is incorrect: ', value);
|
||||
console.error('Session cannot start');
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import { BrowserModule } from '@angular/platform-browser';
|
||||
import { DoBootstrap, Injector, NgModule } from '@angular/core';
|
||||
import { APP_BASE_HREF, CommonModule } from '@angular/common';
|
||||
import { DoBootstrap, Injector, NgModule } from '@angular/core';
|
||||
import { BrowserModule } from '@angular/platform-browser';
|
||||
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
|
||||
|
||||
import { OpenviduWebComponentComponent } from './openvidu-webcomponent.component';
|
||||
|
|
|
|||
Loading…
Reference in New Issue