# FadMobileIdCapture 1.5.0

# 1 - Instal packages
    ```
    npm i @fad-producto/desktop-id-capture
    ```
    *"Requires access token configuration for private FAD repositories."

# 2 - Add angular.json configuration
    "architect": {
        "build": {
            "options": {
                "assets": [
                    {
                        "glob": "**/*",
                        "input": "node_modules/@fad-producto/desktop-id-capture/assets/tf-models",
                        "output": "./assets/tf-models"
                    },
                    {
                        "glob": "**/*",
                        "input": "node_modules/@fad-producto/desktop-id-capture/assets/tfLite",
                        "output": "./"
                    },
                    {
                        "glob": "**/*",
                        "input": "node_modules/@fad-producto/desktop-id-capture/assets/images/svg",
                        "output": "./assets/images/svg"
                    }
                ],
                "scripts": [
                    "node_modules/@fad-producto/desktop-id-capture/assets/opencv.js"

                    // NOTA, SOLO SI EN INDEX ESTA: <base href="./">
                    // Configurar segun href, si se tiene / no configurar
                    "./node_modules/@fad-producto/desktop-id-capture/assets/tfLite/tflite_web_api_cc.js",
                    "./node_modules/@fad-producto/desktop-id-capture/assets/tfLite/tflite_web_api_client.js"
                ]
            ...

# 3 - add skipLibCheck configuration (tsconfig.json)
    "compilerOptions": {
        "skipLibCheck": true,

# 4 - Import component - app.module.ts
import { DesktopMexicanIdModule } from '@fad-producto/desktop-id-capture';

@NgModule({
  imports: [
    DesktopMexicanIdModule,

# 5 - Component Inputs & Outputs
# Inputs
    <fad-desktop-id-capture
        [configuration]="IdCaptureConfigurationModel"
        (getData)="getData($event)"
        (onError)="onError($event)"
        ...

    | Name                     | Type                           | Required | Default              | Description                                              |
    | ------------------------ | ------------------------------ | -------- | -------------------- | -------------------------------------------------------- |
    | configuration            | IdCaptureConfigurationModel    | true     |                      | sets component configuration                             |


    class IdCaptureConfigurationModel
    | Name                     | Type                           | Required | Default              | Description                                                              |
    | ------------------------ | ------------------------------ | -------- | -------------------- | ------------------------------------------------------------------------ |
    | labels                   | RetryLabelsConfigurationModel  | false    | *defaultLabelsConfig | Legends to display on component                                          |
    | styles                   | StyleLabelsConfigurationModel  | false    | *defaultStylesConfig | Theme or style to display on component                                   |
    | requiresBackSide         | boolean                        | false    | false                | indicates if is required to capture both parts of the id                 |
    | showResponsePreview      | boolean                        | false    | true                 | show or hide preview before response                                     |
    | getSignature             | boolean                        | false    | false                | gets INE signature image                                                 |
    | photoRetries             | number                         | false    | 5                    | number of capture retries allowed                                        |
    | deviceId                 | string                         | false    | default camera       | camera device id                                                         |
    | tfWasmPath               | string                         | false    | /                    | ruta de archivos wasm de tf                                              |
    | secondsForManualCapture  | number                         | false    | 0                    | disabled, enter value in seconds to enable                               |
    | acceptedProbability      | number                         | false    | 35                   | percentage of approval or similarity with the configured model           |
    | forceSideValidation      | boolean                        | false    | true                 | does not allow capture if the correct id side is not strictly identified |
    | tfModelName              | string                         | false    | idmex_v1.tflite      | nombre del modelo que se quiere usar para ids                            |

    -> labels: RetryLabelsConfigurationModel = {
        frontTitle: 'ENFOQUE EL FRENTE DEL DOCUMENTO',
        backTitle: 'ENFOQUE EL REVERSO DEL DOCUMENTO',
        resultDescription: 'Verifica que la foto de tu identificación sea correcta y legible',
        cropDescription: 'Verifica que la foto se ajuste lo mejor posible a tu identificacion',
        nextButtonLabel: 'Continuar',
        retryButtonLabel: 'Volver a Tomar',
        analyzingSignature: 'Extrayendo datos'
    }

    -> styles: StyleLabelsConfigurationModel = {
      primary: {
        buttonColor: '#181818',
        borderColor: '#181818',
        fontColor: '#ffffff',
        borderRadius: '0'
      },
      accent: {
        buttonColor: '#ffffff',
        borderColor: '#181818',
        fontColor: '#181818',
        borderRadius: '0'
      }
    }

# Outputs
    getData($event) {
        console.log('Scanner result: ', $event);
    }

    onError($event) {
        console.log('Scanner error: ', $event);
    }

    onClose($event) {
        console.log('Cerrando Scanner ' + $event);
    }

    | Name             |  Return                | Description                                        |
    | ---------------- | ---------------------- | -------------------------------------------------- |
    | getData          | DataResultModel        | Fires when scanning was completed                  |
    | onError          | ResponseErrorModel     | Fires when an error happens                        |
    | onCameraClose    | boolean                | Fires when camera closes                           |

# Data Structure
    DataResultModel
        frontImage?: string;
        backImage?: string;
        crop?: string;          // Face cut
        modelType?: string;     // Tsf Model detection type
        sign?: string;          // Only INE
        isIne?: boolean;
        type?: string;          // INE type, Only INE

    ResponseErrorModel
        error: string; (*ErrorMessages enum)
        message: string; (Error string detail)
        code: number; (*ErrorCodes enum)

    export enum ErrorMessages {
        BROWSER_NOT_SUPPORTED =  'Navegador no soportado',
        NOT_ACCEPT_CAMERA_PERMISSION = 'No tienes permisos para acceder a la cámara',
        MAX_TIME_LIMIT =  'Tiempo máximo superado',
        ORIENTATION_TITLE = 'Por favor coloca tu dispositivo de forma vertical',
        ORIENTATION_INSTRUCTIONS = 'Te sugerimos bloquear el giro automático en tu dispositivo para una mejor experiencia',
        NOT_SUPPORTED_TITLE = 'Atención',
        NOT_SUPPORTED_INSTRUCTIONS = 'Este es un navegador no soportado',
        NOT_DETECTED = 'No se puede identificar el documento',
        NOT_CREATED = 'No fue posible iniciar el componente',
        MODEL_ERROR = 'Se presento un error al cargar el modelo de predicción',
        PERSPECTIVE_ERROR = 'Se presento un error al interpretar la perspectiva',
    }

    export enum ErrorCodes {
        BROWSER_NOT_SUPPORTED= -1,
        NOT_ACCEPT_CAMERA_PERMISSION = -2,
        MAX_TIME_LIMIT = -3,
        ORIENTATION = -4,
        NOT_SUPPORTED = -5,
        NOT_DETECTED = -6,
        NOT_CREATED = -7,
        MODEL_ERROR = -8,
        PERSPECTIVE_ERROR = -9
    }

# ############################################## #
# Error in project: global is not defined
    Add in polyfills.ts
        (window as any).global = window;

# Error on build
    Error: Module not found: Error: Can't resolve '../tflite_web_api_client'
        -> configure tsModelPath 
        -> npm i @tensorflow/tfjs-tflite@0.0.1-alpha.8 --force