@iotize/ionic
Version:
Iotize specific building blocks on top of @ionic/angular.
6,337 lines • 446 kB
JavaScript
import * as i0 from '@angular/core';
import { Injectable, Component, Input, NgModule, EventEmitter, Directive, Output, HostListener, PLATFORM_ID, ChangeDetectionStrategy, Inject, ViewChild, TemplateRef, ViewEncapsulation, ContentChild, ElementRef, NgZone, ChangeDetectorRef, Pipe } from '@angular/core';
import { BehaviorSubject, Observable, Subject, NEVER, combineLatest } from 'rxjs';
import { __awaiter, __decorate, __metadata } from 'tslib';
import * as i1$3 from '@iotize/ionic';
import { getFormFieldOrError, ExportToCsv, LibError, PendingCallManager, TapValueEditorContainerModule, InlineEditorModule, CurrentDeviceService, getAbstractVariableOrError, LibCommonModule } from '@iotize/ionic';
import * as i1 from '@angular/forms';
import { ReactiveFormsModule, FormControl, Validators, FormsModule } from '@angular/forms';
import * as i1$1 from '@ionic/angular';
import { IonicModule, ModalController, AlertController, ActionSheetController, Platform } from '@ionic/angular';
import * as i2 from '@angular/common';
import { CommonModule, DecimalPipe } from '@angular/common';
import * as i3 from '@swimlane/ngx-charts';
import { BaseChartComponent, LegendPosition, NgxChartsModule, GaugeComponent, HeatMapComponent, LineChartComponent, NumberCardComponent, PieChartComponent, PolarChartComponent, PieChartModule } from '@swimlane/ngx-charts';
import { takeUntil, switchMap, shareReplay, map } from 'rxjs/operators';
import * as i1$2 from '@awesome-cordova-plugins/file/ngx';
import { File } from '@awesome-cordova-plugins/file/ngx';
import { createDebugger } from '@iotize/common/debug';
import * as i3$1 from '@iotize/app-common';
import { IconModule } from '@iotize/app-common';
import * as i2$1 from '@angular/material/table';
import { MatTableModule } from '@angular/material/table';
import * as i3$2 from '@angular/cdk/table';
import { DataSource, CdkTableModule } from '@angular/cdk/table';
import { deepCopy, listEnumKeys } from '@iotize/common/utility';
import { TapStreamReader, NumberConverter, TapStreamWriter } from '@iotize/tap/client/impl';
import { variableDataTypeToByteSize, TapVariable } from '@iotize/tap/data';
import { VariableType } from '@iotize/tap/service/impl/variable';
import { GPIOMode } from '@iotize/tap/service/impl/gpio';
import * as shape from 'd3-shape';
import * as i3$3 from '@swimlane/ngx-datatable';
import { ColumnMode, NgxDatatableModule } from '@swimlane/ngx-datatable';
import * as i1$4 from '@angular/router';
import { bufferToHexString } from '@iotize/common/byte-converter';
class MonitoringSettingsService {
constructor() {
this.subject = new BehaviorSubject({
period: 1000,
});
}
set settings(value) {
this.subject.next(value);
}
get settings() {
return this.subject.value;
}
get settings$() {
return this.subject;
}
}
/** @nocollapse */ MonitoringSettingsService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MonitoringSettingsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
/** @nocollapse */ MonitoringSettingsService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MonitoringSettingsService, providedIn: 'root' });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MonitoringSettingsService, decorators: [{
type: Injectable,
args: [{
providedIn: 'root',
}]
}], ctorParameters: function () { return []; } });
class TapMonitoringSettingsComponent {
get period() {
return getFormFieldOrError(this.form, 'period');
}
get dataSource() {
return getFormFieldOrError(this.form, 'dataSource');
}
constructor(formBuilder, monitoringSettingsService, modalController) {
this.formBuilder = formBuilder;
this.monitoringSettingsService = monitoringSettingsService;
this.modalController = modalController;
this.showDataSource = false;
this.form = this.formBuilder.group({
period: [this.monitoringSettingsService.settings.period],
dataSource: ['live'],
});
}
ngOnInit() {
this.form.valueChanges.subscribe(() => {
this.monitoringSettingsService.settings = {
period: this.period.value,
};
});
}
dismiss() {
return __awaiter(this, void 0, void 0, function* () {
const topOverlay = yield this.modalController.getTop();
if (topOverlay) {
yield this.modalController.dismiss(topOverlay.id);
}
});
}
}
/** @nocollapse */ TapMonitoringSettingsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapMonitoringSettingsComponent, deps: [{ token: i1.FormBuilder }, { token: MonitoringSettingsService }, { token: i1$1.ModalController }], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ TapMonitoringSettingsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TapMonitoringSettingsComponent, selector: "tap-monitoring-settings", inputs: { showDataSource: "showDataSource" }, ngImport: i0, template: "<ion-header>\n <ion-toolbar color=\"primary\">\n <ion-buttons slot=\"start\">\n <ion-button (click)=\"dismiss()\">\n <ion-icon name=\"arrow-back\"></ion-icon>\n </ion-button>\n </ion-buttons>\n <ion-title class=\"text-center\">\n Monitoring Settings\n </ion-title>\n </ion-toolbar>\n</ion-header>\n<ion-content>\n <form [formGroup]=\"form\">\n <ion-list>\n <ion-item>\n <ion-label>Frequency (in milliseconds)</ion-label>\n <ion-input\n [formControlName]=\"'period'\"\n slot=\"end\"\n text-right\n type=\"number\"\n ></ion-input>\n </ion-item>\n <ion-item *ngIf=\"showDataSource\">\n <ion-label>Data source</ion-label>\n <ion-select [formControlName]=\"'dataSource'\" slot=\"end\">\n <ion-select-option value=\"live\">Live data</ion-select-option>\n <ion-select-option value=\"datalog\">Data log</ion-select-option>\n </ion-select>\n </ion-item>\n </ion-list>\n </form>\n</ion-content>\n<ion-footer>\n <ion-toolbar>\n <ion-buttons slot=\"end\">\n <ion-button (click)=\"dismiss()\">Ok</ion-button>\n </ion-buttons>\n </ion-toolbar>\n</ion-footer>\n", styles: [""], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1$1.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: i1$1.IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { kind: "component", type: i1$1.IonContent, selector: "ion-content", inputs: ["color", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "component", type: i1$1.IonFooter, selector: "ion-footer", inputs: ["collapse", "mode", "translucent"] }, { kind: "component", type: i1$1.IonHeader, selector: "ion-header", inputs: ["collapse", "mode", "translucent"] }, { kind: "component", type: i1$1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i1$1.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: i1$1.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: i1$1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i1$1.IonList, selector: "ion-list", inputs: ["inset", "lines", "mode"] }, { kind: "component", type: i1$1.IonSelect, selector: "ion-select", inputs: ["cancelText", "compareWith", "disabled", "interface", "interfaceOptions", "mode", "multiple", "name", "okText", "placeholder", "selectedText", "value"] }, { kind: "component", type: i1$1.IonSelectOption, selector: "ion-select-option", inputs: ["disabled", "value"] }, { kind: "component", type: i1$1.IonTitle, selector: "ion-title", inputs: ["color", "size"] }, { kind: "component", type: i1$1.IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { kind: "directive", type: i1$1.NumericValueAccessor, selector: "ion-input[type=number]" }, { kind: "directive", type: i1$1.SelectValueAccessor, selector: "ion-range, ion-select, ion-radio-group, ion-segment, ion-datetime" }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapMonitoringSettingsComponent, decorators: [{
type: Component,
args: [{ selector: 'tap-monitoring-settings', template: "<ion-header>\n <ion-toolbar color=\"primary\">\n <ion-buttons slot=\"start\">\n <ion-button (click)=\"dismiss()\">\n <ion-icon name=\"arrow-back\"></ion-icon>\n </ion-button>\n </ion-buttons>\n <ion-title class=\"text-center\">\n Monitoring Settings\n </ion-title>\n </ion-toolbar>\n</ion-header>\n<ion-content>\n <form [formGroup]=\"form\">\n <ion-list>\n <ion-item>\n <ion-label>Frequency (in milliseconds)</ion-label>\n <ion-input\n [formControlName]=\"'period'\"\n slot=\"end\"\n text-right\n type=\"number\"\n ></ion-input>\n </ion-item>\n <ion-item *ngIf=\"showDataSource\">\n <ion-label>Data source</ion-label>\n <ion-select [formControlName]=\"'dataSource'\" slot=\"end\">\n <ion-select-option value=\"live\">Live data</ion-select-option>\n <ion-select-option value=\"datalog\">Data log</ion-select-option>\n </ion-select>\n </ion-item>\n </ion-list>\n </form>\n</ion-content>\n<ion-footer>\n <ion-toolbar>\n <ion-buttons slot=\"end\">\n <ion-button (click)=\"dismiss()\">Ok</ion-button>\n </ion-buttons>\n </ion-toolbar>\n</ion-footer>\n" }]
}], ctorParameters: function () { return [{ type: i1.FormBuilder }, { type: MonitoringSettingsService }, { type: i1$1.ModalController }]; }, propDecorators: { showDataSource: [{
type: Input
}] } });
class TapMonitoringSettingsModule {
}
/** @nocollapse */ TapMonitoringSettingsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapMonitoringSettingsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ TapMonitoringSettingsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: TapMonitoringSettingsModule, declarations: [TapMonitoringSettingsComponent], imports: [CommonModule, IonicModule, ReactiveFormsModule], exports: [TapMonitoringSettingsComponent] });
/** @nocollapse */ TapMonitoringSettingsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapMonitoringSettingsModule, imports: [CommonModule, IonicModule, ReactiveFormsModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapMonitoringSettingsModule, decorators: [{
type: NgModule,
args: [{
declarations: [TapMonitoringSettingsComponent],
exports: [TapMonitoringSettingsComponent],
entryComponents: [TapMonitoringSettingsComponent],
imports: [CommonModule, IonicModule, ReactiveFormsModule],
}]
}] });
class ChartDataModel {
constructor() {
this.subList = [];
this.currentData = [];
}
initLabel(indexOrArray) {
if (indexOrArray) {
this.labels = indexOrArray;
}
}
initVariable(variableOrArray) {
if (!variableOrArray) {
return [];
}
const vArray = Array.isArray(variableOrArray)
? variableOrArray
: [variableOrArray];
return vArray.map((variable) => {
var _a;
return {
stream: variable.values,
label: ((_a = variable.id) === null || _a === void 0 ? void 0 : _a.toString()) || '',
};
});
}
/**
* @param inputs data inputs
* @param history to show data with time
* @param valueCountLimit when history has true, this one define the limit of length
*/
defineInputStreamSingle(inputs, history, valueCountLimit, forceHistory) {
this.currentData = inputs;
return new Observable((observer) => {
let results = [];
if (inputs) {
if (!Array.isArray(inputs)) {
inputs = [inputs];
}
inputs.forEach((input) => {
if (input) {
const inputStream = input;
this.subList.push(inputStream.stream.subscribe({
next: (data) => {
if (Array.isArray(data) && !forceHistory) {
if (data.length > 1) {
history = false;
}
}
let i = 0;
if (history) {
if (Array.isArray(data)) {
const vals = JSON.parse('{"name": "' + this.currentDate() + '"}');
data.forEach((d) => {
vals[i] = d;
i++;
});
results.push(vals);
results = [
...results.map((r) => {
let newKeys = {};
let i = 0;
for (const [key, value] of Object.entries(r)) {
if (key !== 'name') {
if (typeof key === 'number') {
newKeys[key] = this.labelConfig(key, input.label);
}
else {
newKeys[key] = this.labelConfig(i, input.label);
}
}
else {
newKeys[key] = key;
}
if (!(key === 'name' && i === 0)) {
i++;
}
}
const renamedObj = this.renameKeys(r, newKeys);
const mappedObj = {};
mappedObj['name'] = renamedObj['name'];
for (const [key, v] of Object.entries(renamedObj)) {
if (key !== 'name') {
mappedObj[key] = v;
}
}
return mappedObj;
}),
];
const itemCount = results.length;
if (valueCountLimit !== undefined &&
itemCount > valueCountLimit) {
const toRemove = itemCount - valueCountLimit;
results.splice(0, toRemove);
}
}
else {
results.push({
name: this.currentDate(),
value: data,
extra: 0,
});
const itemCount = results.length;
if (valueCountLimit !== undefined &&
itemCount > valueCountLimit) {
const toRemove = itemCount - valueCountLimit;
results.splice(0, toRemove);
}
}
}
else {
if (Array.isArray(data)) {
data.map(() => {
results[i] = {
name: this.labelConfig(i, input.label),
value: data[i],
extra: i,
};
i++;
});
}
else {
results[i] = {
name: this.labelConfig(i, input.label),
value: data,
extra: i,
};
}
}
results = [...results];
observer.next(results);
},
error: (err) => {
console.log(err);
observer.next([]);
},
}));
}
});
}
});
}
defineMultiInputStream(inputs) {
this.currentData = inputs;
return new Observable((observer) => {
let results = [];
let indexInputs = 0;
inputs.forEach((input) => {
this.subList.push(input.stream.subscribe({
next: (values) => {
let indexInput = 0;
if (!Array.isArray(values)) {
values = [values];
}
values.map((value) => {
let indexOfLabel = 0;
for (const inputLabel of inputs) {
if (inputLabel.label === input.label) {
indexInputs = indexOfLabel;
}
indexOfLabel++;
}
if (!results[indexInput]) {
results[indexInput] = {
name: this.labelConfig(indexInput, 'Index '),
series: [],
};
}
results[indexInput].series[indexInputs] = {
name: inputs[indexInputs].label,
value: value,
extra: indexInput,
};
indexInput++;
});
results = [...results];
observer.next(results);
},
error: (err) => {
console.log(err);
observer.next([]);
},
}));
});
});
}
defineMultiInputStreamTable(inputs) {
this.currentData = inputs;
return new Observable((observer) => {
let results = [];
inputs.forEach((input) => {
let indexValues = 0;
this.subList.push(input.stream.subscribe({
next: (values) => {
let indexOfLabel = 0;
for (const inputLabel of inputs) {
if (inputLabel.label === input.label) {
indexValues = indexOfLabel;
}
indexOfLabel++;
}
const vals = JSON.parse('{"Name": "' + input.label + '"}');
let turn = 0;
if (!Array.isArray(values)) {
values = [values];
}
for (const val of values) {
vals[this.labelConfig(turn, 'Index')] = val;
turn++;
}
results[indexValues] = vals;
results = [...results];
observer.next(results);
},
error: (error) => {
console.log(error);
observer.next([]);
},
}));
});
});
}
defineInputStreamMulti(inputs, history, valueCountLimit) {
this.currentData = inputs;
return new Observable((observer) => {
let results = [];
if (inputs) {
if (!Array.isArray(inputs)) {
inputs = [inputs];
}
inputs.map((input) => {
const inputStream = input;
this.subList.push(inputStream.stream.subscribe({
next: (data) => {
const seriesData = [];
let indexLabel = 0;
if (history) {
if (Array.isArray(data)) {
data.forEach((element) => {
seriesData.push({
name: this.labelConfig(indexLabel, inputStream.label),
value: element,
extra: indexLabel,
});
indexLabel++;
});
results.push({
name: this.currentDate(),
series: seriesData,
});
const itemCount = results.length;
if (valueCountLimit !== undefined &&
itemCount > valueCountLimit) {
const toRemove = itemCount - valueCountLimit;
results.splice(0, toRemove);
}
}
else {
results.push({
name: new Date(),
series: [
{
name: inputStream.label,
value: data,
extra: 0,
},
],
});
const itemCount = results.length;
if (valueCountLimit !== undefined &&
itemCount > valueCountLimit) {
const toRemove = itemCount - valueCountLimit;
results.splice(0, toRemove);
}
}
}
else {
if (Array.isArray(data)) {
data.map((element) => {
seriesData.push({
name: this.labelConfig(indexLabel, inputStream.label),
value: element,
extra: indexLabel,
});
indexLabel++;
});
results = [
{
name: inputStream.label,
series: seriesData,
},
];
}
else {
results = [
{
name: inputStream.label,
series: [
{
name: this.labelConfig(indexLabel, inputStream.label),
value: data,
extra: indexLabel,
},
],
},
];
}
}
results = [...results];
observer.next(results);
},
error: (err) => {
console.log(err);
observer.next([]);
},
}));
});
}
});
}
defineInputStreamHistoryMultiLegend(inputs, valueCountLimit) {
this.currentData = inputs;
return new Observable((observer) => {
let results = [];
if (inputs) {
if (!Array.isArray(inputs)) {
inputs = [inputs];
}
results = [];
inputs.map((input) => {
if (input.stream) {
const inputStream = input;
this.subList.push(inputStream.stream.subscribe({
next: (value) => {
let indexLabel = 0;
if (Array.isArray(value)) {
value.map(() => {
if (!results[indexLabel]) {
results.push({
name: this.labelConfig(indexLabel, inputStream.label),
series: [],
});
}
else {
results[indexLabel].name = this.labelConfig(indexLabel, inputStream.label);
}
results[indexLabel].series.push({
name: new Date(),
value: value[indexLabel],
extra: indexLabel,
});
const itemCount = results[indexLabel].series.length;
if (valueCountLimit !== undefined &&
itemCount > valueCountLimit) {
const toRemove = itemCount - valueCountLimit;
results[indexLabel].series.splice(0, toRemove);
}
indexLabel++;
});
}
else {
if (!results[0]) {
results.push({
name: inputStream.label,
series: [],
});
}
results[0].series.push({
name: new Date(),
value: value,
extra: 0,
});
const itemCount = results[0].series.length;
if (valueCountLimit !== undefined &&
itemCount > valueCountLimit) {
const toRemove = itemCount - valueCountLimit;
results[0].series.splice(0, toRemove);
}
}
results = [...results];
observer.next(results);
},
error: (err) => {
console.log(err);
observer.next([]);
},
}));
}
});
}
});
}
labelConfig(index, labelBundle) {
let labelToReturn = '';
if (typeof this.labels === 'function') {
labelToReturn = this.labels(index);
}
else if (!this.labels) {
labelToReturn = labelBundle + (index + 1);
}
else {
if (Array.isArray(this.labels)) {
if (this.labels[index]) {
labelToReturn = this.labels[index];
}
else {
labelToReturn = labelBundle + (index + 1);
}
}
else if (!Array.isArray(this.labels) && index < 1) {
labelToReturn = this.labels;
}
else if (!Array.isArray(this.labels) && index > 0) {
labelToReturn = labelBundle + (index + 1);
}
}
return labelToReturn;
}
digit(n) {
return n > 9 ? '' + n : '0' + n;
}
renameKeys(obj, newKeys) {
const keyValues = Object.entries(obj).map(([key, value]) => {
const newKey = newKeys[key] || key;
return { [newKey]: value };
});
return Object.assign({}, ...keyValues);
}
showDetail(event, mod, component) {
return __awaiter(this, void 0, void 0, function* () {
const modal = yield mod.create({
component: component,
cssClass: 'modal-class',
componentProps: {
label: event.label,
value: event.value,
index: event.extra,
variable: this.currentData[0],
},
});
return yield modal.present();
});
}
currentDate() {
return ('' +
this.digit(+new Date().getHours()) +
':' +
this.digit(+new Date().getMinutes()) +
':' +
this.digit(+new Date().getSeconds()));
}
destroyCurrentSub() {
for (const sub of this.subList) {
sub.unsubscribe();
}
}
}
class ExportDataFormat {
}
function dataWithSeriesToCsv(dataReceive) {
if (dataReceive.length === 0) {
return [];
}
else {
const data = [];
dataReceive[0].series.forEach((value) => {
const element = {};
if (!isNaN(new Date(value.name).getDate())) {
element['time'] = value.name;
}
else {
element['label'] = value.name;
}
dataReceive.forEach((a) => {
const tab = a.series.filter((n) => value.name.toString() === n.name.toString());
if (tab.length !== 0) {
if (!element[a.name]) {
element[a.name] = tab[0].value;
}
}
});
data.push(element);
});
return data;
}
}
class TapVariableDataPopupComponent {
set variable(inputs) {
this.results.push({
name: this.label,
series: [],
});
inputs.stream.pipe(takeUntil(this.destroyed)).subscribe((value) => {
if (Array.isArray(value)) {
this.currentValue = value[this.index];
}
else {
this.currentValue = value;
}
const seriesData = {
name: new Date(),
value: this.currentValue,
extra: 0,
};
this.results[0].series.push(seriesData);
const itemCount = this.results[0].series.length;
if (itemCount > 10) {
const toRemove = itemCount - 10;
this.results[0].series.splice(0, toRemove);
}
this.results = [...this.results];
});
}
constructor(modalController) {
this.modalController = modalController;
this.legend = false;
this.showLabels = false;
this.animations = true;
this.xAxis = true;
this.yAxis = true;
this.showYAxisLabel = false;
this.showXAxisLabel = false;
this.timeline = false;
this.colorScheme = {
domain: ['#5AA454', '#A10A28', '#C7B42C', '#AAAAAA'],
};
this.results = [];
this.destroyed = new Subject();
this.currentDate =
'' +
this.digit(+new Date().getHours()) +
':' +
this.digit(+new Date().getMinutes()) +
':' +
this.digit(+new Date().getSeconds());
}
ngOnDestroy() {
this.destroyed.next();
}
dismissModal() {
return __awaiter(this, void 0, void 0, function* () {
yield this.modalController.dismiss();
});
}
digit(n) {
return n > 9 ? '' + n : '0' + n;
}
}
/** @nocollapse */ TapVariableDataPopupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableDataPopupComponent, deps: [{ token: i1$1.ModalController }], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ TapVariableDataPopupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TapVariableDataPopupComponent, selector: "tap-tap-variable-data-popup", inputs: { value: "value", label: "label", index: "index", variable: "variable" }, ngImport: i0, template: "<ion-header translucent>\n <ion-toolbar>\n <ion-buttons slot=\"start\">\n <ion-button (click)=\"dismissModal()\"\n ><ion-icon name=\"arrow-back-outline\"></ion-icon\n ></ion-button>\n </ion-buttons>\n <ion-title>{{ label }}</ion-title>\n <ion-buttons slot=\"end\">\n <span>Details</span>\n </ion-buttons>\n </ion-toolbar>\n</ion-header>\n<ion-content>\n <ion-list>\n <ion-item>\n <ion-label>Value on click</ion-label>\n <ion-note class=\"value\" slot=\"end\">{{ value }}</ion-note>\n </ion-item>\n <ion-item>\n <ion-label>Time on click</ion-label>\n <ion-note class=\"value\" slot=\"end\">{{ currentDate }}</ion-note>\n </ion-item>\n\n <ion-item>\n <ion-label>Current value</ion-label>\n <ion-note class=\"value\" slot=\"end\">{{ currentValue }}</ion-note>\n </ion-item>\n\n <!-- <ion-item>\n <ion-label>Dynamic graphic</ion-label>\n <div #containerRef style=\"height: 30vh; width: 100%\">\n <ngx-charts-line-chart\n [view]=\"[containerRef.offsetWidth, containerRef.offsetHeight]\"\n [scheme]=\"colorScheme\"\n [showXAxisLabel]=\"showXAxisLabel\"\n [showYAxisLabel]=\"showYAxisLabel\"\n [legend]=\"legend\"\n [xAxis]=\"xAxis\"\n [yAxis]=\"yAxis\"\n [timeline]=\"timeline\"\n [results]=\"results\"\n >\n </ngx-charts-line-chart>\n </div>\n </ion-item> -->\n </ion-list>\n</ion-content>\n", styles: [".my-custom-modal-css{--background: transparent !important}.value{font-size:1.3em;font-weight:700}\n"], dependencies: [{ kind: "component", type: i1$1.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: i1$1.IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { kind: "component", type: i1$1.IonContent, selector: "ion-content", inputs: ["color", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "component", type: i1$1.IonHeader, selector: "ion-header", inputs: ["collapse", "mode", "translucent"] }, { kind: "component", type: i1$1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i1$1.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: i1$1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i1$1.IonList, selector: "ion-list", inputs: ["inset", "lines", "mode"] }, { kind: "component", type: i1$1.IonNote, selector: "ion-note", inputs: ["color", "mode"] }, { kind: "component", type: i1$1.IonTitle, selector: "ion-title", inputs: ["color", "size"] }, { kind: "component", type: i1$1.IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableDataPopupComponent, decorators: [{
type: Component,
args: [{ selector: 'tap-tap-variable-data-popup', template: "<ion-header translucent>\n <ion-toolbar>\n <ion-buttons slot=\"start\">\n <ion-button (click)=\"dismissModal()\"\n ><ion-icon name=\"arrow-back-outline\"></ion-icon\n ></ion-button>\n </ion-buttons>\n <ion-title>{{ label }}</ion-title>\n <ion-buttons slot=\"end\">\n <span>Details</span>\n </ion-buttons>\n </ion-toolbar>\n</ion-header>\n<ion-content>\n <ion-list>\n <ion-item>\n <ion-label>Value on click</ion-label>\n <ion-note class=\"value\" slot=\"end\">{{ value }}</ion-note>\n </ion-item>\n <ion-item>\n <ion-label>Time on click</ion-label>\n <ion-note class=\"value\" slot=\"end\">{{ currentDate }}</ion-note>\n </ion-item>\n\n <ion-item>\n <ion-label>Current value</ion-label>\n <ion-note class=\"value\" slot=\"end\">{{ currentValue }}</ion-note>\n </ion-item>\n\n <!-- <ion-item>\n <ion-label>Dynamic graphic</ion-label>\n <div #containerRef style=\"height: 30vh; width: 100%\">\n <ngx-charts-line-chart\n [view]=\"[containerRef.offsetWidth, containerRef.offsetHeight]\"\n [scheme]=\"colorScheme\"\n [showXAxisLabel]=\"showXAxisLabel\"\n [showYAxisLabel]=\"showYAxisLabel\"\n [legend]=\"legend\"\n [xAxis]=\"xAxis\"\n [yAxis]=\"yAxis\"\n [timeline]=\"timeline\"\n [results]=\"results\"\n >\n </ngx-charts-line-chart>\n </div>\n </ion-item> -->\n </ion-list>\n</ion-content>\n", styles: [".my-custom-modal-css{--background: transparent !important}.value{font-size:1.3em;font-weight:700}\n"] }]
}], ctorParameters: function () { return [{ type: i1$1.ModalController }]; }, propDecorators: { value: [{
type: Input
}], label: [{
type: Input
}], index: [{
type: Input
}], variable: [{
type: Input
}] } });
class ExportDataService {
constructor(file, platform) {
this.file = file;
this.platform = platform;
}
triggerDownload(blob, filename) {
return __awaiter(this, void 0, void 0, function* () {
if (this.platform.is('cordova')) {
const directory = this.getDownloadDirectory();
filename = yield this.ensureFileNameAvailable(directory, filename);
yield this.file.writeFile(directory, filename, blob);
return directory;
}
else {
const link = document.createElement('a');
link.href = URL.createObjectURL(blob);
link.setAttribute('visibility', 'hidden');
link.download = filename;
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
return undefined;
}
});
}
getDownloadDirectory() {
let directory;
if (this.file.externalRootDirectory) {
directory = this.file.externalRootDirectory;
if (this.platform.is('android')) {
directory += 'Download/';
}
}
else if (this.file.dataDirectory) {
directory = this.file.dataDirectory;
}
else if (this.file.documentsDirectory) {
directory = this.file.documentsDirectory;
}
if (!directory) {
throw new Error('Cannot find a valid directory to download the log file');
}
return directory;
}
ensureFileNameAvailable(directory, filename) {
return __awaiter(this, void 0, void 0, function* () {
const parts = filename.split('.');
const extension = parts.length > 1 ? '.' + parts[parts.length - 1] : '';
const filenameWithoutExt = parts.length > 1 ? parts.slice(0, parts.length - 1).join('.') : parts[0];
let count = 1;
while (yield this.file
.checkFile(directory, filename)
.then((_) => true)
.catch((err) => {
console.log('Check file err', err);
return false;
})) {
filename = `${filenameWithoutExt} (${count})${extension}`;
count++;
}
return filename;
});
}
}
/** @nocollapse */ ExportDataService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ExportDataService, deps: [{ token: i1$2.File }, { token: i1$1.Platform }], target: i0.ɵɵFactoryTarget.Injectable });
/** @nocollapse */ ExportDataService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ExportDataService, providedIn: 'root' });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ExportDataService, decorators: [{
type: Injectable,
args: [{
providedIn: 'root',
}]
}], ctorParameters: function () { return [{ type: i1$2.File }, { type: i1$1.Platform }]; } });
class ExportDataDirective {
constructor(alertController, platform, dataToExportService) {
this.alertController = alertController;
this.platform = platform;
this.dataToExportService = dataToExportService;
this.exportDataError = new EventEmitter();
}
onClickEvent() {
return __awaiter(this, void 0, void 0, function* () {
if (this.exportedFileName === undefined) {
this.exportedFileName = 'data';
}
let alert;
let data = typeof this.dataToExport === 'function'
? this.dataToExport()
: this.dataToExport;
if ((data === null || data === void 0 ? void 0 : data.length) !== 0) {
if (!this.format) {
alert = yield this.alertController.create({
header: 'Export data',
cssClass: 'custom-alert',
message: 'Select file format',
buttons: [
{
text: 'CSV',
handler: () => __awaiter(this, void 0, void 0, function* () {
this.exportToCsv(data);
}),
},
{
text: 'JSON',
handler: () => {
this.exportToJson(data);
},
},
],
});
yield alert.present();
}
else {
switch (this.format) {
case 'csv':
yield this.exportToCsv(data);
break;
case 'json':
yield this.exportToJson(data);
break;
}
}
}
else {
const alert = yield this.alertController.create({
header: 'Export data',
message: 'Cannot export empty data.',
buttons: [
{
text: 'OK',
},
],
});
yield alert.present();
}
});
}
exportToJson(data) {
try {
this.dataToExportService.triggerDownload(new Blob([JSON.stringify(data, null, 4)]), `${this.exportedFileName}.json`);
}
catch (e) {
this.exportDataError.emit(e);
}
}
exportToCsv(data) {
return __awaiter(this, void 0, void 0, function* () {
try {
if (data) {
if (!this.exportedFileName) {
this.exportedFileName = 'data';
}
const csvExport = new ExportToCsv(data, this.exportedFileName, {
headers: Object.keys(data[0]),
});
const csvString = csvExport.csvToString();
yield this.dataToExportService.triggerDownload(new Blob([csvString]), `${this.exportedFileName}.csv`);
}
}
catch (e) {
this.exportDataError.emit(e);
}
});
}
}
/** @nocollapse */ ExportDataDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ExportDataDirective, deps: [{ token: i1$1.AlertController }, { token: i1$1.Platform }, { token: ExportDataService }], target: i0.ɵɵFactoryTarget.Directive });
/** @nocollapse */ ExportDataDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: ExportDataDirective, selector: "[tapExportData]", inputs: { exportedFileName: "exportedFileName", dataToExport: "dataToExport", format: "format" }, outputs: { exportDataError: "exportDataError" }, host: { listeners: { "click": "onClickEvent()" } }, ngImport: i0 });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ExportDataDirective, decorators: [{
type: Directive,
args: [{
selector: '[tapExportData]',
}]
}], ctorParameters: function () { return [{ type: i1$1.AlertController }, { type: i1$1.Platform }, { type: ExportDataService }]; }, propDecorators: { exportDataError: [{
type: Output
}], exportedFileName: [{
type: Input
}], dataToExport: [{
type: Input
}], format: [{
type: Input
}], onClickEvent: [{
type: HostListener,
args: ['click']
}] } });
class BarChartStackedComponent extends BaseChartComponent {
constructor(myChartElement, zone, cd, platformId, modalController) {
super(myChartElement, zone, cd, platformId);
this.modalController = modalController;
this.legendPosition = LegendPosition.Below;
this.showExportButton = false;
this.legend = true;
this.colorScheme = {
domain: [
'#5DADE2',
'#9B59B6',
'#F39C12',
'#5AA454',
'#A10A28',
'#C7B42C',
'#AAAAAA',
],
};
this.orientation = 'vertical';
this.showDetails = false;
this.noBarWhenZero = false;
this.showXAxis = true;
this.showYAxis = true;
this.history = false;
this.valueCountLimit = 10;
this.results = [
{
name: '---',
series: [
{
name: '---',
value: 0,
extra: 0,
},
],
},
];
this.scrollableChart = false;
this.chartModel = new ChartDataModel();
}
set label(indexOrArray) {
this.chartModel.initLabel(indexOrArray);
}
set data(results) {
this.results = results;
}
createExportedData() {
return dataWithSeriesToCsv(this.results);
}
onSelect(event) {
if (typeof event === 'object') {
if (this.showDetails) {
this.chartModel
.showDetail(event, this.modalController, TapVariableDataPopupComponent)
.catch((err) => {
console.log(err);
});
}
}
}
ngAfterViewChecked() {
if (!this.scrollableChart) {
this.widthChart = this.divContainer.nativeElement.offsetWidth;
this.heightChart = this.divContainer.nativeElement.offsetHeight;
}
this.cd.detectChanges();
}
resizeToScroll(size, seriesSize) {
if (this.orientation === 'vertical') {
if (this.divContainer.nativeElement.offsetWidth <=
size * 50 * seriesSize) {
this.barChartVer.view = [
size * 50 * seriesSize,
this.divContainer.nativeElement.offsetHeight,
];
}
}
else if (this.orientation === 'horizontal') {
if (this.divContainer.nativeElement.offsetHeight <=
size * 50 * seriesSize) {
this.barChartHor.view = [
this.divContainer.nativeElement.offsetWidth,
size * 50 * seriesSize,
];
}
}
}
ngOnDestroy() {
var _a;
(_a = this.subscription) === null || _a === void 0 ? void 0 : _a.unsubscribe();
this.chartModel.destroyCurrentSub();
}
}
/** @nocollapse */ BarChartStackedComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: BarChartStackedComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: PLATFORM_ID }, { token: i1$1.ModalController }], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ BarChartStackedComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: BarChartStackedComponent, selector: "iotize-dashboard-bar-chart-stacked", inputs: { orientation: "orientation", showDetails: "showDetails", noBarWhenZero: "noBarWhenZero", showXAxis: "showXAxis", showYAxis: "showYAxis", history: "history", valueCountLimit: "valueCountLimit", label: "label", data: "data", scrollableChart: "scrollableChart" }, viewQueries: [{ propertyName: "divContainer", first: true, predicate: ["containerRef"], descendants: true }, { propertyName: "barChartHor", first: true, predicate: ["barChartHor"], descendants: true }, { propertyName: "barChartVer", first: true, predicate: ["barChartVer"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div\n [ngClass]=\"\n scrollableChart\n ? orientation === 'vertical'\n ? 'verticalContainer'\n : 'horizontalContainer'\n : {}\n \"\n>\n <div\n #containerRef\n [ngClass]=\"\n legendPosition === 'below' && legend ? 'belowLegend' : 'rightLegend'\n \"\n [ngSwitch]=\"orientation\"\n style=\"position: relative\"\n >\n <ngx-charts-bar-horizontal-stacked\n *ngSwitchCase=\"'horizontal'\"\n #barChartHor\n [view]=\"[containerRef.offsetWidth, containerRef.offsetHeight]\"\n [scheme]=\"colorScheme\"\n [results]=\"results\"\n [legend]=\"legend\"\n [legendPosition]=\"legendPosition\"\n [xAxis]=\"showXAxis\"\n [noBarWhenZero]=\"noBarWhenZero\"\n [yAxis]=\"showYAxis\"\n (select)=\"onSelect($event)\"\n >\n </ngx-charts-bar-horizontal-stacked>\n <ngx-charts-bar-vertical-stacked\n *ngSwitchCase=\"'vertical'\"\n #barChartVer\n [view]=\"[containerRef.offsetWidth, containerRef.offsetHeight]\"\n [scheme]=\"colorScheme\"\n [results]=\"results\"\n [legend]=\"legend\"\n [legendPosition]=\"legendPosition\"\n [noBarWhenZero]=\"noBarWhenZero\"\n [xAxis]=\"showXAxis\"\n [yAxis]=\"showYAxis\"\n (select)=\"onSelect($event)\"\n >\n </ngx-charts-bar-vertical-stacked>\n <ion-fab-button\n id=\"exportFabButton\"\n size=\"small\"\n tapExportData\n *ngIf=\"showExportButton\"\n [dataToExport]=\"createExportedData.bind(this)\"\n [exportedFileName]=\"exportedFileName\"\n >\n <ion-icon name=\"download\"></ion-icon>\n </ion-fab-button>\n </div>\n</div>\n", styles: ["::ng-deep .horizontal-legend{overflow:auto!important}.belowLegend{max-height:50vh;width:100%;min-width:100%;margin-bottom:60px}.rightLegend{max-height:50vh;width:100%}#exportFabButton{position:absolute;top:10px;right:10px}@media (prefers-color-scheme: dark){::ng-deep span.legend-label-text{color:#ccc!important}::ng-deep span.legend-label-text:hover{color:#fff!important}::ng-deep .ngx-charts text{fill:#fff!important}}.verticalContainer{overflow-y:hidden;overflow-x:auto;max-height:60vh}.horizontalContainer{overflow-x:hidden;overflow-y:auto;max-height:60vh}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i3.BarHorizontalStackedComponent, selector: "ngx-charts-bar-horizontal-stacked", inputs: ["legend", "legendTitle", "legendPosition", "xAxis", "yAxis", "showXAxisLabel", "showYAxisLabel", "xAxisLabel", "yAxisLabel", "tooltipDisabled", "gradient", "showGridLines", "activeEntries", "schemeType", "trimXAxisTicks", "trimYAxisTicks", "rotateXAxisTicks", "maxXAxisTickLength", "maxYAxisTickLength", "xAxisTickFormatting", "yAxisTickFormatting", "xAxisTicks", "yAxisTicks", "barPadding", "roundDomains", "xScaleMax", "showDataLabel", "dataLabelFormatting", "noBarWhenZero", "wrapTicks"], outputs: ["activate", "deactivate"] }, { kind: "component", type: i3.BarVerticalStackedComponent, selector: "ngx-charts-bar-vertical-stacked", inputs: ["legend", "legendTitle", "legendPosition", "xAxis", "yAxis", "showXAxisLabel", "showYAxisLabel", "xAxisLabel", "yAxisLabel", "tooltipDisabled", "gradient", "showGridLines", "activeEntries", "schemeType", "trimXAxisTicks", "trimYAxisTicks", "rotateXAxisTicks", "maxXAxisTickLength", "maxYAxisTickLength", "xAxisTickFormatting", "yAxisTickFormatting", "xAxisTicks", "yAxisTicks", "barPadding", "roundDomains", "yScaleMax", "showDataLabel", "dataLabelFormatting", "noBarWhenZero", "wrapTicks"], outputs: ["activate", "deactivate"] }, { kind: "component", type: i1$1.IonFabButton, selector: "ion-fab-button", inputs: ["activated", "closeIcon", "color", "disabled", "download", "href", "mode", "rel", "routerAnimation", "routerDirection", "show", "size", "target", "translucent", "type"] }, { kind: "component", type: i1$1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "directive", type: ExportDataDirective, selector: "[tapExportData]", inputs: ["exportedFileName", "dataToExport", "format"], outputs: ["exportDataError"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: BarChartStackedComponent, decorators: [{
type: Component,
args: [{ selector: 'iotize-dashboard-bar-chart-stacked', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n [ngClass]=\"\n scrollableChart\n ? orientation === 'vertical'\n ? 'verticalContainer'\n : 'horizontalContainer'\n : {}\n \"\n>\n <div\n #containerRef\n [ngClass]=\"\n legendPosition === 'below' && legend ? 'belowLegend' : 'rightLegend'\n \"\n [ngSwitch]=\"orientation\"\n style=\"position: relative\"\n >\n <ngx-charts-bar-horizontal-stacked\n *ngSwitchCase=\"'horizontal'\"\n #barChartHor\n [view]=\"[containerRef.offsetWidth, containerRef.offsetHeight]\"\n [scheme]=\"colorScheme\"\n [results]=\"results\"\n [legend]=\"legend\"\n [legendPosition]=\"legendPosition\"\n [xAxis]=\"showXAxis\"\n [noBarWhenZero]=\"noBarWhenZero\"\n [yAxis]=\"showYAxis\"\n (select)=\"onSelect($event)\"\n >\n </ngx-charts-bar-horizontal-stacked>\n <ngx-charts-bar-vertical-stacked\n *ngSwitchCase=\"'vertical'\"\n #barChartVer\n [view]=\"[containerRef.offsetWidth, containerRef.offsetHeight]\"\n [scheme]=\"colorScheme\"\n [results]=\"results\"\n [legend]=\"legend\"\n [legendPosition]=\"legendPosition\"\n [noBarWhenZero]=\"noBarWhenZero\"\n [xAxis]=\"showXAxis\"\n [yAxis]=\"showYAxis\"\n (select)=\"onSelect($event)\"\n >\n </ngx-charts-bar-vertical-stacked>\n <ion-fab-button\n id=\"exportFabButton\"\n size=\"small\"\n tapExportData\n *ngIf=\"showExportButton\"\n [dataToExport]=\"createExportedData.bind(this)\"\n [exportedFileName]=\"exportedFileName\"\n >\n <ion-icon name=\"download\"></ion-icon>\n </ion-fab-button>\n </div>\n</div>\n", styles: ["::ng-deep .horizontal-legend{overflow:auto!important}.belowLegend{max-height:50vh;width:100%;min-width:100%;margin-bottom:60px}.rightLegend{max-height:50vh;width:100%}#exportFabButton{position:absolute;top:10px;right:10px}@media (prefers-color-scheme: dark){::ng-deep span.legend-label-text{color:#ccc!important}::ng-deep span.legend-label-text:hover{color:#fff!important}::ng-deep .ngx-charts text{fill:#fff!important}}.verticalContainer{overflow-y:hidden;overflow-x:auto;max-height:60vh}.horizontalContainer{overflow-x:hidden;overflow-y:auto;max-height:60vh}\n"] }]
}], ctorParameters: function () {
return [{ type: i0.ElementRef }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
type: Inject,
args: [PLATFORM_ID]
}] }, { type: i1$1.ModalController }];
}, propDecorators: { divContainer: [{
type: ViewChild,
args: ['containerRef']
}], barChartHor: [{
type: ViewChild,
args: ['barChartHor']
}], barChartVer: [{
type: ViewChild,
args: ['barChartVer']
}], orientation: [{
type: Input
}], showDetails: [{
type: Input
}], noBarWhenZero: [{
type: Input
}], showXAxis: [{
type: Input
}], showYAxis: [{
type: Input
}], history: [{
type: Input
}], valueCountLimit: [{
type: Input
}], label: [{
type: Input
}], data: [{
type: Input
}], scrollableChart: [{
type: Input
}] } });
class TapVariableDataPopupModule {
}
/** @nocollapse */ TapVariableDataPopupModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableDataPopupModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ TapVariableDataPopupModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: TapVariableDataPopupModule, declarations: [TapVariableDataPopupComponent], imports: [CommonModule, NgxChartsModule, IonicModule], exports: [TapVariableDataPopupComponent] });
/** @nocollapse */ TapVariableDataPopupModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableDataPopupModule, imports: [CommonModule, NgxChartsModule, IonicModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableDataPopupModule, decorators: [{
type: NgModule,
args: [{
declarations: [TapVariableDataPopupComponent],
exports: [TapVariableDataPopupComponent],
imports: [CommonModule, NgxChartsModule, IonicModule],
entryComponents: [TapVariableDataPopupComponent],
}]
}] });
class ExportDataModule {
}
/** @nocollapse */ ExportDataModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ExportDataModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ ExportDataModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: ExportDataModule, declarations: [ExportDataDirective], imports: [CommonModule, IonicModule], exports: [ExportDataDirective] });
/** @nocollapse */ ExportDataModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ExportDataModule, providers: [ExportDataService, File], imports: [CommonModule, IonicModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ExportDataModule, decorators: [{
type: NgModule,
args: [{
exports: [ExportDataDirective],
declarations: [ExportDataDirective],
imports: [CommonModule, IonicModule],
providers: [ExportDataService, File],
}]
}] });
class BarChartStackedModule {
}
/** @nocollapse */ BarChartStackedModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: BarChartStackedModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ BarChartStackedModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: BarChartStackedModule, declarations: [BarChartStackedComponent], imports: [CommonModule,
NgxChartsModule,
TapVariableDataPopupModule,
IonicModule,
ExportDataModule], exports: [BarChartStackedComponent] });
/** @nocollapse */ BarChartStackedModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: BarChartStackedModule, imports: [CommonModule,
NgxChartsModule,
TapVariableDataPopupModule,
IonicModule,
ExportDataModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: BarChartStackedModule, decorators: [{
type: NgModule,
args: [{
declarations: [BarChartStackedComponent],
exports: [BarChartStackedComponent],
imports: [
CommonModule,
NgxChartsModule,
TapVariableDataPopupModule,
IonicModule,
ExportDataModule,
],
}]
}] });
const debug = createDebugger('@iotize/ionic:monitoring');
class GaugeCardComponent extends GaugeComponent {
set digitsInfo(digitsInfo) {
debug('set valueFormatting from ', digitsInfo);
this.valueFormatting = (value) => {
var _a;
if (typeof value === 'number') {
const formattedOrNull = (_a = this.decimalPipe) === null || _a === void 0 ? void 0 : _a.transform(value, digitsInfo);
return formattedOrNull || value.toString();
}
else {
return value.toString();
}
};
}
set label(indexOrArray) {
this.chartModel.initLabel(indexOrArray);
}
set inputStream(stream) {
var _a;
(_a = this.subscription) === null || _a === void 0 ? void 0 : _a.unsubscribe();
if (!stream) {
return;
}
this.subscription = stream.subscribe({
next: (value) => {
if (this.dynamicRange) {
if (this.max == undefined || value > this.max) {
this.max = value;
debug('dynamic max range updated with: ', value);
}
if (this.min == undefined || value < this.min) {
this.min = value;
debug('dynamic min range updated with: ', value);
}
}
if (Array.isArray(value)) {
value.forEach((val, index) => {
if (!this.results[index]) {
this.results.push({
name: this.chartModel.labelConfig(index, 'Index'),
value: val,
});
}
else {
this.results[index].value = val;
}
});
}
else {
this.setSingleValue(value);
}
this.results = [...this.results];
},
error: (err) => {
debug(err);
this.onError.emit(err);
},
});
}
setSingleValue(value) {
var _a;
value = Number(value);
if (!((_a = this.results) === null || _a === void 0 ? void 0 : _a[0])) {
this.results = [
{
name: 'Value',
value: value,
},
];
}
else {
this.results[0].value = value;
this.results = [...this.results];
}
}
constructor(myChartElement, zone, cd, platformId, decimalPipe) {
super(myChartElement, zone, cd, platformId);
this.decimalPipe = decimalPipe;
this.showText = true;
/**
* Automatically set min/max range according to input values
*/
this.dynamicRange = true;
this.legend = false;
this.units = '';
this.showExportButton = false;
this.colorScheme = {
domain: [
'#5DADE2',
'#9B59B6',
'#F39C12',
'#5AA454',
'#A10A28',
'#C7B42C',
'#AAAAAA',
],
};
// @Input() view: [number, number];
this.onError = new EventEmitter();
this.chartModel = new ChartDataModel();
this.results = [
{
name: 'Value',
value: 0,
},
];
}
ngAfterViewInit() {
if (this.gaugeChart.height > 250) {
this.gaugeChart.margin = [80, 80, 0, 80];
}
else {
this.gaugeChart.margin = [0, 80, 0, 80];
}
this.gaugeChart.update();
}
scaleText(repeat = true) {
// if (this.textSize) {
// this.textTransform = ``;
// return;
// }
if (!this.textEl) {
return;
}
return super.scaleText(repeat);
}
ngOnDestroy() {
var _a;
super.ngOnDestroy();
(_a = this.subscription) === null || _a === void 0 ? void 0 : _a.unsubscribe();
}
onSelect(event) { }
}
/** @nocollapse */ GaugeCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: GaugeCardComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: PLATFORM_ID }, { token: i2.DecimalPipe }], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ GaugeCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: GaugeCardComponent, selector: "monitoring-gauge-card", inputs: { showText: "showText", dynamicRange: "dynamicRange", min: "min", max: "max", digitsInfo: "digitsInfo", legend: "legend", legendTitle: "legendTitle", units: "units", showExportButton: "showExportButton", exportedFileName: "exportedFileName", label: "label", colorScheme: "colorScheme", inputStream: "inputStream" }, outputs: { onError: "onError" }, viewQueries: [{ propertyName: "gaugeChart", first: true, predicate: ["ngxChartsGauge"], descendants: true }, { propertyName: "ngxChartsGauge", first: true, predicate: ["ngxChartsGauge"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"chart-container\" style=\"position: relative\">\n <ngx-charts-gauge\n #ngxChartsGauge\n [scheme]=\"colorScheme\"\n [results]=\"results\"\n [min]=\"min\"\n [max]=\"max\"\n [angleSpan]=\"angleSpan\"\n [startAngle]=\"startAngle\"\n [units]=\"units\"\n [bigSegments]=\"bigSegments\"\n [smallSegments]=\"smallSegments\"\n [legend]=\"legend\"\n [legendTitle]=\"legendTitle\"\n [valueFormatting]=\"valueFormatting\"\n [showText]=\"showText\"\n [view]=\"view\"\n (select)=\"onSelect($event)\"\n >\n </ngx-charts-gauge>\n <ion-fab-button\n id=\"exportFabButton\"\n size=\"small\"\n tapExportData\n [dataToExport]=\"results\"\n [exportedFileName]=\"exportedFileName\"\n *ngIf=\"showExportButton\"\n >\n <ion-icon name=\"download\"></ion-icon>\n </ion-fab-button>\n</div>\n", styles: [".chart-container{display:grid}@media (prefers-color-scheme: dark){::ng-deep span.legend-label-text{color:#ccc!important}::ng-deep span.legend-label-text:hover{color:#fff!important}::ng-deep .ngx-charts text{fill:#fff!important}}#exportFabButton{position:absolute;top:10px;right:10px}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.GaugeComponent, selector: "ngx-charts-gauge", inputs: ["legend", "legendTitle", "legendPosition", "min", "max", "textValue", "units", "bigSegments", "smallSegments", "results", "showAxis", "startAngle", "angleSpan", "activeEntries", "axisTickFormatting", "tooltipDisabled", "valueFormatting", "showText", "margin"], outputs: ["activate", "deactivate"] }, { kind: "component", type: i1$1.IonFabButton, selector: "ion-fab-button", inputs: ["activated", "closeIcon", "color", "disabled", "download", "href", "mode", "rel", "routerAnimation", "routerDirection", "show", "size", "target", "translucent", "type"] }, { kind: "component", type: i1$1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "directive", type: ExportDataDirective, selector: "[tapExportData]", inputs: ["exportedFileName", "dataToExport", "format"], outputs: ["exportDataError"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: GaugeCardComponent, decorators: [{
type: Component,
args: [{ selector: 'monitoring-gauge-card', template: "<div class=\"chart-container\" style=\"position: relative\">\n <ngx-charts-gauge\n #ngxChartsGauge\n [scheme]=\"colorScheme\"\n [results]=\"results\"\n [min]=\"min\"\n [max]=\"max\"\n [angleSpan]=\"angleSpan\"\n [startAngle]=\"startAngle\"\n [units]=\"units\"\n [bigSegments]=\"bigSegments\"\n [smallSegments]=\"smallSegments\"\n [legend]=\"legend\"\n [legendTitle]=\"legendTitle\"\n [valueFormatting]=\"valueFormatting\"\n [showText]=\"showText\"\n [view]=\"view\"\n (select)=\"onSelect($event)\"\n >\n </ngx-charts-gauge>\n <ion-fab-button\n id=\"exportFabButton\"\n size=\"small\"\n tapExportData\n [dataToExport]=\"results\"\n [exportedFileName]=\"exportedFileName\"\n *ngIf=\"showExportButton\"\n >\n <ion-icon name=\"download\"></ion-icon>\n </ion-fab-button>\n</div>\n", styles: [".chart-container{display:grid}@media (prefers-color-scheme: dark){::ng-deep span.legend-label-text{color:#ccc!important}::ng-deep span.legend-label-text:hover{color:#fff!important}::ng-deep .ngx-charts text{fill:#fff!important}}#exportFabButton{position:absolute;top:10px;right:10px}\n"] }]
}], ctorParameters: function () {
return [{ type: i0.ElementRef }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
type: Inject,
args: [PLATFORM_ID]
}] }, { type: i2.DecimalPipe }];
}, propDecorators: { gaugeChart: [{
type: ViewChild,
args: ['ngxChartsGauge']
}], ngxChartsGauge: [{
type: ViewChild,
args: ['ngxChartsGauge']
}], showText: [{
type: Input
}], dynamicRange: [{
type: Input
}], min: [{
type: Input
}], max: [{
type: Input
}], digitsInfo: [{
type: Input
}], legend: [{
type: Input
}], legendTitle: [{
type: Input
}], units: [{
type: Input
}], showExportButton: [{
type: Input
}], exportedFileName: [{
type: Input
}], label: [{
type: Input
}], colorScheme: [{
type: Input
}], inputStream: [{
type: Input
}], onError: [{
type: Output
}] } });
class GaugeCardModule {
}
/** @nocollapse */ GaugeCardModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: GaugeCardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ GaugeCardModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: GaugeCardModule, declarations: [GaugeCardComponent], imports: [CommonModule, NgxChartsModule, IonicModule, ExportDataModule], exports: [GaugeCardComponent, NgxChartsModule] });
/** @nocollapse */ GaugeCardModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: GaugeCardModule, imports: [CommonModule, NgxChartsModule, IonicModule, ExportDataModule, NgxChartsModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: GaugeCardModule, decorators: [{
type: NgModule,
args: [{
declarations: [GaugeCardComponent],
exports: [GaugeCardComponent, NgxChartsModule],
imports: [CommonModule, NgxChartsModule, IonicModule, ExportDataModule],
}]
}] });
class MonitoringActionsComponent {
set checkedButtonIndex(index) {
var _a;
if (index !== undefined) {
this.value = (_a = this.actions[index]) === null || _a === void 0 ? void 0 : _a.value;
}
}
constructor() {
this.segment = true;
this.actions = [];
this.disabled = false;
this.color = 'primary';
}
}
/** @nocollapse */ MonitoringActionsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MonitoringActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ MonitoringActionsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MonitoringActionsComponent, selector: "app-monitoring-actions", inputs: { segment: "segment", actions: "actions", checkedButtonIndex: "checkedButtonIndex", disabled: "disabled", color: "color" }, ngImport: i0, template: "<ion-buttons *ngIf=\"!segment\">\n <ion-button\n *ngFor=\"let action of actions\"\n [disabled]=\"disabled || action.disabled\"\n (click)=\"action.action()\"\n >\n <app-common-icon\n *ngIf=\"action.icon\"\n [image]=\"action.icon\"\n ></app-common-icon>\n {{ action.label }}\n </ion-button>\n</ion-buttons>\n<ion-segment\n *ngIf=\"segment\"\n [value]=\"value\"\n [scrollable]=\"true\"\n [color]=\"color\"\n style=\"overflow: auto; width: 100%\"\n>\n <ion-segment-button\n *ngFor=\"let action of actions; let i = index\"\n [value]=\"action.value\"\n [disabled]=\"disabled || action.disabled\"\n (click)=\"action.action()\"\n >\n <app-common-icon\n *ngIf=\"action.icon\"\n [image]=\"action.icon\"\n ></app-common-icon>\n {{ action.label }}\n </ion-segment-button>\n</ion-segment>\n", styles: [".input-wrapper{position:relative;z-index:9999}ion-buttons{margin-left:0}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1$1.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: i1$1.IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { kind: "component", type: i1$1.IonSegment, selector: "ion-segment", inputs: ["color", "disabled", "mode", "scrollable", "selectOnFocus", "swipeGesture", "value"] }, { kind: "component", type: i1$1.IonSegmentButton, selector: "ion-segment-button", inputs: ["disabled", "layout", "mode", "type", "value"] }, { kind: "directive", type: i1$1.SelectValueAccessor, selector: "ion-range, ion-select, ion-radio-group, ion-segment, ion-datetime" }, { kind: "component", type: i3$1.IconComponent, selector: "app-common-icon", inputs: ["imageSize", "color", "image"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MonitoringActionsComponent, decorators: [{
type: Component,
args: [{ selector: 'app-monitoring-actions', template: "<ion-buttons *ngIf=\"!segment\">\n <ion-button\n *ngFor=\"let action of actions\"\n [disabled]=\"disabled || action.disabled\"\n (click)=\"action.action()\"\n >\n <app-common-icon\n *ngIf=\"action.icon\"\n [image]=\"action.icon\"\n ></app-common-icon>\n {{ action.label }}\n </ion-button>\n</ion-buttons>\n<ion-segment\n *ngIf=\"segment\"\n [value]=\"value\"\n [scrollable]=\"true\"\n [color]=\"color\"\n style=\"overflow: auto; width: 100%\"\n>\n <ion-segment-button\n *ngFor=\"let action of actions; let i = index\"\n [value]=\"action.value\"\n [disabled]=\"disabled || action.disabled\"\n (click)=\"action.action()\"\n >\n <app-common-icon\n *ngIf=\"action.icon\"\n [image]=\"action.icon\"\n ></app-common-icon>\n {{ action.label }}\n </ion-segment-button>\n</ion-segment>\n", styles: [".input-wrapper{position:relative;z-index:9999}ion-buttons{margin-left:0}\n"] }]
}], ctorParameters: function () { return []; }, propDecorators: { segment: [{
type: Input
}], actions: [{
type: Input
}], checkedButtonIndex: [{
type: Input
}], disabled: [{
type: Input
}], color: [{
type: Input
}] } });
class MonitoringActionsModule {
}
/** @nocollapse */ MonitoringActionsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MonitoringActionsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ MonitoringActionsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: MonitoringActionsModule, declarations: [MonitoringActionsComponent], imports: [CommonModule, IonicModule, IconModule], exports: [MonitoringActionsComponent] });
/** @nocollapse */ MonitoringActionsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MonitoringActionsModule, imports: [CommonModule, IonicModule, IconModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MonitoringActionsModule, decorators: [{
type: NgModule,
args: [{
declarations: [MonitoringActionsComponent],
exports: [MonitoringActionsComponent],
imports: [CommonModule, IonicModule, IconModule],
}]
}] });
/**
* @deprecated
*/
class MonitoringEditTextComponent {
set inputStream(stream) {
this.setStream(stream);
}
set variable(variable) {
this._variable = variable;
}
set value(v) {
this.myControl.setValue(v);
}
errorToString(item) {
if (item.key in this.validationMessages) {
return this.validationMessages[item.key];
}
return item.value;
}
submit() {
const newValue = this.myControl.value;
if (this.actions) {
this.actions.next(newValue);
}
if (!this._variable) {
throw LibError.componentArgumentRequired(this.constructor.name, 'variable');
}
this.pendingCallManager
.exec(() => __awaiter(this, void 0, void 0, function* () {
if (this._variable) {
yield this.startAction(this._variable.write(newValue).then(() => {
this.myControl.setErrors(null);
this.outEvent.emit({
type: 'WRITE_SUCCESS',
payload: {
newValue: newValue,
},
});
}));
}
}))
.catch((err) => {
this.addFormError.bind(err);
throw err;
});
}
onKeydown(event) {
if (event.key === 'Enter') {
this.submit();
}
else if (event.key === 'Escape') {
this.close();
}
}
ngAfterViewInit() {
setTimeout(() => {
// if (!this.inputref.nativeElement) {
// console.warn('no this.inputref');
// return;
// }
this.inputref.setFocus();
}, 200);
}
close() {
this.outEvent.emit({
type: 'CLOSE',
});
}
addFormError(err) {
console.warn('Form error', err);
this.myControl.setErrors({
write: err.message,
});
this.outEvent.emit({
type: 'WRITE_ERROR',
payload: {
error: err,
},
});
}
refresh() {
if (!this._variable) {
throw LibError.componentArgumentRequired(this.constructor.name, 'variable');
}
this.startAction(this._variable
.read()
.then((v) => {
this.value = v;
})
.catch(this.addFormError.bind(this))).catch((err) => {
console.log(err);
});
}
startAction(actions) {
this.setLoading(true);
return actions.finally(() => this.setLoading(false));
}
setLoading(value) {
this.loading = value;
if (this.loading) {
this.myControl.disable();
}
else {
this.myControl.enable();
}
}
setStream(stream) {
var _a;
(_a = this.subscription) === null || _a === void 0 ? void 0 : _a.unsubscribe();
if (stream) {
this.subscription = stream.subscribe({
next: (value) => {
this.value = value;
},
error: (err) => {
this.myControl.setErrors({
refresh: err.message,
});
},
});
}
}
constructor(formBuilder, tapService) {
this.formBuilder = formBuilder;
this.loading = false;
this.validationMessages = {
required: 'Input is required',
minlength: 'Input is too short',
maxlength: 'Input is too long',
pattern: 'Input does not match pattern',
};
this.label = undefined;
this.input = 'string';
this.type = 'string';
this.clearInput = false;
this.clearOnEdit = false;
this.color = 'primary';
this.disabled = false;
this.inputMode = 'text';
this.max = undefined;
this.min = undefined;
this.maxLength = undefined;
this.minLength = undefined;
this.name = undefined;
this.pattern = undefined;
this.placeholder = undefined;
this.readonly = false;
this.required = false;
this.outEvent = new EventEmitter();
this.myControl = new FormControl('', Validators.compose([
Validators.required,
// Validators.maxLength(this.minLength),
// Validators.minLength(this.maxLength),
// Validators.pattern(this.pattern),
]));
this.myGroup = this.formBuilder.group({
myControl: this.myControl,
});
this.pendingCallManager = PendingCallManager.create(tapService);
this.loading = false;
}
ngOnInit() {
this.refresh();
}
}
/** @nocollapse */ MonitoringEditTextComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MonitoringEditTextComponent, deps: [{ token: i1.FormBuilder }, { token: i1$3.CurrentDeviceService }], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ MonitoringEditTextComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MonitoringEditTextComponent, selector: "monitoring-edit-text", inputs: { inputStream: "inputStream", variable: "variable", label: "label", input: "input", type: "type", actions: "actions", clearInput: "clearInput", clearOnEdit: "clearOnEdit", color: "color", disabled: "disabled", inputMode: "inputMode", max: "max", min: "min", maxLength: "maxLength", minLength: "minLength", name: "name", pattern: "pattern", placeholder: "placeholder", readonly: "readonly", required: "required", value: "value" }, outputs: { outEvent: "outEvent" }, viewQueries: [{ propertyName: "inputref", first: true, predicate: ["inputref"], descendants: true }], ngImport: i0, template: "<ion-item [formGroup]=\"myGroup\">\n <ion-label *ngIf=\"label\">{{ label }}</ion-label>\n <ion-input\n auto-focus\n (keydown)=\"onKeydown($event)\"\n #inputref\n formControlName=\"myControl\"\n [max]=\"max\"\n [maxlength]=\"maxLength\"\n [min]=\"min\"\n [minlength]=\"minLength\"\n [placeholder]=\"placeholder\"\n [required]=\"required\"\n [type]=\"type\"\n >\n </ion-input>\n <ion-buttons>\n <ion-button [disabled]=\"loading\" (click)=\"submit()\">\n <ion-icon name=\"send\" slot=\"start\"></ion-icon>\n <!-- Write -->\n </ion-button>\n <ion-button [disabled]=\"loading\" (click)=\"refresh()\">\n <ion-icon name=\"refresh\" slot=\"start\"></ion-icon>\n <!-- Refresh -->\n </ion-button>\n <ion-button [disabled]=\"loading\" (click)=\"close()\">\n <ion-icon name=\"close\" slot=\"start\"></ion-icon>\n </ion-button>\n </ion-buttons>\n <ion-spinner [hidden]=\"!loading\" name=\"lines\"></ion-spinner>\n</ion-item>\n<ion-item\n class=\"validation-errors\"\n *ngIf=\"\n myControl.dirty &&\n myControl.errors &&\n (myControl.errors | keyvalue).length > 0\n \"\n>\n <!-- {{ myControl.errors | json}} -->\n <ng-container *ngFor=\"let item of myControl.errors | keyvalue\">\n <ion-text color=\"danger error-message \">{{ errorToString(item) }}</ion-text>\n </ng-container>\n</ion-item>\n", styles: [".error-message{font-weight:700}ion-item{background:#ccc}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "component", type: i1$1.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: i1$1.IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { kind: "component", type: i1$1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i1$1.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: i1$1.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: i1$1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i1$1.IonSpinner, selector: "ion-spinner", inputs: ["color", "duration", "name", "paused"] }, { kind: "component", type: i1$1.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { kind: "directive", type: i1$1.TextValueAccessor, selector: "ion-input:not([type=number]),ion-textarea,ion-searchbar" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i2.KeyValuePipe, name: "keyvalue" }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MonitoringEditTextComponent, decorators: [{
type: Component,
args: [{ selector: 'monitoring-edit-text', template: "<ion-item [formGroup]=\"myGroup\">\n <ion-label *ngIf=\"label\">{{ label }}</ion-label>\n <ion-input\n auto-focus\n (keydown)=\"onKeydown($event)\"\n #inputref\n formControlName=\"myControl\"\n [max]=\"max\"\n [maxlength]=\"maxLength\"\n [min]=\"min\"\n [minlength]=\"minLength\"\n [placeholder]=\"placeholder\"\n [required]=\"required\"\n [type]=\"type\"\n >\n </ion-input>\n <ion-buttons>\n <ion-button [disabled]=\"loading\" (click)=\"submit()\">\n <ion-icon name=\"send\" slot=\"start\"></ion-icon>\n <!-- Write -->\n </ion-button>\n <ion-button [disabled]=\"loading\" (click)=\"refresh()\">\n <ion-icon name=\"refresh\" slot=\"start\"></ion-icon>\n <!-- Refresh -->\n </ion-button>\n <ion-button [disabled]=\"loading\" (click)=\"close()\">\n <ion-icon name=\"close\" slot=\"start\"></ion-icon>\n </ion-button>\n </ion-buttons>\n <ion-spinner [hidden]=\"!loading\" name=\"lines\"></ion-spinner>\n</ion-item>\n<ion-item\n class=\"validation-errors\"\n *ngIf=\"\n myControl.dirty &&\n myControl.errors &&\n (myControl.errors | keyvalue).length > 0\n \"\n>\n <!-- {{ myControl.errors | json}} -->\n <ng-container *ngFor=\"let item of myControl.errors | keyvalue\">\n <ion-text color=\"danger error-message \">{{ errorToString(item) }}</ion-text>\n </ng-container>\n</ion-item>\n", styles: [".error-message{font-weight:700}ion-item{background:#ccc}\n"] }]
}], ctorParameters: function () { return [{ type: i1.FormBuilder }, { type: i1$3.CurrentDeviceService }]; }, propDecorators: { inputref: [{
type: ViewChild,
args: ['inputref', { static: false }]
}], inputStream: [{
type: Input
}], variable: [{
type: Input
}], label: [{
type: Input
}], input: [{
type: Input
}], type: [{
type: Input
}], actions: [{
type: Input
}], clearInput: [{
type: Input
}], clearOnEdit: [{
type: Input
}], color: [{
type: Input
}], disabled: [{
type: Input
}], inputMode: [{
type: Input
}], max: [{
type: Input
}], min: [{
type: Input
}], maxLength: [{
type: Input
}], minLength: [{
type: Input
}], name: [{
type: Input
}], pattern: [{
type: Input
}], placeholder: [{
type: Input
}], readonly: [{
type: Input
}], required: [{
type: Input
}], value: [{
type: Input
}], outEvent: [{
type: Output
}] } });
class MonitoringEditTextModule {
}
/** @nocollapse */ MonitoringEditTextModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MonitoringEditTextModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ MonitoringEditTextModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: MonitoringEditTextModule, declarations: [MonitoringEditTextComponent], imports: [CommonModule, FormsModule, IonicModule, ReactiveFormsModule], exports: [MonitoringEditTextComponent, FormsModule] });
/** @nocollapse */ MonitoringEditTextModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MonitoringEditTextModule, imports: [CommonModule, FormsModule, IonicModule, ReactiveFormsModule, FormsModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MonitoringEditTextModule, decorators: [{
type: NgModule,
args: [{
declarations: [MonitoringEditTextComponent],
exports: [MonitoringEditTextComponent, FormsModule],
imports: [CommonModule, FormsModule, IonicModule, ReactiveFormsModule],
}]
}] });
class MonitoringRangeContentDirective {
constructor(tpl) {
this.tpl = tpl;
}
}
/** @nocollapse */ MonitoringRangeContentDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MonitoringRangeContentDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
/** @nocollapse */ MonitoringRangeContentDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: MonitoringRangeContentDirective, selector: "[monitoringRangeContent]", ngImport: i0 });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MonitoringRangeContentDirective, decorators: [{
type: Directive,
args: [{
selector: '[monitoringRangeContent]',
}]
}], ctorParameters: function () { return [{ type: i0.TemplateRef }]; } });
class MonitoringRangeComponent {
get rangeTemplateContext() {
return { $implicit: this };
}
set inputStream(stream) {
var _a;
(_a = this._valueSub) === null || _a === void 0 ? void 0 : _a.unsubscribe();
if (stream) {
this._valueSub = this.focusChange
.pipe(switchMap((hasFocus) => {
if (hasFocus) {
return NEVER;
}
else {
return stream;
}
}), shareReplay(1))
.subscribe((v) => {
this.currentValue = v;
});
}
else {
this.currentValue = undefined;
}
}
set step(step) {
if (step == 0) {
step = 1;
}
this._step = step;
}
constructor() {
this.focusChange = new BehaviorSubject(false);
this.dualKnobs = false;
this.currentValue = undefined;
this.previousValue = undefined;
this.onValueChanged = new EventEmitter();
this.min = 0;
this.max = 100;
this._step = 1;
this.debounce = 0;
this.pin = true;
this.disabled = false;
this.snaps = true;
this.ticks = true;
this.writeValueForEveryChange = false;
}
ngOnDestroy() {
var _a;
(_a = this._valueSub) === null || _a === void 0 ? void 0 : _a.unsubscribe();
}
_onValueChanged(event) {
this.previousValue = this.currentValue;
this.currentValue = event.detail.value;
if (this.writeValueForEveryChange) {
this.onSliderReleased(event);
}
}
onSliderReleased($event) {
var _a;
let currentValue = this.currentValue;
// Issue on mobile: onSliderReleased() may be called before _onValueChanged() event
// So we directly read the value from the range HTML element if available
if (typeof ((_a = this.range) === null || _a === void 0 ? void 0 : _a.value) === 'number') {
currentValue = this.range.value;
}
if (this.previousValue !== currentValue) {
this.onValueChanged.emit(currentValue);
this.previousValue = currentValue;
}
}
}
/** @nocollapse */ MonitoringRangeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MonitoringRangeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ MonitoringRangeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MonitoringRangeComponent, selector: "monitoring-range", inputs: { inputStream: "inputStream", min: "min", max: "max", step: "step", debounce: "debounce", pin: "pin", disabled: "disabled", snaps: "snaps", ticks: "ticks", writeValueForEveryChange: "writeValueForEveryChange", leftIcon: "leftIcon", leftIconColor: "leftIconColor", rightIcon: "rightIcon", rightIconColor: "rightIconColor", color: "color" }, outputs: { onValueChanged: "onValueChanged" }, queries: [{ propertyName: "rangeTemplate", first: true, predicate: MonitoringRangeContentDirective, descendants: true, read: TemplateRef, static: true }], viewQueries: [{ propertyName: "range", first: true, predicate: ["range"], descendants: true, static: true }, { propertyName: "el", first: true, predicate: [".range-knob"], descendants: true }], ngImport: i0, template: "<ion-range\n #range\n [value]=\"currentValue\"\n [class.disableRange]=\"disabled\"\n [min]=\"min\"\n [max]=\"max\"\n [step]=\"_step\"\n [color]=\"color\"\n [snaps]=\"snaps\"\n [debounce]=\"debounce\"\n [pin]=\"pin\"\n [ticks]=\"ticks\"\n [dualKnobs]=\"dualKnobs\"\n [disabled]=\"disabled\"\n (ionChange)=\"_onValueChanged($event)\"\n (ionKnobMoveEnd)=\"onSliderReleased($event)\"\n [ngClass]=\"disabled ? 'rangeDisabled' : ''\"\n>\n <app-common-icon\n *ngIf=\"leftIcon\"\n slot=\"start\"\n [image]=\"leftIcon\"\n [color]=\"leftIconColor\"\n ></app-common-icon>\n <ng-container\n *ngTemplateOutlet=\"\n rangeTemplate || defaultRangeTemplate;\n context: rangeTemplateContext\n \"\n ></ng-container>\n <app-common-icon\n *ngIf=\"rightIcon\"\n slot=\"end\"\n [image]=\"rightIcon\"\n [color]=\"rightIconColor\"\n ></app-common-icon>\n</ion-range>\n\n<ng-template #defaultRangeTemplate>\n <ion-label slot=\"start\">{{ min }}</ion-label>\n <ion-label slot=\"end\">{{ max }}</ion-label>\n</ng-template>\n", styles: ["ion-range{padding-left:0;padding-right:0;min-width:150px}@media (prefers-color-scheme: dark){.rangeDisabled{--knob-size: 0px}}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i1$1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i1$1.IonRange, selector: "ion-range", inputs: ["activeBarStart", "color", "debounce", "disabled", "dualKnobs", "max", "min", "mode", "name", "pin", "pinFormatter", "snaps", "step", "ticks", "value"] }, { kind: "directive", type: i1$1.SelectValueAccessor, selector: "ion-range, ion-select, ion-radio-group, ion-segment, ion-datetime" }, { kind: "component", type: i3$1.IconComponent, selector: "app-common-icon", inputs: ["imageSize", "color", "image"] }], encapsulation: i0.ViewEncapsulation.None });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MonitoringRangeComponent, decorators: [{
type: Component,
args: [{ selector: 'monitoring-range', encapsulation: ViewEncapsulation.None, template: "<ion-range\n #range\n [value]=\"currentValue\"\n [class.disableRange]=\"disabled\"\n [min]=\"min\"\n [max]=\"max\"\n [step]=\"_step\"\n [color]=\"color\"\n [snaps]=\"snaps\"\n [debounce]=\"debounce\"\n [pin]=\"pin\"\n [ticks]=\"ticks\"\n [dualKnobs]=\"dualKnobs\"\n [disabled]=\"disabled\"\n (ionChange)=\"_onValueChanged($event)\"\n (ionKnobMoveEnd)=\"onSliderReleased($event)\"\n [ngClass]=\"disabled ? 'rangeDisabled' : ''\"\n>\n <app-common-icon\n *ngIf=\"leftIcon\"\n slot=\"start\"\n [image]=\"leftIcon\"\n [color]=\"leftIconColor\"\n ></app-common-icon>\n <ng-container\n *ngTemplateOutlet=\"\n rangeTemplate || defaultRangeTemplate;\n context: rangeTemplateContext\n \"\n ></ng-container>\n <app-common-icon\n *ngIf=\"rightIcon\"\n slot=\"end\"\n [image]=\"rightIcon\"\n [color]=\"rightIconColor\"\n ></app-common-icon>\n</ion-range>\n\n<ng-template #defaultRangeTemplate>\n <ion-label slot=\"start\">{{ min }}</ion-label>\n <ion-label slot=\"end\">{{ max }}</ion-label>\n</ng-template>\n", styles: ["ion-range{padding-left:0;padding-right:0;min-width:150px}@media (prefers-color-scheme: dark){.rangeDisabled{--knob-size: 0px}}\n"] }]
}], ctorParameters: function () { return []; }, propDecorators: { rangeTemplate: [{
type: ContentChild,
args: [MonitoringRangeContentDirective, {
read: TemplateRef,
static: true,
}]
}], range: [{
type: ViewChild,
args: ['range', { static: true }]
}], onValueChanged: [{
type: Output
}], inputStream: [{
type: Input
}], min: [{
type: Input
}], max: [{
type: Input
}], step: [{
type: Input
}], debounce: [{
type: Input
}], pin: [{
type: Input
}], disabled: [{
type: Input
}], snaps: [{
type: Input
}], ticks: [{
type: Input
}], writeValueForEveryChange: [{
type: Input
}], leftIcon: [{
type: Input
}], leftIconColor: [{
type: Input
}], rightIcon: [{
type: Input
}], rightIconColor: [{
type: Input
}], color: [{
type: Input
}], el: [{
type: ViewChild,
args: ['.range-knob']
}] } });
class MonitoringRangeModule {
}
/** @nocollapse */ MonitoringRangeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MonitoringRangeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ MonitoringRangeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: MonitoringRangeModule, declarations: [MonitoringRangeComponent, MonitoringRangeContentDirective], imports: [CommonModule, IonicModule, FormsModule, IconModule], exports: [MonitoringRangeComponent, MonitoringRangeContentDirective] });
/** @nocollapse */ MonitoringRangeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MonitoringRangeModule, imports: [CommonModule, IonicModule, FormsModule, IconModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MonitoringRangeModule, decorators: [{
type: NgModule,
args: [{
declarations: [MonitoringRangeComponent, MonitoringRangeContentDirective],
exports: [MonitoringRangeComponent, MonitoringRangeContentDirective],
imports: [CommonModule, IonicModule, FormsModule, IconModule],
}]
}] });
class MonitoringTableComponent {
set columnsMap(mapping) {
var _a, _b, _c;
if (mapping) {
if (!this.columns) {
this.setupColumns();
}
for (const key in mapping) {
if (!((_a = this.columns) === null || _a === void 0 ? void 0 : _a.find((info) => info.columnDef === key))) {
debug('Column ', key, 'is not in columns', this.columns);
this.addColumn(key, mapping[key]);
}
}
// Removing old columns
const toRemove = [];
(_b = this.columns) === null || _b === void 0 ? void 0 : _b.forEach((column, index) => {
if (!(column.columnDef in mapping)) {
debug('Deleting column: ', column);
toRemove.push(index);
}
});
toRemove.reverse().forEach((index) => { var _a; return (_a = this.columns) === null || _a === void 0 ? void 0 : _a.splice(index, 1); });
// debug(`COLUMNS:`, this.columns)
this.displayedColumns = (_c = this.columns) === null || _c === void 0 ? void 0 : _c.map((x) => x.columnDef);
// refresh data
this.dataSource.refresh();
}
}
set variables(variables) {
combineLatest(variables.map((variable) => variable.values)).subscribe((values) => {
if (this.columns) {
const item = {};
this.columns.forEach((column, index) => {
if (column.columnDef === '__date') {
item[column.columnDef] = new Date().toLocaleTimeString();
}
else {
item[column.columnDef] = values[index - (this.date ? 1 : 0)];
}
});
this.dataSource.add(item);
}
});
}
set data$(stream) {
if (stream) {
stream.subscribe((value) => {
if (this.columns) {
this.dataSource.add(value);
}
});
}
}
set data(data) {
debug('Setting table data: ', data);
this.dataSource.data = data;
}
constructor() {
/** Table columns */
this.columns = undefined;
this.dataSource = new MonitoringTableComponentDataSource();
/** Column definitions in order */
this.displayedColumns = [];
this.date = true;
}
setupColumns() {
debug('setupColumns');
if (this.columns) {
this.columns.splice(0, this.columns.length);
}
else {
this.columns = [];
}
if (this.date) {
this.addColumn('__date', 'Date');
}
}
addColumn(id, header) {
if (!this.columns) {
this.columns = [];
}
const columnInfo = {
header: header,
columnDef: id,
cell: (row) => `${row[id]}`,
};
this.columns.push(columnInfo);
}
}
/** @nocollapse */ MonitoringTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MonitoringTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ MonitoringTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MonitoringTableComponent, selector: "tap-app-monitoring-table", inputs: { columns: "columns", dataSource: "dataSource", columnsMap: "columnsMap", displayedColumns: "displayedColumns", variables: "variables", data$: "data$", data: "data", date: "date" }, ngImport: i0, template: "<mat-table\n *ngIf=\"columns && columns.length > 0\"\n [dataSource]=\"dataSource\"\n #table\n>\n <ng-container\n *ngFor=\"let column of columns\"\n [cdkColumnDef]=\"column.columnDef\"\n >\n <mat-header-cell *cdkHeaderCellDef>{{ column.header }}</mat-header-cell>\n <mat-cell *cdkCellDef=\"let row\">{{ column.cell(row) }}</mat-cell>\n </ng-container>\n\n <mat-header-row *matHeaderRowDef=\"displayedColumns\"></mat-header-row>\n <mat-row *matRowDef=\"let row; columns: displayedColumns\"></mat-row>\n</mat-table>\n", styles: [""], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i2$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i2$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i2$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i2$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i2$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i2$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: i3$2.CdkCellDef, selector: "[cdkCellDef]" }, { kind: "directive", type: i3$2.CdkHeaderCellDef, selector: "[cdkHeaderCellDef]" }, { kind: "directive", type: i3$2.CdkColumnDef, selector: "[cdkColumnDef]", inputs: ["sticky", "cdkColumnDef", "stickyEnd"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MonitoringTableComponent, decorators: [{
type: Component,
args: [{ selector: 'tap-app-monitoring-table', template: "<mat-table\n *ngIf=\"columns && columns.length > 0\"\n [dataSource]=\"dataSource\"\n #table\n>\n <ng-container\n *ngFor=\"let column of columns\"\n [cdkColumnDef]=\"column.columnDef\"\n >\n <mat-header-cell *cdkHeaderCellDef>{{ column.header }}</mat-header-cell>\n <mat-cell *cdkCellDef=\"let row\">{{ column.cell(row) }}</mat-cell>\n </ng-container>\n\n <mat-header-row *matHeaderRowDef=\"displayedColumns\"></mat-header-row>\n <mat-row *matRowDef=\"let row; columns: displayedColumns\"></mat-row>\n</mat-table>\n" }]
}], ctorParameters: function () { return []; }, propDecorators: { columns: [{
type: Input
}], dataSource: [{
type: Input
}], columnsMap: [{
type: Input
}], displayedColumns: [{
type: Input
}], variables: [{
type: Input
}], data$: [{
type: Input
}], data: [{
type: Input
}], date: [{
type: Input
}] } });
class MonitoringTableComponentDataSource extends DataSource {
constructor(options = {
max: -1,
newItemOnTop: true,
}) {
super();
this.options = options;
this._data = [];
this._subject = new Subject();
}
add(item) {
if (this.options.newItemOnTop) {
this._data.unshift(item);
if (this.options.max >= 0 && this._data.length > this.options.max) {
this._data.pop();
}
}
else {
this._data.push(item);
if (this.options.max >= 0 && this._data.length > this.options.max) {
this._data.shift();
}
}
this._subject.next(this._data);
// debug(`Adding values: `, item)
}
set data(d) {
this._data = d;
this._subject.next(this._data);
}
connect() {
return this._subject;
}
refresh() {
this._data = [...this._data];
this._subject.next(this._data);
}
disconnect() { }
clear() {
this._data = [];
this._subject.next(this._data);
}
}
class MonitoringTableModule {
}
/** @nocollapse */ MonitoringTableModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MonitoringTableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ MonitoringTableModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: MonitoringTableModule, declarations: [MonitoringTableComponent], imports: [CommonModule, MatTableModule, CdkTableModule], exports: [MonitoringTableComponent] });
/** @nocollapse */ MonitoringTableModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MonitoringTableModule, imports: [CommonModule, MatTableModule, CdkTableModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MonitoringTableModule, decorators: [{
type: NgModule,
args: [{
declarations: [MonitoringTableComponent],
exports: [MonitoringTableComponent],
imports: [CommonModule, MatTableModule, CdkTableModule],
}]
}] });
class MonitoringVariableValueComponent {
set error(err) {
this.fieldError = err;
}
set variable(v) {
this._variable = v;
}
/**
* @deprecated
*/
set config(config) {
if (!this.inputOptions) {
switch (config.type) {
case 'FLOAT32':
this.inputOptions = {
type: 'number',
};
break;
case 'STRING':
this.inputOptions = {
type: 'text',
maxLength: config.length,
};
break;
case 'UINT32':
this.inputOptions = {
type: 'number',
min: 0,
max: 0xffffffff,
};
break;
case 'UINT16':
this.inputOptions = {
type: 'number',
min: 0,
max: 0xffff,
};
break;
case 'UINT8':
this.inputOptions = {
type: 'number',
min: 0,
max: 0xff,
};
break;
case 'INT32':
this.inputOptions = {
type: 'number',
min: -2147483648,
max: 2147483647,
};
break;
case 'INT16':
this.inputOptions = {
type: 'number',
min: -32768,
max: 32767,
};
break;
case 'INT8':
this.inputOptions = {
type: 'number',
min: -128,
max: 127,
};
break;
}
}
}
constructor(decimalPipe) {
this.decimalPipe = decimalPipe;
this.inputOptions = {
type: 'text',
};
this.editable = false;
this.modalEdition = false;
this.refreshable = false;
this.forceValue = undefined;
}
ngOnDestroy() {
var _a;
(_a = this.valueSub) === null || _a === void 0 ? void 0 : _a.unsubscribe();
}
ngAfterViewInit() {
var _a, _b;
this.valueSub = (_b = (_a = this.ctx) === null || _a === void 0 ? void 0 : _a.valueToDisplay) === null || _b === void 0 ? void 0 : _b.pipe(map((value) => {
if (this.valueFormatting) {
value = this.valueFormatting(value);
}
if (this.digitsInfo && typeof value === 'number') {
value = this.decimalPipe.transform(value, this.digitsInfo);
}
return value;
}), shareReplay(1)).subscribe((v) => {
this._value = v;
});
}
onSubmit(newValue) {
var _a;
(_a = this.ctx) === null || _a === void 0 ? void 0 : _a.notifyValueChange(newValue);
}
onSubmitValue() {
var _a;
(_a = this.ctx) === null || _a === void 0 ? void 0 : _a.submitValue();
}
onValueChange(event) {
this.ctx.valueToSubmit = event;
}
onEditModeChange(newValue) {
var _a, _b;
if (newValue) {
(_a = this.ctx) === null || _a === void 0 ? void 0 : _a.enableEditMode();
}
else {
(_b = this.ctx) === null || _b === void 0 ? void 0 : _b.cancelEdit();
}
}
}
/** @nocollapse */ MonitoringVariableValueComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MonitoringVariableValueComponent, deps: [{ token: i2.DecimalPipe }], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ MonitoringVariableValueComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MonitoringVariableValueComponent, selector: "monitoring-variable-value", inputs: { lines: "lines", unitValue: "unitValue", error: "error", variable: "variable", config: "config", inputOptions: "inputOptions", editable: "editable", modalEdition: "modalEdition", valueStyle: "valueStyle", digitsInfo: "digitsInfo", refreshable: "refreshable", valueFormatting: "valueFormatting" }, viewQueries: [{ propertyName: "ctx", first: true, predicate: ["ctx"], descendants: true }], ngImport: i0, template: "<tap-value-editor-container\n #ctx\n [variable]=\"_variable\"\n [showRefreshButton]=\"refreshable\"\n [showEditButton]=\"editable\"\n [showSubmitButton]=\"true\"\n [modalEdition]=\"modalEdition\"\n [inputOptions]=\"inputOptions\"\n [lines]=\"lines\"\n>\n <tap-inline-editor\n [forceValue]=\"forceValue\"\n [value]=\"\n ctx.pendingSubmitValue === undefined ? _value : ctx.pendingSubmitValue\n \"\n [editMode]=\"ctx.editModeChange | async\"\n (editModeChange)=\"onEditModeChange($event)\"\n [editable]=\"editable && ctx.pendingSubmitValue === undefined\"\n [fieldError]=\"fieldError\"\n [inputOptions]=\"inputOptions\"\n [unitValue]=\"unitValue\"\n [valueStyle]=\"valueStyle\"\n (valueChange)=\"onValueChange($event)\"\n (onSubmit)=\"onSubmit($event)\"\n >\n </tap-inline-editor>\n</tap-value-editor-container>\n", styles: [""], dependencies: [{ kind: "component", type: i1$3.TapValueEditorContainerComponent, selector: "tap-value-editor-container", inputs: ["button", "variable", "inputOptions", "showRefreshButton", "showSubmitButton", "showEditButton", "error", "lines", "modalEdition", "value"], outputs: ["submit", "refresh"] }, { kind: "component", type: i1$3.InlineEditorComponent, selector: "tap-inline-editor", inputs: ["editMode", "editable", "unitValue", "inputOptions", "valueStyle", "value", "forceValue", "showLoader", "fieldError"], outputs: ["onSubmit", "valueChange", "editModeChange"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MonitoringVariableValueComponent, decorators: [{
type: Component,
args: [{ selector: 'monitoring-variable-value', template: "<tap-value-editor-container\n #ctx\n [variable]=\"_variable\"\n [showRefreshButton]=\"refreshable\"\n [showEditButton]=\"editable\"\n [showSubmitButton]=\"true\"\n [modalEdition]=\"modalEdition\"\n [inputOptions]=\"inputOptions\"\n [lines]=\"lines\"\n>\n <tap-inline-editor\n [forceValue]=\"forceValue\"\n [value]=\"\n ctx.pendingSubmitValue === undefined ? _value : ctx.pendingSubmitValue\n \"\n [editMode]=\"ctx.editModeChange | async\"\n (editModeChange)=\"onEditModeChange($event)\"\n [editable]=\"editable && ctx.pendingSubmitValue === undefined\"\n [fieldError]=\"fieldError\"\n [inputOptions]=\"inputOptions\"\n [unitValue]=\"unitValue\"\n [valueStyle]=\"valueStyle\"\n (valueChange)=\"onValueChange($event)\"\n (onSubmit)=\"onSubmit($event)\"\n >\n </tap-inline-editor>\n</tap-value-editor-container>\n" }]
}], ctorParameters: function () { return [{ type: i2.DecimalPipe }]; }, propDecorators: { ctx: [{
type: ViewChild,
args: ['ctx']
}], lines: [{
type: Input
}], unitValue: [{
type: Input
}], error: [{
type: Input
}], variable: [{
type: Input
}], config: [{
type: Input
}], inputOptions: [{
type: Input
}], editable: [{
type: Input
}], modalEdition: [{
type: Input
}], valueStyle: [{
type: Input
}], digitsInfo: [{
type: Input
}], refreshable: [{
type: Input
}], valueFormatting: [{
type: Input
}] } });
class MonitoringVariableValueModule {
}
/** @nocollapse */ MonitoringVariableValueModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MonitoringVariableValueModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ MonitoringVariableValueModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: MonitoringVariableValueModule, declarations: [MonitoringVariableValueComponent], imports: [CommonModule,
IonicModule,
TapValueEditorContainerModule,
InlineEditorModule], exports: [MonitoringVariableValueComponent] });
/** @nocollapse */ MonitoringVariableValueModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MonitoringVariableValueModule, providers: [DecimalPipe], imports: [CommonModule,
IonicModule,
TapValueEditorContainerModule,
InlineEditorModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MonitoringVariableValueModule, decorators: [{
type: NgModule,
args: [{
declarations: [MonitoringVariableValueComponent],
exports: [MonitoringVariableValueComponent],
providers: [DecimalPipe],
imports: [
CommonModule,
IonicModule,
TapValueEditorContainerModule,
InlineEditorModule,
],
}]
}] });
const MONITORING_COMPONENTS_METADATA = {};
function getExtendsClassName(target) {
const proto = Object.getPrototypeOf(target);
return proto.constructor.name !== 'Object'
? proto.constructor.name
: undefined;
}
/**
* @deprecated
*/
function AppGenField(options) {
return function (target, propertyKey, descriptor) {
const componentId = target.constructor.name;
if (!MONITORING_COMPONENTS_METADATA[componentId]) {
let fields = {};
MONITORING_COMPONENTS_METADATA[componentId] = {
fields,
decorator: undefined,
extends: getExtendsClassName(target),
};
}
MONITORING_COMPONENTS_METADATA[componentId].fields[propertyKey] = {
decorator: options,
};
};
}
/**
* @deprecated
*/
function MonitoringAppGenComponent(decorator) {
return function (constructor) {
if (!MONITORING_COMPONENTS_METADATA[constructor.name]) {
MONITORING_COMPONENTS_METADATA[constructor.name] = {
decorator,
fields: {},
extends: getExtendsClassName(constructor.prototype),
};
}
else {
MONITORING_COMPONENTS_METADATA[constructor.name].decorator = decorator;
}
};
}
let TapVariableBarChartGroupComponent = class TapVariableBarChartGroupComponent extends BaseChartComponent {
constructor(myChartElement, zone, cd, platformId, modalController) {
super(myChartElement, zone, cd, platformId);
this.modalController = modalController;
this.legendPosition = LegendPosition.Below;
this.showExportButton = false;
this.legend = true;
this.colorScheme = {
domain: [
'#5DADE2',
'#9B59B6',
'#F39C12',
'#5AA454',
'#A10A28',
'#C7B42C',
'#AAAAAA',
],
};
this.orientation = 'vertical';
this.showDetails = false;
this.noBarWhenZero = false;
this.animations = true;
this.roundEdges = true;
this.xAxis = true;
this.yAxis = true;
this.history = false;
this.valueCountLimit = 10;
this.results = [
{
name: '---',
series: [
{
name: '---',
value: 0,
extra: 0,
},
],
},
];
this.scrollableChart = false;
this.chartModel = new ChartDataModel();
}
/**
* @deprecated use xAxis
*/
set showXAxis(v) {
this.xAxis = v;
}
/**
* @deprecated use yAxis
*/
set showYAxis(v) {
this.yAxis = v;
}
set label(indexOrArray) {
this.chartModel.initLabel(indexOrArray);
}
set variable(variableOrArray) {
this.mutlipleVar = variableOrArray.length > 1;
this.input = this.chartModel.initVariable(variableOrArray);
}
set input(inputs) {
if (this.mutlipleVar) {
this.subscription = this.chartModel
.defineMultiInputStream(inputs)
.subscribe((result) => {
if (this.scrollableChart) {
this.resizeToScroll(result.length, result[0].series.length);
}
this.results = result;
});
}
else {
this.subscription = this.chartModel
.defineInputStreamMulti(inputs, this.history, this.valueCountLimit)
.subscribe((result) => {
if (this.scrollableChart) {
this.resizeToScroll(result.length, result[0].series.length);
}
this.results = result;
});
}
this.cd.detectChanges();
}
set data(results) {
this.results = results;
}
createExportedData() {
return dataWithSeriesToCsv(this.results);
}
onSelect(event) {
if (typeof event === 'object') {
if (this.showDetails) {
this.chartModel
.showDetail(event, this.modalController, TapVariableDataPopupComponent)
.catch((err) => {
console.log(err);
});
}
}
}
ngAfterViewChecked() {
if (!this.scrollableChart) {
this.widthChart = this.divContainer.nativeElement.offsetWidth;
this.heightChart = this.divContainer.nativeElement.offsetHeight;
}
this.cd.detectChanges();
}
resizeToScroll(size, seriesSize) {
if (this.orientation === 'vertical') {
if (this.divContainer.nativeElement.offsetWidth <=
size * 50 * seriesSize) {
this.barChartVer.view = [
size * 50 * seriesSize,
this.divContainer.nativeElement.offsetHeight,
];
}
}
else if (this.orientation === 'horizontal') {
if (this.divContainer.nativeElement.offsetHeight <=
size * 50 * seriesSize) {
this.barChartHor.view = [
this.divContainer.nativeElement.offsetWidth,
size * 50 * seriesSize,
];
}
}
}
ngOnDestroy() {
var _a;
(_a = this.subscription) === null || _a === void 0 ? void 0 : _a.unsubscribe();
this.chartModel.destroyCurrentSub();
}
};
/** @nocollapse */ TapVariableBarChartGroupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableBarChartGroupComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: PLATFORM_ID }, { token: i1$1.ModalController }], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ TapVariableBarChartGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TapVariableBarChartGroupComponent, selector: "tap-variable-bar-chart-group", inputs: { legendPosition: "legendPosition", showExportButton: "showExportButton", exportedFileName: "exportedFileName", legend: "legend", legendTitle: "legendTitle", colorScheme: "colorScheme", orientation: "orientation", showDetails: "showDetails", noBarWhenZero: "noBarWhenZero", trimXAxisTicks: "trimXAxisTicks", maxXAxisTickLength: "maxXAxisTickLength", trimYAxisTicks: "trimYAxisTicks", maxYAxisTickLength: "maxYAxisTickLength", animations: "animations", roundDomains: "roundDomains", roundEdges: "roundEdges", barPadding: "barPadding", showYAxisLabel: "showYAxisLabel", yAxisLabel: "yAxisLabel", showXAxisLabel: "showXAxisLabel", xAxisLabel: "xAxisLabel", showGridLines: "showGridLines", scaleMax: "scaleMax", showXAxis: "showXAxis", xAxis: "xAxis", showYAxis: "showYAxis", yAxis: "yAxis", history: "history", valueCountLimit: "valueCountLimit", label: "label", variable: "variable", input: "input", data: "data", scrollableChart: "scrollableChart" }, viewQueries: [{ propertyName: "divContainer", first: true, predicate: ["containerRef"], descendants: true }, { propertyName: "barChartHor", first: true, predicate: ["barChartHor"], descendants: true }, { propertyName: "barChartVer", first: true, predicate: ["barChartVer"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div\n [ngClass]=\"\n scrollableChart\n ? orientation === 'vertical'\n ? 'verticalContainer'\n : 'horizontalContainer'\n : {}\n \"\n>\n <div\n #containerRef\n [ngClass]=\"\n legendPosition === 'below' && legend ? 'belowLegend' : 'rightLegend'\n \"\n [ngSwitch]=\"orientation\"\n style=\"position: relative\"\n >\n <ngx-charts-bar-horizontal-2d\n *ngSwitchCase=\"'horizontal'\"\n #barChartHor\n [view]=\"[containerRef.offsetWidth, containerRef.offsetHeight]\"\n [scheme]=\"colorScheme\"\n [results]=\"results\"\n [legend]=\"legend\"\n [legendTitle]=\"legendTitle\"\n [legendPosition]=\"legendPosition\"\n [noBarWhenZero]=\"noBarWhenZero\"\n [xAxis]=\"xAxis\"\n [showYAxisLabel]=\"showYAxisLabel\"\n [yAxisLabel]=\"yAxisLabel\"\n [yAxis]=\"yAxis\"\n [showXAxisLabel]=\"showXAxisLabel\"\n [xAxisLabel]=\"xAxisLabel\"\n [showGridLines]=\"showGridLines\"\n [trimXAxisTicks]=\"trimXAxisTicks\"\n [maxXAxisTickLength]=\"maxXAxisTickLength\"\n [trimYAxisTicks]=\"trimYAxisTicks\"\n [maxYAxisTickLength]=\"maxYAxisTickLength\"\n [animations]=\"animations\"\n [roundDomains]=\"roundDomains\"\n [roundEdges]=\"roundEdges\"\n [barPadding]=\"barPadding\"\n [xScaleMax]=\"scaleMax\"\n (select)=\"onSelect($event)\"\n >\n </ngx-charts-bar-horizontal-2d>\n <ngx-charts-bar-vertical-2d\n *ngSwitchCase=\"'vertical'\"\n #barChartVer\n [view]=\"[containerRef.offsetWidth, containerRef.offsetHeight]\"\n [scheme]=\"colorScheme\"\n [results]=\"results\"\n [roundEdges]=\"roundEdges\"\n [legend]=\"legend\"\n [legendTitle]=\"legendTitle\"\n [legendPosition]=\"legendPosition\"\n [noBarWhenZero]=\"noBarWhenZero\"\n [xAxis]=\"xAxis\"\n [showYAxisLabel]=\"showYAxisLabel\"\n [yAxisLabel]=\"yAxisLabel\"\n [yAxis]=\"yAxis\"\n [showXAxisLabel]=\"showXAxisLabel\"\n [xAxisLabel]=\"xAxisLabel\"\n [showGridLines]=\"showGridLines\"\n [trimXAxisTicks]=\"trimXAxisTicks\"\n [maxXAxisTickLength]=\"maxXAxisTickLength\"\n [trimYAxisTicks]=\"trimYAxisTicks\"\n [maxYAxisTickLength]=\"maxYAxisTickLength\"\n [animations]=\"animations\"\n [roundDomains]=\"roundDomains\"\n [roundEdges]=\"roundEdges\"\n [barPadding]=\"barPadding\"\n [yScaleMax]=\"scaleMax\"\n (select)=\"onSelect($event)\"\n >\n </ngx-charts-bar-vertical-2d>\n <ion-fab-button\n id=\"exportFabButton\"\n size=\"small\"\n tapExportData\n *ngIf=\"showExportButton\"\n [dataToExport]=\"createExportedData.bind(this)\"\n [exportedFileName]=\"exportedFileName\"\n >\n <ion-icon name=\"download\"></ion-icon>\n </ion-fab-button>\n </div>\n</div>\n", styles: ["::ng-deep .horizontal-legend{overflow:auto!important}.belowLegend{max-height:50vh;width:100%;min-width:100%;margin-bottom:60px}.rightLegend{max-height:50vh;width:100%}#exportFabButton{position:absolute;top:10px;right:10px}@media (prefers-color-scheme: dark){::ng-deep span.legend-label-text{color:#ccc!important}::ng-deep span.legend-label-text:hover{color:#fff!important}::ng-deep .ngx-charts text{fill:#fff!important}}.verticalContainer{overflow-y:hidden;overflow-x:auto;max-height:60vh}.horizontalContainer{overflow-x:hidden;overflow-y:auto;max-height:60vh}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i3.BarHorizontal2DComponent, selector: "ngx-charts-bar-horizontal-2d", inputs: ["legend", "legendTitle", "legendPosition", "xAxis", "yAxis", "showXAxisLabel", "showYAxisLabel", "xAxisLabel", "yAxisLabel", "tooltipDisabled", "gradient", "showGridLines", "activeEntries", "schemeType", "trimXAxisTicks", "trimYAxisTicks", "rotateXAxisTicks", "maxXAxisTickLength", "maxYAxisTickLength", "xAxisTickFormatting", "yAxisTickFormatting", "xAxisTicks", "yAxisTicks", "groupPadding", "barPadding", "roundDomains", "roundEdges", "xScaleMax", "showDataLabel", "dataLabelFormatting", "noBarWhenZero", "wrapTicks"], outputs: ["activate", "deactivate"] }, { kind: "component", type: i3.BarVertical2DComponent, selector: "ngx-charts-bar-vertical-2d", inputs: ["legend", "legendTitle", "legendPosition", "xAxis", "yAxis", "showXAxisLabel", "showYAxisLabel", "xAxisLabel", "yAxisLabel", "tooltipDisabled", "scaleType", "gradient", "showGridLines", "activeEntries", "schemeType", "trimXAxisTicks", "trimYAxisTicks", "rotateXAxisTicks", "maxXAxisTickLength", "maxYAxisTickLength", "xAxisTickFormatting", "yAxisTickFormatting", "xAxisTicks", "yAxisTicks", "groupPadding", "barPadding", "roundDomains", "roundEdges", "yScaleMax", "showDataLabel", "dataLabelFormatting", "noBarWhenZero", "wrapTicks"], outputs: ["activate", "deactivate"] }, { kind: "component", type: i1$1.IonFabButton, selector: "ion-fab-button", inputs: ["activated", "closeIcon", "color", "disabled", "download", "href", "mode", "rel", "routerAnimation", "routerDirection", "show", "size", "target", "translucent", "type"] }, { kind: "component", type: i1$1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "directive", type: ExportDataDirective, selector: "[tapExportData]", inputs: ["exportedFileName", "dataToExport", "format"], outputs: ["exportDataError"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
TapVariableBarChartGroupComponent = __decorate([
MonitoringAppGenComponent({}),
__metadata("design:paramtypes", [ElementRef,
NgZone,
ChangeDetectorRef, String, ModalController])
], TapVariableBarChartGroupComponent);
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableBarChartGroupComponent, decorators: [{
type: Component,
args: [{ selector: 'tap-variable-bar-chart-group', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n [ngClass]=\"\n scrollableChart\n ? orientation === 'vertical'\n ? 'verticalContainer'\n : 'horizontalContainer'\n : {}\n \"\n>\n <div\n #containerRef\n [ngClass]=\"\n legendPosition === 'below' && legend ? 'belowLegend' : 'rightLegend'\n \"\n [ngSwitch]=\"orientation\"\n style=\"position: relative\"\n >\n <ngx-charts-bar-horizontal-2d\n *ngSwitchCase=\"'horizontal'\"\n #barChartHor\n [view]=\"[containerRef.offsetWidth, containerRef.offsetHeight]\"\n [scheme]=\"colorScheme\"\n [results]=\"results\"\n [legend]=\"legend\"\n [legendTitle]=\"legendTitle\"\n [legendPosition]=\"legendPosition\"\n [noBarWhenZero]=\"noBarWhenZero\"\n [xAxis]=\"xAxis\"\n [showYAxisLabel]=\"showYAxisLabel\"\n [yAxisLabel]=\"yAxisLabel\"\n [yAxis]=\"yAxis\"\n [showXAxisLabel]=\"showXAxisLabel\"\n [xAxisLabel]=\"xAxisLabel\"\n [showGridLines]=\"showGridLines\"\n [trimXAxisTicks]=\"trimXAxisTicks\"\n [maxXAxisTickLength]=\"maxXAxisTickLength\"\n [trimYAxisTicks]=\"trimYAxisTicks\"\n [maxYAxisTickLength]=\"maxYAxisTickLength\"\n [animations]=\"animations\"\n [roundDomains]=\"roundDomains\"\n [roundEdges]=\"roundEdges\"\n [barPadding]=\"barPadding\"\n [xScaleMax]=\"scaleMax\"\n (select)=\"onSelect($event)\"\n >\n </ngx-charts-bar-horizontal-2d>\n <ngx-charts-bar-vertical-2d\n *ngSwitchCase=\"'vertical'\"\n #barChartVer\n [view]=\"[containerRef.offsetWidth, containerRef.offsetHeight]\"\n [scheme]=\"colorScheme\"\n [results]=\"results\"\n [roundEdges]=\"roundEdges\"\n [legend]=\"legend\"\n [legendTitle]=\"legendTitle\"\n [legendPosition]=\"legendPosition\"\n [noBarWhenZero]=\"noBarWhenZero\"\n [xAxis]=\"xAxis\"\n [showYAxisLabel]=\"showYAxisLabel\"\n [yAxisLabel]=\"yAxisLabel\"\n [yAxis]=\"yAxis\"\n [showXAxisLabel]=\"showXAxisLabel\"\n [xAxisLabel]=\"xAxisLabel\"\n [showGridLines]=\"showGridLines\"\n [trimXAxisTicks]=\"trimXAxisTicks\"\n [maxXAxisTickLength]=\"maxXAxisTickLength\"\n [trimYAxisTicks]=\"trimYAxisTicks\"\n [maxYAxisTickLength]=\"maxYAxisTickLength\"\n [animations]=\"animations\"\n [roundDomains]=\"roundDomains\"\n [roundEdges]=\"roundEdges\"\n [barPadding]=\"barPadding\"\n [yScaleMax]=\"scaleMax\"\n (select)=\"onSelect($event)\"\n >\n </ngx-charts-bar-vertical-2d>\n <ion-fab-button\n id=\"exportFabButton\"\n size=\"small\"\n tapExportData\n *ngIf=\"showExportButton\"\n [dataToExport]=\"createExportedData.bind(this)\"\n [exportedFileName]=\"exportedFileName\"\n >\n <ion-icon name=\"download\"></ion-icon>\n </ion-fab-button>\n </div>\n</div>\n", styles: ["::ng-deep .horizontal-legend{overflow:auto!important}.belowLegend{max-height:50vh;width:100%;min-width:100%;margin-bottom:60px}.rightLegend{max-height:50vh;width:100%}#exportFabButton{position:absolute;top:10px;right:10px}@media (prefers-color-scheme: dark){::ng-deep span.legend-label-text{color:#ccc!important}::ng-deep span.legend-label-text:hover{color:#fff!important}::ng-deep .ngx-charts text{fill:#fff!important}}.verticalContainer{overflow-y:hidden;overflow-x:auto;max-height:60vh}.horizontalContainer{overflow-x:hidden;overflow-y:auto;max-height:60vh}\n"] }]
}], ctorParameters: function () {
return [{ type: i0.ElementRef }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
type: Inject,
args: [PLATFORM_ID]
}] }, { type: i1$1.ModalController }];
}, propDecorators: { divContainer: [{
type: ViewChild,
args: ['containerRef']
}], barChartHor: [{
type: ViewChild,
args: ['barChartHor']
}], barChartVer: [{
type: ViewChild,
args: ['barChartVer']
}], legendPosition: [{
type: Input
}], showExportButton: [{
type: Input
}], exportedFileName: [{
type: Input
}], legend: [{
type: Input
}], legendTitle: [{
type: Input
}], colorScheme: [{
type: Input
}], orientation: [{
type: Input
}], showDetails: [{
type: Input
}], noBarWhenZero: [{
type: Input
}], trimXAxisTicks: [{
type: Input
}], maxXAxisTickLength: [{
type: Input
}], trimYAxisTicks: [{
type: Input
}], maxYAxisTickLength: [{
type: Input
}], animations: [{
type: Input
}], roundDomains: [{
type: Input
}], roundEdges: [{
type: Input
}], barPadding: [{
type: Input
}], showYAxisLabel: [{
type: Input
}], yAxisLabel: [{
type: Input
}], showXAxisLabel: [{
type: Input
}], xAxisLabel: [{
type: Input
}], showGridLines: [{
type: Input
}], scaleMax: [{
type: Input
}], showXAxis: [{
type: Input
}], xAxis: [{
type: Input
}], showYAxis: [{
type: Input
}], yAxis: [{
type: Input
}], history: [{
type: Input
}], valueCountLimit: [{
type: Input
}], label: [{
type: Input
}], variable: [{
type: Input
}], input: [{
type: Input
}], data: [{
type: Input
}], scrollableChart: [{
type: Input
}] } });
class TapVariableBarChartGroupModule {
}
/** @nocollapse */ TapVariableBarChartGroupModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableBarChartGroupModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ TapVariableBarChartGroupModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: TapVariableBarChartGroupModule, declarations: [TapVariableBarChartGroupComponent], imports: [CommonModule,
NgxChartsModule,
TapVariableDataPopupModule,
IonicModule,
ExportDataModule], exports: [TapVariableBarChartGroupComponent] });
/** @nocollapse */ TapVariableBarChartGroupModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableBarChartGroupModule, imports: [CommonModule,
NgxChartsModule,
TapVariableDataPopupModule,
IonicModule,
ExportDataModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableBarChartGroupModule, decorators: [{
type: NgModule,
args: [{
declarations: [TapVariableBarChartGroupComponent],
exports: [TapVariableBarChartGroupComponent],
imports: [
CommonModule,
NgxChartsModule,
TapVariableDataPopupModule,
IonicModule,
ExportDataModule,
],
}]
}] });
let TapVariableBarChartComponent = class TapVariableBarChartComponent extends BaseChartComponent {
/**
* @deprecated use xAxis
*/
set showXAxis(v) {
this.xAxis = v;
}
/**
* @deprecated use yAxis
*/
set showYAxis(v) {
this.yAxis = v;
}
set variable(variableOrArray) {
this.input = this.chartModel.initVariable(variableOrArray);
}
set history(enable) {
this._history.next(enable);
}
set valueCountLimit(limit) {
if (limit === undefined) {
limit = 30;
}
this._valueCountLimit.next(limit);
}
set input(inputs) {
this._input.next(inputs);
}
set data(results) {
this.results = results;
}
set label(indexOrArray) {
this.chartModel.initLabel(indexOrArray);
}
constructor(myChartElement, zone, cd, platformId, modalController) {
super(myChartElement, zone, cd, platformId);
this.cd = cd;
this.modalController = modalController;
this.results = [];
this.orientation = 'vertical';
this.legend = false;
this.legendPosition = LegendPosition.Below;
this.showGridLines = false;
this.showDetails = false;
this.xAxis = true;
this.showXAxisLabel = false;
this.xAxisLabel = '';
this.yAxis = true;
this.showYAxisLabel = false;
this.yAxisLabel = '';
this.animations = true;
this.roundEdges = true;
this.noBarWhenZero = false;
this.showExportButton = false;
this.xAxisTickFormatting = this.defaultDateTickFormatting.bind(this);
this.scrollableChart = false;
this.colorScheme = {
domain: [
'#5DADE2',
'#9B59B6',
'#f69b05',
'#5AA454',
'#A10A28',
'#C7B42C',
'#AAAAAA',
],
};
this._history = new BehaviorSubject(true);
this._valueCountLimit = new BehaviorSubject(30);
this._input = new BehaviorSubject([]);
this.destroyed = new Subject();
this.chartModel = new ChartDataModel();
}
ngOnInit() {
combineLatest([this._valueCountLimit, this._input, this._history])
.pipe(takeUntil(this.destroyed))
.subscribe(([valueCountLimit, input, history]) => {
this.chartModel.destroyCurrentSub();
if (history) {
this.oldColorScheme = this.colorScheme;
this.colorScheme = { domain: [this.colorScheme.domain[0]] };
}
else {
if (this.oldColorScheme !== undefined) {
this.colorScheme = this.oldColorScheme;
}
}
this.subscription = this.chartModel
.defineInputStreamSingle(input, history, valueCountLimit)
.subscribe((result) => {
if (this.scrollableChart) {
this.resizeToScroll(result.length);
}
this.results = result;
});
this.cd.detectChanges();
});
}
ngAfterContentChecked() {
this.cd.detectChanges();
if (!this.scrollableChart) {
this.widthChart = this.divContainer.nativeElement.offsetWidth;
this.heightChart = this.divContainer.nativeElement.offsetHeight;
}
}
resizeToScroll(size) {
if (this.orientation === 'vertical') {
if (this.divContainer.nativeElement.offsetWidth <= size * 100) {
this.barChartVer.view = [
size * 100,
this.divContainer.nativeElement.offsetHeight,
];
}
}
else if (this.orientation === 'horizontal') {
if (this.divContainer.nativeElement.offsetHeight <= size * 100) {
this.barChartHor.view = [
this.divContainer.nativeElement.offsetWidth,
size * 100,
];
}
}
}
onSelect(event) {
if (typeof event === 'object') {
if (this.showDetails) {
this.chartModel
.showDetail(event, this.modalController, TapVariableDataPopupComponent)
.catch((err) => {
console.log(err);
});
}
}
}
defaultDateTickFormatting(val) {
if (val.time) {
return new Date(val.time).toLocaleDateString();
}
return val;
}
ngOnDestroy() {
var _a;
(_a = this.subscription) === null || _a === void 0 ? void 0 : _a.unsubscribe();
this.chartModel.destroyCurrentSub();
}
};
/** @nocollapse */ TapVariableBarChartComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableBarChartComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: PLATFORM_ID }, { token: i1$1.ModalController }], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ TapVariableBarChartComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TapVariableBarChartComponent, selector: "tap-variable-bar-chart", inputs: { orientation: "orientation", legend: "legend", legendTitle: "legendTitle", legendPosition: "legendPosition", showGridLines: "showGridLines", showDetails: "showDetails", showXAxis: "showXAxis", xAxis: "xAxis", showXAxisLabel: "showXAxisLabel", xAxisLabel: "xAxisLabel", showYAxis: "showYAxis", yAxis: "yAxis", showYAxisLabel: "showYAxisLabel", yAxisLabel: "yAxisLabel", trimXAxisTicks: "trimXAxisTicks", maxXAxisTickLength: "maxXAxisTickLength", trimYAxisTicks: "trimYAxisTicks", maxYAxisTickLength: "maxYAxisTickLength", animations: "animations", roundDomains: "roundDomains", roundEdges: "roundEdges", barPadding: "barPadding", noBarWhenZero: "noBarWhenZero", showExportButton: "showExportButton", exportedFileName: "exportedFileName", variable: "variable", xAxisTickFormatting: "xAxisTickFormatting", history: "history", valueCountLimit: "valueCountLimit", input: "input", data: "data", scrollableChart: "scrollableChart", scaleMax: "scaleMax", scaleMin: "scaleMin", label: "label", colorScheme: "colorScheme" }, viewQueries: [{ propertyName: "divContainer", first: true, predicate: ["containerRef"], descendants: true }, { propertyName: "barChartHor", first: true, predicate: ["chartsHor"], descendants: true }, { propertyName: "barChartVer", first: true, predicate: ["chartsVer"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div\n [ngClass]=\"\n scrollableChart\n ? orientation == 'vertical'\n ? 'verticalContainer'\n : 'horizontalContainer'\n : {}\n \"\n>\n <div\n #containerRef\n [ngClass]=\"\n legendPosition === 'below' && legend ? 'belowLegend' : 'rightLegend'\n \"\n [ngSwitch]=\"orientation\"\n style=\"position: relative\"\n >\n <ngx-charts-bar-horizontal\n *ngSwitchCase=\"'horizontal'\"\n #chartsHor\n [view]=\"[containerRef.offsetWidth, containerRef.offsetHeight]\"\n [scheme]=\"colorScheme\"\n [results]=\"results\"\n [roundEdges]=\"roundEdges\"\n [showXAxisLabel]=\"showXAxisLabel\"\n [showYAxisLabel]=\"showYAxisLabel\"\n [xAxis]=\"xAxis\"\n [yAxisLabel]=\"yAxisLabel\"\n [yAxis]=\"yAxis\"\n [xAxisLabel]=\"xAxisLabel\"\n [legend]=\"legend\"\n [legendTitle]=\"legendTitle\"\n [legendPosition]=\"legendPosition\"\n [noBarWhenZero]=\"noBarWhenZero\"\n [xAxisTickFormatting]=\"xAxisTickFormatting\"\n [xScaleMax]=\"scaleMax\"\n [xScaleMin]=\"scaleMin\"\n [showGridLines]=\"showGridLines\"\n [trimXAxisTicks]=\"trimXAxisTicks\"\n [maxXAxisTickLength]=\"maxXAxisTickLength\"\n [trimYAxisTicks]=\"trimYAxisTicks\"\n [maxYAxisTickLength]=\"maxYAxisTickLength\"\n [animations]=\"animations\"\n [roundDomains]=\"roundDomains\"\n [roundEdges]=\"roundEdges\"\n [barPadding]=\"barPadding\"\n (select)=\"onSelect($event)\"\n >\n </ngx-charts-bar-horizontal>\n <ngx-charts-bar-vertical\n *ngSwitchCase=\"'vertical'\"\n #chartsVer\n [view]=\"[containerRef.offsetWidth, containerRef.offsetHeight]\"\n [noBarWhenZero]=\"noBarWhenZero\"\n [scheme]=\"colorScheme\"\n [results]=\"results\"\n [showXAxisLabel]=\"showXAxisLabel\"\n [showYAxisLabel]=\"showYAxisLabel\"\n [yAxisLabel]=\"yAxisLabel\"\n [xAxisLabel]=\"xAxisLabel\"\n [legend]=\"legend\"\n [legendTitle]=\"legendTitle\"\n [legendPosition]=\"legendPosition\"\n [xAxis]=\"xAxis\"\n [yAxis]=\"yAxis\"\n [yAxisTickFormatting]=\"xAxisTickFormatting\"\n [showGridLines]=\"showGridLines\"\n [trimXAxisTicks]=\"trimXAxisTicks\"\n [maxXAxisTickLength]=\"maxXAxisTickLength\"\n [trimYAxisTicks]=\"trimYAxisTicks\"\n [maxYAxisTickLength]=\"maxYAxisTickLength\"\n [animations]=\"animations\"\n [roundDomains]=\"roundDomains\"\n [roundEdges]=\"roundEdges\"\n [barPadding]=\"barPadding\"\n [yScaleMax]=\"scaleMax\"\n [yScaleMin]=\"scaleMin\"\n (select)=\"onSelect($event)\"\n >\n </ngx-charts-bar-vertical>\n <ion-fab-button\n id=\"exportFabButton\"\n size=\"small\"\n tapExportData\n [dataToExport]=\"results\"\n *ngIf=\"showExportButton\"\n [exportedFileName]=\"exportedFileName\"\n >\n <ion-icon name=\"download\"></ion-icon>\n </ion-fab-button>\n </div>\n</div>\n", styles: ["::ng-deep .horizontal-legend{overflow:auto!important}.belowLegend{max-height:50vh;width:100%;min-width:100%;margin-bottom:60px}.rightLegend{max-height:50vh;min-height:50vh;width:100%}#exportFabButton{position:absolute;top:10px;right:10px}@media (prefers-color-scheme: dark){::ng-deep span.legend-label-text{color:#ccc!important}::ng-deep span.legend-label-text:hover{color:#fff!important}::ng-deep .ngx-charts text{fill:#fff!important}}.verticalContainer{overflow-y:hidden;overflow-x:auto;max-height:60vh}.horizontalContainer{overflow-x:hidden;overflow-y:auto;max-height:60vh}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i3.BarHorizontalComponent, selector: "ngx-charts-bar-horizontal", inputs: ["legend", "legendTitle", "legendPosition", "xAxis", "yAxis", "showXAxisLabel", "showYAxisLabel", "xAxisLabel", "yAxisLabel", "tooltipDisabled", "gradient", "showGridLines", "activeEntries", "schemeType", "trimXAxisTicks", "trimYAxisTicks", "rotateXAxisTicks", "maxXAxisTickLength", "maxYAxisTickLength", "xAxisTickFormatting", "yAxisTickFormatting", "xAxisTicks", "yAxisTicks", "barPadding", "roundDomains", "roundEdges", "xScaleMax", "xScaleMin", "showDataLabel", "dataLabelFormatting", "noBarWhenZero", "wrapTicks"], outputs: ["activate", "deactivate"] }, { kind: "component", type: i3.BarVerticalComponent, selector: "ngx-charts-bar-vertical", inputs: ["legend", "legendTitle", "legendPosition", "xAxis", "yAxis", "showXAxisLabel", "showYAxisLabel", "xAxisLabel", "yAxisLabel", "tooltipDisabled", "gradient", "showGridLines", "activeEntries", "schemeType", "trimXAxisTicks", "trimYAxisTicks", "rotateXAxisTicks", "maxXAxisTickLength", "maxYAxisTickLength", "xAxisTickFormatting", "yAxisTickFormatting", "xAxisTicks", "yAxisTicks", "barPadding", "roundDomains", "roundEdges", "yScaleMax", "yScaleMin", "showDataLabel", "dataLabelFormatting", "noBarWhenZero", "wrapTicks"], outputs: ["activate", "deactivate"] }, { kind: "component", type: i1$1.IonFabButton, selector: "ion-fab-button", inputs: ["activated", "closeIcon", "color", "disabled", "download", "href", "mode", "rel", "routerAnimation", "routerDirection", "show", "size", "target", "translucent", "type"] }, { kind: "component", type: i1$1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "directive", type: ExportDataDirective, selector: "[tapExportData]", inputs: ["exportedFileName", "dataToExport", "format"], outputs: ["exportDataError"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
TapVariableBarChartComponent = __decorate([
MonitoringAppGenComponent({
constraints: {
isNumber: 'YES',
},
}),
__metadata("design:paramtypes", [ElementRef,
NgZone,
ChangeDetectorRef, String, ModalController])
], TapVariableBarChartComponent);
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableBarChartComponent, decorators: [{
type: Component,
args: [{ selector: 'tap-variable-bar-chart', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n [ngClass]=\"\n scrollableChart\n ? orientation == 'vertical'\n ? 'verticalContainer'\n : 'horizontalContainer'\n : {}\n \"\n>\n <div\n #containerRef\n [ngClass]=\"\n legendPosition === 'below' && legend ? 'belowLegend' : 'rightLegend'\n \"\n [ngSwitch]=\"orientation\"\n style=\"position: relative\"\n >\n <ngx-charts-bar-horizontal\n *ngSwitchCase=\"'horizontal'\"\n #chartsHor\n [view]=\"[containerRef.offsetWidth, containerRef.offsetHeight]\"\n [scheme]=\"colorScheme\"\n [results]=\"results\"\n [roundEdges]=\"roundEdges\"\n [showXAxisLabel]=\"showXAxisLabel\"\n [showYAxisLabel]=\"showYAxisLabel\"\n [xAxis]=\"xAxis\"\n [yAxisLabel]=\"yAxisLabel\"\n [yAxis]=\"yAxis\"\n [xAxisLabel]=\"xAxisLabel\"\n [legend]=\"legend\"\n [legendTitle]=\"legendTitle\"\n [legendPosition]=\"legendPosition\"\n [noBarWhenZero]=\"noBarWhenZero\"\n [xAxisTickFormatting]=\"xAxisTickFormatting\"\n [xScaleMax]=\"scaleMax\"\n [xScaleMin]=\"scaleMin\"\n [showGridLines]=\"showGridLines\"\n [trimXAxisTicks]=\"trimXAxisTicks\"\n [maxXAxisTickLength]=\"maxXAxisTickLength\"\n [trimYAxisTicks]=\"trimYAxisTicks\"\n [maxYAxisTickLength]=\"maxYAxisTickLength\"\n [animations]=\"animations\"\n [roundDomains]=\"roundDomains\"\n [roundEdges]=\"roundEdges\"\n [barPadding]=\"barPadding\"\n (select)=\"onSelect($event)\"\n >\n </ngx-charts-bar-horizontal>\n <ngx-charts-bar-vertical\n *ngSwitchCase=\"'vertical'\"\n #chartsVer\n [view]=\"[containerRef.offsetWidth, containerRef.offsetHeight]\"\n [noBarWhenZero]=\"noBarWhenZero\"\n [scheme]=\"colorScheme\"\n [results]=\"results\"\n [showXAxisLabel]=\"showXAxisLabel\"\n [showYAxisLabel]=\"showYAxisLabel\"\n [yAxisLabel]=\"yAxisLabel\"\n [xAxisLabel]=\"xAxisLabel\"\n [legend]=\"legend\"\n [legendTitle]=\"legendTitle\"\n [legendPosition]=\"legendPosition\"\n [xAxis]=\"xAxis\"\n [yAxis]=\"yAxis\"\n [yAxisTickFormatting]=\"xAxisTickFormatting\"\n [showGridLines]=\"showGridLines\"\n [trimXAxisTicks]=\"trimXAxisTicks\"\n [maxXAxisTickLength]=\"maxXAxisTickLength\"\n [trimYAxisTicks]=\"trimYAxisTicks\"\n [maxYAxisTickLength]=\"maxYAxisTickLength\"\n [animations]=\"animations\"\n [roundDomains]=\"roundDomains\"\n [roundEdges]=\"roundEdges\"\n [barPadding]=\"barPadding\"\n [yScaleMax]=\"scaleMax\"\n [yScaleMin]=\"scaleMin\"\n (select)=\"onSelect($event)\"\n >\n </ngx-charts-bar-vertical>\n <ion-fab-button\n id=\"exportFabButton\"\n size=\"small\"\n tapExportData\n [dataToExport]=\"results\"\n *ngIf=\"showExportButton\"\n [exportedFileName]=\"exportedFileName\"\n >\n <ion-icon name=\"download\"></ion-icon>\n </ion-fab-button>\n </div>\n</div>\n", styles: ["::ng-deep .horizontal-legend{overflow:auto!important}.belowLegend{max-height:50vh;width:100%;min-width:100%;margin-bottom:60px}.rightLegend{max-height:50vh;min-height:50vh;width:100%}#exportFabButton{position:absolute;top:10px;right:10px}@media (prefers-color-scheme: dark){::ng-deep span.legend-label-text{color:#ccc!important}::ng-deep span.legend-label-text:hover{color:#fff!important}::ng-deep .ngx-charts text{fill:#fff!important}}.verticalContainer{overflow-y:hidden;overflow-x:auto;max-height:60vh}.horizontalContainer{overflow-x:hidden;overflow-y:auto;max-height:60vh}\n"] }]
}], ctorParameters: function () {
return [{ type: i0.ElementRef }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
type: Inject,
args: [PLATFORM_ID]
}] }, { type: i1$1.ModalController }];
}, propDecorators: { divContainer: [{
type: ViewChild,
args: ['containerRef']
}], barChartHor: [{
type: ViewChild,
args: ['chartsHor']
}], barChartVer: [{
type: ViewChild,
args: ['chartsVer']
}], orientation: [{
type: Input
}], legend: [{
type: Input
}], legendTitle: [{
type: Input
}], legendPosition: [{
type: Input
}], showGridLines: [{
type: Input
}], showDetails: [{
type: Input
}], showXAxis: [{
type: Input
}], xAxis: [{
type: Input
}], showXAxisLabel: [{
type: Input
}], xAxisLabel: [{
type: Input
}], showYAxis: [{
type: Input
}], yAxis: [{
type: Input
}], showYAxisLabel: [{
type: Input
}], yAxisLabel: [{
type: Input
}], trimXAxisTicks: [{
type: Input
}], maxXAxisTickLength: [{
type: Input
}], trimYAxisTicks: [{
type: Input
}], maxYAxisTickLength: [{
type: Input
}], animations: [{
type: Input
}], roundDomains: [{
type: Input
}], roundEdges: [{
type: Input
}], barPadding: [{
type: Input
}], noBarWhenZero: [{
type: Input
}], showExportButton: [{
type: Input
}], exportedFileName: [{
type: Input
}], variable: [{
type: Input
}], xAxisTickFormatting: [{
type: Input
}], history: [{
type: Input
}], valueCountLimit: [{
type: Input
}], input: [{
type: Input
}], data: [{
type: Input
}], scrollableChart: [{
type: Input
}], scaleMax: [{
type: Input
}], scaleMin: [{
type: Input
}], label: [{
type: Input
}], colorScheme: [{
type: Input
}] } });
class TapVariableBarChartModule {
}
/** @nocollapse */ TapVariableBarChartModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableBarChartModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ TapVariableBarChartModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: TapVariableBarChartModule, declarations: [TapVariableBarChartComponent], imports: [CommonModule,
NgxChartsModule,
TapVariableDataPopupModule,
IonicModule,
ExportDataModule], exports: [TapVariableBarChartComponent] });
/** @nocollapse */ TapVariableBarChartModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableBarChartModule, imports: [CommonModule,
NgxChartsModule,
TapVariableDataPopupModule,
IonicModule,
ExportDataModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableBarChartModule, decorators: [{
type: NgModule,
args: [{
declarations: [TapVariableBarChartComponent],
exports: [TapVariableBarChartComponent],
imports: [
CommonModule,
NgxChartsModule,
TapVariableDataPopupModule,
IonicModule,
ExportDataModule,
],
}]
}] });
class TapVariableBitsEditorInfoModalComponent {
constructor(modalController) {
this.modalController = modalController;
this.rows = [];
this.bitOffColor = 'danger';
this.bitOnColor = 'success';
}
dismiss() {
this.modalController.dismiss();
}
}
/** @nocollapse */ TapVariableBitsEditorInfoModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableBitsEditorInfoModalComponent, deps: [{ token: i1$1.ModalController }], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ TapVariableBitsEditorInfoModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TapVariableBitsEditorInfoModalComponent, selector: "app-tap-variable-bits-editor-info-modal", inputs: { rows: "rows", bitOffColor: "bitOffColor", bitOnColor: "bitOnColor" }, ngImport: i0, template: "<ion-header>\n <ion-toolbar color=\"primary\">\n <ion-buttons slot=\"start\">\n <ion-button (click)=\"dismiss()\">\n <ion-icon name=\"arrow-back\"></ion-icon>\n </ion-button>\n </ion-buttons>\n <ion-title>Information</ion-title>\n </ion-toolbar>\n</ion-header>\n<ion-content class=\"ion-padding\">\n <div *ngFor=\"let row of rows\">\n <ion-item *ngFor=\"let bit of row\" fill=\"clear\">\n <ion-fab-button\n size=\"small\"\n slot=\"start\"\n [color]=\"bit.value ? bitOnColor : bitOffColor\"\n [disabled]=\"'true'\"\n >\n {{ bit.index | number: '2.0' }}\n </ion-fab-button>\n <ion-label>\n <h3>{{ bit.label }}</h3>\n <p class=\"span-description\">{{ bit.description }}</p>\n </ion-label>\n </ion-item>\n </div>\n</ion-content>\n", styles: [""], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i1$1.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: i1$1.IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { kind: "component", type: i1$1.IonContent, selector: "ion-content", inputs: ["color", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "component", type: i1$1.IonFabButton, selector: "ion-fab-button", inputs: ["activated", "closeIcon", "color", "disabled", "download", "href", "mode", "rel", "routerAnimation", "routerDirection", "show", "size", "target", "translucent", "type"] }, { kind: "component", type: i1$1.IonHeader, selector: "ion-header", inputs: ["collapse", "mode", "translucent"] }, { kind: "component", type: i1$1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i1$1.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: i1$1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i1$1.IonTitle, selector: "ion-title", inputs: ["color", "size"] }, { kind: "component", type: i1$1.IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { kind: "pipe", type: i2.DecimalPipe, name: "number" }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableBitsEditorInfoModalComponent, decorators: [{
type: Component,
args: [{ selector: 'app-tap-variable-bits-editor-info-modal', template: "<ion-header>\n <ion-toolbar color=\"primary\">\n <ion-buttons slot=\"start\">\n <ion-button (click)=\"dismiss()\">\n <ion-icon name=\"arrow-back\"></ion-icon>\n </ion-button>\n </ion-buttons>\n <ion-title>Information</ion-title>\n </ion-toolbar>\n</ion-header>\n<ion-content class=\"ion-padding\">\n <div *ngFor=\"let row of rows\">\n <ion-item *ngFor=\"let bit of row\" fill=\"clear\">\n <ion-fab-button\n size=\"small\"\n slot=\"start\"\n [color]=\"bit.value ? bitOnColor : bitOffColor\"\n [disabled]=\"'true'\"\n >\n {{ bit.index | number: '2.0' }}\n </ion-fab-button>\n <ion-label>\n <h3>{{ bit.label }}</h3>\n <p class=\"span-description\">{{ bit.description }}</p>\n </ion-label>\n </ion-item>\n </div>\n</ion-content>\n" }]
}], ctorParameters: function () { return [{ type: i1$1.ModalController }]; }, propDecorators: { rows: [{
type: Input
}], bitOffColor: [{
type: Input
}], bitOnColor: [{
type: Input
}] } });
class TapVariableBitsEditorInfoModalModule {
}
/** @nocollapse */ TapVariableBitsEditorInfoModalModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableBitsEditorInfoModalModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ TapVariableBitsEditorInfoModalModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: TapVariableBitsEditorInfoModalModule, declarations: [TapVariableBitsEditorInfoModalComponent], imports: [CommonModule, IonicModule], exports: [TapVariableBitsEditorInfoModalComponent] });
/** @nocollapse */ TapVariableBitsEditorInfoModalModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableBitsEditorInfoModalModule, imports: [CommonModule, IonicModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableBitsEditorInfoModalModule, decorators: [{
type: NgModule,
args: [{
declarations: [TapVariableBitsEditorInfoModalComponent],
exports: [TapVariableBitsEditorInfoModalComponent],
imports: [CommonModule, IonicModule],
}]
}] });
let TapVariableBitsEditorComponent = class TapVariableBitsEditorComponent {
set variable(variable) {
this._variableChange.next(variable);
}
set bitsTemplate(template) {
template = sanitizeBitsTemplateParameter(template);
this._bitsTemplate = template;
if (template) {
this.bitsArrayEditable = deepCopy(template);
}
else {
this.bitsArrayEditable = [];
}
this._restoreLastValueReceived();
}
set value(v) {
if (v === undefined) {
v = 0;
}
this._setRawValue(v);
}
constructor(modalController) {
this.modalController = modalController;
this.bitsArrayEditable = [];
this._variableChange = new BehaviorSubject(undefined);
this.dataSuccessfullyUpdated = new EventEmitter();
this.showHelpButton = true;
this.bitOffColor = 'danger';
this.bitOnColor = 'success';
this.editable = true;
this.editButtonsColor = 'primary';
this.numberByteLength = 4;
this.destroyed = new Subject();
this.loaded = false;
this.onSaving = false;
this.editMode = false;
}
ngOnDestroy() {
this.destroyed.next();
}
ngOnInit() {
this._variableChange
.pipe(switchMap((variable) => {
if (variable) {
return variable.values;
}
else {
return NEVER;
}
}), takeUntil(this.destroyed))
.subscribe((rawVariableValue) => {
this._setRawValue(rawVariableValue);
});
}
_setRawValue(value) {
const rawValue = this._valueToBuffer(value);
this.rawStored = rawValue;
if (!this.editMode) {
this.rawToView(rawValue);
this.loaded = true;
}
}
rawToView(rawVariableValue) {
const tapStreamReader = TapStreamReader.fromArray(rawVariableValue);
if (this.bitsArrayEditable.length === 0) {
this._initBitsTemplate(rawVariableValue);
}
const bitSize = rawVariableValue.length * 8 - 1;
this.bitsArrayEditable.forEach((row) => {
for (let bit of row) {
const bitPosition = this._bitIndexToBufferPosition(bitSize, bit.index);
tapStreamReader.setBitPosition(bitPosition);
bit.value = tapStreamReader.readBoolean(1);
}
});
}
_initBitsTemplate(raw) {
let template = this._bitsTemplate;
if (!Array.isArray(template)) {
template = [[]];
for (let i = 0; i < raw.length * 8; i++) {
template[0].push({
description: 'No description',
label: i.toString(),
index: i,
});
}
}
for (let i = 0; i < template.length; i++) {
this.bitsArrayEditable.push([]);
for (let bit of template[i]) {
this.bitsArrayEditable[i].push(Object.assign({}, bit));
}
}
}
cancelEdit() {
this.editMode = false;
this._restoreLastValueReceived();
}
onEditMode() {
this.editMode = true;
}
onClickEdit(bit) {
return __awaiter(this, void 0, void 0, function* () {
bit.value = !bit.value;
});
}
onSaveEdit(variable) {
return __awaiter(this, void 0, void 0, function* () {
try {
if (!variable) {
return;
}
const variableByteLength = this.getNumberByteLength();
const bufferValue = this._userInputToBuffer(variableByteLength);
this.editMode = false;
this.onSaving = true;
if (typeof variable.writeRaw === 'function') {
yield variable.writeRaw(bufferValue);
}
else {
const decodedValue = variable.converter
? variable.converter.decode(bufferValue)
: bufferValue;
yield variable.write(decodedValue);
}
this.dataSuccessfullyUpdated.next('Data successfully updated !');
}
catch (error) {
this._restoreLastValueReceived();
this.ctx.error = error;
}
this.onSaving = false;
});
}
getNumberByteLength() {
return this.numberByteLength
? this.numberByteLength
: this._guessDataLength();
}
_restoreLastValueReceived() {
if (this.rawStored) {
this.rawToView(this.rawStored);
}
}
_valueToBuffer(value) {
if (typeof value === 'number') {
const variableByteLength = this.getNumberByteLength();
if (variableByteLength > 4) {
throw new Error(`Variable on ${variableByteLength} bytes are not supported.`);
}
else if (variableByteLength === 0) {
return new Uint8Array([]);
}
else {
const converter = new NumberConverter({
sizeOf: (variableByteLength * 8),
signed: false,
leastSignificantBitFirst: false,
});
return converter.encode(value);
}
}
else {
return value;
}
}
_bitIndexToBufferPosition(bitLength, index) {
return this.msb ? index : bitLength - index;
}
_userInputToBuffer(byteLength) {
const tapStreamWriter = TapStreamWriter.create(byteLength);
const bitLength = byteLength * 8 - 1;
this.bitsArrayEditable.forEach((row) => {
for (let bit of row) {
tapStreamWriter.setBitPosition(this._bitIndexToBufferPosition(bitLength, bit.index));
tapStreamWriter.writeBoolean(bit.value || false, 1);
}
});
tapStreamWriter.setBitPosition(bitLength);
const result = tapStreamWriter.toBytes;
console.log('DEBUG USER INPUT TO BUFFER', bitLength, deepCopy(this.bitsArrayEditable), 'result', result);
if (result.length !== byteLength) {
console.warn(`TapVariableBitsEditorComponent encoded value to write does not have the expected byte length of ${byteLength} bytes:`, result);
}
return result;
}
/**
* @deprecated use numberByteLength parameter instead
* @param variable
* @returns
*/
_guessDataLength(variable = this._variableChange.value) {
if (!variable) {
console.warn(`Cannot guess data length, variable is not set yet`);
return 0;
}
const tapVariableConfig = variable
.config;
const quantity = (tapVariableConfig === null || tapVariableConfig === void 0 ? void 0 : tapVariableConfig.length) || 1;
let unit;
if ((tapVariableConfig === null || tapVariableConfig === void 0 ? void 0 : tapVariableConfig.dataType) === undefined) {
// TODO fix with API change
console.warn(`TapVariableBitsEditorComponent failed to guess variable size. use 1 byte size. It may trigger error if size is not valid.`, variable);
unit = VariableType.Data.UINT32;
}
else {
unit = tapVariableConfig.dataType;
}
const length = quantity * variableDataTypeToByteSize(unit);
return length;
}
showInfo() {
return __awaiter(this, void 0, void 0, function* () {
this._infoModal = this.modalController.create({
component: TapVariableBitsEditorInfoModalComponent,
componentProps: {
bitOnColor: this.bitOnColor,
bitOffColor: this.bitOffColor,
rows: this.bitsArrayEditable,
},
});
try {
const modal = yield yield this._infoModal;
modal.present();
yield modal.onDidDismiss();
}
finally {
this._infoModal = undefined;
}
});
}
};
/** @nocollapse */ TapVariableBitsEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableBitsEditorComponent, deps: [{ token: i1$1.ModalController }], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ TapVariableBitsEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TapVariableBitsEditorComponent, selector: "tap-variable-bits-editor", inputs: { variable: "variable", showHelpButton: "showHelpButton", bitOffColor: "bitOffColor", bitOnColor: "bitOnColor", editable: "editable", editButtonsColor: "editButtonsColor", msb: "msb", numberByteLength: "numberByteLength", bitsTemplate: "bitsTemplate", value: "value" }, outputs: { dataSuccessfullyUpdated: "dataSuccessfullyUpdated" }, viewQueries: [{ propertyName: "ctx", first: true, predicate: ["ctx"], descendants: true }], ngImport: i0, template: "<tap-value-editor-container\n #ctx\n [variable]=\"_variableChange.value\"\n [showEditButton]=\"false\"\n [showSubmitButton]=\"false\"\n [lines]=\"'none'\"\n *ngIf=\"bitsArrayEditable.length > 0; else noBitsTemplate\"\n>\n <ion-grid id=\"ionGrid\">\n <ion-row *ngFor=\"let row of bitsArrayEditable\" class=\"row-bits\">\n <div class=\"bit-div\" *ngFor=\"let bit of row\">\n <ion-fab-button\n (click)=\"onClickEdit(bit)\"\n class=\"fab-row\"\n size=\"small\"\n [color]=\"\n (bit.value && !bit.reverse) || (!bit.value && bit.reverse)\n ? bitOnColor\n : bitOffColor\n \"\n [disabled]=\"!editMode\"\n >\n </ion-fab-button>\n <ion-label class=\"label-under\">\n {{ bit.label }}\n </ion-label>\n </div>\n </ion-row>\n <ion-item lines=\"none\" *ngIf=\"editable || showHelpButton\">\n <ion-buttons id=\"buttonsBottom\">\n <ion-button\n fill=\"clear\"\n (click)=\"showInfo()\"\n [color]=\"editButtonsColor\"\n *ngIf=\"showHelpButton\"\n >\n <ion-icon\n class=\"button-edit-icon\"\n name=\"information-circle\"\n ></ion-icon>\n </ion-button>\n <ng-container *ngIf=\"editable\">\n <ion-button\n [color]=\"editButtonsColor\"\n fill=\"clear\"\n [disabled]=\"onSaving\"\n (click)=\"onEditMode()\"\n *ngIf=\"!editMode\"\n >\n <ion-icon class=\"button-edit-icon\" name=\"pencil\"></ion-icon>\n </ion-button>\n <ion-button\n fill=\"clear\"\n (click)=\"cancelEdit()\"\n *ngIf=\"editMode\"\n [color]=\"editButtonsColor\"\n >\n <ion-icon class=\"button-edit-icon\" name=\"close\"></ion-icon>\n </ion-button>\n <ion-button\n fill=\"clear\"\n [color]=\"editButtonsColor\"\n [disabled]=\"!editMode\"\n (click)=\"onSaveEdit(_variableChange.value)\"\n *ngIf=\"!onSaving; else saveLoader\"\n >\n <ion-icon class=\"button-edit-icon\" name=\"save\"></ion-icon>\n </ion-button>\n <ng-template #saveLoader>\n <ion-spinner\n [color]=\"editButtonsColor\"\n name=\"crescent\"\n ></ion-spinner> </ng-template\n ></ng-container>\n </ion-buttons>\n </ion-item>\n </ion-grid>\n</tap-value-editor-container>\n<ng-template #noBitsTemplate>\n <ion-progress-bar type=\"indeterminate\"></ion-progress-bar>\n</ng-template>\n", styles: [".checkbox-bit{--border-radius: 5px }ion-label{opacity:1!important}ion-checkbox{opacity:1!important}.fab-row{height:2em;width:2em;margin:.3vw}.row-bits{display:flex;justify-content:center}.icon-bit{font-size:2.3em}ion-fab-button{opacity:1!important}.button-edit-icon{font-size:2em}.span-description{white-space:pre-line!important}.bit-label-info{font-weight:500}.bit-div{text-align:center;margin:2px}.label-under{writing-mode:vertical-lr;transform:rotate(180deg);margin:auto;font-family:system-ui;padding-left:4px}#buttonsBottom{margin:auto}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1$3.TapValueEditorContainerComponent, selector: "tap-value-editor-container", inputs: ["button", "variable", "inputOptions", "showRefreshButton", "showSubmitButton", "showEditButton", "error", "lines", "modalEdition", "value"], outputs: ["submit", "refresh"] }, { kind: "component", type: i1$1.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: i1$1.IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { kind: "component", type: i1$1.IonFabButton, selector: "ion-fab-button", inputs: ["activated", "closeIcon", "color", "disabled", "download", "href", "mode", "rel", "routerAnimation", "routerDirection", "show", "size", "target", "translucent", "type"] }, { kind: "component", type: i1$1.IonGrid, selector: "ion-grid", inputs: ["fixed"] }, { kind: "component", type: i1$1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i1$1.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: i1$1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i1$1.IonProgressBar, selector: "ion-progress-bar", inputs: ["buffer", "color", "mode", "reversed", "type", "value"] }, { kind: "component", type: i1$1.IonRow, selector: "ion-row" }, { kind: "component", type: i1$1.IonSpinner, selector: "ion-spinner", inputs: ["color", "duration", "name", "paused"] }] });
TapVariableBitsEditorComponent = __decorate([
MonitoringAppGenComponent({
constraints: {
isNumber: 'YES',
isArray: 'NO',
},
events: [
{
name: 'submit',
dataType: 'number',
},
],
}),
__metadata("design:paramtypes", [ModalController])
], TapVariableBitsEditorComponent);
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableBitsEditorComponent, decorators: [{
type: Component,
args: [{ selector: 'tap-variable-bits-editor', template: "<tap-value-editor-container\n #ctx\n [variable]=\"_variableChange.value\"\n [showEditButton]=\"false\"\n [showSubmitButton]=\"false\"\n [lines]=\"'none'\"\n *ngIf=\"bitsArrayEditable.length > 0; else noBitsTemplate\"\n>\n <ion-grid id=\"ionGrid\">\n <ion-row *ngFor=\"let row of bitsArrayEditable\" class=\"row-bits\">\n <div class=\"bit-div\" *ngFor=\"let bit of row\">\n <ion-fab-button\n (click)=\"onClickEdit(bit)\"\n class=\"fab-row\"\n size=\"small\"\n [color]=\"\n (bit.value && !bit.reverse) || (!bit.value && bit.reverse)\n ? bitOnColor\n : bitOffColor\n \"\n [disabled]=\"!editMode\"\n >\n </ion-fab-button>\n <ion-label class=\"label-under\">\n {{ bit.label }}\n </ion-label>\n </div>\n </ion-row>\n <ion-item lines=\"none\" *ngIf=\"editable || showHelpButton\">\n <ion-buttons id=\"buttonsBottom\">\n <ion-button\n fill=\"clear\"\n (click)=\"showInfo()\"\n [color]=\"editButtonsColor\"\n *ngIf=\"showHelpButton\"\n >\n <ion-icon\n class=\"button-edit-icon\"\n name=\"information-circle\"\n ></ion-icon>\n </ion-button>\n <ng-container *ngIf=\"editable\">\n <ion-button\n [color]=\"editButtonsColor\"\n fill=\"clear\"\n [disabled]=\"onSaving\"\n (click)=\"onEditMode()\"\n *ngIf=\"!editMode\"\n >\n <ion-icon class=\"button-edit-icon\" name=\"pencil\"></ion-icon>\n </ion-button>\n <ion-button\n fill=\"clear\"\n (click)=\"cancelEdit()\"\n *ngIf=\"editMode\"\n [color]=\"editButtonsColor\"\n >\n <ion-icon class=\"button-edit-icon\" name=\"close\"></ion-icon>\n </ion-button>\n <ion-button\n fill=\"clear\"\n [color]=\"editButtonsColor\"\n [disabled]=\"!editMode\"\n (click)=\"onSaveEdit(_variableChange.value)\"\n *ngIf=\"!onSaving; else saveLoader\"\n >\n <ion-icon class=\"button-edit-icon\" name=\"save\"></ion-icon>\n </ion-button>\n <ng-template #saveLoader>\n <ion-spinner\n [color]=\"editButtonsColor\"\n name=\"crescent\"\n ></ion-spinner> </ng-template\n ></ng-container>\n </ion-buttons>\n </ion-item>\n </ion-grid>\n</tap-value-editor-container>\n<ng-template #noBitsTemplate>\n <ion-progress-bar type=\"indeterminate\"></ion-progress-bar>\n</ng-template>\n", styles: [".checkbox-bit{--border-radius: 5px }ion-label{opacity:1!important}ion-checkbox{opacity:1!important}.fab-row{height:2em;width:2em;margin:.3vw}.row-bits{display:flex;justify-content:center}.icon-bit{font-size:2.3em}ion-fab-button{opacity:1!important}.button-edit-icon{font-size:2em}.span-description{white-space:pre-line!important}.bit-label-info{font-weight:500}.bit-div{text-align:center;margin:2px}.label-under{writing-mode:vertical-lr;transform:rotate(180deg);margin:auto;font-family:system-ui;padding-left:4px}#buttonsBottom{margin:auto}\n"] }]
}], ctorParameters: function () { return [{ type: i1$1.ModalController }]; }, propDecorators: { ctx: [{
type: ViewChild,
args: ['ctx']
}], dataSuccessfullyUpdated: [{
type: Output
}], variable: [{
type: Input
}], showHelpButton: [{
type: Input
}], bitOffColor: [{
type: Input
}], bitOnColor: [{
type: Input
}], editable: [{
type: Input
}], editButtonsColor: [{
type: Input
}], msb: [{
type: Input
}], numberByteLength: [{
type: Input
}], bitsTemplate: [{
type: Input
}], value: [{
type: Input
}] } });
function sanitizeBitsTemplateParameter(template) {
if (Array.isArray(template) &&
template.length > 0 &&
!Array.isArray(template[0])) {
template = [template];
}
if (template && !Array.isArray(template)) {
template = [];
}
if (template) {
template = template.filter((row) => {
return !!row && Array.isArray(row);
});
template.forEach((row, index) => {
template[index] = row.filter((item) => {
return !!item && typeof item === 'object';
});
});
}
return template;
}
class TapVariableBitsEditorModule {
}
/** @nocollapse */ TapVariableBitsEditorModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableBitsEditorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ TapVariableBitsEditorModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: TapVariableBitsEditorModule, declarations: [TapVariableBitsEditorComponent], imports: [CommonModule,
TapValueEditorContainerModule,
IonicModule,
TapVariableBitsEditorInfoModalModule], exports: [TapVariableBitsEditorComponent] });
/** @nocollapse */ TapVariableBitsEditorModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableBitsEditorModule, imports: [CommonModule,
TapValueEditorContainerModule,
IonicModule,
TapVariableBitsEditorInfoModalModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableBitsEditorModule, decorators: [{
type: NgModule,
args: [{
declarations: [TapVariableBitsEditorComponent],
exports: [TapVariableBitsEditorComponent],
imports: [
CommonModule,
TapValueEditorContainerModule,
IonicModule,
TapVariableBitsEditorInfoModalModule,
],
}]
}] });
let TapVariableButtonsComponent = class TapVariableButtonsComponent {
set buttons(buttons) {
this.actions = (buttons || [])
.filter((button) => !!button)
.map((button) => {
return {
// active: false,
label: button.label,
icon: button.icon,
action: () => __awaiter(this, void 0, void 0, function* () {
yield this.ctx.notifyValueChange(button.value);
}),
value: button.value,
disabled: button.disabled,
};
});
}
set value(newValue) {
this._setActiveButton(newValue);
}
constructor() {
this.destroyed = new Subject();
this.editable = true;
this.color = 'primary';
this.segment = true;
this.actions = [];
}
ngAfterViewInit() {
var _a, _b;
(_b = (_a = this.ctx) === null || _a === void 0 ? void 0 : _a.valueToDisplay) === null || _b === void 0 ? void 0 : _b.pipe(takeUntil(this.destroyed)).subscribe((newValue) => {
this._setActiveButton(newValue);
});
}
ngOnDestroy() {
this.destroyed.next();
}
_setActiveButton(newValue) {
this.checkedButtonIndex = this.actions.findIndex((action) => {
return action.value === newValue;
});
}
};
/** @nocollapse */ TapVariableButtonsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableButtonsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ TapVariableButtonsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TapVariableButtonsComponent, selector: "tap-variable-buttons", inputs: { variable: "variable", editable: "editable", color: "color", segment: "segment", buttons: "buttons" }, viewQueries: [{ propertyName: "ctx", first: true, predicate: ["ctx"], descendants: true }], ngImport: i0, template: "<tap-value-editor-container #ctx [variable]=\"variable\">\n <app-monitoring-actions\n style=\"width: 100%\"\n [disabled]=\"!editable || (ctx.loadingChange | async)\"\n [actions]=\"actions\"\n [segment]=\"segment\"\n [color]=\"color\"\n [checkedButtonIndex]=\"checkedButtonIndex\"\n >\n </app-monitoring-actions>\n</tap-value-editor-container>\n", styles: [""], dependencies: [{ kind: "component", type: MonitoringActionsComponent, selector: "app-monitoring-actions", inputs: ["segment", "actions", "checkedButtonIndex", "disabled", "color"] }, { kind: "component", type: i1$3.TapValueEditorContainerComponent, selector: "tap-value-editor-container", inputs: ["button", "variable", "inputOptions", "showRefreshButton", "showSubmitButton", "showEditButton", "error", "lines", "modalEdition", "value"], outputs: ["submit", "refresh"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }] });
TapVariableButtonsComponent = __decorate([
MonitoringAppGenComponent({
constraints: {
isArray: 'NO',
},
events: [
{
name: 'submit',
dataType: 'number',
},
],
}),
__metadata("design:paramtypes", [])
], TapVariableButtonsComponent);
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableButtonsComponent, decorators: [{
type: Component,
args: [{ selector: 'tap-variable-buttons', template: "<tap-value-editor-container #ctx [variable]=\"variable\">\n <app-monitoring-actions\n style=\"width: 100%\"\n [disabled]=\"!editable || (ctx.loadingChange | async)\"\n [actions]=\"actions\"\n [segment]=\"segment\"\n [color]=\"color\"\n [checkedButtonIndex]=\"checkedButtonIndex\"\n >\n </app-monitoring-actions>\n</tap-value-editor-container>\n" }]
}], ctorParameters: function () { return []; }, propDecorators: { ctx: [{
type: ViewChild,
args: ['ctx']
}], variable: [{
type: Input
}], editable: [{
type: Input
}], color: [{
type: Input
}], segment: [{
type: Input
}], buttons: [{
type: Input
}] } });
class TapVariableButtonsModule {
}
/** @nocollapse */ TapVariableButtonsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableButtonsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ TapVariableButtonsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: TapVariableButtonsModule, declarations: [TapVariableButtonsComponent], imports: [CommonModule,
IonicModule,
MonitoringActionsModule,
TapValueEditorContainerModule], exports: [TapVariableButtonsComponent] });
/** @nocollapse */ TapVariableButtonsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableButtonsModule, imports: [CommonModule,
IonicModule,
MonitoringActionsModule,
TapValueEditorContainerModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableButtonsModule, decorators: [{
type: NgModule,
args: [{
declarations: [TapVariableButtonsComponent],
exports: [TapVariableButtonsComponent],
imports: [
CommonModule,
IonicModule,
MonitoringActionsModule,
TapValueEditorContainerModule,
],
}]
}] });
let TapVariableColorPickerComponent = class TapVariableColorPickerComponent {
set variable(variable) {
this._variable = variable;
}
get pending() {
return this.pendingCallManager.pendingCall !== undefined;
}
constructor(tapService) {
this.editable = true;
this.showHexValue = true;
this.destroyed = new Subject();
// loaded = false;
this._color = '#000000';
this.pendingCallManager = PendingCallManager.create(tapService);
}
ngAfterViewInit() {
var _a, _b;
(_b = (_a = this.ctx) === null || _a === void 0 ? void 0 : _a.valueToDisplay) === null || _b === void 0 ? void 0 : _b.pipe(takeUntil(this.destroyed)).subscribe((newValue) => {
this._color = asColorString(newValue);
});
}
ngOnDestroy() {
this.destroyed.next();
this.pendingCallManager.destroy();
}
onColorChange(color) {
this._color = color;
this.ctx.notifyValueChange(asColorInt(color));
}
};
/** @nocollapse */ TapVariableColorPickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableColorPickerComponent, deps: [{ token: i1$3.CurrentDeviceService }], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ TapVariableColorPickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TapVariableColorPickerComponent, selector: "tap-variable-color-picker", inputs: { editable: "editable", showHexValue: "showHexValue", variable: "variable" }, viewQueries: [{ propertyName: "ctx", first: true, predicate: ["ctx"], descendants: true }], ngImport: i0, template: "<tap-value-editor-container #ctx [variable]=\"_variable\">\n <span id=\"spanColor\" *ngIf=\"showHexValue\">{{ _color }}</span>\n <input\n id=\"inputColor\"\n #inputElement\n type=\"color\"\n [disabled]=\"!editable\"\n [(ngModel)]=\"_color\"\n (ngModelChange)=\"onColorChange($event)\"\n />\n <!-- <ion-spinner *ngIf=\"!loaded\" name=\"crescent\" color=\"primary\"></ion-spinner> -->\n</tap-value-editor-container>\n", styles: ["#spanColor{font-size:.9em;font-weight:600;margin-right:5px}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i1$3.TapValueEditorContainerComponent, selector: "tap-value-editor-container", inputs: ["button", "variable", "inputOptions", "showRefreshButton", "showSubmitButton", "showEditButton", "error", "lines", "modalEdition", "value"], outputs: ["submit", "refresh"] }] });
TapVariableColorPickerComponent = __decorate([
MonitoringAppGenComponent({
constraints: { isNumber: 'YES', isArray: 'NO', isString: 'NO' },
events: [
{
name: 'submit',
dataType: 'number',
},
],
}),
__metadata("design:paramtypes", [CurrentDeviceService])
], TapVariableColorPickerComponent);
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableColorPickerComponent, decorators: [{
type: Component,
args: [{ selector: 'tap-variable-color-picker', template: "<tap-value-editor-container #ctx [variable]=\"_variable\">\n <span id=\"spanColor\" *ngIf=\"showHexValue\">{{ _color }}</span>\n <input\n id=\"inputColor\"\n #inputElement\n type=\"color\"\n [disabled]=\"!editable\"\n [(ngModel)]=\"_color\"\n (ngModelChange)=\"onColorChange($event)\"\n />\n <!-- <ion-spinner *ngIf=\"!loaded\" name=\"crescent\" color=\"primary\"></ion-spinner> -->\n</tap-value-editor-container>\n", styles: ["#spanColor{font-size:.9em;font-weight:600;margin-right:5px}\n"] }]
}], ctorParameters: function () { return [{ type: i1$3.CurrentDeviceService }]; }, propDecorators: { editable: [{
type: Input
}], showHexValue: [{
type: Input
}], variable: [{
type: Input
}], ctx: [{
type: ViewChild,
args: ['ctx']
}] } });
const CSS_COLOR_REGEX = /^#([a-fA-F0-9]{6})$/;
function asColorString(input) {
if (input === undefined) {
input = '#000000';
}
if (typeof input === 'string' && input.startsWith('0x')) {
input = parseInt(input, 16);
}
if (typeof input === 'number') {
if (input < 0) {
input = 0;
}
else if (input > 0xffffff) {
input = 0xffffff;
}
input = '#' + input.toString(16).padStart(6, '0');
}
if (!input.match(CSS_COLOR_REGEX)) {
throw new Error(`Invalid CSS color "${input}". It must formatted as #AD3033`);
}
return input;
}
function asColorInt(input) {
return parseInt(asColorString(input).substr(1), 16);
}
class TapVariableColorPickerModule {
}
/** @nocollapse */ TapVariableColorPickerModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableColorPickerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ TapVariableColorPickerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: TapVariableColorPickerModule, declarations: [TapVariableColorPickerComponent], imports: [CommonModule,
IonicModule,
FormsModule,
TapValueEditorContainerModule], exports: [TapVariableColorPickerComponent] });
/** @nocollapse */ TapVariableColorPickerModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableColorPickerModule, imports: [CommonModule,
IonicModule,
FormsModule,
TapValueEditorContainerModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableColorPickerModule, decorators: [{
type: NgModule,
args: [{
declarations: [TapVariableColorPickerComponent],
exports: [TapVariableColorPickerComponent],
imports: [
CommonModule,
IonicModule,
FormsModule,
TapValueEditorContainerModule,
],
}]
}] });
let TapVariableContextComponent = class TapVariableContextComponent {
get values() {
var _a;
return (_a = this.variable) === null || _a === void 0 ? void 0 : _a.values;
}
get config() {
const variable = this._variable;
if (variable && variable instanceof TapVariable) {
return variable.config;
}
return undefined;
}
set variable(v) {
if (this.sub) {
this.sub.unsubscribe();
this.sub = undefined;
}
if (v) {
this._variable = v;
this.sub = v.values.subscribe((value) => (this.value = value));
}
}
constructor() { }
ngOnDestroy() {
var _a;
(_a = this.sub) === null || _a === void 0 ? void 0 : _a.unsubscribe();
this.sub = undefined;
}
};
/** @nocollapse */ TapVariableContextComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableContextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ TapVariableContextComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TapVariableContextComponent, selector: "tap-variable-context", inputs: { variable: "variable" }, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [""] });
TapVariableContextComponent = __decorate([
MonitoringAppGenComponent({}),
__metadata("design:paramtypes", [])
], TapVariableContextComponent);
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableContextComponent, decorators: [{
type: Component,
args: [{ selector: 'tap-variable-context', template: "<ng-content></ng-content>\n" }]
}], ctorParameters: function () { return []; }, propDecorators: { variable: [{
type: Input
}] } });
class TapVariableContextModule {
}
/** @nocollapse */ TapVariableContextModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableContextModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ TapVariableContextModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: TapVariableContextModule, declarations: [TapVariableContextComponent], imports: [CommonModule, IonicModule], exports: [TapVariableContextComponent] });
/** @nocollapse */ TapVariableContextModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableContextModule, imports: [CommonModule, IonicModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableContextModule, decorators: [{
type: NgModule,
args: [{
declarations: [TapVariableContextComponent],
exports: [TapVariableContextComponent],
imports: [CommonModule, IonicModule],
}]
}] });
let TapVariableDateTimePickerComponent = class TapVariableDateTimePickerComponent {
// loaded = false;
set fieldError(err) {
this.error = err;
}
get pending() {
return this.pendingCallManager.pendingCall !== undefined;
}
set encodingType(type) {
if (type in DATE_TIME_PICKER_ENCODING) {
const converter = DATE_TIME_PICKER_ENCODING[type];
this.formatDataRead = converter.decode.bind(converter);
this.formatDataWrite = converter.encode.bind(converter);
}
else {
this.formatDataRead = undefined;
this.formatDataWrite = undefined;
}
}
set variable(variable) {
this._variable = variable;
}
constructor(tapService) {
this.destroyed = new Subject();
this.format = 'medium';
this.showCalendarPickerTitle = true;
this.editable = true;
this.color = 'primary';
this.showCalendarIcon = true;
this.iconCalendarColor = 'primary';
this.dateTimeValue = '2023-01-01T00:00:00';
this.pendingCallManager = PendingCallManager.create(tapService);
}
ngOnDestroy() {
this.destroyed.next();
this.pendingCallManager.destroy();
}
ngAfterViewInit() {
var _a, _b;
(_b = (_a = this.ctx) === null || _a === void 0 ? void 0 : _a.valueToDisplay) === null || _b === void 0 ? void 0 : _b.pipe(takeUntil(this.destroyed)).subscribe((newValue) => {
this.dateTimeValue = this.formatDataRead
? this.formatDataRead(newValue)
: newValue;
});
}
onPendingChange(event) {
return __awaiter(this, void 0, void 0, function* () {
const value = event.detail.value;
const timeStamp = this.formatDataWrite
? this.formatDataWrite(value)
: value;
yield this.ctx.notifyValueChange(timeStamp);
});
}
onValueClick() {
if (this.editable) {
this.pendingSubmitValue = this.dateTimeValue;
this.dateTimeModal.present();
}
}
};
/** @nocollapse */ TapVariableDateTimePickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableDateTimePickerComponent, deps: [{ token: i1$3.CurrentDeviceService }], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ TapVariableDateTimePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TapVariableDateTimePickerComponent, selector: "tap-variable-date-time-picker", inputs: { fieldError: "fieldError", format: "format", showCalendarPickerTitle: "showCalendarPickerTitle", editable: "editable", color: "color", showCalendarIcon: "showCalendarIcon", iconCalendarColor: "iconCalendarColor", encodingType: "encodingType", formatDataRead: "formatDataRead", formatDataWrite: "formatDataWrite", variable: "variable" }, viewQueries: [{ propertyName: "ctx", first: true, predicate: ["ctx"], descendants: true }, { propertyName: "dateTimeModal", first: true, predicate: ["dateTimeModal"], descendants: true }], ngImport: i0, template: "<tap-value-editor-container\n #ctx\n [button]=\"editable\"\n [variable]=\"_variable\"\n (click)=\"onValueClick()\"\n>\n <!-- <ion-spinner *ngIf=\"!loaded\" name=\"crescent\" color=\"primary\"></ion-spinner> -->\n\n <ion-modal #dateTimeModal>\n <ng-template>\n <ion-content>\n <ion-datetime\n #ionDateTime\n [showDefaultTitle]=\"showCalendarPickerTitle\"\n [showDefaultButtons]=\"true\"\n [color]=\"color\"\n size=\"cover\"\n [value]=\"pendingSubmitValue\"\n (ionChange)=\"onPendingChange($event)\"\n >\n <!-- <ion-buttons slot=\"buttons\">\n <ion-button\n fill=\"clear\"\n [color]=\"color\"\n (click)=\"ionDateTime.confirm(); onConfirm()\"\n >Confirm</ion-button\n >\n <ion-button\n fill=\"clear\"\n color=\"dark\"\n (click)=\"ionDateTime.cancel(); dateTimeModal.dismiss()\"\n >Cancel</ion-button\n >\n </ion-buttons> -->\n </ion-datetime>\n </ion-content>\n </ng-template>\n </ion-modal>\n <ion-icon\n [color]=\"iconCalendarColor\"\n slot=\"start\"\n name=\"calendar\"\n *ngIf=\"showCalendarIcon\"\n ></ion-icon>\n <ion-label>\n {{ dateTimeValue | date: (format ? format : 'MMM d, y, h:mm:ss a') }}\n </ion-label>\n <!--\n <ion-datetime\n *ngIf=\"loaded\"\n \n [displayFormat]=\"format\"\n [value]=\"dateTimeValue\"\n (ionChange)=\n ></ion-datetime>\n -->\n</tap-value-editor-container>\n", styles: [""], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1$1.IonContent, selector: "ion-content", inputs: ["color", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "component", type: i1$1.IonDatetime, selector: "ion-datetime", inputs: ["cancelText", "clearText", "color", "dayValues", "disabled", "doneText", "firstDayOfWeek", "highlightedDates", "hourCycle", "hourValues", "isDateEnabled", "locale", "max", "min", "minuteValues", "mode", "monthValues", "multiple", "name", "preferWheel", "presentation", "readonly", "showClearButton", "showDefaultButtons", "showDefaultTimeLabel", "showDefaultTitle", "size", "titleSelectedDatesFormatter", "value", "yearValues"] }, { kind: "component", type: i1$1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i1$1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i1$1.IonModal, selector: "ion-modal", inputs: ["animated", "keepContentsMounted", "backdropBreakpoint", "backdropDismiss", "breakpoints", "canDismiss", "cssClass", "enterAnimation", "event", "handle", "handleBehavior", "initialBreakpoint", "isOpen", "keyboardClose", "leaveAnimation", "mode", "presentingElement", "showBackdrop", "swipeToClose", "translucent", "trigger"] }, { kind: "directive", type: i1$1.SelectValueAccessor, selector: "ion-range, ion-select, ion-radio-group, ion-segment, ion-datetime" }, { kind: "component", type: i1$3.TapValueEditorContainerComponent, selector: "tap-value-editor-container", inputs: ["button", "variable", "inputOptions", "showRefreshButton", "showSubmitButton", "showEditButton", "error", "lines", "modalEdition", "value"], outputs: ["submit", "refresh"] }, { kind: "pipe", type: i2.DatePipe, name: "date" }] });
TapVariableDateTimePickerComponent = __decorate([
MonitoringAppGenComponent({
constraints: {
isArray: 'NO',
},
}),
__metadata("design:paramtypes", [CurrentDeviceService])
], TapVariableDateTimePickerComponent);
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableDateTimePickerComponent, decorators: [{
type: Component,
args: [{ selector: 'tap-variable-date-time-picker', template: "<tap-value-editor-container\n #ctx\n [button]=\"editable\"\n [variable]=\"_variable\"\n (click)=\"onValueClick()\"\n>\n <!-- <ion-spinner *ngIf=\"!loaded\" name=\"crescent\" color=\"primary\"></ion-spinner> -->\n\n <ion-modal #dateTimeModal>\n <ng-template>\n <ion-content>\n <ion-datetime\n #ionDateTime\n [showDefaultTitle]=\"showCalendarPickerTitle\"\n [showDefaultButtons]=\"true\"\n [color]=\"color\"\n size=\"cover\"\n [value]=\"pendingSubmitValue\"\n (ionChange)=\"onPendingChange($event)\"\n >\n <!-- <ion-buttons slot=\"buttons\">\n <ion-button\n fill=\"clear\"\n [color]=\"color\"\n (click)=\"ionDateTime.confirm(); onConfirm()\"\n >Confirm</ion-button\n >\n <ion-button\n fill=\"clear\"\n color=\"dark\"\n (click)=\"ionDateTime.cancel(); dateTimeModal.dismiss()\"\n >Cancel</ion-button\n >\n </ion-buttons> -->\n </ion-datetime>\n </ion-content>\n </ng-template>\n </ion-modal>\n <ion-icon\n [color]=\"iconCalendarColor\"\n slot=\"start\"\n name=\"calendar\"\n *ngIf=\"showCalendarIcon\"\n ></ion-icon>\n <ion-label>\n {{ dateTimeValue | date: (format ? format : 'MMM d, y, h:mm:ss a') }}\n </ion-label>\n <!--\n <ion-datetime\n *ngIf=\"loaded\"\n \n [displayFormat]=\"format\"\n [value]=\"dateTimeValue\"\n (ionChange)=\n ></ion-datetime>\n -->\n</tap-value-editor-container>\n" }]
}], ctorParameters: function () { return [{ type: i1$3.CurrentDeviceService }]; }, propDecorators: { ctx: [{
type: ViewChild,
args: ['ctx']
}], dateTimeModal: [{
type: ViewChild,
args: ['dateTimeModal']
}], fieldError: [{
type: Input
}], format: [{
type: Input
}], showCalendarPickerTitle: [{
type: Input
}], editable: [{
type: Input
}], color: [{
type: Input
}], showCalendarIcon: [{
type: Input
}], iconCalendarColor: [{
type: Input
}], encodingType: [{
type: Input
}], formatDataRead: [{
type: Input
}], formatDataWrite: [{
type: Input
}], variable: [{
type: Input
}] } });
const DATE_TIME_PICKER_ENCODING = {
timestamp_ms: createTimestampEncoder(1),
timestamp_s: createTimestampEncoder(1000),
};
function createTimestampEncoder(multiplier = 1) {
return {
decode: (timestampInSeconds) => {
timestampInSeconds =
typeof timestampInSeconds === 'string'
? parseInt(timestampInSeconds)
: timestampInSeconds;
if (timestampInSeconds === undefined || isNaN(timestampInSeconds)) {
timestampInSeconds = 0;
}
const date = new Date(timestampInSeconds * multiplier);
return date.toISOString().slice(0, -1);
},
encode: (value) => {
if (!value) {
return 0;
}
const date = Date.parse(value);
return new Date(date).getTime() / multiplier;
},
};
}
class TapVariableDateTimePickerModule {
}
/** @nocollapse */ TapVariableDateTimePickerModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableDateTimePickerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ TapVariableDateTimePickerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: TapVariableDateTimePickerModule, declarations: [TapVariableDateTimePickerComponent], imports: [CommonModule, IonicModule, TapValueEditorContainerModule], exports: [TapVariableDateTimePickerComponent] });
/** @nocollapse */ TapVariableDateTimePickerModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableDateTimePickerModule, imports: [CommonModule, IonicModule, TapValueEditorContainerModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableDateTimePickerModule, decorators: [{
type: NgModule,
args: [{
declarations: [TapVariableDateTimePickerComponent],
exports: [TapVariableDateTimePickerComponent],
imports: [CommonModule, IonicModule, TapValueEditorContainerModule],
}]
}] });
let TapVariableGaugeComponent = class TapVariableGaugeComponent extends GaugeCardComponent {
/**
* @deprecated directly use value input
*/
set variable(v) {
if (v) {
this.inputStream = v.values;
}
else {
this.inputStream = NEVER;
}
}
set value(value) {
this.setSingleValue(value);
}
};
/** @nocollapse */ TapVariableGaugeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableGaugeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ TapVariableGaugeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TapVariableGaugeComponent, selector: "tap-variable-gauge", inputs: { variable: "variable", value: "value" }, usesInheritance: true, ngImport: i0, template: "<div class=\"chart-container\" style=\"position: relative\">\n <ngx-charts-gauge\n #ngxChartsGauge\n [scheme]=\"colorScheme\"\n [results]=\"results\"\n [min]=\"min\"\n [max]=\"max\"\n [angleSpan]=\"angleSpan\"\n [startAngle]=\"startAngle\"\n [units]=\"units\"\n [bigSegments]=\"bigSegments\"\n [smallSegments]=\"smallSegments\"\n [legend]=\"legend\"\n [legendTitle]=\"legendTitle\"\n [valueFormatting]=\"valueFormatting\"\n [showText]=\"showText\"\n [view]=\"view\"\n (select)=\"onSelect($event)\"\n >\n </ngx-charts-gauge>\n <ion-fab-button\n id=\"exportFabButton\"\n size=\"small\"\n tapExportData\n [dataToExport]=\"results\"\n [exportedFileName]=\"exportedFileName\"\n *ngIf=\"showExportButton\"\n >\n <ion-icon name=\"download\"></ion-icon>\n </ion-fab-button>\n</div>\n", styles: [".chart-container{display:grid}@media (prefers-color-scheme: dark){::ng-deep span.legend-label-text{color:#ccc!important}::ng-deep span.legend-label-text:hover{color:#fff!important}::ng-deep .ngx-charts text{fill:#fff!important}}#exportFabButton{position:absolute;top:10px;right:10px}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.GaugeComponent, selector: "ngx-charts-gauge", inputs: ["legend", "legendTitle", "legendPosition", "min", "max", "textValue", "units", "bigSegments", "smallSegments", "results", "showAxis", "startAngle", "angleSpan", "activeEntries", "axisTickFormatting", "tooltipDisabled", "valueFormatting", "showText", "margin"], outputs: ["activate", "deactivate"] }, { kind: "component", type: i1$1.IonFabButton, selector: "ion-fab-button", inputs: ["activated", "closeIcon", "color", "disabled", "download", "href", "mode", "rel", "routerAnimation", "routerDirection", "show", "size", "target", "translucent", "type"] }, { kind: "component", type: i1$1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "directive", type: ExportDataDirective, selector: "[tapExportData]", inputs: ["exportedFileName", "dataToExport", "format"], outputs: ["exportDataError"] }] });
TapVariableGaugeComponent = __decorate([
MonitoringAppGenComponent({
constraints: {
isNumber: 'YES',
},
})
], TapVariableGaugeComponent);
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableGaugeComponent, decorators: [{
type: Component,
args: [{ selector: 'tap-variable-gauge', template: "<div class=\"chart-container\" style=\"position: relative\">\n <ngx-charts-gauge\n #ngxChartsGauge\n [scheme]=\"colorScheme\"\n [results]=\"results\"\n [min]=\"min\"\n [max]=\"max\"\n [angleSpan]=\"angleSpan\"\n [startAngle]=\"startAngle\"\n [units]=\"units\"\n [bigSegments]=\"bigSegments\"\n [smallSegments]=\"smallSegments\"\n [legend]=\"legend\"\n [legendTitle]=\"legendTitle\"\n [valueFormatting]=\"valueFormatting\"\n [showText]=\"showText\"\n [view]=\"view\"\n (select)=\"onSelect($event)\"\n >\n </ngx-charts-gauge>\n <ion-fab-button\n id=\"exportFabButton\"\n size=\"small\"\n tapExportData\n [dataToExport]=\"results\"\n [exportedFileName]=\"exportedFileName\"\n *ngIf=\"showExportButton\"\n >\n <ion-icon name=\"download\"></ion-icon>\n </ion-fab-button>\n</div>\n", styles: [".chart-container{display:grid}@media (prefers-color-scheme: dark){::ng-deep span.legend-label-text{color:#ccc!important}::ng-deep span.legend-label-text:hover{color:#fff!important}::ng-deep .ngx-charts text{fill:#fff!important}}#exportFabButton{position:absolute;top:10px;right:10px}\n"] }]
}], propDecorators: { variable: [{
type: Input
}], value: [{
type: Input
}] } });
class TapVariableGaugeModule {
}
/** @nocollapse */ TapVariableGaugeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableGaugeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ TapVariableGaugeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: TapVariableGaugeModule, declarations: [TapVariableGaugeComponent], imports: [CommonModule, GaugeCardModule, IonicModule, ExportDataModule], exports: [TapVariableGaugeComponent] });
/** @nocollapse */ TapVariableGaugeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableGaugeModule, providers: [DecimalPipe], imports: [CommonModule, GaugeCardModule, IonicModule, ExportDataModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableGaugeModule, decorators: [{
type: NgModule,
args: [{
declarations: [TapVariableGaugeComponent],
providers: [DecimalPipe],
exports: [TapVariableGaugeComponent],
imports: [CommonModule, GaugeCardModule, IonicModule, ExportDataModule],
}]
}] });
let TapVariableSelectComponent = class TapVariableSelectComponent {
set options(selectOptions) {
this._selectOptions = selectOptions === null || selectOptions === void 0 ? void 0 : selectOptions.filter((option) => !!option);
}
constructor() {
this.valueChange = new EventEmitter();
this.refreshable = false;
this.multiple = false;
this.lines = 'none';
this._destroyed = new Subject();
}
ngOnDestroy() {
this._destroyed.next();
this._destroyed.complete();
}
ngAfterViewInit() {
this.ctx.variableValuesStream
.pipe(takeUntil(this._destroyed))
.subscribe((value) => {
this.lastValue = value;
});
this.ctx.editModeChange
.pipe(takeUntil(this._destroyed))
.subscribe((isEditModeOn) => {
if (isEditModeOn) {
this.openSelectDialog();
}
});
}
openSelectDialog() {
var _a;
return __awaiter(this, void 0, void 0, function* () {
yield ((_a = this.selectView) === null || _a === void 0 ? void 0 : _a.open());
});
}
onSelectValueChange(event) {
const value = event.detail.value;
if (this.lastValue !== value) {
this.valueChange.emit(value);
this.ctx.notifyValueChange(value);
}
}
onSelectCancelChange() {
this.ctx.cancelEdit();
}
};
/** @nocollapse */ TapVariableSelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ TapVariableSelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TapVariableSelectComponent, selector: "tap-variable-select", inputs: { variable: "variable", value: "value", editable: "editable", refreshable: "refreshable", multiple: "multiple", lines: "lines", options: "options" }, outputs: { valueChange: "valueChange" }, viewQueries: [{ propertyName: "ctx", first: true, predicate: ["ctx"], descendants: true }, { propertyName: "selectView", first: true, predicate: ["selectView"], descendants: true }], ngImport: i0, template: "<tap-value-editor-container\n #ctx\n [variable]=\"variable\"\n [showEditButton]=\"editable\"\n [showRefreshButton]=\"refreshable\"\n [value]=\"value\"\n [lines]=\"lines\"\n>\n <ion-select\n #selectView\n [multiple]=\"multiple\"\n [value]=\"\n ctx.pendingSubmitValue !== undefined ? ctx.pendingSubmitValue : lastValue\n \"\n [disabled]=\"!editable\"\n (ionChange)=\"onSelectValueChange($event)\"\n (ionCancel)=\"onSelectCancelChange()\"\n >\n <ion-select-option\n *ngFor=\"let option of _selectOptions\"\n [value]=\"option.key\"\n >\n {{ option.text }}\n </ion-select-option>\n </ion-select>\n</tap-value-editor-container>\n", styles: [""], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i1$1.IonSelect, selector: "ion-select", inputs: ["cancelText", "compareWith", "disabled", "interface", "interfaceOptions", "mode", "multiple", "name", "okText", "placeholder", "selectedText", "value"] }, { kind: "component", type: i1$1.IonSelectOption, selector: "ion-select-option", inputs: ["disabled", "value"] }, { kind: "directive", type: i1$1.SelectValueAccessor, selector: "ion-range, ion-select, ion-radio-group, ion-segment, ion-datetime" }, { kind: "component", type: i1$3.TapValueEditorContainerComponent, selector: "tap-value-editor-container", inputs: ["button", "variable", "inputOptions", "showRefreshButton", "showSubmitButton", "showEditButton", "error", "lines", "modalEdition", "value"], outputs: ["submit", "refresh"] }] });
TapVariableSelectComponent = __decorate([
MonitoringAppGenComponent({
constraints: {
isArray: 'NO',
},
events: [
{
name: 'submit',
dataType: 'number',
},
],
}),
__metadata("design:paramtypes", [])
], TapVariableSelectComponent);
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableSelectComponent, decorators: [{
type: Component,
args: [{ selector: 'tap-variable-select', template: "<tap-value-editor-container\n #ctx\n [variable]=\"variable\"\n [showEditButton]=\"editable\"\n [showRefreshButton]=\"refreshable\"\n [value]=\"value\"\n [lines]=\"lines\"\n>\n <ion-select\n #selectView\n [multiple]=\"multiple\"\n [value]=\"\n ctx.pendingSubmitValue !== undefined ? ctx.pendingSubmitValue : lastValue\n \"\n [disabled]=\"!editable\"\n (ionChange)=\"onSelectValueChange($event)\"\n (ionCancel)=\"onSelectCancelChange()\"\n >\n <ion-select-option\n *ngFor=\"let option of _selectOptions\"\n [value]=\"option.key\"\n >\n {{ option.text }}\n </ion-select-option>\n </ion-select>\n</tap-value-editor-container>\n" }]
}], ctorParameters: function () { return []; }, propDecorators: { ctx: [{
type: ViewChild,
args: ['ctx']
}], selectView: [{
type: ViewChild,
args: ['selectView']
}], variable: [{
type: Input
}], value: [{
type: Input
}], valueChange: [{
type: Output
}], editable: [{
type: Input
}], refreshable: [{
type: Input
}], multiple: [{
type: Input
}], lines: [{
type: Input
}], options: [{
type: Input
}] } });
class TapVariableSelectModule {
}
/** @nocollapse */ TapVariableSelectModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableSelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ TapVariableSelectModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: TapVariableSelectModule, declarations: [TapVariableSelectComponent], imports: [CommonModule,
IonicModule,
InlineEditorModule,
TapValueEditorContainerModule], exports: [TapVariableSelectComponent] });
/** @nocollapse */ TapVariableSelectModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableSelectModule, providers: [DecimalPipe], imports: [CommonModule,
IonicModule,
InlineEditorModule,
TapValueEditorContainerModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableSelectModule, decorators: [{
type: NgModule,
args: [{
declarations: [TapVariableSelectComponent],
exports: [TapVariableSelectComponent],
providers: [DecimalPipe],
imports: [
CommonModule,
IonicModule,
InlineEditorModule,
TapValueEditorContainerModule,
],
}]
}] });
const GPIO_MODE_OPTIONS = listEnumKeys(GPIOMode)
.sort()
.map((text) => {
return {
key: GPIOMode[text],
text: text.replace(/_/g, ' '),
};
});
let TapVariableGpioModeComponent = class TapVariableGpioModeComponent {
constructor() {
this.options = GPIO_MODE_OPTIONS;
}
};
/** @nocollapse */ TapVariableGpioModeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableGpioModeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ TapVariableGpioModeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TapVariableGpioModeComponent, selector: "tap-variable-gpio-mode", inputs: { editable: "editable", variable: "variable" }, ngImport: i0, template: "<tap-variable-select\n slot=\"end\"\n [lines]=\"'none'\"\n [variable]=\"variable\"\n [multiple]=\"false\"\n [options]=\"options\"\n [editable]=\"editable\"\n>\n</tap-variable-select>\n", styles: [""], dependencies: [{ kind: "component", type: TapVariableSelectComponent, selector: "tap-variable-select", inputs: ["variable", "value", "editable", "refreshable", "multiple", "lines", "options"], outputs: ["valueChange"] }] });
TapVariableGpioModeComponent = __decorate([
MonitoringAppGenComponent({
constraints: {
isArray: 'NO',
isNumber: 'YES',
},
events: [
{
name: 'submit',
dataType: 'number',
},
],
}),
__metadata("design:paramtypes", [])
], TapVariableGpioModeComponent);
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableGpioModeComponent, decorators: [{
type: Component,
args: [{ selector: 'tap-variable-gpio-mode', template: "<tap-variable-select\n slot=\"end\"\n [lines]=\"'none'\"\n [variable]=\"variable\"\n [multiple]=\"false\"\n [options]=\"options\"\n [editable]=\"editable\"\n>\n</tap-variable-select>\n" }]
}], ctorParameters: function () { return []; }, propDecorators: { editable: [{
type: Input
}], variable: [{
type: Input
}] } });
class TapVariableGpioModeModule {
}
/** @nocollapse */ TapVariableGpioModeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableGpioModeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ TapVariableGpioModeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: TapVariableGpioModeModule, declarations: [TapVariableGpioModeComponent], imports: [CommonModule, IonicModule, TapVariableSelectModule], exports: [TapVariableGpioModeComponent] });
/** @nocollapse */ TapVariableGpioModeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableGpioModeModule, imports: [CommonModule, IonicModule, TapVariableSelectModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableGpioModeModule, decorators: [{
type: NgModule,
args: [{
declarations: [TapVariableGpioModeComponent],
exports: [TapVariableGpioModeComponent],
imports: [CommonModule, IonicModule, TapVariableSelectModule],
}]
}] });
let TapVariableToggleComponent = class TapVariableToggleComponent {
constructor(changeDetectorRef) {
this.changeDetectorRef = changeDetectorRef;
this.textOnLeft = 'Off';
this.textOnRight = 'On';
this.lines = 'none';
this.toggleColor = 'primary';
this.editable = false;
this.valueOn = 1;
this.valueOff = 0;
this.chip = {
outline: false,
color: '',
};
this.chipOutline = false;
this.inputOptions = {
type: 'toggle',
};
}
ngAfterViewInit() {
var _a;
this._valueSub = (_a = this.ctx) === null || _a === void 0 ? void 0 : _a.valueToDisplay.pipe(map((value) => {
if (value === this.valueOn) {
value = true;
}
else if (value === this.valueOff) {
value = false;
}
value = !!value;
return value;
})).subscribe((value) => {
this._lastValueDisplayed = value;
if (this.ctx.pendingSubmitValue === undefined) {
this.toggle.checked = value;
this.changeDetectorRef.detectChanges();
}
});
}
ngOnDestroy() {
var _a;
(_a = this._valueSub) === null || _a === void 0 ? void 0 : _a.unsubscribe();
}
switchToggle() {
if (!this.toggle.disabled) {
this.toggle.checked = !this.toggle.checked;
}
}
onValueChange(event) {
var _a;
if (this._lastValueDisplayed !== event.detail.checked) {
const value = event.detail.checked ? this.valueOn : this.valueOff;
(_a = this.ctx) === null || _a === void 0 ? void 0 : _a.notifyValueChange(value);
}
}
};
/** @nocollapse */ TapVariableToggleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableToggleComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ TapVariableToggleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TapVariableToggleComponent, selector: "tap-variable-toggle", inputs: { textOnLeft: "textOnLeft", textOnRight: "textOnRight", lines: "lines", toggleColor: "toggleColor", variable: "variable", editable: "editable", valueOn: "valueOn", valueOff: "valueOff", chip: "chip" }, viewQueries: [{ propertyName: "toggle", first: true, predicate: ["toggle"], descendants: true }, { propertyName: "ctx", first: true, predicate: ["ctx"], descendants: true }], ngImport: i0, template: "<tap-value-editor-container #ctx [variable]=\"variable\" [lines]=\"lines\">\n <ion-chip\n [color]=\"chip?.color\"\n [outline]=\"chip?.outline\"\n (click)=\"switchToggle()\"\n [disabled]=\"!editable || (ctx.loadingChange | async)\"\n >\n <span class=\"spanToggle\"> {{ textOnLeft }} </span>\n <ion-toggle\n [color]=\"toggleColor\"\n #toggle\n [disabled]=\"!editable || (ctx.loadingChange | async)\"\n style=\"pointer-events: none\"\n (ionChange)=\"onValueChange($event)\"\n ></ion-toggle>\n <span class=\"spanToggle\"> {{ textOnRight }} </span>\n </ion-chip>\n</tap-value-editor-container>\n", styles: [".toggle-icon{font-size:5em}\n"], dependencies: [{ kind: "component", type: i1$1.IonChip, selector: "ion-chip", inputs: ["color", "disabled", "mode", "outline"] }, { kind: "component", type: i1$1.IonToggle, selector: "ion-toggle", inputs: ["checked", "color", "disabled", "enableOnOffLabels", "mode", "name", "value"] }, { kind: "directive", type: i1$1.BooleanValueAccessor, selector: "ion-checkbox,ion-toggle" }, { kind: "component", type: i1$3.TapValueEditorContainerComponent, selector: "tap-value-editor-container", inputs: ["button", "variable", "inputOptions", "showRefreshButton", "showSubmitButton", "showEditButton", "error", "lines", "modalEdition", "value"], outputs: ["submit", "refresh"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }] });
TapVariableToggleComponent = __decorate([
MonitoringAppGenComponent({
constraints: {
isArray: 'NO',
isNumber: 'YES',
},
events: [
{
name: 'submit',
dataType: 'boolean',
},
],
}),
__metadata("design:paramtypes", [ChangeDetectorRef])
], TapVariableToggleComponent);
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableToggleComponent, decorators: [{
type: Component,
args: [{ selector: 'tap-variable-toggle', template: "<tap-value-editor-container #ctx [variable]=\"variable\" [lines]=\"lines\">\n <ion-chip\n [color]=\"chip?.color\"\n [outline]=\"chip?.outline\"\n (click)=\"switchToggle()\"\n [disabled]=\"!editable || (ctx.loadingChange | async)\"\n >\n <span class=\"spanToggle\"> {{ textOnLeft }} </span>\n <ion-toggle\n [color]=\"toggleColor\"\n #toggle\n [disabled]=\"!editable || (ctx.loadingChange | async)\"\n style=\"pointer-events: none\"\n (ionChange)=\"onValueChange($event)\"\n ></ion-toggle>\n <span class=\"spanToggle\"> {{ textOnRight }} </span>\n </ion-chip>\n</tap-value-editor-container>\n", styles: [".toggle-icon{font-size:5em}\n"] }]
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { toggle: [{
type: ViewChild,
args: ['toggle']
}], ctx: [{
type: ViewChild,
args: ['ctx']
}], textOnLeft: [{
type: Input
}], textOnRight: [{
type: Input
}], lines: [{
type: Input
}], toggleColor: [{
type: Input
}], variable: [{
type: Input
}], editable: [{
type: Input
}], valueOn: [{
type: Input
}], valueOff: [{
type: Input
}], chip: [{
type: Input
}] } });
let TapVariableGpioValueComponent = class TapVariableGpioValueComponent {
constructor() { }
};
/** @nocollapse */ TapVariableGpioValueComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableGpioValueComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ TapVariableGpioValueComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TapVariableGpioValueComponent, selector: "tap-variable-gpio-value", inputs: { variable: "variable", editable: "editable" }, ngImport: i0, template: "<tap-variable-toggle [variable]=\"variable\" [editable]=\"editable\">\n</tap-variable-toggle>\n", styles: [""], dependencies: [{ kind: "component", type: TapVariableToggleComponent, selector: "tap-variable-toggle", inputs: ["textOnLeft", "textOnRight", "lines", "toggleColor", "variable", "editable", "valueOn", "valueOff", "chip"] }] });
TapVariableGpioValueComponent = __decorate([
MonitoringAppGenComponent({
constraints: {
isArray: 'NO',
isNumber: 'YES',
},
events: [
{
name: 'submit',
dataType: 'number',
},
],
}),
__metadata("design:paramtypes", [])
], TapVariableGpioValueComponent);
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableGpioValueComponent, decorators: [{
type: Component,
args: [{ selector: 'tap-variable-gpio-value', template: "<tap-variable-toggle [variable]=\"variable\" [editable]=\"editable\">\n</tap-variable-toggle>\n" }]
}], ctorParameters: function () { return []; }, propDecorators: { variable: [{
type: Input
}], editable: [{
type: Input
}] } });
class TapVariableToggleModule {
}
/** @nocollapse */ TapVariableToggleModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableToggleModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ TapVariableToggleModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: TapVariableToggleModule, declarations: [TapVariableToggleComponent], imports: [CommonModule, IonicModule, TapValueEditorContainerModule], exports: [TapVariableToggleComponent] });
/** @nocollapse */ TapVariableToggleModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableToggleModule, imports: [CommonModule, IonicModule, TapValueEditorContainerModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableToggleModule, decorators: [{
type: NgModule,
args: [{
declarations: [TapVariableToggleComponent],
exports: [TapVariableToggleComponent],
imports: [CommonModule, IonicModule, TapValueEditorContainerModule],
}]
}] });
class TapVariableGpioValueModule {
}
/** @nocollapse */ TapVariableGpioValueModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableGpioValueModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ TapVariableGpioValueModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: TapVariableGpioValueModule, declarations: [TapVariableGpioValueComponent], imports: [CommonModule, IonicModule, TapVariableToggleModule], exports: [TapVariableGpioValueComponent] });
/** @nocollapse */ TapVariableGpioValueModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableGpioValueModule, imports: [CommonModule, IonicModule, TapVariableToggleModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableGpioValueModule, decorators: [{
type: NgModule,
args: [{
declarations: [TapVariableGpioValueComponent],
exports: [TapVariableGpioValueComponent],
imports: [CommonModule, IonicModule, TapVariableToggleModule],
}]
}] });
let TapVariableHeatMapChartComponent = class TapVariableHeatMapChartComponent extends HeatMapComponent {
set label(indexOrArray) {
this.chartModel.initLabel(indexOrArray);
}
set variable(variableOrArray) {
this.inputStream = this.chartModel.initVariable(variableOrArray);
}
set inputStream(inputs) {
this.subscription = this.chartModel
.defineInputStreamMulti(inputs, this.history, this.valueCountLimit)
.subscribe((result) => {
result.map((e) => {
e.series.map((v) => {
if (typeof v.value === 'number' && v.value > this.maxValue) {
this.maxValue = v.value;
}
});
});
this.heatChart.max = this.maxValue;
this.chartHeight = result[0].series.length * 50;
if (this.chartHeight <= 100) {
this.chartHeight = 100;
}
this.results = result;
});
}
constructor(myChartElement, zone, platformId, cd) {
super(myChartElement, zone, cd, platformId);
this.colorScheme = {
domain: [
'#e0f7fa',
'#b2ebf2',
'#80deea',
'#4dd0e1',
'#26c6da',
'#00bcd4',
'#00acc1',
'#0097a7',
'#00838f',
'#006064',
],
};
this.showExportButton = false;
this.yAxis = true;
this.showYAxisLabel = true;
this.xAxis = true;
this.showXAxisLabel = false;
this.legend = true;
this.legendPosition = LegendPosition.Below;
this.valueCountLimit = 15;
this.history = false;
this.xAxisTickFormatting = this.defaultDateTickFormatting.bind(this);
this.chartHeight = 100;
this.maxValue = 1;
this.results = [
{
name: '---',
series: [
{
name: '---',
value: 0,
extra: 0,
},
],
},
];
this.chartModel = new ChartDataModel();
}
createExportedData() {
return dataWithSeriesToCsv(this.results);
}
ngAfterContentChecked() {
this.cd.detectChanges();
}
defaultDateTickFormatting(val) {
if (val instanceof Date) {
return val.toLocaleTimeString();
}
return val;
}
ngOnDestroy() {
var _a;
(_a = this.subscription) === null || _a === void 0 ? void 0 : _a.unsubscribe();
this.chartModel.destroyCurrentSub();
}
onSelect(event) {
/* Not implemented
this.chartModel.showDetail(event, this.modalController, TapVariableDataPopupComponent);
*/
}
};
/** @nocollapse */ TapVariableHeatMapChartComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableHeatMapChartComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: PLATFORM_ID }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ TapVariableHeatMapChartComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TapVariableHeatMapChartComponent, selector: "tap-variable-heat-map-chart", inputs: { colorScheme: "colorScheme", showExportButton: "showExportButton", exportedFileName: "exportedFileName", yAxis: "yAxis", showYAxisLabel: "showYAxisLabel", xAxis: "xAxis", showXAxisLabel: "showXAxisLabel", legend: "legend", legendPosition: "legendPosition", valueCountLimit: "valueCountLimit", history: "history", label: "label", xAxisTickFormatting: "xAxisTickFormatting", variable: "variable", inputStream: "inputStream" }, viewQueries: [{ propertyName: "heatChart", first: true, predicate: HeatMapComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div\n style=\"position: relative\"\n #containerRef\n [style.height.px]=\"chartHeight\"\n [ngClass]=\"legendPosition === 'below' ? 'belowLegend' : 'rightLegend'\"\n>\n <ngx-charts-heat-map\n [view]=\"[containerRef.offsetWidth, containerRef.offsetHeight]\"\n [scheme]=\"colorScheme\"\n [animations]=\"false\"\n [legend]=\"legend\"\n [legendPosition]=\"legendPosition\"\n [xAxis]=\"xAxis\"\n [yAxis]=\"yAxis\"\n [showXAxisLabel]=\"false\"\n [showYAxisLabel]=\"false\"\n [innerPadding]=\"[1.5, 1, 1, 1]\"\n [results]=\"results\"\n [xAxisTickFormatting]=\"xAxisTickFormatting\"\n (select)=\"onSelect($event)\"\n >\n </ngx-charts-heat-map>\n <ion-fab-button\n id=\"exportFabButton\"\n size=\"small\"\n tapExportData\n [dataToExport]=\"createExportedData.bind(this)\"\n [exportedFileName]=\"exportedFileName\"\n *ngIf=\"showExportButton\"\n >\n <ion-icon name=\"download\"></ion-icon>\n </ion-fab-button>\n</div>\n", styles: ["::ng-deep .scale-legend{padding:20px!important}::ng-deep .horizontal-legend{overflow:auto!important}.belowLegend{width:100%;margin-bottom:100px}.rightLegend{width:100%}#exportFabButton{position:absolute;top:10px;right:10px}@media (prefers-color-scheme: dark){::ng-deep span.legend-label-text{color:#ccc!important}::ng-deep span.legend-label-text:hover{color:#fff!important}::ng-deep .ngx-charts text{fill:#fff!important}}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.HeatMapComponent, selector: "ngx-charts-heat-map", inputs: ["legend", "legendTitle", "legendPosition", "xAxis", "yAxis", "showXAxisLabel", "showYAxisLabel", "xAxisLabel", "yAxisLabel", "gradient", "innerPadding", "trimXAxisTicks", "trimYAxisTicks", "rotateXAxisTicks", "maxXAxisTickLength", "maxYAxisTickLength", "xAxisTickFormatting", "yAxisTickFormatting", "xAxisTicks", "yAxisTicks", "tooltipDisabled", "tooltipText", "min", "max", "activeEntries", "wrapTicks"], outputs: ["activate", "deactivate"] }, { kind: "directive", type: ExportDataDirective, selector: "[tapExportData]", inputs: ["exportedFileName", "dataToExport", "format"], outputs: ["exportDataError"] }, { kind: "component", type: i1$1.IonFabButton, selector: "ion-fab-button", inputs: ["activated", "closeIcon", "color", "disabled", "download", "href", "mode", "rel", "routerAnimation", "routerDirection", "show", "size", "target", "translucent", "type"] }, { kind: "component", type: i1$1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }] });
TapVariableHeatMapChartComponent = __decorate([
MonitoringAppGenComponent({}),
__metadata("design:paramtypes", [ElementRef,
NgZone, String, ChangeDetectorRef])
], TapVariableHeatMapChartComponent);
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableHeatMapChartComponent, decorators: [{
type: Component,
args: [{ selector: 'tap-variable-heat-map-chart', template: "<div\n style=\"position: relative\"\n #containerRef\n [style.height.px]=\"chartHeight\"\n [ngClass]=\"legendPosition === 'below' ? 'belowLegend' : 'rightLegend'\"\n>\n <ngx-charts-heat-map\n [view]=\"[containerRef.offsetWidth, containerRef.offsetHeight]\"\n [scheme]=\"colorScheme\"\n [animations]=\"false\"\n [legend]=\"legend\"\n [legendPosition]=\"legendPosition\"\n [xAxis]=\"xAxis\"\n [yAxis]=\"yAxis\"\n [showXAxisLabel]=\"false\"\n [showYAxisLabel]=\"false\"\n [innerPadding]=\"[1.5, 1, 1, 1]\"\n [results]=\"results\"\n [xAxisTickFormatting]=\"xAxisTickFormatting\"\n (select)=\"onSelect($event)\"\n >\n </ngx-charts-heat-map>\n <ion-fab-button\n id=\"exportFabButton\"\n size=\"small\"\n tapExportData\n [dataToExport]=\"createExportedData.bind(this)\"\n [exportedFileName]=\"exportedFileName\"\n *ngIf=\"showExportButton\"\n >\n <ion-icon name=\"download\"></ion-icon>\n </ion-fab-button>\n</div>\n", styles: ["::ng-deep .scale-legend{padding:20px!important}::ng-deep .horizontal-legend{overflow:auto!important}.belowLegend{width:100%;margin-bottom:100px}.rightLegend{width:100%}#exportFabButton{position:absolute;top:10px;right:10px}@media (prefers-color-scheme: dark){::ng-deep span.legend-label-text{color:#ccc!important}::ng-deep span.legend-label-text:hover{color:#fff!important}::ng-deep .ngx-charts text{fill:#fff!important}}\n"] }]
}], ctorParameters: function () {
return [{ type: i0.ElementRef }, { type: i0.NgZone }, { type: undefined, decorators: [{
type: Inject,
args: [PLATFORM_ID]
}] }, { type: i0.ChangeDetectorRef }];
}, propDecorators: { heatChart: [{
type: ViewChild,
args: [HeatMapComponent]
}], colorScheme: [{
type: Input
}], showExportButton: [{
type: Input
}], exportedFileName: [{
type: Input
}], yAxis: [{
type: Input
}], showYAxisLabel: [{
type: Input
}], xAxis: [{
type: Input
}], showXAxisLabel: [{
type: Input
}], legend: [{
type: Input
}], legendPosition: [{
type: Input
}], valueCountLimit: [{
type: Input
}], history: [{
type: Input
}], label: [{
type: Input
}], xAxisTickFormatting: [{
type: Input
}], variable: [{
type: Input
}], inputStream: [{
type: Input
}] } });
class TapVariableHeatMapChartModule {
}
/** @nocollapse */ TapVariableHeatMapChartModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableHeatMapChartModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ TapVariableHeatMapChartModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: TapVariableHeatMapChartModule, declarations: [TapVariableHeatMapChartComponent], imports: [CommonModule, NgxChartsModule, ExportDataModule, IonicModule], exports: [TapVariableHeatMapChartComponent] });
/** @nocollapse */ TapVariableHeatMapChartModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableHeatMapChartModule, imports: [CommonModule, NgxChartsModule, ExportDataModule, IonicModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableHeatMapChartModule, decorators: [{
type: NgModule,
args: [{
declarations: [TapVariableHeatMapChartComponent],
exports: [TapVariableHeatMapChartComponent],
imports: [CommonModule, NgxChartsModule, ExportDataModule, IonicModule],
}]
}] });
const CURVES = {
Basis: shape.curveBasis,
BasisClosed: shape.curveBasisClosed,
Bundle: shape.curveBundle.beta(1),
Cardinal: shape.curveCardinal,
CardinalClosed: shape.curveCardinalClosed,
CatmullRom: shape.curveCatmullRom,
CatmullRomClosed: shape.curveCatmullRomClosed,
Linear: shape.curveLinear,
Linear_Closed: shape.curveLinearClosed,
MonotoneX: shape.curveMonotoneX,
MonotoneY: shape.curveMonotoneY,
Natural: shape.curveNatural,
Step: shape.curveStep,
Step_After: shape.curveStepAfter,
Step_Before: shape.curveStepBefore,
Default: shape.curveLinear,
};
const DEFAULT_VALUE_COUNT_LIMIT = 30;
let TapVariableLineChartComponent = class TapVariableLineChartComponent extends LineChartComponent {
/**
* @deprecated use
*/
set linearCurve(curve) {
this.predefinedCurve = curve;
}
set predefinedCurve(curveFctOrId) {
if (Object.keys(CURVES).includes(curveFctOrId)) {
this._curve = CURVES[curveFctOrId];
}
else {
this._curve = CURVES.Default;
}
}
/**
* CHARTS OPTIONS
*/
/**
* @deprecated use legend instead
*/
set showLegend(v) {
this.legend = v;
}
set history(enable) {
this._history.next(enable);
}
set valueCountLimit(limit) {
if (limit === undefined) {
limit = DEFAULT_VALUE_COUNT_LIMIT;
}
this._valueCountLimit.next(limit);
}
set label(indexOrArray) {
this.chartModel.initLabel(indexOrArray);
}
set variable(variableOrArray) {
this.multiple = !!Array.isArray(variableOrArray);
this.input = this.chartModel.initVariable(variableOrArray);
}
set input(inputs) {
this._input.next(inputs);
}
set data(results) {
var _a;
// TODO | ChartInputSingle[]
if (typeof results === 'number' || typeof results === 'string') {
if (!((_a = this.results) === null || _a === void 0 ? void 0 : _a[0])) {
this.results = [
{
name: 'Value',
series: [],
},
];
}
this.results[0].series.push({
name: new Date(),
value: results,
extra: results,
});
}
else if (results) {
if (!Array.isArray(results)) {
const result = results;
const existingSerieIndex = this.results.findIndex((r) => result.name);
if (existingSerieIndex >= 0) {
this.results[existingSerieIndex] = result;
}
else {
this.results.push(result);
}
}
else {
this.results = results;
}
}
}
ngOnInit() {
combineLatest([this._valueCountLimit, this._input, this._history])
.pipe(takeUntil(this.destroyed))
.subscribe(([valueCountLimit, input, history]) => {
this.chartModel.destroyCurrentSub();
if (this.multiple) {
this.subscription = this.chartModel
.defineMultiInputStream(input)
.subscribe((result) => {
this.results = result;
});
}
else if (history && !this.multiple) {
this.subscription = this.chartModel
.defineInputStreamHistoryMultiLegend(input, valueCountLimit)
.subscribe((result) => {
this.results = result;
});
}
else if (!this.multiple) {
this.subscription = this.chartModel
.defineInputStreamMulti(input, false, valueCountLimit)
.subscribe((result) => {
this.results = result;
});
}
});
}
constructor(myChartElement, zone, cd, platformId, alertController) {
super(myChartElement, zone, cd, platformId);
this.alertController = alertController;
this._curve = CURVES.Default;
this.legendTitle = '';
/**
* @deprecated use showLegend instead
*/
this.legend = true;
this.legendPosition = LegendPosition.Below;
this.xAxis = true;
this.showXAxisLabel = false;
this.xAxisLabel = '';
this.yAxis = true;
this.showYAxisLabel = false;
this.yAxisLabel = '';
this.yScaleMin = 0;
this.showExportButton = false;
this.xAxisTickFormatting = this.defaultDateTickFormatting.bind(this);
this.colorScheme = {
domain: [
'#5DADE2',
'#9B59B6',
'#F39C12',
'#5AA454',
'#A10A28',
'#C7B42C',
'#AAAAAA',
],
};
this._history = new BehaviorSubject(true);
this._valueCountLimit = new BehaviorSubject(30);
this._input = new BehaviorSubject([]);
this.destroyed = new Subject();
this.results = [
{
name: 'Value',
series: [],
},
];
this.chartModel = new ChartDataModel();
}
createExportedData() {
return dataWithSeriesToCsv(this.results);
}
defaultDateTickFormatting(val) {
if (val instanceof Date) {
return val.toLocaleTimeString();
}
return val;
}
onSelect(event) {
/* Not implemented
this.chartModel.showDetail(event, this.modalController, TapVariableDataPopupComponent);
*/
}
ngOnDestroy() {
var _a;
(_a = this.subscription) === null || _a === void 0 ? void 0 : _a.unsubscribe();
this.chartModel.destroyCurrentSub();
this.destroyed.next();
}
};
/** @nocollapse */ TapVariableLineChartComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableLineChartComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: PLATFORM_ID }, { token: i1$1.AlertController }], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ TapVariableLineChartComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TapVariableLineChartComponent, selector: "tap-variable-line-chart", inputs: { linearCurve: "linearCurve", predefinedCurve: "predefinedCurve", legendTitle: "legendTitle", legend: "legend", showLegend: "showLegend", legendPosition: "legendPosition", xAxis: "xAxis", showXAxisLabel: "showXAxisLabel", xAxisLabel: "xAxisLabel", yAxis: "yAxis", showYAxisLabel: "showYAxisLabel", yAxisLabel: "yAxisLabel", yScaleMin: "yScaleMin", showExportButton: "showExportButton", exportedFileName: "exportedFileName", history: "history", valueCountLimit: "valueCountLimit", xAxisTickFormatting: "xAxisTickFormatting", label: "label", colorScheme: "colorScheme", variable: "variable", input: "input", data: "data" }, viewQueries: [{ propertyName: "lineChart", first: true, predicate: LineChartComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div\n style=\"position: relative\"\n #containerRef\n class=\"chart-container\"\n [ngClass]=\"\n legendPosition === 'below' && legend ? 'belowLegend' : 'rightLegend'\n \"\n>\n <ngx-charts-line-chart\n [view]=\"[containerRef.offsetWidth, containerRef.offsetHeight]\"\n [scheme]=\"colorScheme\"\n [results]=\"results\"\n [gradient]=\"gradient\"\n [legendPosition]=\"legendPosition\"\n [xAxis]=\"xAxis\"\n [yAxis]=\"yAxis\"\n [legendTitle]=\"legendTitle\"\n [legend]=\"legend\"\n [showXAxisLabel]=\"showXAxisLabel\"\n [showYAxisLabel]=\"showYAxisLabel\"\n [timeline]=\"timeline\"\n [yAxisLabel]=\"yAxisLabel\"\n [xAxisLabel]=\"xAxisLabel\"\n [xAxisTickFormatting]=\"xAxisTickFormatting\"\n [curve]=\"_curve\"\n [autoScale]=\"autoScale\"\n [xScaleMin]=\"xScaleMin\"\n [xScaleMax]=\"xScaleMax\"\n [yScaleMin]=\"yScaleMin\"\n [yScaleMax]=\"yScaleMax\"\n [showGridLines]=\"showGridLines\"\n [animations]=\"animations\"\n [trimXAxisTicks]=\"trimXAxisTicks\"\n [maxXAxisTickLength]=\"maxXAxisTickLength\"\n [trimYAxisTicks]=\"trimYAxisTicks\"\n [maxYAxisTickLength]=\"maxYAxisTickLength\"\n [rangeFillOpacity]=\"rangeFillOpacity\"\n [roundDomains]=\"roundDomains\"\n [showRefLines]=\"showRefLines\"\n [showRefLabels]=\"showRefLabels\"\n [referenceLines]=\"referenceLines\"\n (select)=\"onSelect($event)\"\n >\n </ngx-charts-line-chart>\n <ion-fab-button\n id=\"exportFabButton\"\n size=\"small\"\n tapExportData\n [dataToExport]=\"createExportedData.bind(this)\"\n [exportedFileName]=\"exportedFileName\"\n *ngIf=\"showExportButton\"\n >\n <ion-icon name=\"download\"></ion-icon>\n </ion-fab-button>\n</div>\n", styles: ["::ng-deep .horizontal-legend{overflow:auto!important}.belowLegend{height:50vh;width:100%;margin-bottom:100px}.rightLegend{height:50vh;width:100%}#exportFabButton{position:absolute;top:10px;right:10px}@media (prefers-color-scheme: dark){::ng-deep span.legend-label-text{color:#ccc!important}::ng-deep span.legend-label-text:hover{color:#fff!important}::ng-deep .ngx-charts text{fill:#fff!important}::ng-deep .ngx-charts .tooltip-anchor{fill:var(--ion-color-primary)!important}}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.LineChartComponent, selector: "ngx-charts-line-chart", inputs: ["legend", "legendTitle", "legendPosition", "xAxis", "yAxis", "showXAxisLabel", "showYAxisLabel", "xAxisLabel", "yAxisLabel", "autoScale", "timeline", "gradient", "showGridLines", "curve", "activeEntries", "schemeType", "rangeFillOpacity", "trimXAxisTicks", "trimYAxisTicks", "rotateXAxisTicks", "maxXAxisTickLength", "maxYAxisTickLength", "xAxisTickFormatting", "yAxisTickFormatting", "xAxisTicks", "yAxisTicks", "roundDomains", "tooltipDisabled", "showRefLines", "referenceLines", "showRefLabels", "xScaleMin", "xScaleMax", "yScaleMin", "yScaleMax", "wrapTicks"], outputs: ["activate", "deactivate"] }, { kind: "component", type: i1$1.IonFabButton, selector: "ion-fab-button", inputs: ["activated", "closeIcon", "color", "disabled", "download", "href", "mode", "rel", "routerAnimation", "routerDirection", "show", "size", "target", "translucent", "type"] }, { kind: "component", type: i1$1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "directive", type: ExportDataDirective, selector: "[tapExportData]", inputs: ["exportedFileName", "dataToExport", "format"], outputs: ["exportDataError"] }] });
TapVariableLineChartComponent = __decorate([
MonitoringAppGenComponent({
constraints: {
isNumber: 'YES',
},
}),
__metadata("design:paramtypes", [ElementRef,
NgZone,
ChangeDetectorRef, String, AlertController])
], TapVariableLineChartComponent);
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableLineChartComponent, decorators: [{
type: Component,
args: [{ selector: 'tap-variable-line-chart', template: "<div\n style=\"position: relative\"\n #containerRef\n class=\"chart-container\"\n [ngClass]=\"\n legendPosition === 'below' && legend ? 'belowLegend' : 'rightLegend'\n \"\n>\n <ngx-charts-line-chart\n [view]=\"[containerRef.offsetWidth, containerRef.offsetHeight]\"\n [scheme]=\"colorScheme\"\n [results]=\"results\"\n [gradient]=\"gradient\"\n [legendPosition]=\"legendPosition\"\n [xAxis]=\"xAxis\"\n [yAxis]=\"yAxis\"\n [legendTitle]=\"legendTitle\"\n [legend]=\"legend\"\n [showXAxisLabel]=\"showXAxisLabel\"\n [showYAxisLabel]=\"showYAxisLabel\"\n [timeline]=\"timeline\"\n [yAxisLabel]=\"yAxisLabel\"\n [xAxisLabel]=\"xAxisLabel\"\n [xAxisTickFormatting]=\"xAxisTickFormatting\"\n [curve]=\"_curve\"\n [autoScale]=\"autoScale\"\n [xScaleMin]=\"xScaleMin\"\n [xScaleMax]=\"xScaleMax\"\n [yScaleMin]=\"yScaleMin\"\n [yScaleMax]=\"yScaleMax\"\n [showGridLines]=\"showGridLines\"\n [animations]=\"animations\"\n [trimXAxisTicks]=\"trimXAxisTicks\"\n [maxXAxisTickLength]=\"maxXAxisTickLength\"\n [trimYAxisTicks]=\"trimYAxisTicks\"\n [maxYAxisTickLength]=\"maxYAxisTickLength\"\n [rangeFillOpacity]=\"rangeFillOpacity\"\n [roundDomains]=\"roundDomains\"\n [showRefLines]=\"showRefLines\"\n [showRefLabels]=\"showRefLabels\"\n [referenceLines]=\"referenceLines\"\n (select)=\"onSelect($event)\"\n >\n </ngx-charts-line-chart>\n <ion-fab-button\n id=\"exportFabButton\"\n size=\"small\"\n tapExportData\n [dataToExport]=\"createExportedData.bind(this)\"\n [exportedFileName]=\"exportedFileName\"\n *ngIf=\"showExportButton\"\n >\n <ion-icon name=\"download\"></ion-icon>\n </ion-fab-button>\n</div>\n", styles: ["::ng-deep .horizontal-legend{overflow:auto!important}.belowLegend{height:50vh;width:100%;margin-bottom:100px}.rightLegend{height:50vh;width:100%}#exportFabButton{position:absolute;top:10px;right:10px}@media (prefers-color-scheme: dark){::ng-deep span.legend-label-text{color:#ccc!important}::ng-deep span.legend-label-text:hover{color:#fff!important}::ng-deep .ngx-charts text{fill:#fff!important}::ng-deep .ngx-charts .tooltip-anchor{fill:var(--ion-color-primary)!important}}\n"] }]
}], ctorParameters: function () {
return [{ type: i0.ElementRef }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
type: Inject,
args: [PLATFORM_ID]
}] }, { type: i1$1.AlertController }];
}, propDecorators: { lineChart: [{
type: ViewChild,
args: [LineChartComponent]
}], linearCurve: [{
type: Input
}], predefinedCurve: [{
type: Input
}], legendTitle: [{
type: Input
}], legend: [{
type: Input
}], showLegend: [{
type: Input
}], legendPosition: [{
type: Input
}], xAxis: [{
type: Input
}], showXAxisLabel: [{
type: Input
}], xAxisLabel: [{
type: Input
}], yAxis: [{
type: Input
}], showYAxisLabel: [{
type: Input
}], yAxisLabel: [{
type: Input
}], yScaleMin: [{
type: Input
}], showExportButton: [{
type: Input
}], exportedFileName: [{
type: Input
}], history: [{
type: Input
}], valueCountLimit: [{
type: Input
}], xAxisTickFormatting: [{
type: Input
}], label: [{
type: Input
}], colorScheme: [{
type: Input
}], variable: [{
type: Input
}], input: [{
type: Input
}], data: [{
type: Input
}] } });
class TapVariableLineChartModule {
}
/** @nocollapse */ TapVariableLineChartModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableLineChartModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ TapVariableLineChartModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: TapVariableLineChartModule, declarations: [TapVariableLineChartComponent], imports: [CommonModule, NgxChartsModule, IonicModule, ExportDataModule], exports: [TapVariableLineChartComponent] });
/** @nocollapse */ TapVariableLineChartModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableLineChartModule, imports: [CommonModule, NgxChartsModule, IonicModule, ExportDataModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableLineChartModule, decorators: [{
type: NgModule,
args: [{
declarations: [TapVariableLineChartComponent],
exports: [TapVariableLineChartComponent],
imports: [CommonModule, NgxChartsModule, IonicModule, ExportDataModule],
}]
}] });
let TapVariableLinearGaugeComponent = class TapVariableLinearGaugeComponent {
constructor() {
this.dataValue = 0;
this.dataPercent = 0;
this.destroyed = new Subject();
this.min = 0;
this.max = 100;
this.color = 'primary';
this.textColor = 'dark';
this.reversed = false;
}
/**
* @deprecated use unit instead
*/
set units(v) {
this.unit = v;
}
set value(v) {
if (v === undefined || v === null) {
v = 0;
}
if (typeof v === 'string') {
v = parseInt(v, 10);
if (isNaN(v)) {
v = 0;
}
}
if (typeof v !== 'number') {
console.warn(`TapVariableLinearGauge: Invalid value type: ${typeof v}`, v);
}
this.setValue(v);
}
/**
* @deprecated use [value]="..." instead
*/
set variable(variable) {
this._variable = variable;
if (variable) {
this.inputStream = variable.values;
}
}
/**
* @deprecated use [value]="..." instead
*/
set inputStream(inputs) {
inputs.pipe(takeUntil(this.destroyed)).subscribe((value) => {
this.setValue(value);
});
}
setValue(value) {
if (this.min === null) {
this.min = 0;
}
if (this.max == null) {
this.max = 100;
}
if (typeof value === 'string') {
value = parseInt(value);
}
if (typeof value !== 'number') {
value = this.min;
}
this.dataValue = value;
if (value <= this.min) {
this.min = value;
this.dataPercent = 0;
}
else if (value >= this.max) {
this.dataPercent = 1;
this.max = value;
}
else {
this.dataPercent = (value - this.min) / (this.max - this.min);
}
}
ngOnDestroy() {
this.destroyed.next();
}
};
/** @nocollapse */ TapVariableLinearGaugeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableLinearGaugeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ TapVariableLinearGaugeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TapVariableLinearGaugeComponent, selector: "tap-variable-linear-gauge", inputs: { unit: "unit", digitsInfo: "digitsInfo", units: "units", min: "min", max: "max", color: "color", textColor: "textColor", reversed: "reversed", value: "value", variable: "variable", inputStream: "inputStream" }, ngImport: i0, template: "<div id=\"divBloc\">\n <ion-label id=\"labelValue\" [color]=\"textColor\"\n >{{ dataValue | number: digitsInfo }}\n <span *ngIf=\"unit\">{{ unit }}</span></ion-label\n >\n <ion-label id=\"labelMin\">\n {{ reversed ? max : min }}\n </ion-label>\n <ion-label id=\"labelMax\">\n {{ reversed ? min : max }}\n </ion-label>\n <ion-progress-bar\n id=\"progressBar\"\n [reversed]=\"reversed\"\n [color]=\"color\"\n [value]=\"dataPercent\"\n ></ion-progress-bar>\n</div>\n", styles: ["#divBloc{width:100%;position:relative;text-align:center;padding:10px 10px 20px}#labelValue{margin:5px;font-size:2em}#labelMin{left:10px;top:20px;position:absolute}#progressBar{box-shadow:#3c40434d 0 1px 2px,#3c404326 0 2px 6px 2px;border-radius:5px}#labelMax{position:absolute;top:20px;right:10px}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1$1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i1$1.IonProgressBar, selector: "ion-progress-bar", inputs: ["buffer", "color", "mode", "reversed", "type", "value"] }, { kind: "pipe", type: i2.DecimalPipe, name: "number" }] });
TapVariableLinearGaugeComponent = __decorate([
MonitoringAppGenComponent({
constraints: {
isNumber: 'YES',
},
})
], TapVariableLinearGaugeComponent);
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableLinearGaugeComponent, decorators: [{
type: Component,
args: [{ selector: 'tap-variable-linear-gauge', template: "<div id=\"divBloc\">\n <ion-label id=\"labelValue\" [color]=\"textColor\"\n >{{ dataValue | number: digitsInfo }}\n <span *ngIf=\"unit\">{{ unit }}</span></ion-label\n >\n <ion-label id=\"labelMin\">\n {{ reversed ? max : min }}\n </ion-label>\n <ion-label id=\"labelMax\">\n {{ reversed ? min : max }}\n </ion-label>\n <ion-progress-bar\n id=\"progressBar\"\n [reversed]=\"reversed\"\n [color]=\"color\"\n [value]=\"dataPercent\"\n ></ion-progress-bar>\n</div>\n", styles: ["#divBloc{width:100%;position:relative;text-align:center;padding:10px 10px 20px}#labelValue{margin:5px;font-size:2em}#labelMin{left:10px;top:20px;position:absolute}#progressBar{box-shadow:#3c40434d 0 1px 2px,#3c404326 0 2px 6px 2px;border-radius:5px}#labelMax{position:absolute;top:20px;right:10px}\n"] }]
}], propDecorators: { unit: [{
type: Input
}], digitsInfo: [{
type: Input
}], units: [{
type: Input
}], min: [{
type: Input
}], max: [{
type: Input
}], color: [{
type: Input
}], textColor: [{
type: Input
}], reversed: [{
type: Input
}], value: [{
type: Input
}], variable: [{
type: Input
}], inputStream: [{
type: Input
}] } });
class TapVariableLinearGaugeModule {
}
/** @nocollapse */ TapVariableLinearGaugeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableLinearGaugeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ TapVariableLinearGaugeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: TapVariableLinearGaugeModule, declarations: [TapVariableLinearGaugeComponent], imports: [CommonModule, IonicModule], exports: [TapVariableLinearGaugeComponent] });
/** @nocollapse */ TapVariableLinearGaugeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableLinearGaugeModule, providers: [DecimalPipe], imports: [CommonModule, IonicModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableLinearGaugeModule, decorators: [{
type: NgModule,
args: [{
exports: [TapVariableLinearGaugeComponent],
declarations: [TapVariableLinearGaugeComponent],
providers: [DecimalPipe],
imports: [CommonModule, IonicModule],
}]
}] });
/**
* @deprecated it will probably be removed as it's not very usefull
*/
let TapVariableNumberChartComponent = class TapVariableNumberChartComponent extends NumberCardComponent {
set label(indexOrArray) {
this.chartModel.initLabel(indexOrArray);
}
set variable(variableOrArray) {
this.input = this.chartModel.initVariable(variableOrArray);
}
set input(inputs) {
this.subscription = this.chartModel
.defineInputStreamSingle(inputs, false, 0)
.subscribe((result) => {
let index = 0;
for (const item of result) {
if (!this.results[index]) {
if (item.value !== this.results[index].value) {
this.results = result;
}
}
else {
this.results = result;
}
index++;
}
this.resizeComponent();
this.loaded = true;
});
}
constructor(myChartElement, zone, cd, platformId, modalController) {
super(myChartElement, zone, cd, platformId);
this.modalController = modalController;
this.showDetails = false;
this.cardColor = '#232837';
this.showExportButton = false;
this.colorScheme = {
domain: [
'#5AA454',
'#E44D25',
'#CFC0BB',
'#7aa3e5',
'#a8385d',
'#aae3f5',
'#5DADE2',
'#9B59B6',
'#F39C12',
'#5AA454',
'#A10A28',
'#C7B42C',
'#AAAAAA',
],
};
this.results = [
{
name: '---',
value: 0,
extra: 0,
},
];
this.loaded = false;
this.chartModel = new ChartDataModel();
}
onSelect(event) {
if (typeof event === 'object') {
if (this.showDetails) {
this.chartModel
.showDetail(event, this.modalController, TapVariableDataPopupComponent)
.catch((err) => {
console.warn('Failed to show value detail', err);
});
}
}
}
ngAfterViewInit() {
this.innerWidth = window.innerWidth;
this.resizeComponent();
}
resizeComponent() {
if (this.innerWidth <= 400) {
this.innerWidth = 400;
}
this.innerHeight = (150 * this.results.length) / (this.innerWidth / 300);
if (this.results.length === 1) {
this.innerHeight = 150;
}
else {
if (this.innerHeight <= 210) {
this.innerHeight = 210;
}
}
this.cd.detectChanges();
}
onResize(event) {
this.innerWidth = window.innerWidth;
this.resizeComponent();
}
ngOnDestroy() {
var _a;
(_a = this.subscription) === null || _a === void 0 ? void 0 : _a.unsubscribe();
this.chartModel.destroyCurrentSub();
}
};
/** @nocollapse */ TapVariableNumberChartComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableNumberChartComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: PLATFORM_ID }, { token: i1$1.ModalController }], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ TapVariableNumberChartComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TapVariableNumberChartComponent, selector: "tap-variable-number-chart", inputs: { showDetails: "showDetails", cardColor: "cardColor", showExportButton: "showExportButton", exportedFileName: "exportedFileName", label: "label", colorScheme: "colorScheme", variable: "variable", input: "input" }, host: { listeners: { "window:resize": "onResize($event)" } }, usesInheritance: true, ngImport: i0, template: "<div #containerRef style=\"width: 100%; overflow: auto; position: relative\">\n <ngx-charts-number-card\n #charts\n [view]=\"[containerRef.offsetWidth, innerHeight]\"\n [scheme]=\"colorScheme\"\n [results]=\"results\"\n [cardColor]=\"cardColor\"\n (select)=\"onSelect($event)\"\n >\n </ngx-charts-number-card>\n <ion-fab-button\n id=\"exportFabButton\"\n size=\"small\"\n tapExportData\n *ngIf=\"showExportButton\"\n [exportedFileName]=\"exportedFileName\"\n [dataToExport]=\"results\"\n >\n <ion-icon name=\"download\"></ion-icon>\n </ion-fab-button>\n</div>\n", styles: [":host ::ng-deep rect.card{min-height:250!important;min-width:250!important;margin:500px!important}@media (prefers-color-scheme: dark){::ng-deep span.legend-label-text{color:#ccc!important}::ng-deep span.legend-label-text:hover{color:#fff!important}::ng-deep .ngx-charts text{fill:#fff!important}}#exportFabButton{position:absolute;top:10px;right:10px}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.NumberCardComponent, selector: "ngx-charts-number-card", inputs: ["cardColor", "bandColor", "emptyColor", "innerPadding", "textColor", "valueFormatting", "labelFormatting", "designatedTotal"] }, { kind: "directive", type: ExportDataDirective, selector: "[tapExportData]", inputs: ["exportedFileName", "dataToExport", "format"], outputs: ["exportDataError"] }, { kind: "component", type: i1$1.IonFabButton, selector: "ion-fab-button", inputs: ["activated", "closeIcon", "color", "disabled", "download", "href", "mode", "rel", "routerAnimation", "routerDirection", "show", "size", "target", "translucent", "type"] }, { kind: "component", type: i1$1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
TapVariableNumberChartComponent = __decorate([
MonitoringAppGenComponent({
constraints: {
isNumber: 'YES',
},
}),
__metadata("design:paramtypes", [ElementRef,
NgZone,
ChangeDetectorRef, String, ModalController])
], TapVariableNumberChartComponent);
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableNumberChartComponent, decorators: [{
type: Component,
args: [{ selector: 'tap-variable-number-chart', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div #containerRef style=\"width: 100%; overflow: auto; position: relative\">\n <ngx-charts-number-card\n #charts\n [view]=\"[containerRef.offsetWidth, innerHeight]\"\n [scheme]=\"colorScheme\"\n [results]=\"results\"\n [cardColor]=\"cardColor\"\n (select)=\"onSelect($event)\"\n >\n </ngx-charts-number-card>\n <ion-fab-button\n id=\"exportFabButton\"\n size=\"small\"\n tapExportData\n *ngIf=\"showExportButton\"\n [exportedFileName]=\"exportedFileName\"\n [dataToExport]=\"results\"\n >\n <ion-icon name=\"download\"></ion-icon>\n </ion-fab-button>\n</div>\n", styles: [":host ::ng-deep rect.card{min-height:250!important;min-width:250!important;margin:500px!important}@media (prefers-color-scheme: dark){::ng-deep span.legend-label-text{color:#ccc!important}::ng-deep span.legend-label-text:hover{color:#fff!important}::ng-deep .ngx-charts text{fill:#fff!important}}#exportFabButton{position:absolute;top:10px;right:10px}\n"] }]
}], ctorParameters: function () {
return [{ type: i0.ElementRef }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
type: Inject,
args: [PLATFORM_ID]
}] }, { type: i1$1.ModalController }];
}, propDecorators: { showDetails: [{
type: Input
}], cardColor: [{
type: Input
}], showExportButton: [{
type: Input
}], exportedFileName: [{
type: Input
}], label: [{
type: Input
}], colorScheme: [{
type: Input
}], variable: [{
type: Input
}], input: [{
type: Input
}], onResize: [{
type: HostListener,
args: ['window:resize', ['$event']]
}] } });
class TapVariableNumberChartModule {
}
/** @nocollapse */ TapVariableNumberChartModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableNumberChartModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ TapVariableNumberChartModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: TapVariableNumberChartModule, declarations: [TapVariableNumberChartComponent], imports: [CommonModule,
NgxChartsModule,
TapVariableDataPopupModule,
ExportDataModule,
IonicModule], exports: [TapVariableNumberChartComponent] });
/** @nocollapse */ TapVariableNumberChartModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableNumberChartModule, imports: [CommonModule,
NgxChartsModule,
TapVariableDataPopupModule,
ExportDataModule,
IonicModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableNumberChartModule, decorators: [{
type: NgModule,
args: [{
declarations: [TapVariableNumberChartComponent],
exports: [TapVariableNumberChartComponent],
imports: [
CommonModule,
NgxChartsModule,
TapVariableDataPopupModule,
ExportDataModule,
IonicModule,
],
}]
}] });
let TapVariableNumberComponent = class TapVariableNumberComponent extends MonitoringVariableValueComponent {
constructor() {
super(...arguments);
this.inputOptions = {
type: 'number',
};
}
set min(value) {
this.inputOptions.min = value;
}
set max(value) {
this.inputOptions.max = value;
}
set value(value) {
this._value = value;
}
};
/** @nocollapse */ TapVariableNumberComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableNumberComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ TapVariableNumberComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TapVariableNumberComponent, selector: "tap-variable-number", inputs: { min: "min", max: "max", value: "value" }, usesInheritance: true, ngImport: i0, template: "<tap-value-editor-container\n #ctx\n [variable]=\"_variable\"\n [showRefreshButton]=\"refreshable\"\n [showEditButton]=\"editable\"\n [showSubmitButton]=\"true\"\n [modalEdition]=\"modalEdition\"\n [inputOptions]=\"inputOptions\"\n [lines]=\"lines\"\n>\n <tap-inline-editor\n [forceValue]=\"forceValue\"\n [value]=\"\n ctx.pendingSubmitValue === undefined ? _value : ctx.pendingSubmitValue\n \"\n [editMode]=\"ctx.editModeChange | async\"\n (editModeChange)=\"onEditModeChange($event)\"\n [editable]=\"editable && ctx.pendingSubmitValue === undefined\"\n [fieldError]=\"fieldError\"\n [inputOptions]=\"inputOptions\"\n [unitValue]=\"unitValue\"\n [valueStyle]=\"valueStyle\"\n (valueChange)=\"onValueChange($event)\"\n (onSubmit)=\"onSubmit($event)\"\n >\n </tap-inline-editor>\n</tap-value-editor-container>\n", styles: [""], dependencies: [{ kind: "component", type: i1$3.InlineEditorComponent, selector: "tap-inline-editor", inputs: ["editMode", "editable", "unitValue", "inputOptions", "valueStyle", "value", "forceValue", "showLoader", "fieldError"], outputs: ["onSubmit", "valueChange", "editModeChange"] }, { kind: "component", type: i1$3.TapValueEditorContainerComponent, selector: "tap-value-editor-container", inputs: ["button", "variable", "inputOptions", "showRefreshButton", "showSubmitButton", "showEditButton", "error", "lines", "modalEdition", "value"], outputs: ["submit", "refresh"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }] });
TapVariableNumberComponent = __decorate([
MonitoringAppGenComponent({
constraints: {
isArray: 'NO',
isNumber: 'YES',
},
events: [
{
name: 'submit',
dataType: 'string',
},
],
})
], TapVariableNumberComponent);
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableNumberComponent, decorators: [{
type: Component,
args: [{ selector: 'tap-variable-number', template: "<tap-value-editor-container\n #ctx\n [variable]=\"_variable\"\n [showRefreshButton]=\"refreshable\"\n [showEditButton]=\"editable\"\n [showSubmitButton]=\"true\"\n [modalEdition]=\"modalEdition\"\n [inputOptions]=\"inputOptions\"\n [lines]=\"lines\"\n>\n <tap-inline-editor\n [forceValue]=\"forceValue\"\n [value]=\"\n ctx.pendingSubmitValue === undefined ? _value : ctx.pendingSubmitValue\n \"\n [editMode]=\"ctx.editModeChange | async\"\n (editModeChange)=\"onEditModeChange($event)\"\n [editable]=\"editable && ctx.pendingSubmitValue === undefined\"\n [fieldError]=\"fieldError\"\n [inputOptions]=\"inputOptions\"\n [unitValue]=\"unitValue\"\n [valueStyle]=\"valueStyle\"\n (valueChange)=\"onValueChange($event)\"\n (onSubmit)=\"onSubmit($event)\"\n >\n </tap-inline-editor>\n</tap-value-editor-container>\n" }]
}], propDecorators: { min: [{
type: Input
}], max: [{
type: Input
}], value: [{
type: Input
}] } });
class TapVariableNumberModule {
}
/** @nocollapse */ TapVariableNumberModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableNumberModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ TapVariableNumberModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: TapVariableNumberModule, declarations: [TapVariableNumberComponent], imports: [CommonModule,
IonicModule,
InlineEditorModule,
TapValueEditorContainerModule], exports: [TapVariableNumberComponent] });
/** @nocollapse */ TapVariableNumberModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableNumberModule, providers: [DecimalPipe], imports: [CommonModule,
IonicModule,
InlineEditorModule,
TapValueEditorContainerModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableNumberModule, decorators: [{
type: NgModule,
args: [{
declarations: [TapVariableNumberComponent],
exports: [TapVariableNumberComponent],
providers: [DecimalPipe],
imports: [
CommonModule,
IonicModule,
InlineEditorModule,
TapValueEditorContainerModule,
],
}]
}] });
let TapVariablePieChartAdvancedComponent = class TapVariablePieChartAdvancedComponent extends PieChartComponent {
set variable(variableOrArray) {
this.input = this.chartModel.initVariable(variableOrArray);
}
set history(enable) {
this._history.next(enable);
}
set valueCountLimit(limit) {
if (limit === undefined) {
limit = 30;
}
this._valueCountLimit.next(limit);
}
set label(indexOrArray) {
this.chartModel.initLabel(indexOrArray);
}
set input(inputs) {
this._input.next(inputs);
}
ngOnInit() {
combineLatest([this._valueCountLimit, this._input, this._history])
.pipe(takeUntil(this.destroyed))
.subscribe(([valueCountLimit, input, history]) => {
this.chartModel.destroyCurrentSub();
this.subscription = this.chartModel
.defineInputStreamSingle(input, history, valueCountLimit)
.subscribe((result) => {
this.results = result;
});
this.cd.detectChanges();
});
}
constructor(myChartElement, zone, cd, platformId, modalController) {
super(myChartElement, zone, cd, platformId);
this.modalController = modalController;
this.showDetails = false;
this.showExportButton = false;
this.colorScheme = {
domain: [
'#5DADE2',
'#9B59B6',
'#F39C12',
'#5AA454',
'#A10A28',
'#C7B42C',
'#AAAAAA',
],
};
this._history = new BehaviorSubject(true);
this._valueCountLimit = new BehaviorSubject(30);
this._input = new BehaviorSubject([]);
this.destroyed = new Subject();
this.results = [
{
name: '---',
value: 0,
extra: 0,
},
];
this.chartModel = new ChartDataModel();
}
ngAfterViewChecked() {
this.cd.detectChanges();
}
onSelect(event) {
if (typeof event === 'object') {
if (this.showDetails) {
this.chartModel
.showDetail(event, this.modalController, TapVariableDataPopupComponent)
.catch((err) => {
console.log(err);
});
}
}
}
ngOnDestroy() {
var _a;
(_a = this.subscription) === null || _a === void 0 ? void 0 : _a.unsubscribe();
this.chartModel.destroyCurrentSub();
}
};
/** @nocollapse */ TapVariablePieChartAdvancedComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariablePieChartAdvancedComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: PLATFORM_ID }, { token: i1$1.ModalController }], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ TapVariablePieChartAdvancedComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TapVariablePieChartAdvancedComponent, selector: "tap-variable-pie-chart-advanced", inputs: { showDetails: "showDetails", showExportButton: "showExportButton", exportedFileName: "exportedFileName", variable: "variable", history: "history", valueCountLimit: "valueCountLimit", label: "label", colorScheme: "colorScheme", input: "input" }, usesInheritance: true, ngImport: i0, template: "<div #containerRef style=\"width: 100%; position: relative\">\n <ngx-charts-advanced-pie-chart\n #charts\n [view]=\"[containerRef.offsetWidth, containerRef.offsetHeight]\"\n [scheme]=\"colorScheme\"\n [results]=\"results\"\n (select)=\"onSelect($event)\"\n >\n </ngx-charts-advanced-pie-chart>\n <ion-fab-button\n id=\"exportFabButton\"\n size=\"small\"\n tapExportData\n [dataToExport]=\"results\"\n [exportedFileName]=\"exportedFileName\"\n *ngIf=\"showExportButton\"\n >\n <ion-icon name=\"download\"></ion-icon>\n </ion-fab-button>\n</div>\n", styles: [".legend-items{padding-top:10px!important;padding-bottom:10px!important}#exportFabButton{position:absolute;top:50px;right:10px}@media (prefers-color-scheme: dark){.legend-item{color:#ccc!important}.legend-item:hover{color:#fff!important}}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.AdvancedPieChartComponent, selector: "ngx-charts-advanced-pie-chart", inputs: ["gradient", "activeEntries", "tooltipDisabled", "tooltipText", "label", "valueFormatting", "nameFormatting", "percentageFormatting"], outputs: ["activate", "deactivate"] }, { kind: "component", type: i1$1.IonFabButton, selector: "ion-fab-button", inputs: ["activated", "closeIcon", "color", "disabled", "download", "href", "mode", "rel", "routerAnimation", "routerDirection", "show", "size", "target", "translucent", "type"] }, { kind: "component", type: i1$1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "directive", type: ExportDataDirective, selector: "[tapExportData]", inputs: ["exportedFileName", "dataToExport", "format"], outputs: ["exportDataError"] }], encapsulation: i0.ViewEncapsulation.None });
TapVariablePieChartAdvancedComponent = __decorate([
MonitoringAppGenComponent({
constraints: {
isNumber: 'YES',
isArray: 'YES',
},
}),
__metadata("design:paramtypes", [ElementRef,
NgZone,
ChangeDetectorRef, String, ModalController])
], TapVariablePieChartAdvancedComponent);
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariablePieChartAdvancedComponent, decorators: [{
type: Component,
args: [{ selector: 'tap-variable-pie-chart-advanced', encapsulation: ViewEncapsulation.None, template: "<div #containerRef style=\"width: 100%; position: relative\">\n <ngx-charts-advanced-pie-chart\n #charts\n [view]=\"[containerRef.offsetWidth, containerRef.offsetHeight]\"\n [scheme]=\"colorScheme\"\n [results]=\"results\"\n (select)=\"onSelect($event)\"\n >\n </ngx-charts-advanced-pie-chart>\n <ion-fab-button\n id=\"exportFabButton\"\n size=\"small\"\n tapExportData\n [dataToExport]=\"results\"\n [exportedFileName]=\"exportedFileName\"\n *ngIf=\"showExportButton\"\n >\n <ion-icon name=\"download\"></ion-icon>\n </ion-fab-button>\n</div>\n", styles: [".legend-items{padding-top:10px!important;padding-bottom:10px!important}#exportFabButton{position:absolute;top:50px;right:10px}@media (prefers-color-scheme: dark){.legend-item{color:#ccc!important}.legend-item:hover{color:#fff!important}}\n"] }]
}], ctorParameters: function () {
return [{ type: i0.ElementRef }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
type: Inject,
args: [PLATFORM_ID]
}] }, { type: i1$1.ModalController }];
}, propDecorators: { showDetails: [{
type: Input
}], showExportButton: [{
type: Input
}], exportedFileName: [{
type: Input
}], variable: [{
type: Input
}], history: [{
type: Input
}], valueCountLimit: [{
type: Input
}], label: [{
type: Input
}], colorScheme: [{
type: Input
}], input: [{
type: Input
}] } });
class TapVariablePieChartAdvancedModule {
}
/** @nocollapse */ TapVariablePieChartAdvancedModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariablePieChartAdvancedModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ TapVariablePieChartAdvancedModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: TapVariablePieChartAdvancedModule, declarations: [TapVariablePieChartAdvancedComponent], imports: [CommonModule,
NgxChartsModule,
TapVariableDataPopupModule,
IonicModule,
ExportDataModule], exports: [TapVariablePieChartAdvancedComponent] });
/** @nocollapse */ TapVariablePieChartAdvancedModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariablePieChartAdvancedModule, imports: [CommonModule,
NgxChartsModule,
TapVariableDataPopupModule,
IonicModule,
ExportDataModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariablePieChartAdvancedModule, decorators: [{
type: NgModule,
args: [{
declarations: [TapVariablePieChartAdvancedComponent],
exports: [TapVariablePieChartAdvancedComponent],
imports: [
CommonModule,
NgxChartsModule,
TapVariableDataPopupModule,
IonicModule,
ExportDataModule,
],
}]
}] });
let TapVariablePieChartGridComponent = class TapVariablePieChartGridComponent extends PieChartComponent {
set label(indexOrArray) {
this.chartModel.initLabel(indexOrArray);
}
set variable(variableOrArray) {
this.input = this.chartModel.initVariable(variableOrArray);
}
set input(inputs) {
this.subscription = this.chartModel
.defineInputStreamSingle(inputs, false, 0)
.subscribe((result) => {
let index = 0;
for (const item of result) {
if (this.results[index] !== undefined) {
if (item.value !== this.results[index].value) {
this.results = result;
}
}
else {
this.results = result;
}
index++;
}
this.resizeComponent();
});
}
onResize(event) {
this.innerWidth = window.innerWidth;
this.resizeComponent();
}
constructor(myChartElement, zone, cd, platformId, cdr) {
super(myChartElement, zone, cd, platformId);
this.cdr = cdr;
this.results = [
{
name: '---',
value: 0,
extra: 0,
},
];
this.chartModel = new ChartDataModel();
this.colorScheme = {
domain: [
'#5DADE2',
'#9B59B6',
'#F39C12',
'#5AA454',
'#A10A28',
'#C7B42C',
'#AAAAAA',
],
};
this.showExportButton = false;
}
ngAfterContentInit() {
this.innerWidth = window.innerWidth;
this.resizeComponent();
this.cdr.detectChanges();
}
onSelect(event) {
/* Not implemented
this.chartModel.showDetail(event, this.modalController, TapVariableDataPopupComponent);
*/
}
resizeComponent() {
if (this.innerWidth <= 400) {
this.innerWidth = 400;
}
this.innerHeight = (150 * this.results.length) / (this.innerWidth / 300);
if (this.innerHeight <= 150) {
this.innerHeight = 150;
}
this.cdr.detectChanges();
}
ngOnDestroy() {
var _a;
(_a = this.subscription) === null || _a === void 0 ? void 0 : _a.unsubscribe();
this.chartModel.destroyCurrentSub();
}
};
/** @nocollapse */ TapVariablePieChartGridComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariablePieChartGridComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: PLATFORM_ID }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ TapVariablePieChartGridComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TapVariablePieChartGridComponent, selector: "tap-variable-pie-chart-grid", inputs: { colorScheme: "colorScheme", showExportButton: "showExportButton", exportedFileName: "exportedFileName", label: "label", variable: "variable", input: "input" }, host: { listeners: { "window:resize": "onResize($event)" } }, usesInheritance: true, ngImport: i0, template: "<div #containerRef style=\"width: 100%; overflow: auto; position: relative\">\n <ngx-charts-pie-grid\n #charts\n [view]=\"[containerRef.offsetWidth, innerHeight]\"\n [scheme]=\"colorScheme\"\n [animations]=\"false\"\n [results]=\"results\"\n (select)=\"onSelect($event)\"\n >\n </ngx-charts-pie-grid>\n <ion-fab-button\n id=\"exportFabButton\"\n size=\"small\"\n tapExportData\n *ngIf=\"showExportButton\"\n [exportedFileName]=\"exportedFileName\"\n [dataToExport]=\"results\"\n >\n <ion-icon name=\"download\"></ion-icon>\n </ion-fab-button>\n</div>\n", styles: ["@media (prefers-color-scheme: dark){::ng-deep span.legend-label-text{color:#ccc!important}::ng-deep span.legend-label-text:hover{color:#fff!important}::ng-deep .ngx-charts text{fill:#fff!important}}#exportFabButton{position:absolute;top:10px;right:10px}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.PieGridComponent, selector: "ngx-charts-pie-grid", inputs: ["designatedTotal", "tooltipDisabled", "tooltipText", "label", "minWidth", "activeEntries"], outputs: ["activate", "deactivate"] }, { kind: "component", type: i1$1.IonFabButton, selector: "ion-fab-button", inputs: ["activated", "closeIcon", "color", "disabled", "download", "href", "mode", "rel", "routerAnimation", "routerDirection", "show", "size", "target", "translucent", "type"] }, { kind: "component", type: i1$1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "directive", type: ExportDataDirective, selector: "[tapExportData]", inputs: ["exportedFileName", "dataToExport", "format"], outputs: ["exportDataError"] }] });
TapVariablePieChartGridComponent = __decorate([
MonitoringAppGenComponent({
constraints: {
isNumber: 'YES',
},
}),
__metadata("design:paramtypes", [ElementRef,
NgZone,
ChangeDetectorRef, String, ChangeDetectorRef])
], TapVariablePieChartGridComponent);
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariablePieChartGridComponent, decorators: [{
type: Component,
args: [{ selector: 'tap-variable-pie-chart-grid', template: "<div #containerRef style=\"width: 100%; overflow: auto; position: relative\">\n <ngx-charts-pie-grid\n #charts\n [view]=\"[containerRef.offsetWidth, innerHeight]\"\n [scheme]=\"colorScheme\"\n [animations]=\"false\"\n [results]=\"results\"\n (select)=\"onSelect($event)\"\n >\n </ngx-charts-pie-grid>\n <ion-fab-button\n id=\"exportFabButton\"\n size=\"small\"\n tapExportData\n *ngIf=\"showExportButton\"\n [exportedFileName]=\"exportedFileName\"\n [dataToExport]=\"results\"\n >\n <ion-icon name=\"download\"></ion-icon>\n </ion-fab-button>\n</div>\n", styles: ["@media (prefers-color-scheme: dark){::ng-deep span.legend-label-text{color:#ccc!important}::ng-deep span.legend-label-text:hover{color:#fff!important}::ng-deep .ngx-charts text{fill:#fff!important}}#exportFabButton{position:absolute;top:10px;right:10px}\n"] }]
}], ctorParameters: function () {
return [{ type: i0.ElementRef }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
type: Inject,
args: [PLATFORM_ID]
}] }, { type: i0.ChangeDetectorRef }];
}, propDecorators: { colorScheme: [{
type: Input
}], showExportButton: [{
type: Input
}], exportedFileName: [{
type: Input
}], label: [{
type: Input
}], variable: [{
type: Input
}], input: [{
type: Input
}], onResize: [{
type: HostListener,
args: ['window:resize', ['$event']]
}] } });
class TapVariablePieChartGridModule {
}
/** @nocollapse */ TapVariablePieChartGridModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariablePieChartGridModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ TapVariablePieChartGridModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: TapVariablePieChartGridModule, declarations: [TapVariablePieChartGridComponent], imports: [CommonModule, NgxChartsModule, IonicModule, ExportDataModule], exports: [TapVariablePieChartGridComponent] });
/** @nocollapse */ TapVariablePieChartGridModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariablePieChartGridModule, imports: [CommonModule, NgxChartsModule, IonicModule, ExportDataModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariablePieChartGridModule, decorators: [{
type: NgModule,
args: [{
declarations: [TapVariablePieChartGridComponent],
exports: [TapVariablePieChartGridComponent],
imports: [CommonModule, NgxChartsModule, IonicModule, ExportDataModule],
}]
}] });
let TapVariablePolarRadarChartComponent = class TapVariablePolarRadarChartComponent extends PolarChartComponent {
set variable(variableOrArray) {
this.input = this.chartModel.initVariable(variableOrArray);
}
set input(inputs) {
this.subscription = this.chartModel
.defineMultiInputStream(inputs)
.subscribe((result) => {
this.results = result;
this.loaded = true;
});
}
constructor(myChartElement, zone, platformId, cd) {
super(myChartElement, zone, cd, platformId);
this.colorScheme = {
domain: [
'#5DADE2',
'#9B59B6',
'#F39C12',
'#5AA454',
'#A10A28',
'#C7B42C',
'#AAAAAA',
],
};
this.legend = true;
this.legendPosition = LegendPosition.Below;
this.showExportButton = false;
this.xAxis = true;
this.showXAxisLabel = true;
this.yAxis = true;
this.showYAxisLabel = true;
this.valueCountLimit = 4;
this.loaded = false;
this.results = [
{
name: 'Value',
series: [],
},
];
this.chartModel = new ChartDataModel();
}
createExportedData() {
return dataWithSeriesToCsv(this.results);
}
ngOnDestroy() {
var _a;
(_a = this.subscription) === null || _a === void 0 ? void 0 : _a.unsubscribe();
this.chartModel.destroyCurrentSub();
}
onSelect(event) {
/* Not implemented
this.chartModel.showDetail(event, this.modalController, TapVariableDataPopupComponent);
*/
}
};
/** @nocollapse */ TapVariablePolarRadarChartComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariablePolarRadarChartComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: PLATFORM_ID }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ TapVariablePolarRadarChartComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TapVariablePolarRadarChartComponent, selector: "tap-variable-polar-radar-chart", inputs: { colorScheme: "colorScheme", legend: "legend", legendPosition: "legendPosition", showExportButton: "showExportButton", exportedFileName: "exportedFileName", xAxis: "xAxis", showXAxisLabel: "showXAxisLabel", yAxis: "yAxis", showYAxisLabel: "showYAxisLabel", valueCountLimit: "valueCountLimit", variable: "variable", input: "input" }, usesInheritance: true, ngImport: i0, template: "<div\n #containerRef\n [ngClass]=\"legendPosition === 'below' ? 'belowLegend' : 'rightLegend'\"\n style=\"position: relative\"\n>\n <ngx-charts-polar-chart\n *ngIf=\"loaded\"\n #polarChart\n [view]=\"[containerRef.offsetWidth, containerRef.offsetHeight]\"\n [scheme]=\"colorScheme\"\n [legend]=\"legend\"\n [legendPosition]=\"legendPosition\"\n [showXAxisLabel]=\"showXAxisLabel\"\n [showYAxisLabel]=\"showYAxisLabel\"\n [xAxis]=\"xAxis\"\n [yAxis]=\"yAxis\"\n [results]=\"results\"\n (select)=\"onSelect($event)\"\n >\n </ngx-charts-polar-chart>\n <ion-fab-button\n id=\"exportFabButton\"\n size=\"small\"\n tapExportData\n *ngIf=\"showExportButton\"\n [exportedFileName]=\"exportedFileName\"\n [dataToExport]=\"createExportedData.bind(this)\"\n >\n <ion-icon name=\"download\"></ion-icon>\n </ion-fab-button>\n</div>\n", styles: ["::ng-deep .horizontal-legend{overflow:auto!important}.belowLegend{height:50vh;width:100%;margin-bottom:100px}.rightLegend{height:50vh;width:100%}#exportFabButton{position:absolute;top:10px;right:10px}@media (prefers-color-scheme: dark){::ng-deep span.legend-label-text{color:#ccc!important}::ng-deep span.legend-label-text:hover{color:#fff!important}::ng-deep .ngx-charts text{fill:#fff!important}}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.PolarChartComponent, selector: "ngx-charts-polar-chart", inputs: ["legend", "legendTitle", "legendPosition", "xAxis", "yAxis", "showXAxisLabel", "showYAxisLabel", "xAxisLabel", "yAxisLabel", "autoScale", "showGridLines", "curve", "activeEntries", "schemeType", "rangeFillOpacity", "trimYAxisTicks", "maxYAxisTickLength", "xAxisTickFormatting", "yAxisTickFormatting", "roundDomains", "tooltipDisabled", "showSeriesOnHover", "gradient", "yAxisMinScale", "labelTrim", "labelTrimSize", "wrapTicks"], outputs: ["activate", "deactivate"] }, { kind: "component", type: i1$1.IonFabButton, selector: "ion-fab-button", inputs: ["activated", "closeIcon", "color", "disabled", "download", "href", "mode", "rel", "routerAnimation", "routerDirection", "show", "size", "target", "translucent", "type"] }, { kind: "component", type: i1$1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "directive", type: ExportDataDirective, selector: "[tapExportData]", inputs: ["exportedFileName", "dataToExport", "format"], outputs: ["exportDataError"] }] });
TapVariablePolarRadarChartComponent = __decorate([
MonitoringAppGenComponent({
constraints: {
isNumber: 'YES',
},
}),
__metadata("design:paramtypes", [ElementRef,
NgZone, String, ChangeDetectorRef])
], TapVariablePolarRadarChartComponent);
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariablePolarRadarChartComponent, decorators: [{
type: Component,
args: [{ selector: 'tap-variable-polar-radar-chart', template: "<div\n #containerRef\n [ngClass]=\"legendPosition === 'below' ? 'belowLegend' : 'rightLegend'\"\n style=\"position: relative\"\n>\n <ngx-charts-polar-chart\n *ngIf=\"loaded\"\n #polarChart\n [view]=\"[containerRef.offsetWidth, containerRef.offsetHeight]\"\n [scheme]=\"colorScheme\"\n [legend]=\"legend\"\n [legendPosition]=\"legendPosition\"\n [showXAxisLabel]=\"showXAxisLabel\"\n [showYAxisLabel]=\"showYAxisLabel\"\n [xAxis]=\"xAxis\"\n [yAxis]=\"yAxis\"\n [results]=\"results\"\n (select)=\"onSelect($event)\"\n >\n </ngx-charts-polar-chart>\n <ion-fab-button\n id=\"exportFabButton\"\n size=\"small\"\n tapExportData\n *ngIf=\"showExportButton\"\n [exportedFileName]=\"exportedFileName\"\n [dataToExport]=\"createExportedData.bind(this)\"\n >\n <ion-icon name=\"download\"></ion-icon>\n </ion-fab-button>\n</div>\n", styles: ["::ng-deep .horizontal-legend{overflow:auto!important}.belowLegend{height:50vh;width:100%;margin-bottom:100px}.rightLegend{height:50vh;width:100%}#exportFabButton{position:absolute;top:10px;right:10px}@media (prefers-color-scheme: dark){::ng-deep span.legend-label-text{color:#ccc!important}::ng-deep span.legend-label-text:hover{color:#fff!important}::ng-deep .ngx-charts text{fill:#fff!important}}\n"] }]
}], ctorParameters: function () {
return [{ type: i0.ElementRef }, { type: i0.NgZone }, { type: undefined, decorators: [{
type: Inject,
args: [PLATFORM_ID]
}] }, { type: i0.ChangeDetectorRef }];
}, propDecorators: { colorScheme: [{
type: Input
}], legend: [{
type: Input
}], legendPosition: [{
type: Input
}], showExportButton: [{
type: Input
}], exportedFileName: [{
type: Input
}], xAxis: [{
type: Input
}], showXAxisLabel: [{
type: Input
}], yAxis: [{
type: Input
}], showYAxisLabel: [{
type: Input
}], valueCountLimit: [{
type: Input
}], variable: [{
type: Input
}], input: [{
type: Input
}] } });
class TapVariablePolarRadarChartModule {
}
/** @nocollapse */ TapVariablePolarRadarChartModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariablePolarRadarChartModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ TapVariablePolarRadarChartModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: TapVariablePolarRadarChartModule, declarations: [TapVariablePolarRadarChartComponent], imports: [CommonModule, NgxChartsModule, IonicModule, ExportDataModule], exports: [TapVariablePolarRadarChartComponent] });
/** @nocollapse */ TapVariablePolarRadarChartModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariablePolarRadarChartModule, imports: [CommonModule, NgxChartsModule, IonicModule, ExportDataModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariablePolarRadarChartModule, decorators: [{
type: NgModule,
args: [{
declarations: [TapVariablePolarRadarChartComponent],
exports: [TapVariablePolarRadarChartComponent],
imports: [CommonModule, NgxChartsModule, IonicModule, ExportDataModule],
}]
}] });
let TapVariablePushButtonComponent = class TapVariablePushButtonComponent {
onTouchStart() {
this._onTouchStartOrMouseDown();
}
onMouseDown() {
if (this.platform.is('desktop')) {
this._onTouchStartOrMouseDown();
if (this._handleMouseUp) {
document.removeEventListener('mouseup', this._handleMouseUp);
}
this._handleMouseUp = () => {
if (this._handleMouseUp) {
document.removeEventListener('mouseup', this._handleMouseUp);
}
this._onTouchEndOrMouseUp();
};
document.addEventListener('mouseup', this._handleMouseUp);
}
}
onTouchEnd() {
this._onTouchEndOrMouseUp();
}
_onTouchStartOrMouseDown() {
if (isConfiguredValue(this.mouseDownValue))
this.writeValue(this.mouseDownValue);
}
_onTouchEndOrMouseUp() {
if (isConfiguredValue(this.mouseUpValue))
this.writeValue(this.mouseUpValue);
}
/**
* @deprecated
*/
set defineValueOnClick(v) {
this.value = v;
}
set fieldError(err) {
this.error = err;
}
set variable(variable) {
this._variable = variable;
}
constructor(actionSheetController, platform) {
this.actionSheetController = actionSheetController;
this.platform = platform;
this.mouseDownValue = undefined;
this.mouseUpValue = undefined;
this.value = 1;
this.buttonText = 'Write';
this.size = 'default';
this.color = 'primary';
this.iconPosition = 'start';
this.strong = false;
this.confirm = false;
this.confirmMessage = 'Are you sure ?';
this.editable = true;
this.destroyed = new Subject();
this.loading = false;
}
ngAfterViewInit() {
var _a, _b;
(_b = (_a = this.ctx) === null || _a === void 0 ? void 0 : _a.valueToDisplay) === null || _b === void 0 ? void 0 : _b.pipe(takeUntil(this.destroyed)).subscribe((newValue) => { });
}
ngOnDestroy() {
this.destroyed.next();
}
onClick() {
return __awaiter(this, void 0, void 0, function* () {
if (!isConfiguredValue(this.value)) {
return;
}
if (this.confirm) {
const actionSheet = yield this.actionSheetController.create({
header: this.confirmMessage,
buttons: [
{
text: 'Confirm',
icon: 'checkmark',
handler: () => {
this.writeValue(this.value);
},
},
{
text: 'Cancel',
icon: 'close',
},
],
});
yield actionSheet.present();
}
else {
this.writeValue(this.value);
}
});
}
writeValue(valueToWrite) {
return __awaiter(this, void 0, void 0, function* () {
this.loading = true;
yield this.ctx.notifyValueChange(valueToWrite, true);
this.loading = false;
});
}
};
/** @nocollapse */ TapVariablePushButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariablePushButtonComponent, deps: [{ token: i1$1.ActionSheetController }, { token: i1$1.Platform }], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ TapVariablePushButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TapVariablePushButtonComponent, selector: "tap-variable-push-button", inputs: { mouseDownValue: "mouseDownValue", mouseUpValue: "mouseUpValue", value: "value", buttonText: "buttonText", size: "size", color: "color", icon: "icon", iconPosition: "iconPosition", fill: "fill", expand: "expand", strong: "strong", shape: "shape", confirm: "confirm", confirmMessage: "confirmMessage", editable: "editable", defineValueOnClick: "defineValueOnClick", fieldError: "fieldError", variable: "variable" }, host: { listeners: { "touchstart": "onTouchStart()", "mousedown": "onMouseDown()", "touchend": "onTouchEnd()" } }, viewQueries: [{ propertyName: "ctx", first: true, predicate: ["ctx"], descendants: true }], ngImport: i0, template: "<tap-value-editor-container #ctx [variable]=\"_variable\">\n <ion-button\n [disabled]=\"loading || !editable\"\n [color]=\"color\"\n [size]=\"size\"\n [fill]=\"fill\"\n [strong]=\"strong\"\n [shape]=\"shape\"\n [expand]=\"expand\"\n [ngClass]=\"{ 'full-width': expand === 'block' || expand === 'full' }\"\n (click)=\"onClick()\"\n >\n <span *ngIf=\"icon\" [slot]=\"iconPosition\">\n \n <app-common-icon [image]=\"icon\"> </app-common-icon>\n \n </span>\n <ion-text *ngIf=\"buttonText\">{{ buttonText }}</ion-text>\n </ion-button>\n</tap-value-editor-container>\n", styles: [".full-width{width:100%!important}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1$1.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: i1$1.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { kind: "component", type: i1$3.TapValueEditorContainerComponent, selector: "tap-value-editor-container", inputs: ["button", "variable", "inputOptions", "showRefreshButton", "showSubmitButton", "showEditButton", "error", "lines", "modalEdition", "value"], outputs: ["submit", "refresh"] }, { kind: "component", type: i3$1.IconComponent, selector: "app-common-icon", inputs: ["imageSize", "color", "image"] }] });
TapVariablePushButtonComponent = __decorate([
MonitoringAppGenComponent({
constraints: {
isArray: 'NO',
isNumber: 'YES',
},
events: [
{
name: 'submit',
dataType: 'void',
},
{
dataType: 'void',
name: 'mouseUp',
},
{
dataType: 'void',
name: 'mouseDown',
},
],
}),
__metadata("design:paramtypes", [ActionSheetController,
Platform])
], TapVariablePushButtonComponent);
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariablePushButtonComponent, decorators: [{
type: Component,
args: [{ selector: 'tap-variable-push-button', template: "<tap-value-editor-container #ctx [variable]=\"_variable\">\n <ion-button\n [disabled]=\"loading || !editable\"\n [color]=\"color\"\n [size]=\"size\"\n [fill]=\"fill\"\n [strong]=\"strong\"\n [shape]=\"shape\"\n [expand]=\"expand\"\n [ngClass]=\"{ 'full-width': expand === 'block' || expand === 'full' }\"\n (click)=\"onClick()\"\n >\n <span *ngIf=\"icon\" [slot]=\"iconPosition\">\n \n <app-common-icon [image]=\"icon\"> </app-common-icon>\n \n </span>\n <ion-text *ngIf=\"buttonText\">{{ buttonText }}</ion-text>\n </ion-button>\n</tap-value-editor-container>\n", styles: [".full-width{width:100%!important}\n"] }]
}], ctorParameters: function () { return [{ type: i1$1.ActionSheetController }, { type: i1$1.Platform }]; }, propDecorators: { ctx: [{
type: ViewChild,
args: ['ctx']
}], onTouchStart: [{
type: HostListener,
args: ['touchstart']
}], onMouseDown: [{
type: HostListener,
args: ['mousedown']
}], onTouchEnd: [{
type: HostListener,
args: ['touchend']
}], mouseDownValue: [{
type: Input
}], mouseUpValue: [{
type: Input
}], value: [{
type: Input
}], buttonText: [{
type: Input
}], size: [{
type: Input
}], color: [{
type: Input
}], icon: [{
type: Input
}], iconPosition: [{
type: Input
}], fill: [{
type: Input
}], expand: [{
type: Input
}], strong: [{
type: Input
}], shape: [{
type: Input
}], confirm: [{
type: Input
}], confirmMessage: [{
type: Input
}], editable: [{
type: Input
}], defineValueOnClick: [{
type: Input
}], fieldError: [{
type: Input
}], variable: [{
type: Input
}] } });
function isConfiguredValue(value) {
return value !== undefined && value !== null;
}
class TapVariablePushButtonModule {
}
/** @nocollapse */ TapVariablePushButtonModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariablePushButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ TapVariablePushButtonModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: TapVariablePushButtonModule, declarations: [TapVariablePushButtonComponent], imports: [CommonModule,
IonicModule,
TapValueEditorContainerModule,
IconModule], exports: [TapVariablePushButtonComponent] });
/** @nocollapse */ TapVariablePushButtonModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariablePushButtonModule, imports: [CommonModule,
IonicModule,
TapValueEditorContainerModule,
IconModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariablePushButtonModule, decorators: [{
type: NgModule,
args: [{
declarations: [TapVariablePushButtonComponent],
exports: [TapVariablePushButtonComponent],
imports: [
CommonModule,
IonicModule,
TapValueEditorContainerModule,
IconModule,
],
}]
}] });
let TapVariableRangeComponent = class TapVariableRangeComponent {
set variable(variable) {
this._variable = variable;
}
constructor() {
this.editable = true;
this.writeValueForEveryChange = false;
this.min = 0;
this.max = 100;
this.step = 1;
this.color = 'primary';
this.pin = true;
this.snaps = true;
this.ticks = true;
this.debounce = 0;
this.valueChange = new EventEmitter();
}
onValueChange(newValue) {
var _a;
// const newValue = $event.detail.value;
this.valueChange.emit(newValue);
(_a = this.ctx) === null || _a === void 0 ? void 0 : _a.notifyValueChange(newValue);
}
};
/** @nocollapse */ TapVariableRangeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableRangeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ TapVariableRangeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TapVariableRangeComponent, selector: "tap-variable-range", inputs: { variable: "variable", editable: "editable", writeValueForEveryChange: "writeValueForEveryChange", min: "min", max: "max", step: "step", color: "color", pin: "pin", snaps: "snaps", ticks: "ticks", debounce: "debounce", leftIcon: "leftIcon", leftIconColor: "leftIconColor", rightIcon: "rightIcon", rightIconColor: "rightIconColor", value: "value" }, outputs: { valueChange: "valueChange" }, viewQueries: [{ propertyName: "ctx", first: true, predicate: ["ctx"], descendants: true }], ngImport: i0, template: "<tap-value-editor-container #ctx [variable]=\"_variable\" [value]=\"value\">\n <monitoring-range\n [disabled]=\"!editable || (ctx.loadingChange | async)\"\n [inputStream]=\"ctx.valueToDisplay\"\n [ticks]=\"ticks\"\n [pin]=\"pin\"\n [snaps]=\"snaps\"\n [max]=\"max\"\n [min]=\"min\"\n [step]=\"step\"\n [color]=\"color\"\n [debounce]=\"debounce\"\n [writeValueForEveryChange]=\"writeValueForEveryChange\"\n [leftIcon]=\"leftIcon\"\n [leftIconColor]=\"leftIconColor\"\n [rightIconColor]=\"rightIconColor\"\n [rightIcon]=\"rightIcon\"\n style=\"width: 100%\"\n (onValueChanged)=\"onValueChange($event)\"\n >\n <ng-template monitoringRangeContent>\n <ion-label slot=\"start\">{{ min }}</ion-label>\n <ion-label slot=\"end\">{{ max }}</ion-label>\n </ng-template>\n </monitoring-range>\n</tap-value-editor-container>\n", styles: [""], dependencies: [{ kind: "component", type: i1$1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: MonitoringRangeComponent, selector: "monitoring-range", inputs: ["inputStream", "min", "max", "step", "debounce", "pin", "disabled", "snaps", "ticks", "writeValueForEveryChange", "leftIcon", "leftIconColor", "rightIcon", "rightIconColor", "color"], outputs: ["onValueChanged"] }, { kind: "directive", type: MonitoringRangeContentDirective, selector: "[monitoringRangeContent]" }, { kind: "component", type: i1$3.TapValueEditorContainerComponent, selector: "tap-value-editor-container", inputs: ["button", "variable", "inputOptions", "showRefreshButton", "showSubmitButton", "showEditButton", "error", "lines", "modalEdition", "value"], outputs: ["submit", "refresh"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }] });
TapVariableRangeComponent = __decorate([
MonitoringAppGenComponent({
constraints: {
isArray: 'YES',
isNumber: 'YES',
},
events: [
{
name: 'submit',
dataType: 'number',
},
],
}),
__metadata("design:paramtypes", [])
], TapVariableRangeComponent);
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableRangeComponent, decorators: [{
type: Component,
args: [{ selector: 'tap-variable-range', template: "<tap-value-editor-container #ctx [variable]=\"_variable\" [value]=\"value\">\n <monitoring-range\n [disabled]=\"!editable || (ctx.loadingChange | async)\"\n [inputStream]=\"ctx.valueToDisplay\"\n [ticks]=\"ticks\"\n [pin]=\"pin\"\n [snaps]=\"snaps\"\n [max]=\"max\"\n [min]=\"min\"\n [step]=\"step\"\n [color]=\"color\"\n [debounce]=\"debounce\"\n [writeValueForEveryChange]=\"writeValueForEveryChange\"\n [leftIcon]=\"leftIcon\"\n [leftIconColor]=\"leftIconColor\"\n [rightIconColor]=\"rightIconColor\"\n [rightIcon]=\"rightIcon\"\n style=\"width: 100%\"\n (onValueChanged)=\"onValueChange($event)\"\n >\n <ng-template monitoringRangeContent>\n <ion-label slot=\"start\">{{ min }}</ion-label>\n <ion-label slot=\"end\">{{ max }}</ion-label>\n </ng-template>\n </monitoring-range>\n</tap-value-editor-container>\n" }]
}], ctorParameters: function () { return []; }, propDecorators: { variable: [{
type: Input
}], editable: [{
type: Input
}], writeValueForEveryChange: [{
type: Input
}], min: [{
type: Input
}], max: [{
type: Input
}], step: [{
type: Input
}], color: [{
type: Input
}], pin: [{
type: Input
}], snaps: [{
type: Input
}], ticks: [{
type: Input
}], debounce: [{
type: Input
}], leftIcon: [{
type: Input
}], leftIconColor: [{
type: Input
}], rightIcon: [{
type: Input
}], rightIconColor: [{
type: Input
}], value: [{
type: Input
}], valueChange: [{
type: Output
}], ctx: [{
type: ViewChild,
args: ['ctx']
}] } });
class TapVariableRangeModule {
}
/** @nocollapse */ TapVariableRangeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableRangeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ TapVariableRangeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: TapVariableRangeModule, declarations: [TapVariableRangeComponent], imports: [CommonModule,
IonicModule,
MonitoringRangeModule,
TapValueEditorContainerModule], exports: [TapVariableRangeComponent] });
/** @nocollapse */ TapVariableRangeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableRangeModule, imports: [CommonModule,
IonicModule,
MonitoringRangeModule,
TapValueEditorContainerModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableRangeModule, decorators: [{
type: NgModule,
args: [{
declarations: [TapVariableRangeComponent],
exports: [TapVariableRangeComponent],
imports: [
CommonModule,
IonicModule,
MonitoringRangeModule,
TapValueEditorContainerModule,
],
}]
}] });
class TapVariableSwitchPictureComponent {
set fieldError(err) {
this.error = err;
}
get pending() {
return this.pendingCallManager.pendingCall !== undefined;
}
set variable(variable) {
this._variable = variable;
if (variable) {
this.inputStream = variable.values;
}
}
set inputStream(inputs) {
this.subscription = inputs.subscribe((value) => {
this.state = value;
this.pictures.filter((picture) => {
if (picture.index === this.state) {
this.currentSrc = picture.src;
this.loaded = true;
}
});
});
}
constructor(changeDetectorRef, tapService) {
this.changeDetectorRef = changeDetectorRef;
this.state = 0;
this.loaded = false;
this.stateText = 'State';
this.pendingCallManager = PendingCallManager.create(tapService);
}
ngOnDestroy() {
var _a;
(_a = this.subscription) === null || _a === void 0 ? void 0 : _a.unsubscribe();
this.pendingCallManager.destroy();
}
switchPicture() {
if (this.editable) {
this.state++;
if (this.state === this.pictures.length + 1) {
this.state = 1;
}
this.pictures.filter((value) => {
if (value.index === this.state) {
this.pendingCallManager
.exec(() => __awaiter(this, void 0, void 0, function* () {
var _a;
return (_a = this._variable) === null || _a === void 0 ? void 0 : _a.write(value.src).then(() => {
this.changeDetectorRef.detectChanges();
});
}))
.catch((err) => {
if (!this.pending) {
this.fieldError = err;
}
else {
this.pendingSubmitValue = value.src;
}
this.changeDetectorRef.detectChanges();
});
this.currentSrc = value.src;
}
});
}
}
}
/** @nocollapse */ TapVariableSwitchPictureComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableSwitchPictureComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$3.CurrentDeviceService }], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ TapVariableSwitchPictureComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TapVariableSwitchPictureComponent, selector: "tap-variable-switch-picture", inputs: { fieldError: "fieldError", pictures: "pictures", stateText: "stateText", editable: "editable", variable: "variable", inputStream: "inputStream" }, ngImport: i0, template: "<ion-item-sliding [disabled]=\"!error\">\n <ion-item>\n <ion-thumbnail slot=\"start\">\n <img *ngIf=\"loaded\" (click)=\"switchPicture()\" [src]=\"currentSrc\" />\n <ion-spinner\n style=\"height: 100%; width: 100%\"\n *ngIf=\"!loaded\"\n name=\"crescent\"\n color=\"primary\"\n ></ion-spinner>\n </ion-thumbnail>\n <ion-label>{{ stateText }} : {{ state }}</ion-label>\n <ion-icon\n slot=\"end\"\n *ngIf=\"error\"\n name=\"alert-outline\"\n color=\"danger\"\n ></ion-icon>\n </ion-item>\n\n <ion-item-options side=\"end\" style=\"max-width: 85%\">\n <ion-item-option color=\"danger\">\n <ion-text *ngIf=\"error\" color=\"light\" style=\"max-width: 100%\">\n <span style=\"text-transform: none !important\">{{ error.message }}</span>\n </ion-text>\n </ion-item-option>\n </ion-item-options>\n</ion-item-sliding>\n", styles: [""], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1$1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i1$1.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: i1$1.IonItemOption, selector: "ion-item-option", inputs: ["color", "disabled", "download", "expandable", "href", "mode", "rel", "target", "type"] }, { kind: "component", type: i1$1.IonItemOptions, selector: "ion-item-options", inputs: ["side"] }, { kind: "component", type: i1$1.IonItemSliding, selector: "ion-item-sliding", inputs: ["disabled"] }, { kind: "component", type: i1$1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i1$1.IonSpinner, selector: "ion-spinner", inputs: ["color", "duration", "name", "paused"] }, { kind: "component", type: i1$1.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { kind: "component", type: i1$1.IonThumbnail, selector: "ion-thumbnail" }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableSwitchPictureComponent, decorators: [{
type: Component,
args: [{ selector: 'tap-variable-switch-picture', template: "<ion-item-sliding [disabled]=\"!error\">\n <ion-item>\n <ion-thumbnail slot=\"start\">\n <img *ngIf=\"loaded\" (click)=\"switchPicture()\" [src]=\"currentSrc\" />\n <ion-spinner\n style=\"height: 100%; width: 100%\"\n *ngIf=\"!loaded\"\n name=\"crescent\"\n color=\"primary\"\n ></ion-spinner>\n </ion-thumbnail>\n <ion-label>{{ stateText }} : {{ state }}</ion-label>\n <ion-icon\n slot=\"end\"\n *ngIf=\"error\"\n name=\"alert-outline\"\n color=\"danger\"\n ></ion-icon>\n </ion-item>\n\n <ion-item-options side=\"end\" style=\"max-width: 85%\">\n <ion-item-option color=\"danger\">\n <ion-text *ngIf=\"error\" color=\"light\" style=\"max-width: 100%\">\n <span style=\"text-transform: none !important\">{{ error.message }}</span>\n </ion-text>\n </ion-item-option>\n </ion-item-options>\n</ion-item-sliding>\n" }]
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i1$3.CurrentDeviceService }]; }, propDecorators: { fieldError: [{
type: Input
}], pictures: [{
type: Input
}], stateText: [{
type: Input
}], editable: [{
type: Input
}], variable: [{
type: Input
}], inputStream: [{
type: Input
}] } });
class TapVariableSwitchPictureModule {
}
/** @nocollapse */ TapVariableSwitchPictureModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableSwitchPictureModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ TapVariableSwitchPictureModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: TapVariableSwitchPictureModule, declarations: [TapVariableSwitchPictureComponent], imports: [CommonModule, IonicModule], exports: [TapVariableSwitchPictureComponent] });
/** @nocollapse */ TapVariableSwitchPictureModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableSwitchPictureModule, imports: [CommonModule, IonicModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableSwitchPictureModule, decorators: [{
type: NgModule,
args: [{
declarations: [TapVariableSwitchPictureComponent],
exports: [TapVariableSwitchPictureComponent],
imports: [CommonModule, IonicModule],
}]
}] });
const TABLE_LIMIT = 10;
let TapVariableTableComponent = class TapVariableTableComponent {
set history(enable) {
this._history.next(enable);
}
set valueCountLimit(limit) {
if (limit === undefined) {
limit = 30;
}
this._valueCountLimit.next(limit);
}
set label(indexOrArray) {
this.chartModel.initLabel(indexOrArray);
}
set variable(variableOrArray) {
this.multiple = !!Array.isArray(variableOrArray);
this.input = this.chartModel.initVariable(variableOrArray);
}
set input(inputs) {
this._input.next(inputs);
}
columnsPushForEachKey(key) {
console.log('DEBUG columnsPushForEachKey', key, this.columns);
if (this.history && key === 'name') {
this.columns.push({
prop: key,
name: !this.nameLabel
? this.history
? 'Time'
: 'Name'
: this.nameLabel,
sortable: true,
});
}
else if (key === 'value') {
this.columns.push({ prop: key, name: this.valueLabel, sortable: true });
}
else if (key !== 'extra') {
this.columns.push({ prop: key, name: key, sortable: true });
}
}
constructor(modalController, cdr) {
this.modalController = modalController;
this.cdr = cdr;
this.rows = [];
this.chartModel = new ChartDataModel();
this.loadingIndicator = true;
this.reorderable = false;
this.columnMode = ColumnMode.force;
this.limit = TABLE_LIMIT;
this.valueLabel = 'Value';
this.showExportButton = false;
this._history = new BehaviorSubject(true);
this._valueCountLimit = new BehaviorSubject(30);
this.destroyed = new Subject();
this._input = new BehaviorSubject([]);
this.multiple = false;
}
createExportedData() {
return this.rows;
}
ngAfterViewInit() {
this.darkModeStatus =
window.matchMedia &&
window.matchMedia('(prefers-color-scheme: dark)').matches;
combineLatest([this._valueCountLimit, this._input, this._history])
.pipe(takeUntil(this.destroyed), switchMap(([valueCountLimit, input, history]) => {
this.chartModel.destroyCurrentSub();
if (this.multiple) {
return this.chartModel.defineMultiInputStream(input);
}
else {
return this.chartModel.defineInputStreamSingle(input, history, valueCountLimit, true);
}
}))
.subscribe((result) => {
this.resultToTableData(result);
});
}
resultToTableData(result) {
this.rows = result;
this.columns = [];
const jsonData = JSON.parse(JSON.stringify(this.rows[0]));
for (const key of Object.keys(jsonData)) {
if (key === 'series') {
jsonData['series'].forEach((k) => this.columnsPushForEachKey(k.name));
}
else {
this.columnsPushForEachKey(key);
}
}
this.loadingIndicator = false;
this.cdr.detectChanges();
}
onSelect(event) {
if (typeof event === 'object') {
this.chartModel
.showDetail(event, this.modalController, TapVariableDataPopupComponent)
.catch((err) => {
console.warn(err);
});
}
}
ngOnDestroy() {
this.chartModel.destroyCurrentSub();
this.destroyed.next();
this.destroyed.complete();
}
};
/** @nocollapse */ TapVariableTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableTableComponent, deps: [{ token: i1$1.ModalController }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ TapVariableTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TapVariableTableComponent, selector: "tap-variable-table", inputs: { loadingIndicator: "loadingIndicator", reorderable: "reorderable", columnMode: "columnMode", limit: "limit", valueLabel: "valueLabel", nameLabel: "nameLabel", history: "history", valueCountLimit: "valueCountLimit", showExportButton: "showExportButton", exportedFileName: "exportedFileName", label: "label", variable: "variable", input: "input" }, ngImport: i0, template: "<div style=\"position: relative\">\n <ngx-datatable\n [ngClass]=\"darkModeStatus ? 'dark' : 'material'\"\n [rows]=\"rows\"\n [loadingIndicator]=\"loadingIndicator\"\n [columns]=\"columns\"\n [columnMode]=\"columnMode\"\n [headerHeight]=\"50\"\n [footerHeight]=\"50\"\n [rowHeight]=\"50\"\n [reorderable]=\"reorderable\"\n [scrollbarH]=\"true\"\n [limit]=\"limit\"\n >\n </ngx-datatable>\n <!--\n [targetMarkerTemplate]=\"targetMarkerTemplate\"\n <ng-template #targetMarkerTemplate let-class=\"class\">\n <div [ngClass]=\"class\">\n <div class=\"icon datatable-icon-down\"></div>\n <div class=\"icon datatable-icon-up\"></div>\n </div>\n </ng-template>\n -->\n\n <ion-fab-button\n id=\"exportFabButton\"\n size=\"small\"\n tapExportData\n [dataToExport]=\"createExportedData.bind(this)\"\n [exportedFileName]=\"exportedFileName\"\n *ngIf=\"showExportButton\"\n >\n <ion-icon name=\"download\"></ion-icon>\n </ion-fab-button>\n</div>\n", styles: [":host ::ng-deep .datatable-scroll{width:100%!important}:host ::ng-deep datatable-pager{width:85%!important}#exportFabButton{position:absolute;top:0;right:2px}:host ::ng-deep .page-count{white-space:nowrap!important}:host ::ng-deep .datatable-pager{max-width:85%!important}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3$3.DatatableComponent, selector: "ngx-datatable", inputs: ["targetMarkerTemplate", "rows", "groupRowsBy", "groupedRows", "columns", "selected", "scrollbarV", "scrollbarH", "rowHeight", "columnMode", "headerHeight", "footerHeight", "externalPaging", "externalSorting", "limit", "count", "offset", "loadingIndicator", "selectionType", "reorderable", "swapColumns", "sortType", "sorts", "cssClasses", "messages", "rowClass", "selectCheck", "displayCheck", "groupExpansionDefault", "trackByProp", "selectAllRowsOnPage", "virtualization", "treeFromRelation", "treeToRelation", "summaryRow", "summaryHeight", "summaryPosition", "rowIdentity"], outputs: ["scroll", "activate", "select", "sort", "page", "reorder", "resize", "tableContextmenu", "treeAction"] }, { kind: "component", type: i1$1.IonFabButton, selector: "ion-fab-button", inputs: ["activated", "closeIcon", "color", "disabled", "download", "href", "mode", "rel", "routerAnimation", "routerDirection", "show", "size", "target", "translucent", "type"] }, { kind: "component", type: i1$1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "directive", type: ExportDataDirective, selector: "[tapExportData]", inputs: ["exportedFileName", "dataToExport", "format"], outputs: ["exportDataError"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
TapVariableTableComponent = __decorate([
MonitoringAppGenComponent({}),
__metadata("design:paramtypes", [ModalController,
ChangeDetectorRef])
], TapVariableTableComponent);
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableTableComponent, decorators: [{
type: Component,
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'tap-variable-table', template: "<div style=\"position: relative\">\n <ngx-datatable\n [ngClass]=\"darkModeStatus ? 'dark' : 'material'\"\n [rows]=\"rows\"\n [loadingIndicator]=\"loadingIndicator\"\n [columns]=\"columns\"\n [columnMode]=\"columnMode\"\n [headerHeight]=\"50\"\n [footerHeight]=\"50\"\n [rowHeight]=\"50\"\n [reorderable]=\"reorderable\"\n [scrollbarH]=\"true\"\n [limit]=\"limit\"\n >\n </ngx-datatable>\n <!--\n [targetMarkerTemplate]=\"targetMarkerTemplate\"\n <ng-template #targetMarkerTemplate let-class=\"class\">\n <div [ngClass]=\"class\">\n <div class=\"icon datatable-icon-down\"></div>\n <div class=\"icon datatable-icon-up\"></div>\n </div>\n </ng-template>\n -->\n\n <ion-fab-button\n id=\"exportFabButton\"\n size=\"small\"\n tapExportData\n [dataToExport]=\"createExportedData.bind(this)\"\n [exportedFileName]=\"exportedFileName\"\n *ngIf=\"showExportButton\"\n >\n <ion-icon name=\"download\"></ion-icon>\n </ion-fab-button>\n</div>\n", styles: [":host ::ng-deep .datatable-scroll{width:100%!important}:host ::ng-deep datatable-pager{width:85%!important}#exportFabButton{position:absolute;top:0;right:2px}:host ::ng-deep .page-count{white-space:nowrap!important}:host ::ng-deep .datatable-pager{max-width:85%!important}\n"] }]
}], ctorParameters: function () { return [{ type: i1$1.ModalController }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { loadingIndicator: [{
type: Input
}], reorderable: [{
type: Input
}], columnMode: [{
type: Input
}], limit: [{
type: Input
}], valueLabel: [{
type: Input
}], nameLabel: [{
type: Input
}], history: [{
type: Input
}], valueCountLimit: [{
type: Input
}], showExportButton: [{
type: Input
}], exportedFileName: [{
type: Input
}], label: [{
type: Input
}], variable: [{
type: Input
}], input: [{
type: Input
}] } });
class TapVariableTableModule {
}
/** @nocollapse */ TapVariableTableModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableTableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ TapVariableTableModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: TapVariableTableModule, declarations: [TapVariableTableComponent], imports: [CommonModule, i3$3.NgxDatatableModule, IonicModule,
ExportDataModule], exports: [TapVariableTableComponent] });
/** @nocollapse */ TapVariableTableModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableTableModule, imports: [CommonModule,
NgxDatatableModule.forRoot({
messages: {
emptyMessage: 'No data to display',
totalMessage: 'total',
selectedMessage: 'selected', // Footer selected message
},
}),
IonicModule,
ExportDataModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableTableModule, decorators: [{
type: NgModule,
args: [{
declarations: [TapVariableTableComponent],
exports: [TapVariableTableComponent],
imports: [
CommonModule,
NgxDatatableModule.forRoot({
messages: {
emptyMessage: 'No data to display',
totalMessage: 'total',
selectedMessage: 'selected', // Footer selected message
},
}),
IonicModule,
ExportDataModule,
],
}]
}] });
function stringToRegex(str) {
const matchResult = str.match(/\/(.+)\/(.*)/);
if (!matchResult) {
throw new Error(`Invalid regex string format "${str}". Regex should be surrended with '/' character.`);
}
return new RegExp(matchResult[1], matchResult[2]);
}
let TapVariableTextComponent = class TapVariableTextComponent extends MonitoringVariableValueComponent {
constructor() {
super(...arguments);
this.inputOptions = {
type: 'text',
};
}
set placeholder(value) {
this.inputOptions.placeholder = value;
}
set minLength(value) {
this.inputOptions.minLength = value || 0;
}
set maxLength(value) {
this.inputOptions.maxLength = value || 0;
}
set pattern(regex) {
if (typeof regex === 'string') {
regex = stringToRegex(regex);
}
this.inputOptions.pattern = regex;
}
};
/** @nocollapse */ TapVariableTextComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableTextComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ TapVariableTextComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TapVariableTextComponent, selector: "tap-variable-text", inputs: { placeholder: "placeholder", minLength: "minLength", maxLength: "maxLength", pattern: "pattern", value: "value" }, usesInheritance: true, ngImport: i0, template: "<tap-value-editor-container\n #ctx\n [variable]=\"_variable\"\n [showRefreshButton]=\"refreshable\"\n [showEditButton]=\"editable\"\n [showSubmitButton]=\"true\"\n [modalEdition]=\"modalEdition\"\n [inputOptions]=\"inputOptions\"\n [lines]=\"lines\"\n>\n <tap-inline-editor\n [forceValue]=\"forceValue\"\n [value]=\"\n ctx.pendingSubmitValue === undefined ? _value : ctx.pendingSubmitValue\n \"\n [editMode]=\"ctx.editModeChange | async\"\n (editModeChange)=\"onEditModeChange($event)\"\n [editable]=\"editable && ctx.pendingSubmitValue === undefined\"\n [fieldError]=\"fieldError\"\n [inputOptions]=\"inputOptions\"\n [unitValue]=\"unitValue\"\n [valueStyle]=\"valueStyle\"\n (valueChange)=\"onValueChange($event)\"\n (onSubmit)=\"onSubmit($event)\"\n >\n </tap-inline-editor>\n</tap-value-editor-container>\n", styles: [""], dependencies: [{ kind: "component", type: i1$3.InlineEditorComponent, selector: "tap-inline-editor", inputs: ["editMode", "editable", "unitValue", "inputOptions", "valueStyle", "value", "forceValue", "showLoader", "fieldError"], outputs: ["onSubmit", "valueChange", "editModeChange"] }, { kind: "component", type: i1$3.TapValueEditorContainerComponent, selector: "tap-value-editor-container", inputs: ["button", "variable", "inputOptions", "showRefreshButton", "showSubmitButton", "showEditButton", "error", "lines", "modalEdition", "value"], outputs: ["submit", "refresh"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }] });
TapVariableTextComponent = __decorate([
MonitoringAppGenComponent({
constraints: {
isArray: 'NO',
},
events: [
{
name: 'submit',
dataType: 'string',
},
],
})
], TapVariableTextComponent);
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableTextComponent, decorators: [{
type: Component,
args: [{ selector: 'tap-variable-text', template: "<tap-value-editor-container\n #ctx\n [variable]=\"_variable\"\n [showRefreshButton]=\"refreshable\"\n [showEditButton]=\"editable\"\n [showSubmitButton]=\"true\"\n [modalEdition]=\"modalEdition\"\n [inputOptions]=\"inputOptions\"\n [lines]=\"lines\"\n>\n <tap-inline-editor\n [forceValue]=\"forceValue\"\n [value]=\"\n ctx.pendingSubmitValue === undefined ? _value : ctx.pendingSubmitValue\n \"\n [editMode]=\"ctx.editModeChange | async\"\n (editModeChange)=\"onEditModeChange($event)\"\n [editable]=\"editable && ctx.pendingSubmitValue === undefined\"\n [fieldError]=\"fieldError\"\n [inputOptions]=\"inputOptions\"\n [unitValue]=\"unitValue\"\n [valueStyle]=\"valueStyle\"\n (valueChange)=\"onValueChange($event)\"\n (onSubmit)=\"onSubmit($event)\"\n >\n </tap-inline-editor>\n</tap-value-editor-container>\n" }]
}], propDecorators: { placeholder: [{
type: Input
}], minLength: [{
type: Input
}], maxLength: [{
type: Input
}], pattern: [{
type: Input
}], value: [{
type: Input
}] } });
class TapVariableTextModule {
}
/** @nocollapse */ TapVariableTextModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableTextModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ TapVariableTextModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: TapVariableTextModule, declarations: [TapVariableTextComponent], imports: [CommonModule,
IonicModule,
InlineEditorModule,
TapValueEditorContainerModule], exports: [TapVariableTextComponent] });
/** @nocollapse */ TapVariableTextModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableTextModule, providers: [DecimalPipe], imports: [CommonModule,
IonicModule,
InlineEditorModule,
TapValueEditorContainerModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableTextModule, decorators: [{
type: NgModule,
args: [{
declarations: [TapVariableTextComponent],
exports: [TapVariableTextComponent],
providers: [DecimalPipe],
imports: [
CommonModule,
IonicModule,
InlineEditorModule,
TapValueEditorContainerModule,
],
}]
}] });
class TextCardComponent {
set inputStream(stream) {
var _a;
if (stream) {
(_a = this.subscription) === null || _a === void 0 ? void 0 : _a.unsubscribe();
this.subscription = stream.subscribe({
next: (value) => {
if (this.template) {
value = this.template.replace('#value#', value);
}
this.value = value;
},
error: (err) => {
this.error = err;
},
});
}
}
constructor() {
this.options = {
initialValue: '0',
};
this.color = 'dark';
this.value = this.options.initialValue;
}
ngOnDestroy() {
var _a;
(_a = this.subscription) === null || _a === void 0 ? void 0 : _a.unsubscribe();
}
}
/** @nocollapse */ TextCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TextCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ TextCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TextCardComponent, selector: "monitoring-text-card", inputs: { options: "options", title: "title", subtitle: "subtitle", template: "template", unit: "unit", icon: "icon", color: "color", inputStream: "inputStream" }, ngImport: i0, template: "<ion-card>\n <ion-item *ngIf=\"title || icon\" lines=\"full\" [color]=\"color\">\n <ion-icon *ngIf=\"icon\" name=\"{{ icon }}\" slot=\"start\"></ion-icon>\n <ion-label *ngIf=\"title\">{{ title }}</ion-label>\n <ion-icon *ngIf=\"icon\" slot=\"end\"></ion-icon>\n </ion-item>\n <ion-card-content>\n <span class=\"variable-value\" *ngIf=\"value\">{{ value }}</span>\n <br *ngIf=\"unit\" />\n <span *ngIf=\"unit\" class=\"unit\">{{ unit }}</span>\n </ion-card-content>\n <ion-card-content *ngIf=\"error\">\n {{ error }}\n </ion-card-content>\n <ion-card-content *ngIf=\"subtitle\" class=\"text-center\">\n <ion-text class=\"description\">{{ subtitle }}</ion-text>\n </ion-card-content>\n</ion-card>\n", styles: [".variable-value{font-size:1.4em;font-weight:700}ion-card,ion-card ion-item,ion-card-subtitle,ion-item ion-card-subtitle{text-align:center}.description{font-size:.9em;color:#777;text-align:center}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1$1.IonCard, selector: "ion-card", inputs: ["button", "color", "disabled", "download", "href", "mode", "rel", "routerAnimation", "routerDirection", "target", "type"] }, { kind: "component", type: i1$1.IonCardContent, selector: "ion-card-content", inputs: ["mode"] }, { kind: "component", type: i1$1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i1$1.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: i1$1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i1$1.IonText, selector: "ion-text", inputs: ["color", "mode"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TextCardComponent, decorators: [{
type: Component,
args: [{ selector: 'monitoring-text-card', template: "<ion-card>\n <ion-item *ngIf=\"title || icon\" lines=\"full\" [color]=\"color\">\n <ion-icon *ngIf=\"icon\" name=\"{{ icon }}\" slot=\"start\"></ion-icon>\n <ion-label *ngIf=\"title\">{{ title }}</ion-label>\n <ion-icon *ngIf=\"icon\" slot=\"end\"></ion-icon>\n </ion-item>\n <ion-card-content>\n <span class=\"variable-value\" *ngIf=\"value\">{{ value }}</span>\n <br *ngIf=\"unit\" />\n <span *ngIf=\"unit\" class=\"unit\">{{ unit }}</span>\n </ion-card-content>\n <ion-card-content *ngIf=\"error\">\n {{ error }}\n </ion-card-content>\n <ion-card-content *ngIf=\"subtitle\" class=\"text-center\">\n <ion-text class=\"description\">{{ subtitle }}</ion-text>\n </ion-card-content>\n</ion-card>\n", styles: [".variable-value{font-size:1.4em;font-weight:700}ion-card,ion-card ion-item,ion-card-subtitle,ion-item ion-card-subtitle{text-align:center}.description{font-size:.9em;color:#777;text-align:center}\n"] }]
}], ctorParameters: function () { return []; }, propDecorators: { options: [{
type: Input
}], title: [{
type: Input
}], subtitle: [{
type: Input
}], template: [{
type: Input
}], unit: [{
type: Input
}], icon: [{
type: Input
}], color: [{
type: Input
}], inputStream: [{
type: Input
}] } });
class TextCardModule {
}
/** @nocollapse */ TextCardModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TextCardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ TextCardModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: TextCardModule, declarations: [TextCardComponent], imports: [CommonModule, IonicModule], exports: [TextCardComponent] });
/** @nocollapse */ TextCardModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TextCardModule, imports: [CommonModule, IonicModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TextCardModule, decorators: [{
type: NgModule,
args: [{
declarations: [TextCardComponent],
exports: [TextCardComponent],
imports: [CommonModule, IonicModule],
}]
}] });
class VariableCardComponent {
// private _switchButtonSubscription?: Subscription;
set variable(variable) {
// console.log('VariableCardComponent', 'SET VARIABLE', variable);
this._variable = variable;
if (this._subscription) {
this._subscription.unsubscribe();
}
this._subscription = variable.values.subscribe({
next: (value) => {
if (this.refreshValues) {
this.value = value;
}
},
error: (error) => {
// console.warn(`Monitoring error: `, error);
this.error = error;
},
complete: () => {
// console.warn('VariableCardComponent', 'values observable is complete')
},
});
}
get variable() {
return getAbstractVariableOrError(this._variable);
}
constructor(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.bundleName = '...';
this.value = 'Unknown';
this.refreshValues = false;
this.monitoringButtons = [0, 1, 2, 3, 4, 5].map((v) => {
return {
label: `${v}`,
value: v,
};
});
this.selectOptions = [0, 1, 2, 3, 4, 5].map((v) => {
return {
key: v,
text: `Value ${v}`,
};
});
}
get variableConfig() {
if (this._variable instanceof TapVariable) {
return this._variable.context.config;
}
return undefined;
}
// editConfig() {
// this.router.navigate(['/device/monitoring/add']);
// }
switchButtonToggleAction(checked) {
return __awaiter(this, void 0, void 0, function* () {
if (!this._variable) {
throw LibError.componentArgumentRequired('VariableCardComponent', 'variable');
}
const value = checked ? 1 : 0;
yield this._variable.write(value);
// .catch((error) => {
// console.warn(`Cannot write ${this._variable.identifier()}: ${error}`)
// this.error = error;
// })
});
}
// onEditEvent(event: MonitoringEditTextEvent) {
// console.log('EDIT EVENT => ', event);
// switch (event.type) {
// case 'CLOSE':
// this.editMode = false;
// break;
// case 'WRITE_SUCCESS':
// this.editMode = false;
// break;
// }
// }
ngOnDestroy() {
if (this._subscription) {
this._subscription.unsubscribe();
}
// if (this._switchButtonSubscription) {
// this._switchButtonSubscription.unsubscribe();
// }
}
onCardTypeChange($event) {
// console.log('onCardTypeChange', $event);
// this.cardType = $event.detail.value;
}
toggleMonitoring() {
// 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();
// }
// }
}
}
/** @nocollapse */ VariableCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: VariableCardComponent, deps: [{ token: i1$4.Router }], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ VariableCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: VariableCardComponent, selector: "app-variable-card", inputs: { cardType: "cardType", cardTypes: "cardTypes", editMode: "editMode", monitor: "monitor", showStartStopMonitoring: "showStartStopMonitoring", unit: "unit", bundleName: "bundleName", variable: "variable" }, ngImport: i0, template: "<ion-card *ngIf=\"_variable\">\n <ion-item lines=\"none\">\n <ion-label slot=\"start\">{{ bundleName }}</ion-label>\n <ion-label slot=\"end\">#{{ _variable.id }}</ion-label>\n </ion-item>\n <!-- <ion-item>\n <ion-icon *ngIf=\"icon\" name=\"{{icon}}\" slot=\"start\"></ion-icon>\n <ion-label>{{variable.identifier() || variableConfig.id }}</ion-label>\n </ion-item> -->\n <ion-card-content *ngIf=\"monitor\">\n <ng-container [ngSwitch]=\"cardType\">\n <ion-item *ngSwitchCase=\"'text'\" lines=\"none\" class=\"ion-no-padding\">\n <monitoring-variable-value\n style=\"margin: auto\"\n [lines]=\"'none'\"\n [variable]=\"variable\"\n [editable]=\"editMode\"\n ></monitoring-variable-value>\n <span slot=\"end\" *ngIf=\"unit\" class=\"unit\">{{ unit }}</span>\n </ion-item>\n <ion-item *ngSwitchCase=\"'select'\" lines=\"none\" class=\"ion-no-padding\">\n <tap-variable-select\n style=\"margin: auto\"\n [lines]=\"'none'\"\n [variable]=\"variable\"\n [options]=\"selectOptions\"\n [editable]=\"editMode\"\n ></tap-variable-select>\n <span slot=\"end\" *ngIf=\"unit\" class=\"unit\">{{ unit }}</span>\n </ion-item>\n <tap-variable-toggle\n *ngSwitchCase=\"'switch'\"\n [variable]=\"_variable\"\n ></tap-variable-toggle>\n <tap-variable-buttons\n *ngSwitchCase=\"'buttons'\"\n [variable]=\"variable\"\n [buttons]=\"monitoringButtons\"\n ></tap-variable-buttons>\n <tap-variable-range\n *ngSwitchCase=\"'range'\"\n [variable]=\"_variable\"\n [pin]=\"true\"\n [snaps]=\"true\"\n [ticks]=\"true\"\n [min]=\"0\"\n [max]=\"100\"\n ></tap-variable-range>\n <ion-text color=\"danger\" *ngSwitchDefault>\n <ion-icon name=\"alert\"></ion-icon> Unknown card type {{ cardType }}\n </ion-text>\n </ng-container>\n </ion-card-content>\n <ion-card-content *ngIf=\"error\">\n <ion-text color=\"danger\">{{ error }}</ion-text>\n </ion-card-content>\n <!--\n <ion-item>\n <ion-select\n [(ngModel)]=\"cardType\"\n okText=\"Select\"\n cancelText=\"Dismiss\"\n (ionChange)=\"onCardTypeChange($event)\"\n >\n <ion-select-option\n *ngFor=\"let cardType of cardTypes\"\n value=\"{{ cardType }}\"\n >{{ cardType }}</ion-select-option\n >\n </ion-select>\n <ion-buttons slot=\"end\">\n <ion-button (click)=\"toggleMonitoring()\" *ngIf=\"showStartStopMonitoring\">\n <ion-icon *ngIf=\"!playMonitoring\" name=\"play\"></ion-icon>\n <ion-icon *ngIf=\"playMonitoring\" name=\"pause\"></ion-icon>\n </ion-button>\n <ion-button (click)=\"editMode = !editMode\">\n <ion-icon *ngIf=\"!editMode\" name=\"create\"></ion-icon> <span *ngIf=\"!editMode\"></span>\n <ion-icon *ngIf=\"editMode\" name=\"close\"></ion-icon> \n </ion-button>\n <ion-button (click)=\"editConfig()\">\n \n <ion-icon name=\"cog\"></ion-icon> \n </ion-button>\n </ion-buttons>\n </ion-item>\n -->\n</ion-card>\n", styles: [".variable-value{font-size:1.4em;font-weight:700}ion-card-content{text-align:center}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i2.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: i1$1.IonCard, selector: "ion-card", inputs: ["button", "color", "disabled", "download", "href", "mode", "rel", "routerAnimation", "routerDirection", "target", "type"] }, { kind: "component", type: i1$1.IonCardContent, selector: "ion-card-content", inputs: ["mode"] }, { kind: "component", type: i1$1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i1$1.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: i1$1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i1$1.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { kind: "component", type: MonitoringVariableValueComponent, selector: "monitoring-variable-value", inputs: ["lines", "unitValue", "error", "variable", "config", "inputOptions", "editable", "modalEdition", "valueStyle", "digitsInfo", "refreshable", "valueFormatting"] }, { kind: "component", type: TapVariableRangeComponent, selector: "tap-variable-range", inputs: ["variable", "editable", "writeValueForEveryChange", "min", "max", "step", "color", "pin", "snaps", "ticks", "debounce", "leftIcon", "leftIconColor", "rightIcon", "rightIconColor", "value"], outputs: ["valueChange"] }, { kind: "component", type: TapVariableButtonsComponent, selector: "tap-variable-buttons", inputs: ["variable", "editable", "color", "segment", "buttons"] }, { kind: "component", type: TapVariableToggleComponent, selector: "tap-variable-toggle", inputs: ["textOnLeft", "textOnRight", "lines", "toggleColor", "variable", "editable", "valueOn", "valueOff", "chip"] }, { kind: "component", type: TapVariableSelectComponent, selector: "tap-variable-select", inputs: ["variable", "value", "editable", "refreshable", "multiple", "lines", "options"], outputs: ["valueChange"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: VariableCardComponent, decorators: [{
type: Component,
args: [{ selector: 'app-variable-card', template: "<ion-card *ngIf=\"_variable\">\n <ion-item lines=\"none\">\n <ion-label slot=\"start\">{{ bundleName }}</ion-label>\n <ion-label slot=\"end\">#{{ _variable.id }}</ion-label>\n </ion-item>\n <!-- <ion-item>\n <ion-icon *ngIf=\"icon\" name=\"{{icon}}\" slot=\"start\"></ion-icon>\n <ion-label>{{variable.identifier() || variableConfig.id }}</ion-label>\n </ion-item> -->\n <ion-card-content *ngIf=\"monitor\">\n <ng-container [ngSwitch]=\"cardType\">\n <ion-item *ngSwitchCase=\"'text'\" lines=\"none\" class=\"ion-no-padding\">\n <monitoring-variable-value\n style=\"margin: auto\"\n [lines]=\"'none'\"\n [variable]=\"variable\"\n [editable]=\"editMode\"\n ></monitoring-variable-value>\n <span slot=\"end\" *ngIf=\"unit\" class=\"unit\">{{ unit }}</span>\n </ion-item>\n <ion-item *ngSwitchCase=\"'select'\" lines=\"none\" class=\"ion-no-padding\">\n <tap-variable-select\n style=\"margin: auto\"\n [lines]=\"'none'\"\n [variable]=\"variable\"\n [options]=\"selectOptions\"\n [editable]=\"editMode\"\n ></tap-variable-select>\n <span slot=\"end\" *ngIf=\"unit\" class=\"unit\">{{ unit }}</span>\n </ion-item>\n <tap-variable-toggle\n *ngSwitchCase=\"'switch'\"\n [variable]=\"_variable\"\n ></tap-variable-toggle>\n <tap-variable-buttons\n *ngSwitchCase=\"'buttons'\"\n [variable]=\"variable\"\n [buttons]=\"monitoringButtons\"\n ></tap-variable-buttons>\n <tap-variable-range\n *ngSwitchCase=\"'range'\"\n [variable]=\"_variable\"\n [pin]=\"true\"\n [snaps]=\"true\"\n [ticks]=\"true\"\n [min]=\"0\"\n [max]=\"100\"\n ></tap-variable-range>\n <ion-text color=\"danger\" *ngSwitchDefault>\n <ion-icon name=\"alert\"></ion-icon> Unknown card type {{ cardType }}\n </ion-text>\n </ng-container>\n </ion-card-content>\n <ion-card-content *ngIf=\"error\">\n <ion-text color=\"danger\">{{ error }}</ion-text>\n </ion-card-content>\n <!--\n <ion-item>\n <ion-select\n [(ngModel)]=\"cardType\"\n okText=\"Select\"\n cancelText=\"Dismiss\"\n (ionChange)=\"onCardTypeChange($event)\"\n >\n <ion-select-option\n *ngFor=\"let cardType of cardTypes\"\n value=\"{{ cardType }}\"\n >{{ cardType }}</ion-select-option\n >\n </ion-select>\n <ion-buttons slot=\"end\">\n <ion-button (click)=\"toggleMonitoring()\" *ngIf=\"showStartStopMonitoring\">\n <ion-icon *ngIf=\"!playMonitoring\" name=\"play\"></ion-icon>\n <ion-icon *ngIf=\"playMonitoring\" name=\"pause\"></ion-icon>\n </ion-button>\n <ion-button (click)=\"editMode = !editMode\">\n <ion-icon *ngIf=\"!editMode\" name=\"create\"></ion-icon> <span *ngIf=\"!editMode\"></span>\n <ion-icon *ngIf=\"editMode\" name=\"close\"></ion-icon> \n </ion-button>\n <ion-button (click)=\"editConfig()\">\n \n <ion-icon name=\"cog\"></ion-icon> \n </ion-button>\n </ion-buttons>\n </ion-item>\n -->\n</ion-card>\n", styles: [".variable-value{font-size:1.4em;font-weight:700}ion-card-content{text-align:center}\n"] }]
}], ctorParameters: function () { return [{ type: i1$4.Router }]; }, propDecorators: { cardType: [{
type: Input
}], cardTypes: [{
type: Input
}], editMode: [{
type: Input
}], monitor: [{
type: Input
}], showStartStopMonitoring: [{
type: Input
}], unit: [{
type: Input
}], bundleName: [{
type: Input
}], variable: [{
type: Input
}] } });
class VariableCardModule {
}
/** @nocollapse */ VariableCardModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: VariableCardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ VariableCardModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: VariableCardModule, declarations: [VariableCardComponent], imports: [CommonModule,
FormsModule,
ReactiveFormsModule,
IonicModule,
GaugeCardModule,
MonitoringVariableValueModule,
TapVariableRangeModule,
TapVariableLineChartModule,
TapVariableButtonsModule,
TapVariableToggleModule,
TapVariableTextModule,
TapVariableSelectModule], exports: [VariableCardComponent] });
/** @nocollapse */ VariableCardModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: VariableCardModule, imports: [CommonModule,
FormsModule,
ReactiveFormsModule,
IonicModule,
GaugeCardModule,
MonitoringVariableValueModule,
TapVariableRangeModule,
TapVariableLineChartModule,
TapVariableButtonsModule,
TapVariableToggleModule,
TapVariableTextModule,
TapVariableSelectModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: VariableCardModule, decorators: [{
type: NgModule,
args: [{
declarations: [VariableCardComponent],
exports: [VariableCardComponent],
imports: [
CommonModule,
FormsModule,
ReactiveFormsModule,
IonicModule,
GaugeCardModule,
MonitoringVariableValueModule,
TapVariableRangeModule,
TapVariableLineChartModule,
TapVariableButtonsModule,
TapVariableToggleModule,
TapVariableTextModule,
TapVariableSelectModule,
],
}]
}] });
class ChartContainerComponent {
constructor() { }
get offsetWidth() {
var _a;
return ((_a = this.containerRef) === null || _a === void 0 ? void 0 : _a.nativeElement.offsetWidth) || 0;
}
get offsetHeight() {
var _a;
return ((_a = this.containerRef) === null || _a === void 0 ? void 0 : _a.nativeElement.offsetHeight) || 0;
}
}
/** @nocollapse */ ChartContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ChartContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ ChartContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: ChartContainerComponent, selector: "dashboard-component-chart-container", inputs: { legendPosition: "legendPosition", legend: "legend" }, viewQueries: [{ propertyName: "containerRef", first: true, predicate: ["containerRef"], descendants: true }], ngImport: i0, template: "<div\n #containerRef\n style=\"position: relative\"\n class=\"chart-container\"\n [ngClass]=\"\n legendPosition === 'below' && legend ? 'belowLegend' : 'rightLegend'\n \"\n>\n <ng-content></ng-content>\n</div>\n", styles: ["::ng-deep .horizontal-legend{overflow:auto!important}.belowLegend{height:50vh;width:100%;margin-bottom:100px}.rightLegend{height:50vh;width:100%}#exportFabButton{position:absolute;top:10px;right:10px}@media (prefers-color-scheme: dark){::ng-deep span.legend-label-text{color:#ccc!important}::ng-deep span.legend-label-text:hover{color:#fff!important}::ng-deep .ngx-charts text{fill:#fff!important}::ng-deep .ngx-charts .tooltip-anchor{fill:var(--ion-color-primary)!important}}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ChartContainerComponent, decorators: [{
type: Component,
args: [{ selector: 'dashboard-component-chart-container', template: "<div\n #containerRef\n style=\"position: relative\"\n class=\"chart-container\"\n [ngClass]=\"\n legendPosition === 'below' && legend ? 'belowLegend' : 'rightLegend'\n \"\n>\n <ng-content></ng-content>\n</div>\n", styles: ["::ng-deep .horizontal-legend{overflow:auto!important}.belowLegend{height:50vh;width:100%;margin-bottom:100px}.rightLegend{height:50vh;width:100%}#exportFabButton{position:absolute;top:10px;right:10px}@media (prefers-color-scheme: dark){::ng-deep span.legend-label-text{color:#ccc!important}::ng-deep span.legend-label-text:hover{color:#fff!important}::ng-deep .ngx-charts text{fill:#fff!important}::ng-deep .ngx-charts .tooltip-anchor{fill:var(--ion-color-primary)!important}}\n"] }]
}], ctorParameters: function () { return []; }, propDecorators: { legendPosition: [{
type: Input
}], legend: [{
type: Input
}], containerRef: [{
type: ViewChild,
args: ['containerRef']
}] } });
class ChartContainerModule {
}
/** @nocollapse */ ChartContainerModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ChartContainerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ ChartContainerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: ChartContainerModule, declarations: [ChartContainerComponent], imports: [CommonModule, IonicModule], exports: [ChartContainerComponent] });
/** @nocollapse */ ChartContainerModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ChartContainerModule, imports: [CommonModule, IonicModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ChartContainerModule, decorators: [{
type: NgModule,
args: [{
declarations: [ChartContainerComponent],
exports: [ChartContainerComponent],
imports: [CommonModule, IonicModule],
}]
}] });
class TapMonitoringComponentsModule {
}
/** @nocollapse */ TapMonitoringComponentsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapMonitoringComponentsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ TapMonitoringComponentsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: TapMonitoringComponentsModule, imports: [CommonModule, IonicModule], exports: [LibCommonModule,
MonitoringActionsModule,
MonitoringVariableValueModule,
GaugeCardModule,
MonitoringEditTextModule,
MonitoringTableModule,
VariableCardModule,
MonitoringRangeModule,
BarChartStackedModule,
TextCardModule,
ChartContainerModule,
TapVariableButtonsModule,
TapVariableBarChartModule,
TapVariableBarChartGroupModule,
TapVariableLineChartModule,
TapVariableContextModule,
TapVariableDataPopupModule,
TapVariableDateTimePickerModule,
TapVariableGaugeModule,
TapVariableGpioModeModule,
TapVariableGpioValueModule,
TapVariableHeatMapChartModule,
TapVariableNumberChartModule,
TapVariableNumberModule,
TapVariablePieChartAdvancedModule,
TapVariablePieChartGridModule,
TapVariablePolarRadarChartModule,
TapVariableRangeModule,
TapVariableSelectModule,
TapVariableSwitchPictureModule,
TapVariableTableModule,
TapVariableTextModule,
TapVariableToggleModule,
TapVariableColorPickerModule,
TapVariableLinearGaugeModule,
TapVariablePushButtonModule,
TapVariableBitsEditorModule,
PieChartModule,
NgxChartsModule] });
/** @nocollapse */ TapMonitoringComponentsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapMonitoringComponentsModule, imports: [CommonModule, IonicModule, LibCommonModule,
MonitoringActionsModule,
MonitoringVariableValueModule,
GaugeCardModule,
MonitoringEditTextModule,
MonitoringTableModule,
VariableCardModule,
MonitoringRangeModule,
BarChartStackedModule,
TextCardModule,
ChartContainerModule,
TapVariableButtonsModule,
TapVariableBarChartModule,
TapVariableBarChartGroupModule,
TapVariableLineChartModule,
TapVariableContextModule,
TapVariableDataPopupModule,
TapVariableDateTimePickerModule,
TapVariableGaugeModule,
TapVariableGpioModeModule,
TapVariableGpioValueModule,
TapVariableHeatMapChartModule,
TapVariableNumberChartModule,
TapVariableNumberModule,
TapVariablePieChartAdvancedModule,
TapVariablePieChartGridModule,
TapVariablePolarRadarChartModule,
TapVariableRangeModule,
TapVariableSelectModule,
TapVariableSwitchPictureModule,
TapVariableTableModule,
TapVariableTextModule,
TapVariableToggleModule,
TapVariableColorPickerModule,
TapVariableLinearGaugeModule,
TapVariablePushButtonModule,
TapVariableBitsEditorModule,
PieChartModule,
NgxChartsModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapMonitoringComponentsModule, decorators: [{
type: NgModule,
args: [{
declarations: [],
exports: [
LibCommonModule,
MonitoringActionsModule,
MonitoringVariableValueModule,
GaugeCardModule,
MonitoringEditTextModule,
MonitoringTableModule,
VariableCardModule,
MonitoringRangeModule,
BarChartStackedModule,
TextCardModule,
ChartContainerModule,
TapVariableButtonsModule,
TapVariableBarChartModule,
TapVariableBarChartGroupModule,
TapVariableLineChartModule,
TapVariableContextModule,
TapVariableDataPopupModule,
TapVariableDateTimePickerModule,
TapVariableGaugeModule,
TapVariableGpioModeModule,
TapVariableGpioValueModule,
TapVariableHeatMapChartModule,
TapVariableNumberChartModule,
TapVariableNumberModule,
TapVariablePieChartAdvancedModule,
TapVariablePieChartGridModule,
TapVariablePolarRadarChartModule,
TapVariableRangeModule,
TapVariableSelectModule,
TapVariableSwitchPictureModule,
TapVariableTableModule,
TapVariableTextModule,
TapVariableToggleModule,
TapVariableColorPickerModule,
TapVariableLinearGaugeModule,
TapVariablePushButtonModule,
TapVariableBitsEditorModule,
PieChartModule,
NgxChartsModule,
],
imports: [CommonModule, IonicModule],
}]
}] });
class HexstringPipe {
transform(value, args) {
return bufferToHexString(value);
}
}
/** @nocollapse */ HexstringPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: HexstringPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
/** @nocollapse */ HexstringPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: HexstringPipe, name: "hexstring" });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: HexstringPipe, decorators: [{
type: Pipe,
args: [{
name: 'hexstring',
}]
}] });
class TapMonitoringModule {
}
/** @nocollapse */ TapMonitoringModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapMonitoringModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ TapMonitoringModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: TapMonitoringModule, declarations: [HexstringPipe], imports: [CommonModule, IonicModule], exports: [TapMonitoringComponentsModule,
TapMonitoringSettingsModule,
NgxChartsModule,
HexstringPipe] });
/** @nocollapse */ TapMonitoringModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapMonitoringModule, imports: [CommonModule, IonicModule, TapMonitoringComponentsModule,
TapMonitoringSettingsModule,
NgxChartsModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapMonitoringModule, decorators: [{
type: NgModule,
args: [{
declarations: [HexstringPipe],
imports: [CommonModule, IonicModule],
exports: [
TapMonitoringComponentsModule,
TapMonitoringSettingsModule,
NgxChartsModule,
HexstringPipe,
],
}]
}] });
class TapDatalogTableComponent {
constructor(changeRefDetector) {
this.changeRefDetector = changeRefDetector;
this.dataColumns = [];
this.date = true;
this.sync = true;
this.onSyncEvent = new EventEmitter();
this.onRetrySync = new EventEmitter();
}
set dataLogger(dataLogger) {
if (dataLogger) {
dataLogger.stream.subscribe((p) => {
if (this.dataColumns.length === 0) {
this.initColumnsFromPacket(p);
}
if (!this._packets) {
this._packets = [];
}
this._packets.push(p);
this.changeRefDetector.detectChanges();
});
}
}
set packets(packets) {
this._packets = packets;
if (packets && this.dataColumns.length === 0 && packets.length > 0) {
this.initColumnsFromPacket(packets[0]);
}
}
get packets() {
return this._packets;
}
packetVariableValue(packet, key) {
let value = packet.decodedData[key];
if (value instanceof Uint8Array) {
value = `0x${bufferToHexString(value)}`;
}
return value;
}
packetId(packet) {
return packet.meta.packetId;
}
packetDate(packet) {
return packet.meta.logTime;
}
isPacketSync(packetInfo) {
if (!('syncInfo' in packetInfo)) {
return false;
}
return packetInfo.syncInfo && packetInfo.syncInfo.isSync;
}
syncPacket(packetInfo) {
this.onRetrySync.emit(packetInfo);
}
initColumnsFromPacket(p) {
this.dataColumns = Object.keys(p.decodedData).map((key) => {
return {
key: key,
title: key,
};
});
}
}
/** @nocollapse */ TapDatalogTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapDatalogTableComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ TapDatalogTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TapDatalogTableComponent, selector: "tap-datalog-table", inputs: { dataColumns: "dataColumns", date: "date", sync: "sync", dataLogger: "dataLogger", packets: "packets" }, outputs: { onSyncEvent: "onSyncEvent", onRetrySync: "onRetrySync" }, ngImport: i0, template: "<table *ngIf=\"dataColumns\" class=\"table\" mat-table>\n <thead>\n <th *ngIf=\"date\"><ion-icon name=\"time\"></ion-icon> Date</th>\n <th><ion-icon name=\"document\"></ion-icon> ID</th>\n <th *ngFor=\"let dataColumn of dataColumns\">\n <ion-icon name=\"analytics\"></ion-icon> {{ dataColumn.title }}\n </th>\n <th *ngIf=\"sync\"><ion-icon name=\"cloud\"></ion-icon> Cloud sync</th>\n </thead>\n <tbody>\n <tr *ngFor=\"let packet of packets\">\n <td *ngIf=\"date\">\n {{ packetDate(packet) | date: 'short' }}\n </td>\n <td>\n {{ packetId(packet) }}\n </td>\n <td *ngFor=\"let info of dataColumns\">\n {{ packetVariableValue(packet, info.key) }}\n </td>\n <td *ngIf=\"sync\">\n <ion-text *ngIf=\"isPacketSync(packet)\" color=\"success\">\n <ion-icon [name]=\"'checkmark'\"></ion-icon> Sync\n </ion-text>\n <ion-text *ngIf=\"!isPacketSync(packet)\" color=\"danger\">\n <ion-icon [name]=\"'alert'\"></ion-icon> Not sync \n <a (click)=\"syncPacket(packet)\"> retry </a>\n </ion-text>\n <!-- <ion-buttons slot=\"end\">\n <ion-button (click)=\"syncPacket(packet)\" [color]=\"isPacketSync(packet) ? 'success': ''\" [disabled]=\"isPacketSync(packet)\">\n <ion-icon [name]=\"isPacketSync(packet) ? 'checkmark' : 'sync'\"></ion-icon>\n Sync\n </ion-button>\n <ion-button (click)=\"decodePacket(syncInfo)\">\n <ion-icon name=\"sync\"></ion-icon>\n Decode\n </ion-button> \n <ion-button (click)=\"detail(syncInfo)\">\n <ion-icon name=\"more\"></ion-icon>\n Detail\n </ion-button> \n </ion-buttons>-->\n </td>\n </tr>\n </tbody>\n</table>\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;text-align:left}@media only screen and (max-width: 760px),(min-device-width: 768px) and (max-device-width: 1024px){table,thead,tbody,th,td,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}}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1$1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i1$1.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { kind: "pipe", type: i2.DatePipe, name: "date" }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapDatalogTableComponent, decorators: [{
type: Component,
args: [{ selector: 'tap-datalog-table', template: "<table *ngIf=\"dataColumns\" class=\"table\" mat-table>\n <thead>\n <th *ngIf=\"date\"><ion-icon name=\"time\"></ion-icon> Date</th>\n <th><ion-icon name=\"document\"></ion-icon> ID</th>\n <th *ngFor=\"let dataColumn of dataColumns\">\n <ion-icon name=\"analytics\"></ion-icon> {{ dataColumn.title }}\n </th>\n <th *ngIf=\"sync\"><ion-icon name=\"cloud\"></ion-icon> Cloud sync</th>\n </thead>\n <tbody>\n <tr *ngFor=\"let packet of packets\">\n <td *ngIf=\"date\">\n {{ packetDate(packet) | date: 'short' }}\n </td>\n <td>\n {{ packetId(packet) }}\n </td>\n <td *ngFor=\"let info of dataColumns\">\n {{ packetVariableValue(packet, info.key) }}\n </td>\n <td *ngIf=\"sync\">\n <ion-text *ngIf=\"isPacketSync(packet)\" color=\"success\">\n <ion-icon [name]=\"'checkmark'\"></ion-icon> Sync\n </ion-text>\n <ion-text *ngIf=\"!isPacketSync(packet)\" color=\"danger\">\n <ion-icon [name]=\"'alert'\"></ion-icon> Not sync \n <a (click)=\"syncPacket(packet)\"> retry </a>\n </ion-text>\n <!-- <ion-buttons slot=\"end\">\n <ion-button (click)=\"syncPacket(packet)\" [color]=\"isPacketSync(packet) ? 'success': ''\" [disabled]=\"isPacketSync(packet)\">\n <ion-icon [name]=\"isPacketSync(packet) ? 'checkmark' : 'sync'\"></ion-icon>\n Sync\n </ion-button>\n <ion-button (click)=\"decodePacket(syncInfo)\">\n <ion-icon name=\"sync\"></ion-icon>\n Decode\n </ion-button> \n <ion-button (click)=\"detail(syncInfo)\">\n <ion-icon name=\"more\"></ion-icon>\n Detail\n </ion-button> \n </ion-buttons>-->\n </td>\n </tr>\n </tbody>\n</table>\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;text-align:left}@media only screen and (max-width: 760px),(min-device-width: 768px) and (max-device-width: 1024px){table,thead,tbody,th,td,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}}\n"] }]
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { dataColumns: [{
type: Input
}], date: [{
type: Input
}], sync: [{
type: Input
}], onSyncEvent: [{
type: Output
}], dataLogger: [{
type: Input
}], packets: [{
type: Input
}], onRetrySync: [{
type: Output
}] } });
class TapDatalogTableModule {
}
/** @nocollapse */ TapDatalogTableModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapDatalogTableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ TapDatalogTableModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: TapDatalogTableModule, declarations: [TapDatalogTableComponent], imports: [CommonModule, IonicModule], exports: [TapDatalogTableComponent] });
/** @nocollapse */ TapDatalogTableModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapDatalogTableModule, imports: [CommonModule, IonicModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapDatalogTableModule, decorators: [{
type: NgModule,
args: [{
declarations: [TapDatalogTableComponent],
exports: [TapDatalogTableComponent],
imports: [CommonModule, IonicModule],
}]
}] });
class LabelValueComponent {
constructor() { }
ngOnInit() { }
}
/** @nocollapse */ LabelValueComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: LabelValueComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ LabelValueComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: LabelValueComponent, selector: "tap-label-value", inputs: { unit: "unit", color: "color", valueStyle: "valueStyle", value: "value" }, ngImport: i0, template: "<ion-label\n *ngIf=\"value; else loadingTemplate\"\n [color]=\"color\"\n [ngStyle]=\"valueStyle\"\n >{{ value }}<span *ngIf=\"unit\">{{ unit }}</span></ion-label\n>\n<ng-template #loadingTemplate>\n <ion-spinner [color]=\"color\" name=\"dots\"></ion-spinner>\n</ng-template>\n", styles: ["span{font-weight:600;font-size:1em;margin-left:10px}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i1$1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i1$1.IonSpinner, selector: "ion-spinner", inputs: ["color", "duration", "name", "paused"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: LabelValueComponent, decorators: [{
type: Component,
args: [{ selector: 'tap-label-value', template: "<ion-label\n *ngIf=\"value; else loadingTemplate\"\n [color]=\"color\"\n [ngStyle]=\"valueStyle\"\n >{{ value }}<span *ngIf=\"unit\">{{ unit }}</span></ion-label\n>\n<ng-template #loadingTemplate>\n <ion-spinner [color]=\"color\" name=\"dots\"></ion-spinner>\n</ng-template>\n", styles: ["span{font-weight:600;font-size:1em;margin-left:10px}\n"] }]
}], ctorParameters: function () { return []; }, propDecorators: { unit: [{
type: Input
}], color: [{
type: Input
}], valueStyle: [{
type: Input
}], value: [{
type: Input
}] } });
/**
* @deprecated not usefull anymore with new dashboard editor
*/
let TapVariableImageAndValueComponent = class TapVariableImageAndValueComponent {
set variable(variable) {
if (variable !== undefined) {
this._variable = variable;
this._destroyed.next();
}
}
constructor(decimalPipe) {
this.decimalPipe = decimalPipe;
this._destroyed = new Subject();
this.imageSize = '90px';
this.valuePosition = 'bottom';
this.unit = '°C';
this.editable = false;
this.valueStyle = {
'font-size': '1.4em',
};
}
ngOnDestroy() {
this._destroyed.next();
}
ngAfterViewInit() {
var _a, _b;
(_b = (_a = this.ctx) === null || _a === void 0 ? void 0 : _a.valueToDisplay) === null || _b === void 0 ? void 0 : _b.pipe(takeUntil(this._destroyed), map((value) => {
return this.digitsInfo
? this.decimalPipe.transform(value, this.digitsInfo)
: value;
}), shareReplay(1)).subscribe((v) => {
this.valueToDisplay = v;
});
}
onEditMode() {
var _a;
return __awaiter(this, void 0, void 0, function* () {
if (this.editable) {
yield ((_a = this.ctx) === null || _a === void 0 ? void 0 : _a.enableEditMode());
}
});
}
};
/** @nocollapse */ TapVariableImageAndValueComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableImageAndValueComponent, deps: [{ token: i2.DecimalPipe }], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ TapVariableImageAndValueComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TapVariableImageAndValueComponent, selector: "tap-variable-image-and-value", inputs: { image: "image", imageSize: "imageSize", valuePosition: "valuePosition", unit: "unit", imageColor: "imageColor", labelColor: "labelColor", editable: "editable", variable: "variable", valueStyle: "valueStyle", digitsInfo: "digitsInfo" }, viewQueries: [{ propertyName: "ctx", first: true, predicate: ["ctx"], descendants: true }], ngImport: i0, template: "<tap-value-editor-container\n #ctx\n [variable]=\"_variable\"\n [modalEdition]=\"editable\"\n [lines]=\"'none'\"\n [button]=\"editable\"\n (click)=\"onEditMode()\"\n>\n <div class=\"div-icon-and-value\">\n <div class=\"top-label\" *ngIf=\"valuePosition === 'top'\">\n <tap-label-value\n [color]=\"labelColor\"\n [valueStyle]=\"valueStyle\"\n [unit]=\"unit\"\n [value]=\"valueToDisplay\"\n >\n </tap-label-value>\n </div>\n <div class=\"div-icon-and-value-center\">\n <tap-label-value\n *ngIf=\"valuePosition === 'left'\"\n class=\"left-label\"\n [color]=\"labelColor\"\n [valueStyle]=\"valueStyle\"\n [unit]=\"unit\"\n [value]=\"valueToDisplay\"\n >\n </tap-label-value>\n <app-common-icon\n [color]=\"imageColor\"\n [image]=\"image\"\n [imageSize]=\"imageSize\"\n >\n </app-common-icon>\n <tap-label-value\n *ngIf=\"valuePosition === 'right'\"\n class=\"right-label\"\n [color]=\"labelColor\"\n [valueStyle]=\"valueStyle\"\n [unit]=\"unit\"\n [value]=\"valueToDisplay\"\n >\n </tap-label-value>\n </div>\n <div class=\"bottom-label\" *ngIf=\"valuePosition === 'bottom'\">\n <tap-label-value\n [color]=\"labelColor\"\n [valueStyle]=\"valueStyle\"\n [unit]=\"unit\"\n [value]=\"valueToDisplay\"\n >\n </tap-label-value>\n </div>\n </div>\n</tap-value-editor-container>\n", styles: ["div{width:-moz-fit-content;width:fit-content}.div-icon-and-value{margin:auto;padding:6px}.div-icon-and-value-center{display:flex;align-items:center}.top-label,.bottom-label{margin:auto;text-align:center}ion-label{height:-moz-fit-content;height:fit-content}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1$3.TapValueEditorContainerComponent, selector: "tap-value-editor-container", inputs: ["button", "variable", "inputOptions", "showRefreshButton", "showSubmitButton", "showEditButton", "error", "lines", "modalEdition", "value"], outputs: ["submit", "refresh"] }, { kind: "component", type: i3$1.IconComponent, selector: "app-common-icon", inputs: ["imageSize", "color", "image"] }, { kind: "component", type: LabelValueComponent, selector: "tap-label-value", inputs: ["unit", "color", "valueStyle", "value"] }] });
TapVariableImageAndValueComponent = __decorate([
MonitoringAppGenComponent({
constraints: {
isNumber: 'YES',
isArray: 'NO',
},
}),
__metadata("design:paramtypes", [DecimalPipe])
], TapVariableImageAndValueComponent);
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableImageAndValueComponent, decorators: [{
type: Component,
args: [{ selector: 'tap-variable-image-and-value', template: "<tap-value-editor-container\n #ctx\n [variable]=\"_variable\"\n [modalEdition]=\"editable\"\n [lines]=\"'none'\"\n [button]=\"editable\"\n (click)=\"onEditMode()\"\n>\n <div class=\"div-icon-and-value\">\n <div class=\"top-label\" *ngIf=\"valuePosition === 'top'\">\n <tap-label-value\n [color]=\"labelColor\"\n [valueStyle]=\"valueStyle\"\n [unit]=\"unit\"\n [value]=\"valueToDisplay\"\n >\n </tap-label-value>\n </div>\n <div class=\"div-icon-and-value-center\">\n <tap-label-value\n *ngIf=\"valuePosition === 'left'\"\n class=\"left-label\"\n [color]=\"labelColor\"\n [valueStyle]=\"valueStyle\"\n [unit]=\"unit\"\n [value]=\"valueToDisplay\"\n >\n </tap-label-value>\n <app-common-icon\n [color]=\"imageColor\"\n [image]=\"image\"\n [imageSize]=\"imageSize\"\n >\n </app-common-icon>\n <tap-label-value\n *ngIf=\"valuePosition === 'right'\"\n class=\"right-label\"\n [color]=\"labelColor\"\n [valueStyle]=\"valueStyle\"\n [unit]=\"unit\"\n [value]=\"valueToDisplay\"\n >\n </tap-label-value>\n </div>\n <div class=\"bottom-label\" *ngIf=\"valuePosition === 'bottom'\">\n <tap-label-value\n [color]=\"labelColor\"\n [valueStyle]=\"valueStyle\"\n [unit]=\"unit\"\n [value]=\"valueToDisplay\"\n >\n </tap-label-value>\n </div>\n </div>\n</tap-value-editor-container>\n", styles: ["div{width:-moz-fit-content;width:fit-content}.div-icon-and-value{margin:auto;padding:6px}.div-icon-and-value-center{display:flex;align-items:center}.top-label,.bottom-label{margin:auto;text-align:center}ion-label{height:-moz-fit-content;height:fit-content}\n"] }]
}], ctorParameters: function () { return [{ type: i2.DecimalPipe }]; }, propDecorators: { ctx: [{
type: ViewChild,
args: ['ctx']
}], image: [{
type: Input
}], imageSize: [{
type: Input
}], valuePosition: [{
type: Input
}], unit: [{
type: Input
}], imageColor: [{
type: Input
}], labelColor: [{
type: Input
}], editable: [{
type: Input
}], variable: [{
type: Input
}], valueStyle: [{
type: Input
}], digitsInfo: [{
type: Input
}] } });
class TapVariableImageAndValueModule {
}
/** @nocollapse */ TapVariableImageAndValueModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableImageAndValueModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
/** @nocollapse */ TapVariableImageAndValueModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: TapVariableImageAndValueModule, declarations: [TapVariableImageAndValueComponent, LabelValueComponent], imports: [CommonModule,
IonicModule,
TapValueEditorContainerModule,
IconModule], exports: [TapVariableImageAndValueComponent] });
/** @nocollapse */ TapVariableImageAndValueModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableImageAndValueModule, providers: [DecimalPipe], imports: [CommonModule,
IonicModule,
TapValueEditorContainerModule,
IconModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TapVariableImageAndValueModule, decorators: [{
type: NgModule,
args: [{
exports: [TapVariableImageAndValueComponent],
declarations: [TapVariableImageAndValueComponent, LabelValueComponent],
imports: [
CommonModule,
IonicModule,
TapValueEditorContainerModule,
IconModule,
],
providers: [DecimalPipe],
}]
}] });
/**
* Generated bundle index. Do not edit.
*/
export { BarChartStackedComponent, BarChartStackedModule, CSS_COLOR_REGEX, ChartContainerComponent, ChartContainerModule, ExportDataDirective, ExportDataModule, ExportDataService, GaugeCardComponent, GaugeCardModule, HexstringPipe, MonitoringActionsComponent, MonitoringActionsModule, MonitoringEditTextComponent, MonitoringEditTextModule, MonitoringRangeComponent, MonitoringRangeContentDirective, MonitoringRangeModule, MonitoringSettingsService, MonitoringTableComponent, MonitoringTableComponentDataSource, MonitoringTableModule, MonitoringVariableValueComponent, MonitoringVariableValueModule, TapDatalogTableComponent, TapDatalogTableModule, TapMonitoringComponentsModule, TapMonitoringModule, TapMonitoringSettingsComponent, TapMonitoringSettingsModule, TapVariableBarChartComponent, TapVariableBarChartGroupComponent, TapVariableBarChartGroupModule, TapVariableBarChartModule, TapVariableBitsEditorComponent, TapVariableBitsEditorModule, TapVariableButtonsComponent, TapVariableButtonsModule, TapVariableColorPickerComponent, TapVariableColorPickerModule, TapVariableContextComponent, TapVariableContextModule, TapVariableDataPopupComponent, TapVariableDataPopupModule, TapVariableDateTimePickerComponent, TapVariableDateTimePickerModule, TapVariableGaugeComponent, TapVariableGaugeModule, TapVariableGpioModeComponent, TapVariableGpioModeModule, TapVariableGpioValueComponent, TapVariableGpioValueModule, TapVariableHeatMapChartComponent, TapVariableHeatMapChartModule, TapVariableImageAndValueComponent, TapVariableImageAndValueModule, TapVariableLineChartComponent, TapVariableLineChartModule, TapVariableLinearGaugeComponent, TapVariableLinearGaugeModule, TapVariableNumberChartComponent, TapVariableNumberChartModule, TapVariableNumberComponent, TapVariableNumberModule, TapVariablePieChartAdvancedComponent, TapVariablePieChartAdvancedModule, TapVariablePieChartGridComponent, TapVariablePieChartGridModule, TapVariablePolarRadarChartComponent, TapVariablePolarRadarChartModule, TapVariablePushButtonComponent, TapVariablePushButtonModule, TapVariableRangeComponent, TapVariableRangeModule, TapVariableSelectComponent, TapVariableSelectModule, TapVariableSwitchPictureComponent, TapVariableSwitchPictureModule, TapVariableTableComponent, TapVariableTableModule, TapVariableTextComponent, TapVariableTextModule, TapVariableToggleComponent, TapVariableToggleModule, TextCardComponent, TextCardModule, VariableCardComponent, VariableCardModule };
//# sourceMappingURL=iotize-ionic-monitoring.mjs.map