import { Component, Inject } from '@angular/core';
import { MAT_DIALOG_DATA } from "@angular/material/dialog";
import { Subject } from 'rxjs';
import { MessageResult } from "../message-box/message-box";
import * as i0 from "@angular/core";
import * as i1 from "@angular/material/dialog";
import * as i2 from "@angular/common";
import * as i3 from "angular-svg-icon";
import * as i4 from "@angular/material/button";
import * as i5 from "@angular/material/tooltip";
import * as i6 from "@angular/material/toolbar";
import * as i7 from "@angular/material/card";
import * as i8 from "devextreme-angular";
import * as i9 from "ngx-webcam";
import * as i10 from "../directives/material-elevation.directive";
export class CameraDialogEditComponent {
    constructor(dialogRef, data, matDialog) {
        this.dialogRef = dialogRef;
        this.data = data;
        this.matDialog = matDialog;
        this.cameraNotFound = false;
        this.cameraNotAllowed = false;
        this.cameraNotReadonly = false;
        this.allowTakePhoto = true;
        this.webcamImage = undefined;
        this.trigger = new Subject();
        if (this.data && this.data["height"]) {
            this.height = this.data["height"];
        }
        else {
            this.height = 400;
        }
        if (this.data && this.data["width"]) {
            this.width = this.data["width"];
        }
        else {
            this.width = 400;
        }
    }
    ngAfterViewInit() {
    }
    ngOnInit() {
    }
    cameraError(error) {
        if (error?.mediaStreamError && error?.mediaStreamError.name === "NotFoundError") {
            this.cameraNotFound = true;
            this.allowTakePhoto = false;
            console.warn("No camera was found!");
        }
        else if (error?.mediaStreamError && error?.mediaStreamError.name === "NotAllowedError") {
            this.cameraNotAllowed = true;
            this.allowTakePhoto = false;
            console.warn("Camera access was not allowed by user!");
        }
        else if (error?.mediaStreamError && error?.mediaStreamError.name === "NotReadableError") {
            this.cameraNotReadonly = true;
            this.allowTakePhoto = false;
            console.warn("Camera was not readable.");
        }
        console.error(error);
    }
    takePhoto() {
        this.trigger.next();
    }
    handleImage(webcamImage) {
        console.info('received webcam image', webcamImage);
        this.webcamImage = webcamImage;
        this.image_capture_url = webcamImage?.imageAsDataUrl;
    }
    get triggerObservable() {
        return this.trigger.asObservable();
    }
    clearPhoto() {
        this.webcamImage = undefined;
    }
    usePhoto() {
        this.onClose();
    }
    onClose() {
        this.dialogRef.close({ result: { webcamImage: this.webcamImage, dialogResult: MessageResult.Ok } });
    }
    onCancel() {
        this.dialogRef.close({ result: { id: "", dialogResult: MessageResult.Cancel } });
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CameraDialogEditComponent, deps: [{ token: i1.MatDialogRef }, { token: MAT_DIALOG_DATA }, { token: i1.MatDialog }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: CameraDialogEditComponent, selector: "mobicloud-camera-dialog-edit", ngImport: i0, template: "<div mat-dialog-container class=\"dialog-container\">\n    <mat-toolbar color=\"primary\" class=\"mat-elevation-z2 dialog-caption\" cdkDrag cdkDragRootElement=\".cdk-overlay-pane\" cdkDragHandle>\n        <mat-card-header i18n=\"@@FieldCaption-Camera\">Camera</mat-card-header>\n        <span class=\"dialog-caption-spacer\"></span>\n        <button mat-raised-button appMaterialElevation matTooltip=\"Close\" i18n-matTooltip=\"@@Action-Close\" aria-label=\"Close\" i18n-aria-label=\"@@Action-Close\" class=\"dialog-toolbar-button\" (click)=\"onCancel()\">\n          <svg-icon name=\"mobicloud_close\" svgClass=\"dialog-toolbar-button-icon\"></svg-icon>\n        </button>        \n    </mat-toolbar>\n\n    <div class=\"camera-edit-container flex flex-col\">\n        <div class=\"webcam-container justify-center items-center\" [ngStyle]=\"{height: height + 'px'}\" *ngIf=\"!cameraNotFound && allowTakePhoto\">\n            <webcam class=\"webcam\" [height]=\"height\" [width]=\"width\" [trigger]=\"triggerObservable\" (imageCapture)=\"handleImage($event)\" [allowCameraSwitch]=\"true\" (initError)=\"cameraError($event)\" *ngIf=\"!webcamImage\"></webcam>\n            <img alt=\"\"alt=\"\" class=\"photo\" [width]=\"width\" [src]=\"image_capture_url\" *ngIf=\"webcamImage\"/>\n        </div>\n        <div class=\"webcam-container-error justify-center items-center\" [ngStyle]=\"{height: height + 'px'}\" *ngIf=\"cameraNotFound || cameraNotAllowed || cameraNotReadonly\">\n            <div *ngIf=\"cameraNotFound\" i18n=\"@@ErrorText-NoCameraFound\">No camera was found</div>\n            <div *ngIf=\"cameraNotAllowed\" i18n=\"@@ErrorText-CameraNotAllowed\">Your browser has denied access to your camera</div>\n            <div *ngIf=\"cameraNotReadonly\" i18n=\"@@ErrorText-CameraNotReadble\">Could not access your camera. It migth be used by another application?</div>\n        </div>        \n        <div class=\"buttons-container justify-center items-center\">\n            <dx-button class=\"takephoto-button\" icon=\"photo\" text=\"Take Photo\" i18n-text=\"@@Action-TakePhoto\" hint=\"Take photo\" i18n-hint=\"@@Action-TakePhoto\" [visible]=\"allowTakePhoto && !webcamImage\" (onClick)=\"takePhoto();\">                \n            </dx-button>\n            <dx-button class=\"usephoto-button\" [disabled]=\"webcamImage == undefined\" icon=\"todo\" text=\"Use Photo\" i18n-text=\"@@Action-UsePhoto\" hint=\"Use photo\" i18n-hint=\"@@Action-UsePhoto\" [visible]=\"webcamImage\" (onClick)=\"usePhoto();\">                \n            </dx-button>            \n            <dx-button class=\"clear-button\" icon=\"clear\" text=\"Clear Photo\" i18n-text=\"@@Action-ClearPhoto\" hint=\"Clear photo\" i18n-hint=\"@@Action-ClearPhoto\" [visible]=\"webcamImage\" (onClick)=\"clearPhoto();\">                \n            </dx-button>          \n            <!-- <button class=\"actionBtn\" (click)=\"triggerSnapshot();\">Take A Snapshot</button> -->\n        </div>\n        <div class=\"snapshot\" *ngIf=\"webcamImage\"></div>\n\n        <!-- <div class=\"snapshot\" *ngIf=\"webcamImage\">    \n            <h2>Take your image or get another</h2>\n            <img alt=\"\"[src]=\"image_capture_url\"/>\n        </div> -->\n    </div>\n    \n  </div>", styles: [".webcam-container-error>div{color:var(--default-textcolor-error);padding:20px}.buttons-container{height:40px}.takephoto-button,.clear-button,.usephoto-button{margin:5px}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i3.SvgIconComponent, selector: "svg-icon", inputs: ["src", "name", "stretch", "applyClass", "applyCss", "svgClass", "class", "viewBox", "svgAriaLabel", "svgStyle"] }, { kind: "component", type: i4.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "directive", type: i5.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: i6.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i7.MatCardHeader, selector: "mat-card-header" }, { kind: "component", type: i8.DxButtonComponent, selector: "dx-button", inputs: ["accessKey", "activeStateEnabled", "disabled", "elementAttr", "focusStateEnabled", "height", "hint", "hoverStateEnabled", "icon", "rtlEnabled", "stylingMode", "tabIndex", "template", "text", "type", "useSubmitBehavior", "validationGroup", "visible", "width"], outputs: ["onClick", "onContentReady", "onDisposing", "onInitialized", "onOptionChanged", "accessKeyChange", "activeStateEnabledChange", "disabledChange", "elementAttrChange", "focusStateEnabledChange", "heightChange", "hintChange", "hoverStateEnabledChange", "iconChange", "rtlEnabledChange", "stylingModeChange", "tabIndexChange", "templateChange", "textChange", "typeChange", "useSubmitBehaviorChange", "validationGroupChange", "visibleChange", "widthChange"] }, { kind: "component", type: i9.WebcamComponent, selector: "webcam", inputs: ["width", "height", "videoOptions", "allowCameraSwitch", "mirrorImage", "captureImageData", "imageType", "imageQuality", "trigger", "switchCamera"], outputs: ["imageCapture", "initError", "imageClick", "cameraSwitched"] }, { kind: "directive", type: i10.MaterialElevationDirective, selector: "[appMaterialElevation]", inputs: ["defaultElevation", "raisedElevation"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CameraDialogEditComponent, decorators: [{
            type: Component,
            args: [{ selector: 'mobicloud-camera-dialog-edit', template: "<div mat-dialog-container class=\"dialog-container\">\n    <mat-toolbar color=\"primary\" class=\"mat-elevation-z2 dialog-caption\" cdkDrag cdkDragRootElement=\".cdk-overlay-pane\" cdkDragHandle>\n        <mat-card-header i18n=\"@@FieldCaption-Camera\">Camera</mat-card-header>\n        <span class=\"dialog-caption-spacer\"></span>\n        <button mat-raised-button appMaterialElevation matTooltip=\"Close\" i18n-matTooltip=\"@@Action-Close\" aria-label=\"Close\" i18n-aria-label=\"@@Action-Close\" class=\"dialog-toolbar-button\" (click)=\"onCancel()\">\n          <svg-icon name=\"mobicloud_close\" svgClass=\"dialog-toolbar-button-icon\"></svg-icon>\n        </button>        \n    </mat-toolbar>\n\n    <div class=\"camera-edit-container flex flex-col\">\n        <div class=\"webcam-container justify-center items-center\" [ngStyle]=\"{height: height + 'px'}\" *ngIf=\"!cameraNotFound && allowTakePhoto\">\n            <webcam class=\"webcam\" [height]=\"height\" [width]=\"width\" [trigger]=\"triggerObservable\" (imageCapture)=\"handleImage($event)\" [allowCameraSwitch]=\"true\" (initError)=\"cameraError($event)\" *ngIf=\"!webcamImage\"></webcam>\n            <img alt=\"\"alt=\"\" class=\"photo\" [width]=\"width\" [src]=\"image_capture_url\" *ngIf=\"webcamImage\"/>\n        </div>\n        <div class=\"webcam-container-error justify-center items-center\" [ngStyle]=\"{height: height + 'px'}\" *ngIf=\"cameraNotFound || cameraNotAllowed || cameraNotReadonly\">\n            <div *ngIf=\"cameraNotFound\" i18n=\"@@ErrorText-NoCameraFound\">No camera was found</div>\n            <div *ngIf=\"cameraNotAllowed\" i18n=\"@@ErrorText-CameraNotAllowed\">Your browser has denied access to your camera</div>\n            <div *ngIf=\"cameraNotReadonly\" i18n=\"@@ErrorText-CameraNotReadble\">Could not access your camera. It migth be used by another application?</div>\n        </div>        \n        <div class=\"buttons-container justify-center items-center\">\n            <dx-button class=\"takephoto-button\" icon=\"photo\" text=\"Take Photo\" i18n-text=\"@@Action-TakePhoto\" hint=\"Take photo\" i18n-hint=\"@@Action-TakePhoto\" [visible]=\"allowTakePhoto && !webcamImage\" (onClick)=\"takePhoto();\">                \n            </dx-button>\n            <dx-button class=\"usephoto-button\" [disabled]=\"webcamImage == undefined\" icon=\"todo\" text=\"Use Photo\" i18n-text=\"@@Action-UsePhoto\" hint=\"Use photo\" i18n-hint=\"@@Action-UsePhoto\" [visible]=\"webcamImage\" (onClick)=\"usePhoto();\">                \n            </dx-button>            \n            <dx-button class=\"clear-button\" icon=\"clear\" text=\"Clear Photo\" i18n-text=\"@@Action-ClearPhoto\" hint=\"Clear photo\" i18n-hint=\"@@Action-ClearPhoto\" [visible]=\"webcamImage\" (onClick)=\"clearPhoto();\">                \n            </dx-button>          \n            <!-- <button class=\"actionBtn\" (click)=\"triggerSnapshot();\">Take A Snapshot</button> -->\n        </div>\n        <div class=\"snapshot\" *ngIf=\"webcamImage\"></div>\n\n        <!-- <div class=\"snapshot\" *ngIf=\"webcamImage\">    \n            <h2>Take your image or get another</h2>\n            <img alt=\"\"[src]=\"image_capture_url\"/>\n        </div> -->\n    </div>\n    \n  </div>", styles: [".webcam-container-error>div{color:var(--default-textcolor-error);padding:20px}.buttons-container{height:40px}.takephoto-button,.clear-button,.usephoto-button{margin:5px}\n"] }]
        }], ctorParameters: () => [{ type: i1.MatDialogRef }, { type: undefined, decorators: [{
                    type: Inject,
                    args: [MAT_DIALOG_DATA]
                }] }, { type: i1.MatDialog }] });
//# sourceMappingURL=data:application/json;base64, 