/**
 * @fileoverview added by tsickle
 * Generated from: lib/ui-components/variable-card/variable-card.component.ts
 * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
import { __awaiter, __generator } from "tslib";
import { Component, Input } from '@angular/core';
import { Router } from '@angular/router';
import { LibError } from '@iotize/ionic';
import { AbstractVariable, TapVariable } from '@iotize/tap/data';
var VariableCardComponent = /** @class */ (function () {
    function VariableCardComponent(router) {
        this.router = router;
        this.waitForSubmit = false;
        this.cardType = 'text';
        this.cardTypes = [
            // 'chart',
            'gauge',
            'switch',
            'text',
            'buttons',
            'range',
            'select'
        ];
        this.editMode = false;
        this.monitor = true;
        this.showStartStopMonitoring = false;
        this.unit = '';
        this.value = 'Unknown';
        /**
         *
         */
        this.refreshValues = false;
        this.monitoringButtons = [0, 1, 2, 3, 4, 5].map((/**
         * @param {?} v
         * @return {?}
         */
        function (v) {
            return {
                label: "" + v,
                value: v
            };
        }));
        this.selectOptions = {
            type: 'select',
            options: [0, 1, 2, 3, 4, 5].map((/**
             * @param {?} v
             * @return {?}
             */
            function (v) {
                return {
                    key: v,
                    text: "Value " + v
                };
            }))
        };
    }
    Object.defineProperty(VariableCardComponent.prototype, "variable", {
        get: /**
         * @return {?}
         */
        function () {
            return (/** @type {?} */ (this._variable));
        },
        // private _switchButtonSubscription?: Subscription;
        set: 
        // private _switchButtonSubscription?: Subscription;
        /**
         * @param {?} variable
         * @return {?}
         */
        function (variable) {
            var _this = this;
            // console.log('VariableCardComponent', 'SET VARIABLE', variable);
            this._variable = variable;
            if (this._subscription) {
                this._subscription.unsubscribe();
            }
            this._subscription = variable.values
                .subscribe({
                next: (/**
                 * @param {?} value
                 * @return {?}
                 */
                function (value) {
                    if (_this.refreshValues) {
                        // console.log('VariableCardComponent', 'NEW VAR VALUE', value);
                        _this.value = value;
                    }
                }),
                error: (/**
                 * @param {?} error
                 * @return {?}
                 */
                function (error) {
                    // console.warn(`Monitoring error: `, error);
                    _this.error = error;
                }),
                complete: (/**
                 * @return {?}
                 */
                function () {
                    // console.warn('VariableCardComponent', 'values observable is complete')
                })
            });
            // TODO 
            // variable.events
            //   .subscribe((event) => {
            //     // console.log('VariableCardComponent', 'Monitoring event', event);
            //     switch (event.type) {
            //       case 'READ_ERROR':
            //         this.error = event.payload;
            //         break;
            //       case 'READ_SUCCESS':
            //         this.error = undefined;
            //         break;
            //     }
            //   });
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(VariableCardComponent.prototype, "variableConfig", {
        get: /**
         * @return {?}
         */
        function () {
            if (this._variable instanceof TapVariable) {
                return this._variable.context.config;
            }
            return undefined;
        },
        enumerable: true,
        configurable: true
    });
    /**
     * @return {?}
     */
    VariableCardComponent.prototype.ngOnInit = /**
     * @return {?}
     */
    function () {
    };
    // editConfig() {
    //   this.router.navigate(['/device/monitoring/add']);
    // }
    // editConfig() {
    //   this.router.navigate(['/device/monitoring/add']);
    // }
    /**
     * @param {?} checked
     * @return {?}
     */
    VariableCardComponent.prototype.switchButtonToggleAction = 
    // editConfig() {
    //   this.router.navigate(['/device/monitoring/add']);
    // }
    /**
     * @param {?} checked
     * @return {?}
     */
    function (checked) {
        return __awaiter(this, void 0, void 0, function () {
            var value;
            return __generator(this, function (_a) {
                switch (_a.label) {
                    case 0:
                        if (!this._variable) {
                            throw LibError.componentArgumentRequired('VariableCardComponent', 'variable');
                        }
                        value = checked ? 1 : 0;
                        return [4 /*yield*/, this._variable.write(value)];
                    case 1:
                        _a.sent();
                        return [2 /*return*/];
                }
            });
        });
    };
    // onEditEvent(event: MonitoringEditTextEvent) {
    //   console.log('EDIT EVENT => ', event);
    //   switch (event.type) {
    //     case 'CLOSE':
    //       this.editMode = false;
    //       break;
    //     case 'WRITE_SUCCESS':
    //       this.editMode = false;
    //       break;
    //   }
    // }
    // onEditEvent(event: MonitoringEditTextEvent) {
    //   console.log('EDIT EVENT => ', event);
    //   switch (event.type) {
    //     case 'CLOSE':
    //       this.editMode = false;
    //       break;
    //     case 'WRITE_SUCCESS':
    //       this.editMode = false;
    //       break;
    //   }
    // }
    /**
     * @return {?}
     */
    VariableCardComponent.prototype.ngOnDestroy = 
    // onEditEvent(event: MonitoringEditTextEvent) {
    //   console.log('EDIT EVENT => ', event);
    //   switch (event.type) {
    //     case 'CLOSE':
    //       this.editMode = false;
    //       break;
    //     case 'WRITE_SUCCESS':
    //       this.editMode = false;
    //       break;
    //   }
    // }
    /**
     * @return {?}
     */
    function () {
        if (this._subscription) {
            this._subscription.unsubscribe();
        }
        // if (this._switchButtonSubscription) {
        //   this._switchButtonSubscription.unsubscribe();
        // }
    };
    /**
     * @param {?} $event
     * @return {?}
     */
    VariableCardComponent.prototype.onCardTypeChange = /**
     * @param {?} $event
     * @return {?}
     */
    function ($event) {
        // console.log('onCardTypeChange', $event);
        // this.cardType = $event.detail.value;
    };
    /**
     * @return {?}
     */
    VariableCardComponent.prototype.toggleMonitoring = /**
     * @return {?}
     */
    function () {
        // if (this.monitor) {
        // if (!this._variable) {
        //   throw LibError.componentArgumentRequired('VariableCardComponent', 'variable');
        // }
        this.refreshValues = !this.refreshValues;
        // if (this.refreshValues) {
        //   // console.log('Start monitoring with period: ', this.monitoringPeriod);
        //   this._variable.monitor().start({
        //     forceChange: false,
        //     period: this.monitoringPeriod
        //   });
        // } else {
        //   // console.log('Pause monitoring');
        //   this._variable.monitor().pause();
        // }
        // }
    };
    VariableCardComponent.decorators = [
        { type: Component, args: [{
                    selector: 'app-variable-card',
                    template: "<ion-card *ngIf=\"_variable\">\r\n    <ion-card-header>\r\n      <ion-card-title>{{ 'UNAMED' }}</ion-card-title>\r\n    </ion-card-header>\r\n  <!-- <ion-item>\r\n    <ion-icon *ngIf=\"icon\" name=\"{{icon}}\" slot=\"start\"></ion-icon>\r\n    <ion-label>{{variable.identifier() || variableConfig.id }}</ion-label>\r\n  </ion-item> -->\r\n  <ion-card-content *ngIf=\"monitor\">\r\n    <ng-container [ngSwitch]=\"cardType\">\r\n        <ion-item *ngSwitchCase=\"'text'\" lines=\"none\" class=\"ion-no-padding\" >\r\n          <monitoring-variable-value  style=\"margin: auto;\"\r\n            [lines]=\"'none'\"\r\n          [variable]=\"variable\" \r\n          [editable]=\"true\"></monitoring-variable-value>\r\n          <span slot=\"end\" *ngIf=\"unit\" class=\"unit\">{{unit}}</span>\r\n        </ion-item>\r\n        <ion-item *ngSwitchCase=\"'select'\" lines=\"none\" class=\"ion-no-padding\" >\r\n          <monitoring-variable-value  style=\"margin: auto;\"\r\n            [lines]=\"'none'\"\r\n          [variable]=\"variable\" \r\n          [inputOptions]=\"selectOptions\"\r\n          [editable]=\"true\"></monitoring-variable-value>\r\n          <span slot=\"end\" *ngIf=\"unit\" class=\"unit\">{{unit}}</span>\r\n        </ion-item>\r\n      <monitoring-gauge-card *ngSwitchCase=\"'gauge'\" [digitsInfo]=\"'1.2-2'\" [input]=\"variable.values\" [dynamicRange]=\"true\"\r\n        [units]=\"unit\"></monitoring-gauge-card>\r\n      <monitoring-chart-card *ngSwitchCase=\"'chart'\" [input]=\"variable.values\"></monitoring-chart-card>\r\n      <tap-variable-toggle *ngSwitchCase=\"'switch'\" [variable]=\"variable\"></tap-variable-toggle>\r\n      <tap-variable-buttons *ngSwitchCase=\"'buttons'\" [variable]=\"variable\" [buttons]=\"monitoringButtons\"></tap-variable-buttons>\r\n      <tap-variable-range *ngSwitchCase=\"'range'\" [variable]=\"variable\"  [pin]=\"true\" [snaps]=\"true\" [ticks]=\"true\" [min]=\"0\" [max]=\"100\"></tap-variable-range>\r\n      <ion-text color=\"danger\" *ngSwitchDefault>\r\n        <ion-icon name=\"alert\"></ion-icon> Unknown card type {{cardType}}\r\n      </ion-text>\r\n  </ng-container>\r\n  </ion-card-content>\r\n  <!--<ion-card-content *ngIf=\"editMode\">\r\n    <monitoring-edit-text (onEvent)=\"onEditEvent($event)\" [variable]=\"variable\"></monitoring-edit-text>\r\n  </ion-card-content>-->\r\n  <ion-card-content *ngIf=\"error\">\r\n    <ion-text color=\"danger\">{{ error }}</ion-text>\r\n  </ion-card-content>\r\n  <ion-item>\r\n    <ion-select [(ngModel)]=\"cardType\" okText=\"Select\" cancelText=\"Dismiss\" (ionChange)=\"onCardTypeChange($event)\">\r\n      <ion-select-option *ngFor=\"let cardType of cardTypes\" value=\"{{cardType}}\">{{cardType}}</ion-select-option>\r\n    </ion-select>\r\n    <!-- <ion-buttons slot=\"end\">\r\n      <ion-button (click)=\"toggleMonitoring()\" *ngIf=\"showStartStopMonitoring\">\r\n        <ion-icon *ngIf=\"!playMonitoring\" name=\"play\"></ion-icon>\r\n        <ion-icon *ngIf=\"playMonitoring\" name=\"pause\"></ion-icon>\r\n      </ion-button>\r\n      <ion-button (click)=\"editMode = !editMode\">\r\n        <ion-icon *ngIf=\"!editMode\" name=\"create\"></ion-icon> <span *ngIf=\"!editMode\"></span>\r\n        <ion-icon *ngIf=\"editMode\" name=\"close\"></ion-icon> \r\n      </ion-button>\r\n      <ion-button (click)=\"editConfig()\">\r\n        \r\n        <ion-icon name=\"cog\"></ion-icon> \r\n      </ion-button>\r\n    </ion-buttons> -->\r\n  </ion-item>\r\n</ion-card>",
                    styles: [".variable-value{font-size:1.4em;font-weight:700}ion-card{text-align:center}"]
                }] }
    ];
    /** @nocollapse */
    VariableCardComponent.ctorParameters = function () { return [
        { type: Router }
    ]; };
    VariableCardComponent.propDecorators = {
        cardType: [{ type: Input }],
        cardTypes: [{ type: Input }],
        editMode: [{ type: Input }],
        monitor: [{ type: Input }],
        showStartStopMonitoring: [{ type: Input }],
        unit: [{ type: Input }],
        variable: [{ type: Input }]
    };
    return VariableCardComponent;
}());
export { VariableCardComponent };
if (false) {
    /** @type {?} */
    VariableCardComponent.prototype.waitForSubmit;
    /** @type {?} */
    VariableCardComponent.prototype.cardType;
    /** @type {?} */
    VariableCardComponent.prototype.cardTypes;
    /** @type {?} */
    VariableCardComponent.prototype.editMode;
    /** @type {?} */
    VariableCardComponent.prototype.monitor;
    /** @type {?} */
    VariableCardComponent.prototype.showStartStopMonitoring;
    /** @type {?} */
    VariableCardComponent.prototype.unit;
    /** @type {?} */
    VariableCardComponent.prototype.error;
    /** @type {?} */
    VariableCardComponent.prototype.value;
    /**
     *
     * @type {?}
     */
    VariableCardComponent.prototype.refreshValues;
    /** @type {?} */
    VariableCardComponent.prototype.monitoringButtons;
    /** @type {?} */
    VariableCardComponent.prototype.selectOptions;
    /** @type {?} */
    VariableCardComponent.prototype._variable;
    /**
     * @type {?}
     * @private
     */
    VariableCardComponent.prototype._subscription;
    /** @type {?} */
    VariableCardComponent.prototype.router;
}
//# sourceMappingURL=data:application/json;base64, 