import { Component, ViewChild, Injector, Output, EventEmitter } from '@angular/core';
import { ModalDirective } from 'ngx-bootstrap';
import { finalize } from 'rxjs/operators';
import { ClientConnectionsServiceProxy, CreateOrEditClientConnectionDto } from '@shared/service-proxies/service-proxies';
import { AppComponentBase } from '@shared/common/app-component-base';
import * as moment from 'moment';


@Component({
    selector: 'createOrEditClientConnectionModal',
    templateUrl: './create-or-edit-clientConnection-modal.component.html'
})
export class CreateOrEditClientConnectionModalComponent extends AppComponentBase {

    @ViewChild('createOrEditModal', { static: true }) modal: ModalDirective;


    @Output() modalSave: EventEmitter<any> = new EventEmitter<any>();

    active = false;
    saving = false;
    isCreate = false;
    clientConnection: CreateOrEditClientConnectionDto = new CreateOrEditClientConnectionDto();
    isValidUrl: boolean = false;
    constructor(
        injector: Injector,
        private _clientConnectionsServiceProxy: ClientConnectionsServiceProxy
    ) {
        super(injector);
    }

    show(clientConnectionId?: number): void {

        if (!clientConnectionId) {
            this.clientConnection = new CreateOrEditClientConnectionDto();
            this.clientConnection.id = clientConnectionId;
            this.active = true;
            this.isCreate = true;
            this.modal.show();
        } else {
            this._clientConnectionsServiceProxy.getClientConnectionForEdit(clientConnectionId).subscribe(result => {
                this.clientConnection = result.clientConnection;
                this.active = true;
                this.isCreate = false;
                this.modal.show();
            });
        }
        console.log(this._isValidUrl("http://localhost:4200/app/sprintship/integration/connections"));
    }

    save(): void {
        this.saving = true;
        if (!this._isValidUrl(this.clientConnection.url)) {
            this.notify.error(this.l('InvalidUrl'));
            this.saving = false;
        } else {
            this._clientConnectionsServiceProxy.createOrEdit(this.clientConnection)
                .pipe(finalize(() => { this.saving = false; }))
                .subscribe(() => {
                    this.notify.info(this.l('SavedSuccessfully'));
                    this.close();
                    this.modalSave.emit(null);
                });
        }
    }

    validURL(str) {
        var pattern = new RegExp('^(https?:\\/\\/)?' + // protocol
            '((([a-z\\d]([a-z\\d-]*[a-z\\d])*)\\.)+[a-z]{2,}|' + // domain name
            '((\\d{1,3}\\.){3}\\d{1,3}))' + // OR ip (v4) address
            '(\\:\\d+)?(\\/[-a-z\\d%_.~+]*)*' + // port and path
            '(\\?[;&a-z\\d%_.~+=-]*)?' + // query string
            '(\\#[-a-z\\d_]*)?$', 'i'); // fragment locator
        return !!pattern.test(str);
    }

    _isValidUrl(str){
        var res = str.match(/(http(s)?:\/\/.)?(www\.)?[-a-zA-Z0-9@:%._\+~#=]{2,256}\.[a-z]{2,6}\b([-a-zA-Z0-9@:%_\+.~#?&//=]*)/g);
        return (res !== null)
    }







    close(): void {

        this.active = false;
        this.modal.hide();
    }
}