/**
 * @fileoverview added by tsickle
 * Generated from: lib/ui-components/tap-datalog-table/tap-datalog-table.component.ts
 * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
import { ChangeDetectorRef, Component, EventEmitter, Input, Output } from '@angular/core';
import { bufferToHexString } from '@iotize/common/byte-converter';
var TapDatalogTableComponent = /** @class */ (function () {
    function TapDatalogTableComponent(changeRefDetector) {
        this.changeRefDetector = changeRefDetector;
        this.onRetrySync = new EventEmitter();
        this.dataColumns = [];
        this.date = true;
        this.sync = true;
        this.syncEvent = new EventEmitter();
    }
    Object.defineProperty(TapDatalogTableComponent.prototype, "dataLogger", {
        set: /**
         * @param {?} dataLogger
         * @return {?}
         */
        function (dataLogger) {
            var _this = this;
            if (dataLogger) {
                dataLogger.stream.subscribe((/**
                 * @param {?} p
                 * @return {?}
                 */
                function (p) {
                    if (_this.dataColumns.length == 0) {
                        _this.initColumnsFromPacket(p);
                    }
                    if (!_this._packets) {
                        _this._packets = [];
                    }
                    _this._packets.push(p);
                    _this.changeRefDetector.detectChanges();
                }));
            }
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(TapDatalogTableComponent.prototype, "packets", {
        get: /**
         * @return {?}
         */
        function () {
            return this._packets;
        },
        set: /**
         * @param {?} packets
         * @return {?}
         */
        function (packets) {
            this._packets = packets;
            if (packets && this.dataColumns.length == 0 && packets.length > 0) {
                this.initColumnsFromPacket(packets[0]);
            }
        },
        enumerable: true,
        configurable: true
    });
    /**
     * @return {?}
     */
    TapDatalogTableComponent.prototype.ngOnInit = /**
     * @return {?}
     */
    function () { };
    /**
     * @param {?} packet
     * @param {?} key
     * @return {?}
     */
    TapDatalogTableComponent.prototype.packetVariableValue = /**
     * @param {?} packet
     * @param {?} key
     * @return {?}
     */
    function (packet, key) {
        /** @type {?} */
        var value = packet.decodedData[key];
        if (value instanceof Uint8Array) {
            value = "0x" + bufferToHexString(value);
        }
        return value;
    };
    /**
     * @param {?} packet
     * @return {?}
     */
    TapDatalogTableComponent.prototype.packetId = /**
     * @param {?} packet
     * @return {?}
     */
    function (packet) {
        return packet.meta.packetId;
    };
    /**
     * @param {?} packet
     * @return {?}
     */
    TapDatalogTableComponent.prototype.packetDate = /**
     * @param {?} packet
     * @return {?}
     */
    function (packet) {
        return packet.meta.logTime;
    };
    /**
     * @param {?} packetInfo
     * @return {?}
     */
    TapDatalogTableComponent.prototype.isPacketSync = /**
     * @param {?} packetInfo
     * @return {?}
     */
    function (packetInfo) {
        return packetInfo.syncInfo && packetInfo.syncInfo.isSync;
    };
    /**
     * @param {?} packetInfo
     * @return {?}
     */
    TapDatalogTableComponent.prototype.syncPacket = /**
     * @param {?} packetInfo
     * @return {?}
     */
    function (packetInfo) {
        this.onRetrySync.emit(packetInfo);
    };
    /**
     * @private
     * @param {?} p
     * @return {?}
     */
    TapDatalogTableComponent.prototype.initColumnsFromPacket = /**
     * @private
     * @param {?} p
     * @return {?}
     */
    function (p) {
        this.dataColumns = Object.keys(p.decodedData).map((/**
         * @param {?} key
         * @return {?}
         */
        function (key) {
            return {
                key: key,
                title: key
            };
        }));
    };
    TapDatalogTableComponent.decorators = [
        { type: Component, args: [{
                    selector: 'tap-datalog-table',
                    template: "<table *ngIf=\"dataColumns\" class=\"table\" mat-table>\r\n    <thead>\r\n        <th *ngIf=\"date\">\r\n            <ion-icon name=\"time\"></ion-icon> Date\r\n        </th>\r\n        <th>\r\n            <ion-icon name=\"document\"></ion-icon> ID\r\n        </th>\r\n        <th *ngFor=\"let dataColumn of dataColumns\">\r\n            <ion-icon name=\"analytics\"></ion-icon> {{ dataColumn.title }}\r\n        </th>\r\n        <th *ngIf=\"sync\">\r\n            <ion-icon name=\"cloud\"></ion-icon> Cloud sync\r\n        </th>\r\n    </thead>\r\n    <tbody>\r\n        <tr *ngFor=\"let packet of packets\">\r\n            <td *ngIf=\"date\">\r\n                {{ packetDate(packet) | date: 'short'}}\r\n            </td>\r\n            <td>\r\n                {{packetId(packet)}}\r\n            </td>\r\n            <td *ngFor=\"let info of dataColumns\">\r\n                {{ packetVariableValue(packet, info.key) }}\r\n            </td>\r\n            <td *ngIf=\"sync\">\r\n                <ion-text *ngIf=\"isPacketSync(packet)\" color=\"success\">\r\n                    <ion-icon [name]=\"'checkmark'\"></ion-icon> &nbsp;\r\n                    Sync\r\n                </ion-text>\r\n                <ion-text *ngIf=\"!isPacketSync(packet)\" color=\"danger\">\r\n                    <ion-icon [name]=\"'alert'\"></ion-icon> &nbsp;\r\n                    Not sync &nbsp;\r\n                    <a (click)=\"syncPacket(packet)\">\r\n                        retry\r\n                    </a>\r\n                </ion-text>\r\n                <!--  <ion-buttons slot=\"end\">\r\n                                    <ion-button (click)=\"syncPacket(packet)\" [color]=\"isPacketSync(packet) ? 'success': ''\" [disabled]=\"isPacketSync(packet)\">\r\n                                        <ion-icon [name]=\"isPacketSync(packet) ? 'checkmark' : 'sync'\"></ion-icon>\r\n                                        Sync\r\n                                    </ion-button>\r\n                                    <ion-button (click)=\"decodePacket(syncInfo)\">\r\n                        <ion-icon name=\"sync\"></ion-icon>\r\n                        Decode\r\n                    </ion-button> \r\n                                    <ion-button (click)=\"detail(syncInfo)\">\r\n                                                                                                                                                    <ion-icon name=\"more\"></ion-icon>\r\n                                                                                                                                                    Detail\r\n                                                                                                                                              </ion-button> \r\n                                </ion-buttons>-->\r\n            </td>\r\n        </tr>\r\n    </tbody>\r\n</table>\r\n",
                    styles: ["table{width:100%;border-collapse:collapse}tr:nth-of-type(odd){background:#eee}th{background:#333;color:#fff;font-weight:700}td,th{padding:10px;border:1px solid #ccc;text-align:left}@media only screen and (max-width:760px),(min-device-width:768px) and (max-device-width:1024px){table,tbody,td,th,thead,tr{display:block}thead tr{position:absolute;top:-9999px;left:-9999px}tr{border:1px solid #ccc}td{border:none;border-bottom:1px solid #eee;position:relative;padding-left:50%}td:before{position:relative;top:0;left:6px;width:45%;padding-right:10px;white-space:nowrap}}@media only screen and (min-device-width:320px) and (max-device-width:480px){body{padding:0;margin:0;width:320px}}@media only screen and (min-device-width:768px) and (max-device-width:1024px){body{width:495px}}"]
                }] }
    ];
    /** @nocollapse */
    TapDatalogTableComponent.ctorParameters = function () { return [
        { type: ChangeDetectorRef }
    ]; };
    TapDatalogTableComponent.propDecorators = {
        dataLogger: [{ type: Input }],
        packets: [{ type: Input }],
        onRetrySync: [{ type: Output }],
        dataColumns: [{ type: Input }],
        date: [{ type: Input }],
        sync: [{ type: Input }],
        syncEvent: [{ type: Output }]
    };
    return TapDatalogTableComponent;
}());
export { TapDatalogTableComponent };
if (false) {
    /** @type {?} */
    TapDatalogTableComponent.prototype._packets;
    /** @type {?} */
    TapDatalogTableComponent.prototype.onRetrySync;
    /** @type {?} */
    TapDatalogTableComponent.prototype.dataColumns;
    /** @type {?} */
    TapDatalogTableComponent.prototype.date;
    /** @type {?} */
    TapDatalogTableComponent.prototype.sync;
    /** @type {?} */
    TapDatalogTableComponent.prototype.syncEvent;
    /**
     * @type {?}
     * @protected
     */
    TapDatalogTableComponent.prototype.changeRefDetector;
}
//# sourceMappingURL=data:application/json;base64, 