import { Component, Injector, Input, ViewEncapsulation } from '@angular/core';
import { GPS } from '../../../../forms/page/widgets/gps';
import { MatDialog } from '@angular/material/dialog';
import { ImageMapViewComponent } from '../../../form-object-view/form-object-widgets/image-widget-view/image-map-view/image-map-view.component';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
function FormObjectGpsValueComponent_div_0_Template(rf, ctx) { if (rf & 1) {
    const _r2 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "div", 1);
    i0.ɵɵelementStart(1, "img", 2);
    i0.ɵɵlistener("click", function FormObjectGpsValueComponent_div_0_Template_img_click_1_listener($event) { i0.ɵɵrestoreView(_r2); const ctx_r1 = i0.ɵɵnextContext(); ctx_r1.showImageMapView($event); return $event.stopPropagation(); });
    i0.ɵɵelementEnd();
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const ctx_r0 = i0.ɵɵnextContext();
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("src", ctx_r0.url, i0.ɵɵsanitizeUrl);
} }
export class FormObjectGpsValueComponent {
    constructor(_injector) {
        this._injector = _injector;
    }
    ngOnInit() {
        this.widgetValue = this.widget.getWidgetValue();
        if (this.widget.value !== null && this.widget.value.length) {
            this.latitude = this.widget.value[0].value[0].latitude;
            this.longitude = this.widget.value[0].value[0].longitude;
            this.url = `https://maps.googleapis.com/maps/api/staticmap?markers=color:red|${this.latitude},${this.longitude} &center=${this.latitude},${this.longitude}&zoom=10&size=175x100&scale=2&key=AIzaSyBuCjQh5y-9beQUKgRpOvycjbq8AvrybBI`;
        }
    }
    /**
       * Open Image map location dialog
       */
    showImageMapView() {
        this.dialog = this._injector.get(MatDialog);
        this.dialog.open(ImageMapViewComponent, {
            maxWidth: '100vw',
            maxHeight: '100vh',
            height: '100%',
            width: '100%',
            panelClass: 'image-map-box-container',
            data: {
                widget: this.widget,
                widgetValue: this.widgetValue,
                widgetProperties: this.widgetProperties
            },
        });
    }
}
FormObjectGpsValueComponent.ɵfac = function FormObjectGpsValueComponent_Factory(t) { return new (t || FormObjectGpsValueComponent)(i0.ɵɵdirectiveInject(i0.Injector)); };
FormObjectGpsValueComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: FormObjectGpsValueComponent, selectors: [["app-formobject-gps-value"]], inputs: { widget: "widget", widgetProperties: "widgetProperties" }, decls: 1, vars: 1, consts: [["class", "gps-container", 4, "ngIf"], [1, "gps-container"], ["alt", "", 1, "mapImage", "rounded", 3, "src", "click"]], template: function FormObjectGpsValueComponent_Template(rf, ctx) { if (rf & 1) {
        i0.ɵɵtemplate(0, FormObjectGpsValueComponent_div_0_Template, 2, 1, "div", 0);
    } if (rf & 2) {
        i0.ɵɵproperty("ngIf", ctx.widget.value !== null && (ctx.widget.value == null ? null : ctx.widget.value.length) !== 0 && ctx.widget.value !== undefined);
    } }, directives: [i1.NgIf], styles: ["app-formobject-gps-value .mapImage{vertical-align:top;min-width:59px;min-height:26px;max-width:59px;max-height:26px}.gps-media-box-container .mat-dialog-container{padding:0}.gps-media-box-container .mat-form-field.mat-form-field-appearance-fill{width:100%!important}.gps-media-box-container .image-map-container .close-button{position:absolute;top:-31px;right:-27px}.gps-media-box-container .image-map-container #close-icon{color:#000!important;font-size:14px;font-weight:600}.gps-media-box-container agm-map{height:100%;width:100%}.gps-media-box-container .image-map-box-container .mat-dialog-container{width:86%;height:86%;margin:auto}.gps-media-box-container .image-map-box-container .image-map-container{display:flex;align-items:center;justify-content:center}.gps-media-box-container .image-map-box-container .image-map-body{width:100%;height:100%}\n"], encapsulation: 2 });
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(FormObjectGpsValueComponent, [{
        type: Component,
        args: [{ selector: 'app-formobject-gps-value', encapsulation: ViewEncapsulation.None, template: "<div *ngIf=\"widget.value !== null && widget.value?.length!==0 &&  widget.value !== undefined \" class=\"gps-container\">\n    <img   (click)=\"showImageMapView($event); $event.stopPropagation();\" class=\"mapImage rounded\"   [src]=\"url\" alt=\"\">\n</div>\n", styles: ["app-formobject-gps-value .mapImage{vertical-align:top;min-width:59px;min-height:26px;max-width:59px;max-height:26px}.gps-media-box-container .mat-dialog-container{padding:0}.gps-media-box-container .mat-form-field.mat-form-field-appearance-fill{width:100%!important}.gps-media-box-container .image-map-container .close-button{position:absolute;top:-31px;right:-27px}.gps-media-box-container .image-map-container #close-icon{color:#000!important;font-size:14px;font-weight:600}.gps-media-box-container agm-map{height:100%;width:100%}.gps-media-box-container .image-map-box-container .mat-dialog-container{width:86%;height:86%;margin:auto}.gps-media-box-container .image-map-box-container .image-map-container{display:flex;align-items:center;justify-content:center}.gps-media-box-container .image-map-box-container .image-map-body{width:100%;height:100%}\n"] }]
    }], function () { return [{ type: i0.Injector }]; }, { widget: [{
            type: Input
        }], widgetProperties: [{
            type: Input
        }] }); })();
//# sourceMappingURL=data:application/json;base64, 