🚀 Descripción ngx-ba-videoconfirmation es un módulo Angular que proporciona un componente robusto y fácil de integrar para la videoconfirmación. Diseñado específicamente para los clientes de Biometría Aplicada, este componente facilita la captura de video junto con texto de confirmación, optimizando procesos donde la verificación visual es crucial.

📦 Instalación Para utilizar ngx-ba-videoconfirmation en tu proyecto Angular, debes descargar el paquete directamente desde el feed de Azure DevOps de Biometría Aplicada.

Asegúrate de tener acceso al feed de npm de Biometría Aplicada en Azure DevOps. Tu archivo .npmrc debe estar configurado para autenticarte correctamente con el registro. Si necesitas ayuda con esto, contacta al equipo de Biometría Aplicada.

Instala el paquete usando npm:

Bash

npm install [email protected] Nota: La versión 1.2.0 es la última disponible al momento de crear esta documentación. Te recomendamos verificar la versión más reciente en tu feed de Azure DevOps para asegurar que utilizas la última actualización.

🛠️ Uso Para integrar el componente ngx-ba-videoconfirmation en tu aplicación Angular, sigue estos pasos:

1. Importar el Módulo Importa el NgxBaVideoconfirmationModule en tu AppModule (o en el módulo de características donde lo vayas a usar):

TypeScript

// app.module.ts (o tu módulo de características) import { NgModule } from '@angular/core'; import { BrowserModule } from '@angular/platform-browser'; import { NgxBaVideoconfirmationModule } from 'ngx-ba-videoconfirmation';

import { AppComponent } from './app.component';

@NgModule({ declarations: [ AppComponent ], imports: [ BrowserModule, NgxBaVideoconfirmationModule // ¡Importa aquí! ], providers: [], bootstrap: [AppComponent] }) export class AppModule { } 2. Utilizar el Componente en la Plantilla Usa el selector en la plantilla HTML de tu componente:

HTML

<ngx-ba-videoconfirmation [TextRecord]="textRecord" (videoResponse)="handleVideoResponse($event)"

3. Configurar Propiedades en tu Componente TypeScript Define la propiedad de entrada (TextRecord) y el método para manejar el evento de salida (videoResponse) en el archivo TypeScript de tu componente:

TypeScript

// tu-componente.component.ts import { Component } from '@angular/core';

// Define la interfaz para la salida del componente interface ResponseVideo { videoText: string; // El texto reconocido en el video (si aplica) videoBase64: string; // El video capturado codificado en formato Base64 }

@Component({ selector: 'app-tu-componente', templateUrl: './tu-componente.component.html', styleUrls: ['./tu-componente.component.css'] }) export class TuComponente { /**

• @Input() TextRecord: Texto que el usuario debe leer o confirmar en el video. */ textRecord: string = 'Por favor, confirme su identidad diciendo su nombre completo y la frase "Acepto los términos y condiciones".';

constructor() { }

/**

• @Output() videoResponse: Manejador del evento que recibe la información del video grabado.
• @param response Objeto con el texto del video y el video en Base64. */ handleVideoResponse(response: ResponseVideo): void { console.log('Video de confirmación recibido:', response); // Aquí puedes procesar la respuesta, por ejemplo, enviarla a un servicio API alert(Texto del video: ${response.videoText}\nVideo Base64 (parcial): ${response.videoBase64.substring(0, 50)}...); } } Propiedades de Entrada (@Input()) Propiedad Tipo Descripción TextRecord string Requerido. El texto que el usuario debe leer o confirmar en el video para propósitos de verificación.

Exportar a Hojas de cálculo Eventos de Salida (@Output()) Evento Tipo Descripción videoResponse EventEmitter Emite un objeto ResponseVideo con la información del video grabado una vez que el proceso de confirmación ha finalizado.

Exportar a Hojas de cálculo Interfaz ResponseVideo El objeto emitido por el evento videoResponse sigue la siguiente estructura:

TypeScript

interface ResponseVideo { videoText: string; // El texto reconocido en el video. Puede estar vacío si la funcionalidad de reconocimiento no aplica o no se configuró. videoBase64: string; // El video capturado, codificado en formato Base64. } ⚠️ Dependencias (Peer Dependencies) Para que ngx-ba-videoconfirmation funcione correctamente, tu proyecto Angular debe tener instaladas las siguientes peerDependencies en las versiones compatibles. Asegúrate de que estas versiones estén presentes en tu package.json:

@angular/common: ^17.3.0 @angular/core: ^17.3.0 bootstrap: ^5.3.2 ngx-bootstrap: ^5.6.1 Puedes instalarlas usando npm:

Bash

npm install @angular/common@^17.3.0 @angular/core@^17.3.0 bootstrap@^5.3.2 ngx-bootstrap@^5.6.1 ✍️ Autor Eduardo Prieto Islas Biometría Aplicada

📜 Licencia Este componente es de uso exclusivo para clientes de Biometría Aplicada. Su distribución y uso están sujetos a los términos y condiciones de los acuerdos contractuales con Biometría Aplicada.