import { Component, Output, EventEmitter, Input } from '@angular/core';
import { FormBuilder, Validators } from '@angular/forms';
import { CurrentDeviceService } from '../../current-device.service';
import { Platform } from '@ionic/angular';
import { getFormFieldOrError } from '../../utility';
import * as i0 from "@angular/core";
import * as i1 from "../../current-device.service";
import * as i2 from "@angular/forms";
import * as i3 from "@ionic/angular";
import * as i4 from "@angular/common";
import * as i5 from "../../lib-common/remember-value-control";
export class TapConnectSocketComponent {
    constructor(currentDevice, formBuilder, platform) {
        this.currentDevice = currentDevice;
        this.formBuilder = formBuilder;
        this.platform = platform;
        this.rememberGroupName = 'TapConnectSocket';
        this.onProtocolSelected = new EventEmitter();
        this.protocols = [
            {
                title: 'Websocket',
                value: 'ws',
            },
        ];
        if (this.isSocketSupported()) {
            this.protocols.push({
                title: 'Socket',
                value: 'tcp',
            });
        }
        const defaultPort = this.isSocketSupported() ? '2000' : '2080';
        const defaultProtocol = this.isSocketSupported() ? 'tcp' : 'ws';
        this.form = this.formBuilder.group({
            host: ['192.168.20.10', Validators.required],
            port: [defaultPort, Validators.required],
            protocol: [defaultProtocol, Validators.required],
        });
    }
    get protocol() {
        return getFormFieldOrError(this.form, 'protocol');
    }
    get host() {
        return getFormFieldOrError(this.form, 'host');
    }
    get port() {
        return getFormFieldOrError(this.form, 'port');
    }
    isSocketSupported() {
        return this.platform.is('cordova') || this.platform.is('electron');
    }
    async connect() {
        let url;
        switch (this.protocol.value) {
            case 'ws':
                url = `ws://${this.host.value}:${this.port.value}`;
                const metaWs = {
                    type: 'websocket',
                    info: {
                        url: url,
                    },
                };
                this.onProtocolSelected.emit({
                    meta: metaWs,
                });
                break;
            case 'tcp':
                url = `tcp://${this.host.value}:${this.port.value}`;
                const meta = {
                    type: 'socket',
                    info: {
                        url: url,
                    },
                };
                this.onProtocolSelected.emit({
                    meta: meta,
                });
                break;
            default:
                console.warn(`Invalid protocol: ${this.protocol.value}`);
        }
    }
}
/** @nocollapse */ TapConnectSocketComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TapConnectSocketComponent, deps: [{ token: i1.CurrentDeviceService }, { token: i2.FormBuilder }, { token: i3.Platform }], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ TapConnectSocketComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: TapConnectSocketComponent, selector: "tap-connect-socket", inputs: { protocols: "protocols" }, outputs: { onProtocolSelected: "onProtocolSelected" }, ngImport: i0, template: "<form (ngSubmit)=\"connect()\" [formGroup]=\"form\" (keydown.enter)=\"connect()\">\n  <ion-row>\n    <ion-col>\n      <ion-item>\n        <ion-label position=\"floating\"> Protocol </ion-label>\n        <ion-select name=\"protocol\" formControlName=\"protocol\" required>\n          <ion-select-option\n            *ngFor=\"let protocol of protocols\"\n            [value]=\"protocol.value\"\n            >{{ protocol.title }}</ion-select-option\n          >\n        </ion-select>\n      </ion-item>\n    </ion-col>\n    <ion-col>\n      <ion-item>\n        <ion-label position=\"floating\"> Hostname </ion-label>\n        <ion-input\n          [rememberValueControl]=\"rememberGroupName\"\n          name=\"host\"\n          formControlName=\"host\"\n          placeholder=\"Hostname. For example: 192.168.20.10\"\n          autocapitalize=\"none\"\n          spellcheck=\"false\"\n          autocorrect=\"off\"\n          required\n          type=\"text\"\n        ></ion-input>\n      </ion-item>\n    </ion-col>\n    <ion-col>\n      <ion-item>\n        <ion-label position=\"floating\"> Port </ion-label>\n        <ion-input\n          [rememberValueControl]=\"rememberGroupName\"\n          name=\"port\"\n          formControlName=\"port\"\n          placeholder=\"Port. Default is 2000 for tcp.\"\n          required\n          type=\"number\"\n        ></ion-input>\n      </ion-item>\n    </ion-col>\n    <ion-col>\n      <ion-item lines=\"none\" class=\"submit-container\">\n        <ion-button\n          [disabled]=\"form['invalid']\"\n          type=\"submit\"\n          fill=\"clear\"\n          slot=\"end\"\n        >\n          <ion-icon name=\"send\"></ion-icon> &nbsp; Connect\n        </ion-button>\n      </ion-item>\n    </ion-col>\n  </ion-row>\n</form>\n", styles: [".submit-container{text-align:center;top:50%;transform:translateY(-50%)}\n"], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i3.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: i3.IonCol, selector: "ion-col", inputs: ["offset", "offsetLg", "offsetMd", "offsetSm", "offsetXl", "offsetXs", "pull", "pullLg", "pullMd", "pullSm", "pullXl", "pullXs", "push", "pushLg", "pushMd", "pushSm", "pushXl", "pushXs", "size", "sizeLg", "sizeMd", "sizeSm", "sizeXl", "sizeXs"] }, { kind: "component", type: i3.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i3.IonInput, selector: "ion-input", inputs: ["accept", "autocapitalize", "autocomplete", "autocorrect", "autofocus", "clearInput", "clearOnEdit", "color", "debounce", "disabled", "enterkeyhint", "inputmode", "max", "maxlength", "min", "minlength", "mode", "multiple", "name", "pattern", "placeholder", "readonly", "required", "size", "spellcheck", "step", "type", "value"] }, { kind: "component", type: i3.IonItem, selector: "ion-item", inputs: ["button", "color", "counter", "counterFormatter", "detail", "detailIcon", "disabled", "download", "fill", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "shape", "target", "type"] }, { kind: "component", type: i3.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i3.IonRow, selector: "ion-row" }, { kind: "component", type: i3.IonSelect, selector: "ion-select", inputs: ["cancelText", "compareWith", "disabled", "interface", "interfaceOptions", "mode", "multiple", "name", "okText", "placeholder", "selectedText", "value"] }, { kind: "component", type: i3.IonSelectOption, selector: "ion-select-option", inputs: ["disabled", "value"] }, { kind: "directive", type: i3.NumericValueAccessor, selector: "ion-input[type=number]" }, { kind: "directive", type: i3.SelectValueAccessor, selector: "ion-range, ion-select, ion-radio-group, ion-segment, ion-datetime" }, { kind: "directive", type: i3.TextValueAccessor, selector: "ion-input:not([type=number]),ion-textarea,ion-searchbar" }, { kind: "directive", type: i5.RememberValueControlDirective, selector: "[rememberValueControl]", inputs: ["formControlName", "rememberValueControl"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TapConnectSocketComponent, decorators: [{
            type: Component,
            args: [{ selector: 'tap-connect-socket', template: "<form (ngSubmit)=\"connect()\" [formGroup]=\"form\" (keydown.enter)=\"connect()\">\n  <ion-row>\n    <ion-col>\n      <ion-item>\n        <ion-label position=\"floating\"> Protocol </ion-label>\n        <ion-select name=\"protocol\" formControlName=\"protocol\" required>\n          <ion-select-option\n            *ngFor=\"let protocol of protocols\"\n            [value]=\"protocol.value\"\n            >{{ protocol.title }}</ion-select-option\n          >\n        </ion-select>\n      </ion-item>\n    </ion-col>\n    <ion-col>\n      <ion-item>\n        <ion-label position=\"floating\"> Hostname </ion-label>\n        <ion-input\n          [rememberValueControl]=\"rememberGroupName\"\n          name=\"host\"\n          formControlName=\"host\"\n          placeholder=\"Hostname. For example: 192.168.20.10\"\n          autocapitalize=\"none\"\n          spellcheck=\"false\"\n          autocorrect=\"off\"\n          required\n          type=\"text\"\n        ></ion-input>\n      </ion-item>\n    </ion-col>\n    <ion-col>\n      <ion-item>\n        <ion-label position=\"floating\"> Port </ion-label>\n        <ion-input\n          [rememberValueControl]=\"rememberGroupName\"\n          name=\"port\"\n          formControlName=\"port\"\n          placeholder=\"Port. Default is 2000 for tcp.\"\n          required\n          type=\"number\"\n        ></ion-input>\n      </ion-item>\n    </ion-col>\n    <ion-col>\n      <ion-item lines=\"none\" class=\"submit-container\">\n        <ion-button\n          [disabled]=\"form['invalid']\"\n          type=\"submit\"\n          fill=\"clear\"\n          slot=\"end\"\n        >\n          <ion-icon name=\"send\"></ion-icon> &nbsp; Connect\n        </ion-button>\n      </ion-item>\n    </ion-col>\n  </ion-row>\n</form>\n", styles: [".submit-container{text-align:center;top:50%;transform:translateY(-50%)}\n"] }]
        }], ctorParameters: function () { return [{ type: i1.CurrentDeviceService }, { type: i2.FormBuilder }, { type: i3.Platform }]; }, propDecorators: { onProtocolSelected: [{
                type: Output
            }], protocols: [{
                type: Input
            }] } });
//# sourceMappingURL=data:application/json;base64, 