ngx-hana-nameserver-history-viewer 1.1.90 → 1.2.0-9.8.beta
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2020/src/nameserver-history-viewer/components/nameserver-history.component.mjs +24 -19
- package/esm2020/src/nameserver-history-viewer/components/port-selector/port-selector.component.mjs +3 -3
- package/esm2020/src/nameserver-history-viewer/components/time-range-selector/time-range-selector.component.mjs +2 -2
- package/esm2020/src/nameserver-history-viewer/components/timezone-selector/timezone-selector.component.mjs +2 -4
- package/esm2020/src/nameserver-history-viewer/components/timezone-selector/timezone-selector.service.mjs +2 -4
- package/esm2020/src/nameserver-history-viewer/services/chart.service.mjs +11 -6
- package/esm2020/src/nameserver-history-viewer/utils/chartjs-downsample/responsive_downsample_plugin.mjs +1 -1
- package/esm2020/src/nameserver-history-viewer/utils/time-util.mjs +2 -4
- package/fesm2015/ngx-hana-nameserver-history-viewer.mjs +57 -47
- package/fesm2015/ngx-hana-nameserver-history-viewer.mjs.map +1 -1
- package/fesm2020/ngx-hana-nameserver-history-viewer.mjs +43 -39
- package/fesm2020/ngx-hana-nameserver-history-viewer.mjs.map +1 -1
- package/package.json +4 -3
- package/src/nameserver-history-viewer/components/nameserver-history.component.d.ts +13 -9
|
@@ -6,9 +6,10 @@ import * as i2$1 from '@angular/forms';
|
|
|
6
6
|
import { FormsModule } from '@angular/forms';
|
|
7
7
|
import * as i1$1 from '@danielmoncada/angular-datetime-picker';
|
|
8
8
|
import { OwlDateTimeModule, OwlNativeDateTimeModule } from '@danielmoncada/angular-datetime-picker';
|
|
9
|
-
import * as
|
|
9
|
+
import * as moment$2 from 'moment-timezone';
|
|
10
10
|
import * as i2 from 'ngx-dropdown-list';
|
|
11
11
|
import { DropdownListModule } from 'ngx-dropdown-list';
|
|
12
|
+
import { __awaiter } from 'tslib';
|
|
12
13
|
import { SelectionModel } from '@angular/cdk/collections';
|
|
13
14
|
import * as chartjs from 'chart.js';
|
|
14
15
|
import { Chart as Chart$2 } from 'chart.js';
|
|
@@ -511,8 +512,6 @@ function setChartHeight(nsAll, nsContent) {
|
|
|
511
512
|
}
|
|
512
513
|
}
|
|
513
514
|
|
|
514
|
-
// workaround for fixing following error when doing packagr: Cannot call a namespace ('moment')
|
|
515
|
-
const moment$4 = momentImported;
|
|
516
515
|
/**
|
|
517
516
|
* get the time range for all ports
|
|
518
517
|
*/
|
|
@@ -550,7 +549,7 @@ function _getTimeRange(time) {
|
|
|
550
549
|
* get default local time zone
|
|
551
550
|
*/
|
|
552
551
|
function getDefaultTimezone() {
|
|
553
|
-
return moment$
|
|
552
|
+
return moment$2.tz.guess();
|
|
554
553
|
}
|
|
555
554
|
/**
|
|
556
555
|
* Get time from provided timezone, using this only because chart.js doesn't support timezone.
|
|
@@ -563,8 +562,8 @@ function getTimeFromTimeZone(time, timezone) {
|
|
|
563
562
|
timezone = getDefaultTimezone();
|
|
564
563
|
console.warn(`getTimeFromTimeZone - Input timezone is null, returning the local (${timezone}) time. `);
|
|
565
564
|
}
|
|
566
|
-
const utcOffset = moment$
|
|
567
|
-
const currentOffset = moment$
|
|
565
|
+
const utcOffset = moment$2.tz.zone(timezone).utcOffset(time * 1000);
|
|
566
|
+
const currentOffset = moment$2.tz.zone(getDefaultTimezone()).utcOffset(time * 1000);
|
|
568
567
|
// convert to utc and then to selected timezone
|
|
569
568
|
return time + currentOffset * 60 - utcOffset * 60;
|
|
570
569
|
}
|
|
@@ -572,7 +571,7 @@ function getTimeFromTimeZone(time, timezone) {
|
|
|
572
571
|
* Get time formatted with the provided timezone
|
|
573
572
|
*/
|
|
574
573
|
function getTimeString(time) {
|
|
575
|
-
return moment$
|
|
574
|
+
return moment$2(time).format('YYYY-MM-DD HH:mm:ss');
|
|
576
575
|
}
|
|
577
576
|
/**
|
|
578
577
|
* Get the time range string by time array, eg: 2018-10-25 10:10:00 ~ 2018-10-25 12:12:00
|
|
@@ -762,8 +761,6 @@ function blobToFile(theBlob, fileName) {
|
|
|
762
761
|
return theBlob;
|
|
763
762
|
}
|
|
764
763
|
|
|
765
|
-
// workaround for fixing following error when doing packagr: Cannot call a namespace ('moment')
|
|
766
|
-
const moment$3 = momentImported;
|
|
767
764
|
class TimezoneSelectorService {
|
|
768
765
|
/**
|
|
769
766
|
* get the default timezone
|
|
@@ -776,7 +773,7 @@ class TimezoneSelectorService {
|
|
|
776
773
|
*/
|
|
777
774
|
getZones() {
|
|
778
775
|
const timezones = [];
|
|
779
|
-
const zones = moment$
|
|
776
|
+
const zones = moment$2.tz.names();
|
|
780
777
|
zones.forEach(zone => {
|
|
781
778
|
// get region
|
|
782
779
|
let region;
|
|
@@ -807,8 +804,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
807
804
|
type: Injectable
|
|
808
805
|
}] });
|
|
809
806
|
|
|
810
|
-
// workaround for fixing following error when doing packagr: Cannot call a namespace ('moment')
|
|
811
|
-
const moment$2 = momentImported;
|
|
812
807
|
class TimezoneSelectorComponent {
|
|
813
808
|
constructor(service) {
|
|
814
809
|
this.service = service;
|
|
@@ -954,7 +949,7 @@ class PortSelectorComponent {
|
|
|
954
949
|
}
|
|
955
950
|
PortSelectorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PortSelectorComponent, deps: [{ token: PortSelectorService }], target: i0.ɵɵFactoryTarget.Component });
|
|
956
951
|
PortSelectorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: PortSelectorComponent, selector: "port-selector", inputs: { disabled: "disabled", port: "port", ports: "ports" }, outputs: { portChange: "portChange" }, providers: [PortSelectorService], ngImport: i0, template: `
|
|
957
|
-
<label>
|
|
952
|
+
<label style="width: 100%">
|
|
958
953
|
<ngx-dropdown-list (selectionChange)="onChange($event)"
|
|
959
954
|
[items]="displayPorts"
|
|
960
955
|
[multiSelection]="false"
|
|
@@ -970,7 +965,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
970
965
|
args: [{
|
|
971
966
|
selector: 'port-selector',
|
|
972
967
|
template: `
|
|
973
|
-
<label>
|
|
968
|
+
<label style="width: 100%">
|
|
974
969
|
<ngx-dropdown-list (selectionChange)="onChange($event)"
|
|
975
970
|
[items]="displayPorts"
|
|
976
971
|
[multiSelection]="false"
|
|
@@ -1068,7 +1063,7 @@ TimeRangeSelectorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0
|
|
|
1068
1063
|
<owl-date-time #dtRange3 (afterPickerClosed)="afterPickerClosed()"></owl-date-time>
|
|
1069
1064
|
</div>
|
|
1070
1065
|
</div>
|
|
1071
|
-
`, isInline: true, styles: [":host *,:host *:before,:host *:after{box-sizing:inherit;display:inherit;font-size:inherit;font-weight:inherit;font-family:inherit}:host .hover-box,:host .time-range input:hover,.time-range :host input:hover,:host .nameserver-history-all .toolbar-chart .port-selection .port-load-button button:hover{outline:0;box-shadow:0 0 6px #23adff}:host .dashed-box,:host .nameserver-history-all .toolbar-chart .chart-operation button,:host .nameserver-history-all .toolbar-chart .port-selection,:host .nameserver-history-all .toolbar-chart .input-time,:host .nameserver-history-all .toolbar-chart .upload-box-content{background:#f8f8f8;box-shadow:inset 0 20px 20px -20px #0009;border:1px dashed #0782d0}:host .solid-box,:host .time-range input,.time-range :host input,:host .nameserver-history-all .toolbar-chart .port-selection .port-load-button button{background:#fff none;border:1px solid #ccc;border-radius:4px;line-height:1.42857143}:host .nameserver-history-all{width:98%;min-width:1314px;height:auto;border:1px none #0782d0;border-bottom-style:dashed;margin:3px 1%;box-sizing:border-box;display:inline-block;font-size:14px;font-weight:400;font-family:Helvetica,Arial,sans-serif}:host .nameserver-history-all .toolbar-chart{width:100%;height:48px}:host .nameserver-history-all .toolbar-chart button{text-align:center;white-space:nowrap;vertical-align:middle}:host .nameserver-history-all .toolbar-chart button:hover{text-shadow:1px 1px 3px royalblue;cursor:pointer;font-weight:600}:host .nameserver-history-all .toolbar-chart button:disabled{text-shadow:none;opacity:.65;cursor:default;color:#a9a9a9;font-weight:400}:host .nameserver-history-all .toolbar-chart .upload-box-content{width:20%;height:100%;float:left
|
|
1066
|
+
`, isInline: true, styles: [":host *,:host *:before,:host *:after{box-sizing:inherit;display:inherit;font-size:inherit;font-weight:inherit;font-family:inherit}:host .hover-box,:host .time-range input:hover,.time-range :host input:hover,:host .nameserver-history-all .toolbar-chart .port-selection .port-load-button button:hover{outline:0;box-shadow:0 0 6px #23adff}:host .dashed-box,:host .nameserver-history-all .toolbar-chart .chart-operation button,:host .nameserver-history-all .toolbar-chart .port-selection,:host .nameserver-history-all .toolbar-chart .input-time,:host .nameserver-history-all .toolbar-chart .upload-box-content{background:#f8f8f8;box-shadow:inset 0 20px 20px -20px #0009;border:1px dashed #0782d0}:host .solid-box,:host .time-range input,.time-range :host input,:host .nameserver-history-all .toolbar-chart .port-selection .port-load-button button{background:#fff none;border:1px solid #ccc;border-radius:4px;line-height:1.42857143}:host .nameserver-history-all{width:98%;min-width:1314px;height:auto;border:1px none #0782d0;border-bottom-style:dashed;margin:3px 1%;box-sizing:border-box;display:inline-block;font-size:14px;font-weight:400;font-family:Helvetica,Arial,sans-serif}:host .nameserver-history-all .toolbar-chart{width:100%;height:48px}:host .nameserver-history-all .toolbar-chart button{text-align:center;white-space:nowrap;vertical-align:middle}:host .nameserver-history-all .toolbar-chart button:hover{text-shadow:1px 1px 3px royalblue;cursor:pointer;font-weight:600}:host .nameserver-history-all .toolbar-chart button:disabled{text-shadow:none;opacity:.65;cursor:default;color:#a9a9a9;font-weight:400}:host .nameserver-history-all .toolbar-chart .upload-box-content{width:20%;height:100%;float:left}:host .nameserver-history-all .toolbar-chart .upload-box-content .box-stream-mode-text{text-align:center;color:#00008b}:host .nameserver-history-all .toolbar-chart .input-time{margin-left:1%;margin-right:1%;width:43%;height:100%}:host .nameserver-history-all .toolbar-chart .input-time .input-time-range{height:100%;width:57%;float:left}:host .nameserver-history-all .toolbar-chart .input-time .timezone-selector{margin-top:6px;height:100%;width:42.5%;margin-right:.5%;float:right}:host .nameserver-history-all .toolbar-chart .port-selection{width:14%;margin-right:1%;height:48px}:host .nameserver-history-all .toolbar-chart .port-selection .port-selector{margin-top:6px;margin-left:2%;margin-right:1%;width:47%;float:left}:host .nameserver-history-all .toolbar-chart .port-selection .port-load-button{margin-top:6px;margin-left:1%;margin-right:2%;width:47%;float:right}:host .nameserver-history-all .toolbar-chart .port-selection .port-load-button button{color:#333;width:100%;padding:6px 12px;margin-bottom:0}:host .nameserver-history-all .toolbar-chart .port-selection .port-load-button button:hover{text-shadow:None;font-weight:400}:host .nameserver-history-all .toolbar-chart .port-selection .port-load-button button:disabled{box-shadow:none}:host .nameserver-history-all .toolbar-chart .chart-operation{width:20%;height:48px;float:right}:host .nameserver-history-all .toolbar-chart .chart-operation .left{margin-right:1%;width:49%;height:100%;float:left}:host .nameserver-history-all .toolbar-chart .chart-operation .right{width:50%;height:100%;float:right}:host .nameserver-history-all .toolbar-chart .chart-operation button{width:100%;height:100%;color:#00008b}:host .nameserver-history-all .nameserver-history-content{width:100%;height:730px;margin:5px 5px 5px 0}:host .nameserver-history-all .nameserver-history-content .nameserver-history-content-chart{width:75%;height:100%;position:relative;float:left}:host .nameserver-history-all .nameserver-history-content .nameserver-history-content-controller{width:25%;height:100%;float:right;overflow:auto}:host .message-container{width:98%;margin:0 1%;box-sizing:border-box;display:inline-block}.time-range{width:100%;box-sizing:border-box}.time-range .time-range-from{width:48.5%;float:left;margin-left:1%;margin-right:1%}.time-range .time-range-to{width:48.5%;float:right;margin-right:1%}.time-range input{margin-top:6px;width:100%;padding:6px 12px;color:#495057;cursor:pointer}.time-range input:disabled{box-shadow:none}\n"], components: [{ type: i1$1.OwlDateTimeComponent, selector: "owl-date-time", inputs: ["backdropClass", "panelClass", "startAt", "endAt", "pickerType", "pickerMode", "disabled", "opened", "scrollStrategy"], outputs: ["afterPickerClosed", "afterPickerOpen", "yearSelected", "monthSelected", "dateSelected"], exportAs: ["owlDateTime"] }], directives: [{ type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1$1.OwlDateTimeInputDirective, selector: "input[owlDateTime]", inputs: ["required", "owlDateTime", "owlDateTimeFilter", "_disabled", "min", "max", "selectMode", "rangeSeparator", "value", "values"], outputs: ["dateTimeChange", "dateTimeInput"], exportAs: ["owlDateTimeInput"] }, { type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1$1.OwlDateTimeTriggerDirective, selector: "[owlDateTimeTrigger]", inputs: ["owlDateTimeTrigger", "disabled"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1072
1067
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TimeRangeSelectorComponent, decorators: [{
|
|
1073
1068
|
type: Component,
|
|
1074
1069
|
args: [{ selector: 'time-range-selector', template: `
|
|
@@ -1090,7 +1085,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
1090
1085
|
<owl-date-time #dtRange3 (afterPickerClosed)="afterPickerClosed()"></owl-date-time>
|
|
1091
1086
|
</div>
|
|
1092
1087
|
</div>
|
|
1093
|
-
`, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host *,:host *:before,:host *:after{box-sizing:inherit;display:inherit;font-size:inherit;font-weight:inherit;font-family:inherit}:host .hover-box,:host .time-range input:hover,.time-range :host input:hover,:host .nameserver-history-all .toolbar-chart .port-selection .port-load-button button:hover{outline:0;box-shadow:0 0 6px #23adff}:host .dashed-box,:host .nameserver-history-all .toolbar-chart .chart-operation button,:host .nameserver-history-all .toolbar-chart .port-selection,:host .nameserver-history-all .toolbar-chart .input-time,:host .nameserver-history-all .toolbar-chart .upload-box-content{background:#f8f8f8;box-shadow:inset 0 20px 20px -20px #0009;border:1px dashed #0782d0}:host .solid-box,:host .time-range input,.time-range :host input,:host .nameserver-history-all .toolbar-chart .port-selection .port-load-button button{background:#fff none;border:1px solid #ccc;border-radius:4px;line-height:1.42857143}:host .nameserver-history-all{width:98%;min-width:1314px;height:auto;border:1px none #0782d0;border-bottom-style:dashed;margin:3px 1%;box-sizing:border-box;display:inline-block;font-size:14px;font-weight:400;font-family:Helvetica,Arial,sans-serif}:host .nameserver-history-all .toolbar-chart{width:100%;height:48px}:host .nameserver-history-all .toolbar-chart button{text-align:center;white-space:nowrap;vertical-align:middle}:host .nameserver-history-all .toolbar-chart button:hover{text-shadow:1px 1px 3px royalblue;cursor:pointer;font-weight:600}:host .nameserver-history-all .toolbar-chart button:disabled{text-shadow:none;opacity:.65;cursor:default;color:#a9a9a9;font-weight:400}:host .nameserver-history-all .toolbar-chart .upload-box-content{width:20%;height:100%;float:left
|
|
1088
|
+
`, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host *,:host *:before,:host *:after{box-sizing:inherit;display:inherit;font-size:inherit;font-weight:inherit;font-family:inherit}:host .hover-box,:host .time-range input:hover,.time-range :host input:hover,:host .nameserver-history-all .toolbar-chart .port-selection .port-load-button button:hover{outline:0;box-shadow:0 0 6px #23adff}:host .dashed-box,:host .nameserver-history-all .toolbar-chart .chart-operation button,:host .nameserver-history-all .toolbar-chart .port-selection,:host .nameserver-history-all .toolbar-chart .input-time,:host .nameserver-history-all .toolbar-chart .upload-box-content{background:#f8f8f8;box-shadow:inset 0 20px 20px -20px #0009;border:1px dashed #0782d0}:host .solid-box,:host .time-range input,.time-range :host input,:host .nameserver-history-all .toolbar-chart .port-selection .port-load-button button{background:#fff none;border:1px solid #ccc;border-radius:4px;line-height:1.42857143}:host .nameserver-history-all{width:98%;min-width:1314px;height:auto;border:1px none #0782d0;border-bottom-style:dashed;margin:3px 1%;box-sizing:border-box;display:inline-block;font-size:14px;font-weight:400;font-family:Helvetica,Arial,sans-serif}:host .nameserver-history-all .toolbar-chart{width:100%;height:48px}:host .nameserver-history-all .toolbar-chart button{text-align:center;white-space:nowrap;vertical-align:middle}:host .nameserver-history-all .toolbar-chart button:hover{text-shadow:1px 1px 3px royalblue;cursor:pointer;font-weight:600}:host .nameserver-history-all .toolbar-chart button:disabled{text-shadow:none;opacity:.65;cursor:default;color:#a9a9a9;font-weight:400}:host .nameserver-history-all .toolbar-chart .upload-box-content{width:20%;height:100%;float:left}:host .nameserver-history-all .toolbar-chart .upload-box-content .box-stream-mode-text{text-align:center;color:#00008b}:host .nameserver-history-all .toolbar-chart .input-time{margin-left:1%;margin-right:1%;width:43%;height:100%}:host .nameserver-history-all .toolbar-chart .input-time .input-time-range{height:100%;width:57%;float:left}:host .nameserver-history-all .toolbar-chart .input-time .timezone-selector{margin-top:6px;height:100%;width:42.5%;margin-right:.5%;float:right}:host .nameserver-history-all .toolbar-chart .port-selection{width:14%;margin-right:1%;height:48px}:host .nameserver-history-all .toolbar-chart .port-selection .port-selector{margin-top:6px;margin-left:2%;margin-right:1%;width:47%;float:left}:host .nameserver-history-all .toolbar-chart .port-selection .port-load-button{margin-top:6px;margin-left:1%;margin-right:2%;width:47%;float:right}:host .nameserver-history-all .toolbar-chart .port-selection .port-load-button button{color:#333;width:100%;padding:6px 12px;margin-bottom:0}:host .nameserver-history-all .toolbar-chart .port-selection .port-load-button button:hover{text-shadow:None;font-weight:400}:host .nameserver-history-all .toolbar-chart .port-selection .port-load-button button:disabled{box-shadow:none}:host .nameserver-history-all .toolbar-chart .chart-operation{width:20%;height:48px;float:right}:host .nameserver-history-all .toolbar-chart .chart-operation .left{margin-right:1%;width:49%;height:100%;float:left}:host .nameserver-history-all .toolbar-chart .chart-operation .right{width:50%;height:100%;float:right}:host .nameserver-history-all .toolbar-chart .chart-operation button{width:100%;height:100%;color:#00008b}:host .nameserver-history-all .nameserver-history-content{width:100%;height:730px;margin:5px 5px 5px 0}:host .nameserver-history-all .nameserver-history-content .nameserver-history-content-chart{width:75%;height:100%;position:relative;float:left}:host .nameserver-history-all .nameserver-history-content .nameserver-history-content-controller{width:25%;height:100%;float:right;overflow:auto}:host .message-container{width:98%;margin:0 1%;box-sizing:border-box;display:inline-block}.time-range{width:100%;box-sizing:border-box}.time-range .time-range-from{width:48.5%;float:left;margin-left:1%;margin-right:1%}.time-range .time-range-to{width:48.5%;float:right;margin-right:1%}.time-range input{margin-top:6px;width:100%;padding:6px 12px;color:#495057;cursor:pointer}.time-range input:disabled{box-shadow:none}\n"] }]
|
|
1094
1089
|
}], propDecorators: { disabled: [{
|
|
1095
1090
|
type: Input
|
|
1096
1091
|
}], dateTimeRange: [{
|
|
@@ -1946,11 +1941,17 @@ class ChartService {
|
|
|
1946
1941
|
* generate configuration for chart and create the chart object.
|
|
1947
1942
|
*/
|
|
1948
1943
|
buildChart(time, data, yScale, header, headerKey, selection, tableSource, title, defaultItems, zoomCB) {
|
|
1949
|
-
return new Promise((resolve) => {
|
|
1950
|
-
|
|
1951
|
-
const
|
|
1952
|
-
|
|
1953
|
-
|
|
1944
|
+
return new Promise((resolve, reject) => {
|
|
1945
|
+
var _a;
|
|
1946
|
+
const ctx = (_a = document.getElementById('chartNameServerHistory')) === null || _a === void 0 ? void 0 : _a.getContext('2d');
|
|
1947
|
+
if (ctx) {
|
|
1948
|
+
const cfg = ChartService._generateChartConfig(time, data, yScale, header, headerKey, selection, tableSource, title, defaultItems, zoomCB);
|
|
1949
|
+
this._chart = new Chart$2(ctx, cfg);
|
|
1950
|
+
resolve();
|
|
1951
|
+
}
|
|
1952
|
+
else {
|
|
1953
|
+
reject('Can not find the canvas.');
|
|
1954
|
+
}
|
|
1954
1955
|
});
|
|
1955
1956
|
}
|
|
1956
1957
|
/**
|
|
@@ -3532,9 +3533,21 @@ class NameServerHistoryComponent {
|
|
|
3532
3533
|
this.stepShowChart = false;
|
|
3533
3534
|
this.searchType = SearchType.searchAll;
|
|
3534
3535
|
}
|
|
3535
|
-
|
|
3536
|
-
|
|
3537
|
-
|
|
3536
|
+
ngOnChanges(changes) {
|
|
3537
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
3538
|
+
const fbc = changes.fileBuffer;
|
|
3539
|
+
if (fbc && fbc.currentValue && fbc.currentValue !== fbc.previousValue) {
|
|
3540
|
+
// simulate selecting file
|
|
3541
|
+
const simulatedEvent = { target: { files: [blobToFile(this.fileBuffer, this.streamModeFileName)] } };
|
|
3542
|
+
yield this.fileSelected(simulatedEvent);
|
|
3543
|
+
this.port = undefined; // clear the port selection
|
|
3544
|
+
if (this.autoDisplay) {
|
|
3545
|
+
this.showChart();
|
|
3546
|
+
}
|
|
3547
|
+
}
|
|
3548
|
+
});
|
|
3549
|
+
}
|
|
3550
|
+
ngAfterViewInit() {
|
|
3538
3551
|
// init items' status
|
|
3539
3552
|
// reset chart button will be disable by default later, only be enabled after zoomed
|
|
3540
3553
|
this._toggleItems([
|
|
@@ -3544,19 +3557,12 @@ class NameServerHistoryComponent {
|
|
|
3544
3557
|
{ id: HtmlElement.loadPortsButton, status: true },
|
|
3545
3558
|
{ id: HtmlElement.resetChartButton, status: false }
|
|
3546
3559
|
]);
|
|
3547
|
-
|
|
3548
|
-
ngOnChanges(changes) {
|
|
3549
|
-
const fbc = changes.fileBuffer;
|
|
3550
|
-
if (fbc && fbc.currentValue && fbc.currentValue !== fbc.previousValue) {
|
|
3551
|
-
// simulate selecting file
|
|
3552
|
-
const simulatedEvent = { target: { files: [blobToFile(this.fileBuffer, this.streamModeFileName)] } };
|
|
3553
|
-
this.fileSelected(simulatedEvent);
|
|
3554
|
-
}
|
|
3560
|
+
this.onResize(); // update the size, otherwise there may have a scrollbar (because of the toast) if auto display is set to true
|
|
3555
3561
|
}
|
|
3556
3562
|
/**
|
|
3557
|
-
|
|
3558
|
-
|
|
3559
|
-
|
|
3563
|
+
* Reset Chart to initial status
|
|
3564
|
+
* If legend is already selected/unselected from the list, it wouldn't be restored.
|
|
3565
|
+
*/
|
|
3560
3566
|
resetChart() {
|
|
3561
3567
|
this._toggleItems([{ id: HtmlElement.resetChartButton, status: false }]);
|
|
3562
3568
|
if (this.tableSource && this._selection) {
|
|
@@ -3608,17 +3614,19 @@ class NameServerHistoryComponent {
|
|
|
3608
3614
|
* select name server history file, currently only supports 1 file.
|
|
3609
3615
|
*/
|
|
3610
3616
|
fileSelected(event) {
|
|
3611
|
-
|
|
3612
|
-
|
|
3613
|
-
if (
|
|
3614
|
-
|
|
3615
|
-
|
|
3616
|
-
|
|
3617
|
-
|
|
3618
|
-
|
|
3619
|
-
|
|
3617
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
3618
|
+
const selectedFile = getFileFromInput(event.target);
|
|
3619
|
+
if (selectedFile) {
|
|
3620
|
+
if (!isSameFile(this.file, selectedFile)) {
|
|
3621
|
+
// init port selector
|
|
3622
|
+
yield this._initPortSelector().catch(e => this._showMessage(Alert.error, e));
|
|
3623
|
+
this.file = selectedFile;
|
|
3624
|
+
this.abbreviatedFileName = getAbbreviatedFileName(this.file.name);
|
|
3625
|
+
// after file has been selected, the show chart button needs to be enabled
|
|
3626
|
+
this._toggleItems([{ id: HtmlElement.showChartButton, status: true }]);
|
|
3627
|
+
}
|
|
3620
3628
|
}
|
|
3621
|
-
}
|
|
3629
|
+
});
|
|
3622
3630
|
}
|
|
3623
3631
|
/**
|
|
3624
3632
|
* drop name server history file, currently only supports 1 file.
|
|
@@ -3992,10 +4000,10 @@ class NameServerHistoryComponent {
|
|
|
3992
4000
|
}
|
|
3993
4001
|
}
|
|
3994
4002
|
NameServerHistoryComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NameServerHistoryComponent, deps: [{ token: FileService }, { token: ChartService }, { token: UIService }], target: i0.ɵɵFactoryTarget.Component });
|
|
3995
|
-
NameServerHistoryComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NameServerHistoryComponent, selector: "ngx-hana-nameserver-history-viewer", inputs: { defaultSelectedItems: "defaultSelectedItems", hideMeasureColumns: "hideMeasureColumns", maxRowsLimitation: "maxRowsLimitation", showInstruction: "showInstruction", timezone: "timezone", fileBuffer: "fileBuffer", streamModeFileName: "streamModeFileName" }, providers: [FileService, ChartService, UIService], viewQueries: [{ propertyName: "nameserverHistoryAllRef", first: true, predicate: ["nameserverHistoryAll"], descendants: true, read: ElementRef }, { propertyName: "nameserverHistoryContentRef", first: true, predicate: ["nameserverHistoryContent"], descendants: true, read: ElementRef }], usesOnChanges: true, ngImport: i0, template: "<div #nameserverHistoryAll class=\"nameserver-history-all\" (window:resize)=\"onResize()\">\r\n <div class=\"toolbar-chart\">\r\n <div class=\"upload-box-content\">\r\n <div *ngIf=\"!showReadFileProgress\">\r\n <file-drop-input (fileDrop)=\"fileDropped($event)\" (fileInput)=\"fileSelected($event)\"\r\n [dropAreaText]= \"abbreviatedFileName\"\r\n [inputAreaText]=\"'Browse'\"\r\n [title]=\"file?.name? file.name:'Select a name server history file from your local disk.'\"\r\n *ngIf=\"!fileBuffer\">\r\n </file-drop-input>\r\n <p *ngIf=\"fileBuffer\">{{streamModeFileName || 'nameserver_history.trc (stream mode)'}}</p>\r\n </div>\r\n <div *ngIf=\"showReadFileProgress\">\r\n <progress-bar [progress]=\"readProgress\"></progress-bar>\r\n </div>\r\n </div>\r\n <div class=\"input-time\">\r\n <div class=\"input-time-range\">\r\n <time-range-selector [disabled]=\"showReadFileProgress\" [(dateTimeRange)]=\"dateTimeRange\"></time-range-selector>\r\n </div>\r\n <div class=\"timezone-selector\">\r\n <timezone-selector [(timezone)]=\"timezone\" [disabled]=\"showReadFileProgress\"></timezone-selector>\r\n </div>\r\n </div>\r\n\r\n <div class=\"port-selection\">\r\n <div class=\"port-selector\">\r\n <port-selector (portChange)=\"switchPortForChart($event)\" [(port)]=\"port\" [ports]=\"ports\" [disabled]=\"showReadFileProgress\"></port-selector>\r\n </div>\r\n <div class=\"port-load-button\">\r\n <button (click)=\"loadPorts()\" title=\"Load all ports from name server history trace file.\" [disabled]=\"!enableShowChartButton || port || !enableLoadPortsButton\">{{showReadFileProgress? \"Loading...\" : \"Load\"}}</button>\r\n </div>\r\n </div>\r\n\r\n <div class=\"chart-operation\">\r\n <div class=\"left\">\r\n <button (click)=\"showChart()\" title=\"Load and display all data from name server history trace file.\" [disabled]=\"!enableShowChartButton\">{{showReadFileProgress? \"Loading...\" : \"Show\"}}</button>\r\n </div>\r\n <div class=\"right\">\r\n <button (click)=\"resetChart()\" title=\"Reset zoom of chart.\" [disabled]=\"showReadFileProgress || !enableResetChartButton\">Reset Chart</button>\r\n </div>\r\n </div>\r\n </div>\r\n <div #nameserverHistoryContent class=\"nameserver-history-content\">\r\n <div class=\"nameserver-history-content-chart\">\r\n <instruction [(show)]=\"showInstruction\" *ngIf=\"!showChartFlag && showInstruction\"\r\n [step1Finished]=\"!!file\"\r\n [step2Finished]=\"dateTimeRange && (!!dateTimeRange[0] || !!dateTimeRange[1]) || timezone != defaultTimezone\"\r\n [step3Finished]=\"!!port\"\r\n [step4Finished]=\"stepShowChart && !enableShowChartButton\"\r\n [step5Finished]=\"false\">\r\n </instruction>\r\n <canvas id=\"chartNameServerHistory\" ></canvas>\r\n </div>\r\n <div class=\"nameserver-history-content-controller\" >\r\n <ngx-selection-table (change)=\"selectItem($event)\" *ngIf=\"showChartFlag\"\r\n [filter]=\"true\"\r\n [checkbox]=\"true\"\r\n [tableSource]=\"tableSource\"\r\n [keyColumn]=\"kpiColumn\"\r\n [hiddenColumns]=\"hiddenColumns\"\r\n [tooltipColumn]=\"descColumn\"\r\n [searchStyle]=\"searchType\"\r\n [searchColumn]=\"kpiColumn\"\r\n [multiSelection]=\"true\">\r\n </ngx-selection-table>\r\n </div>\r\n </div>\r\n</div>\r\n<div class=\"message-container\" *ngIf=\"alertMessage\">\r\n <alert [(alertMessage)]=\"alertMessage\" [alertType]=\"alertType\" [alertTimeout]=\"30000\"></alert>\r\n</div>\r\n", styles: [":host *,:host *:before,:host *:after{box-sizing:inherit;display:inherit;font-size:inherit;font-weight:inherit;font-family:inherit}:host .hover-box,:host .nameserver-history-all .toolbar-chart .port-selection .port-load-button button:hover{outline:0;box-shadow:0 0 6px #23adff}:host .dashed-box,:host .nameserver-history-all .toolbar-chart .chart-operation button,:host .nameserver-history-all .toolbar-chart .port-selection,:host .nameserver-history-all .toolbar-chart .input-time,:host .nameserver-history-all .toolbar-chart .upload-box-content{background:#f8f8f8;box-shadow:inset 0 20px 20px -20px #0009;border:1px dashed #0782d0}:host .solid-box,:host .nameserver-history-all .toolbar-chart .port-selection .port-load-button button{background:#fff none;border:1px solid #ccc;border-radius:4px;line-height:1.42857143}:host .nameserver-history-all{width:98%;min-width:1314px;height:auto;border:1px none #0782d0;border-bottom-style:dashed;margin:3px 1%;box-sizing:border-box;display:inline-block;font-size:14px;font-weight:400;font-family:Helvetica,Arial,sans-serif}:host .nameserver-history-all .toolbar-chart{width:100%;height:48px}:host .nameserver-history-all .toolbar-chart button{text-align:center;white-space:nowrap;vertical-align:middle}:host .nameserver-history-all .toolbar-chart button:hover{text-shadow:1px 1px 3px royalblue;cursor:pointer;font-weight:600}:host .nameserver-history-all .toolbar-chart button:disabled{text-shadow:none;opacity:.65;cursor:default;color:#a9a9a9;font-weight:400}:host .nameserver-history-all .toolbar-chart .upload-box-content{width:20%;height:100%;float:left
|
|
4003
|
+
NameServerHistoryComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NameServerHistoryComponent, selector: "ngx-hana-nameserver-history-viewer", inputs: { defaultSelectedItems: "defaultSelectedItems", hideMeasureColumns: "hideMeasureColumns", maxRowsLimitation: "maxRowsLimitation", showInstruction: "showInstruction", timezone: "timezone", fileBuffer: "fileBuffer", streamModeFileName: "streamModeFileName", autoDisplay: "autoDisplay" }, providers: [FileService, ChartService, UIService], viewQueries: [{ propertyName: "nameserverHistoryAllRef", first: true, predicate: ["nameserverHistoryAll"], descendants: true, read: ElementRef }, { propertyName: "nameserverHistoryContentRef", first: true, predicate: ["nameserverHistoryContent"], descendants: true, read: ElementRef }], usesOnChanges: true, ngImport: i0, template: "<div #nameserverHistoryAll class=\"nameserver-history-all\" (window:resize)=\"onResize()\">\r\n <div class=\"toolbar-chart\">\r\n <div class=\"upload-box-content\">\r\n <div *ngIf=\"!showReadFileProgress\">\r\n <file-drop-input (fileDrop)=\"fileDropped($event)\" (fileInput)=\"fileSelected($event)\"\r\n [dropAreaText]= \"abbreviatedFileName\"\r\n [inputAreaText]=\"'Browse'\"\r\n [title]=\"file?.name? file.name:'Select a name server history file from your local disk.'\"\r\n *ngIf=\"!fileBuffer\">\r\n </file-drop-input>\r\n <p *ngIf=\"fileBuffer\" class=\"box-stream-mode-text\">{{streamModeFileName || 'nameserver_history.trc (stream mode)'}}</p>\r\n </div>\r\n <div *ngIf=\"showReadFileProgress\">\r\n <progress-bar [progress]=\"readProgress\"></progress-bar>\r\n </div>\r\n </div>\r\n <div class=\"input-time\">\r\n <div class=\"input-time-range\">\r\n <time-range-selector [disabled]=\"showReadFileProgress\" [(dateTimeRange)]=\"dateTimeRange\"></time-range-selector>\r\n </div>\r\n <div class=\"timezone-selector\">\r\n <timezone-selector [(timezone)]=\"timezone\" [disabled]=\"showReadFileProgress\"></timezone-selector>\r\n </div>\r\n </div>\r\n\r\n <div class=\"port-selection\">\r\n <div class=\"port-selector\">\r\n <port-selector (portChange)=\"switchPortForChart($event)\" [(port)]=\"port\" [ports]=\"ports\" [disabled]=\"showReadFileProgress\"></port-selector>\r\n </div>\r\n <div class=\"port-load-button\">\r\n <button (click)=\"loadPorts()\" title=\"Load all ports from name server history trace file.\" [disabled]=\"!enableShowChartButton || port || !enableLoadPortsButton\">{{showReadFileProgress? \"Loading...\" : \"Load\"}}</button>\r\n </div>\r\n </div>\r\n\r\n <div class=\"chart-operation\">\r\n <div class=\"left\">\r\n <button (click)=\"showChart()\" title=\"Load and display all data from name server history trace file.\" [disabled]=\"!enableShowChartButton\">{{showReadFileProgress? \"Loading...\" : \"Show\"}}</button>\r\n </div>\r\n <div class=\"right\">\r\n <button (click)=\"resetChart()\" title=\"Reset zoom of chart.\" [disabled]=\"showReadFileProgress || !enableResetChartButton\">Reset Chart</button>\r\n </div>\r\n </div>\r\n </div>\r\n <div #nameserverHistoryContent class=\"nameserver-history-content\">\r\n <div class=\"nameserver-history-content-chart\">\r\n <instruction [(show)]=\"showInstruction\" *ngIf=\"!showChartFlag && showInstruction\"\r\n [step1Finished]=\"!!file\"\r\n [step2Finished]=\"dateTimeRange && (!!dateTimeRange[0] || !!dateTimeRange[1]) || timezone != defaultTimezone\"\r\n [step3Finished]=\"!!port\"\r\n [step4Finished]=\"stepShowChart && !enableShowChartButton\"\r\n [step5Finished]=\"false\">\r\n </instruction>\r\n <canvas id=\"chartNameServerHistory\" ></canvas>\r\n </div>\r\n <div class=\"nameserver-history-content-controller\" >\r\n <ngx-selection-table (change)=\"selectItem($event)\" *ngIf=\"showChartFlag\"\r\n [filter]=\"true\"\r\n [checkbox]=\"true\"\r\n [tableSource]=\"tableSource\"\r\n [keyColumn]=\"kpiColumn\"\r\n [hiddenColumns]=\"hiddenColumns\"\r\n [tooltipColumn]=\"descColumn\"\r\n [searchStyle]=\"searchType\"\r\n [searchColumn]=\"kpiColumn\"\r\n [multiSelection]=\"true\">\r\n </ngx-selection-table>\r\n </div>\r\n </div>\r\n</div>\r\n<div class=\"message-container\" *ngIf=\"alertMessage\">\r\n <alert [(alertMessage)]=\"alertMessage\" [alertType]=\"alertType\" [alertTimeout]=\"30000\"></alert>\r\n</div>\r\n", styles: [":host *,:host *:before,:host *:after{box-sizing:inherit;display:inherit;font-size:inherit;font-weight:inherit;font-family:inherit}:host .hover-box,:host .nameserver-history-all .toolbar-chart .port-selection .port-load-button button:hover{outline:0;box-shadow:0 0 6px #23adff}:host .dashed-box,:host .nameserver-history-all .toolbar-chart .chart-operation button,:host .nameserver-history-all .toolbar-chart .port-selection,:host .nameserver-history-all .toolbar-chart .input-time,:host .nameserver-history-all .toolbar-chart .upload-box-content{background:#f8f8f8;box-shadow:inset 0 20px 20px -20px #0009;border:1px dashed #0782d0}:host .solid-box,:host .nameserver-history-all .toolbar-chart .port-selection .port-load-button button{background:#fff none;border:1px solid #ccc;border-radius:4px;line-height:1.42857143}:host .nameserver-history-all{width:98%;min-width:1314px;height:auto;border:1px none #0782d0;border-bottom-style:dashed;margin:3px 1%;box-sizing:border-box;display:inline-block;font-size:14px;font-weight:400;font-family:Helvetica,Arial,sans-serif}:host .nameserver-history-all .toolbar-chart{width:100%;height:48px}:host .nameserver-history-all .toolbar-chart button{text-align:center;white-space:nowrap;vertical-align:middle}:host .nameserver-history-all .toolbar-chart button:hover{text-shadow:1px 1px 3px royalblue;cursor:pointer;font-weight:600}:host .nameserver-history-all .toolbar-chart button:disabled{text-shadow:none;opacity:.65;cursor:default;color:#a9a9a9;font-weight:400}:host .nameserver-history-all .toolbar-chart .upload-box-content{width:20%;height:100%;float:left}:host .nameserver-history-all .toolbar-chart .upload-box-content .box-stream-mode-text{text-align:center;color:#00008b}:host .nameserver-history-all .toolbar-chart .input-time{margin-left:1%;margin-right:1%;width:43%;height:100%}:host .nameserver-history-all .toolbar-chart .input-time .input-time-range{height:100%;width:57%;float:left}:host .nameserver-history-all .toolbar-chart .input-time .timezone-selector{margin-top:6px;height:100%;width:42.5%;margin-right:.5%;float:right}:host .nameserver-history-all .toolbar-chart .port-selection{width:14%;margin-right:1%;height:48px}:host .nameserver-history-all .toolbar-chart .port-selection .port-selector{margin-top:6px;margin-left:2%;margin-right:1%;width:47%;float:left}:host .nameserver-history-all .toolbar-chart .port-selection .port-load-button{margin-top:6px;margin-left:1%;margin-right:2%;width:47%;float:right}:host .nameserver-history-all .toolbar-chart .port-selection .port-load-button button{color:#333;width:100%;padding:6px 12px;margin-bottom:0}:host .nameserver-history-all .toolbar-chart .port-selection .port-load-button button:hover{text-shadow:None;font-weight:400}:host .nameserver-history-all .toolbar-chart .port-selection .port-load-button button:disabled{box-shadow:none}:host .nameserver-history-all .toolbar-chart .chart-operation{width:20%;height:48px;float:right}:host .nameserver-history-all .toolbar-chart .chart-operation .left{margin-right:1%;width:49%;height:100%;float:left}:host .nameserver-history-all .toolbar-chart .chart-operation .right{width:50%;height:100%;float:right}:host .nameserver-history-all .toolbar-chart .chart-operation button{width:100%;height:100%;color:#00008b}:host .nameserver-history-all .nameserver-history-content{width:100%;height:730px;margin:5px 5px 5px 0}:host .nameserver-history-all .nameserver-history-content .nameserver-history-content-chart{width:75%;height:100%;position:relative;float:left}:host .nameserver-history-all .nameserver-history-content .nameserver-history-content-controller{width:25%;height:100%;float:right;overflow:auto}:host .message-container{width:98%;margin:0 1%;box-sizing:border-box;display:inline-block}\n"], components: [{ type: FileDropInputComponent, selector: "file-drop-input", inputs: ["dropAreaText", "inputAreaText"], outputs: ["fileDrop", "fileInput"] }, { type: ProgressBarComponent, selector: "progress-bar", inputs: ["progress"] }, { type: TimeRangeSelectorComponent, selector: "time-range-selector", inputs: ["disabled", "dateTimeRange"], outputs: ["dateTimeRangeChange"] }, { type: TimezoneSelectorComponent, selector: "timezone-selector", inputs: ["disabled", "timezone"], outputs: ["timezoneChange"] }, { type: PortSelectorComponent, selector: "port-selector", inputs: ["disabled", "port", "ports"], outputs: ["portChange"] }, { type: InstructionComponent, selector: "instruction", inputs: ["step1Finished", "step2Finished", "step3Finished", "step4Finished", "step5Finished", "show"], outputs: ["showChange"] }, { type: i8.SelectionTableComponent, selector: "ngx-selection-table", inputs: ["filter", "keyColumn", "tableSource", "checkbox", "multiSelection", "clickToSelect", "hiddenColumns", "tooltipColumn", "searchStyle", "searchColumn"], outputs: ["change"] }, { type: AlertComponent, selector: "alert", inputs: ["alertMessage", "alertType", "alertTimeout"], outputs: ["alertMessageChange"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
3996
4004
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NameServerHistoryComponent, decorators: [{
|
|
3997
4005
|
type: Component,
|
|
3998
|
-
args: [{ selector: 'ngx-hana-nameserver-history-viewer', providers: [FileService, ChartService, UIService], template: "<div #nameserverHistoryAll class=\"nameserver-history-all\" (window:resize)=\"onResize()\">\r\n <div class=\"toolbar-chart\">\r\n <div class=\"upload-box-content\">\r\n <div *ngIf=\"!showReadFileProgress\">\r\n <file-drop-input (fileDrop)=\"fileDropped($event)\" (fileInput)=\"fileSelected($event)\"\r\n [dropAreaText]= \"abbreviatedFileName\"\r\n [inputAreaText]=\"'Browse'\"\r\n [title]=\"file?.name? file.name:'Select a name server history file from your local disk.'\"\r\n *ngIf=\"!fileBuffer\">\r\n </file-drop-input>\r\n <p *ngIf=\"fileBuffer\">{{streamModeFileName || 'nameserver_history.trc (stream mode)'}}</p>\r\n </div>\r\n <div *ngIf=\"showReadFileProgress\">\r\n <progress-bar [progress]=\"readProgress\"></progress-bar>\r\n </div>\r\n </div>\r\n <div class=\"input-time\">\r\n <div class=\"input-time-range\">\r\n <time-range-selector [disabled]=\"showReadFileProgress\" [(dateTimeRange)]=\"dateTimeRange\"></time-range-selector>\r\n </div>\r\n <div class=\"timezone-selector\">\r\n <timezone-selector [(timezone)]=\"timezone\" [disabled]=\"showReadFileProgress\"></timezone-selector>\r\n </div>\r\n </div>\r\n\r\n <div class=\"port-selection\">\r\n <div class=\"port-selector\">\r\n <port-selector (portChange)=\"switchPortForChart($event)\" [(port)]=\"port\" [ports]=\"ports\" [disabled]=\"showReadFileProgress\"></port-selector>\r\n </div>\r\n <div class=\"port-load-button\">\r\n <button (click)=\"loadPorts()\" title=\"Load all ports from name server history trace file.\" [disabled]=\"!enableShowChartButton || port || !enableLoadPortsButton\">{{showReadFileProgress? \"Loading...\" : \"Load\"}}</button>\r\n </div>\r\n </div>\r\n\r\n <div class=\"chart-operation\">\r\n <div class=\"left\">\r\n <button (click)=\"showChart()\" title=\"Load and display all data from name server history trace file.\" [disabled]=\"!enableShowChartButton\">{{showReadFileProgress? \"Loading...\" : \"Show\"}}</button>\r\n </div>\r\n <div class=\"right\">\r\n <button (click)=\"resetChart()\" title=\"Reset zoom of chart.\" [disabled]=\"showReadFileProgress || !enableResetChartButton\">Reset Chart</button>\r\n </div>\r\n </div>\r\n </div>\r\n <div #nameserverHistoryContent class=\"nameserver-history-content\">\r\n <div class=\"nameserver-history-content-chart\">\r\n <instruction [(show)]=\"showInstruction\" *ngIf=\"!showChartFlag && showInstruction\"\r\n [step1Finished]=\"!!file\"\r\n [step2Finished]=\"dateTimeRange && (!!dateTimeRange[0] || !!dateTimeRange[1]) || timezone != defaultTimezone\"\r\n [step3Finished]=\"!!port\"\r\n [step4Finished]=\"stepShowChart && !enableShowChartButton\"\r\n [step5Finished]=\"false\">\r\n </instruction>\r\n <canvas id=\"chartNameServerHistory\" ></canvas>\r\n </div>\r\n <div class=\"nameserver-history-content-controller\" >\r\n <ngx-selection-table (change)=\"selectItem($event)\" *ngIf=\"showChartFlag\"\r\n [filter]=\"true\"\r\n [checkbox]=\"true\"\r\n [tableSource]=\"tableSource\"\r\n [keyColumn]=\"kpiColumn\"\r\n [hiddenColumns]=\"hiddenColumns\"\r\n [tooltipColumn]=\"descColumn\"\r\n [searchStyle]=\"searchType\"\r\n [searchColumn]=\"kpiColumn\"\r\n [multiSelection]=\"true\">\r\n </ngx-selection-table>\r\n </div>\r\n </div>\r\n</div>\r\n<div class=\"message-container\" *ngIf=\"alertMessage\">\r\n <alert [(alertMessage)]=\"alertMessage\" [alertType]=\"alertType\" [alertTimeout]=\"30000\"></alert>\r\n</div>\r\n", styles: [":host *,:host *:before,:host *:after{box-sizing:inherit;display:inherit;font-size:inherit;font-weight:inherit;font-family:inherit}:host .hover-box,:host .nameserver-history-all .toolbar-chart .port-selection .port-load-button button:hover{outline:0;box-shadow:0 0 6px #23adff}:host .dashed-box,:host .nameserver-history-all .toolbar-chart .chart-operation button,:host .nameserver-history-all .toolbar-chart .port-selection,:host .nameserver-history-all .toolbar-chart .input-time,:host .nameserver-history-all .toolbar-chart .upload-box-content{background:#f8f8f8;box-shadow:inset 0 20px 20px -20px #0009;border:1px dashed #0782d0}:host .solid-box,:host .nameserver-history-all .toolbar-chart .port-selection .port-load-button button{background:#fff none;border:1px solid #ccc;border-radius:4px;line-height:1.42857143}:host .nameserver-history-all{width:98%;min-width:1314px;height:auto;border:1px none #0782d0;border-bottom-style:dashed;margin:3px 1%;box-sizing:border-box;display:inline-block;font-size:14px;font-weight:400;font-family:Helvetica,Arial,sans-serif}:host .nameserver-history-all .toolbar-chart{width:100%;height:48px}:host .nameserver-history-all .toolbar-chart button{text-align:center;white-space:nowrap;vertical-align:middle}:host .nameserver-history-all .toolbar-chart button:hover{text-shadow:1px 1px 3px royalblue;cursor:pointer;font-weight:600}:host .nameserver-history-all .toolbar-chart button:disabled{text-shadow:none;opacity:.65;cursor:default;color:#a9a9a9;font-weight:400}:host .nameserver-history-all .toolbar-chart .upload-box-content{width:20%;height:100%;float:left
|
|
4006
|
+
args: [{ selector: 'ngx-hana-nameserver-history-viewer', providers: [FileService, ChartService, UIService], template: "<div #nameserverHistoryAll class=\"nameserver-history-all\" (window:resize)=\"onResize()\">\r\n <div class=\"toolbar-chart\">\r\n <div class=\"upload-box-content\">\r\n <div *ngIf=\"!showReadFileProgress\">\r\n <file-drop-input (fileDrop)=\"fileDropped($event)\" (fileInput)=\"fileSelected($event)\"\r\n [dropAreaText]= \"abbreviatedFileName\"\r\n [inputAreaText]=\"'Browse'\"\r\n [title]=\"file?.name? file.name:'Select a name server history file from your local disk.'\"\r\n *ngIf=\"!fileBuffer\">\r\n </file-drop-input>\r\n <p *ngIf=\"fileBuffer\" class=\"box-stream-mode-text\">{{streamModeFileName || 'nameserver_history.trc (stream mode)'}}</p>\r\n </div>\r\n <div *ngIf=\"showReadFileProgress\">\r\n <progress-bar [progress]=\"readProgress\"></progress-bar>\r\n </div>\r\n </div>\r\n <div class=\"input-time\">\r\n <div class=\"input-time-range\">\r\n <time-range-selector [disabled]=\"showReadFileProgress\" [(dateTimeRange)]=\"dateTimeRange\"></time-range-selector>\r\n </div>\r\n <div class=\"timezone-selector\">\r\n <timezone-selector [(timezone)]=\"timezone\" [disabled]=\"showReadFileProgress\"></timezone-selector>\r\n </div>\r\n </div>\r\n\r\n <div class=\"port-selection\">\r\n <div class=\"port-selector\">\r\n <port-selector (portChange)=\"switchPortForChart($event)\" [(port)]=\"port\" [ports]=\"ports\" [disabled]=\"showReadFileProgress\"></port-selector>\r\n </div>\r\n <div class=\"port-load-button\">\r\n <button (click)=\"loadPorts()\" title=\"Load all ports from name server history trace file.\" [disabled]=\"!enableShowChartButton || port || !enableLoadPortsButton\">{{showReadFileProgress? \"Loading...\" : \"Load\"}}</button>\r\n </div>\r\n </div>\r\n\r\n <div class=\"chart-operation\">\r\n <div class=\"left\">\r\n <button (click)=\"showChart()\" title=\"Load and display all data from name server history trace file.\" [disabled]=\"!enableShowChartButton\">{{showReadFileProgress? \"Loading...\" : \"Show\"}}</button>\r\n </div>\r\n <div class=\"right\">\r\n <button (click)=\"resetChart()\" title=\"Reset zoom of chart.\" [disabled]=\"showReadFileProgress || !enableResetChartButton\">Reset Chart</button>\r\n </div>\r\n </div>\r\n </div>\r\n <div #nameserverHistoryContent class=\"nameserver-history-content\">\r\n <div class=\"nameserver-history-content-chart\">\r\n <instruction [(show)]=\"showInstruction\" *ngIf=\"!showChartFlag && showInstruction\"\r\n [step1Finished]=\"!!file\"\r\n [step2Finished]=\"dateTimeRange && (!!dateTimeRange[0] || !!dateTimeRange[1]) || timezone != defaultTimezone\"\r\n [step3Finished]=\"!!port\"\r\n [step4Finished]=\"stepShowChart && !enableShowChartButton\"\r\n [step5Finished]=\"false\">\r\n </instruction>\r\n <canvas id=\"chartNameServerHistory\" ></canvas>\r\n </div>\r\n <div class=\"nameserver-history-content-controller\" >\r\n <ngx-selection-table (change)=\"selectItem($event)\" *ngIf=\"showChartFlag\"\r\n [filter]=\"true\"\r\n [checkbox]=\"true\"\r\n [tableSource]=\"tableSource\"\r\n [keyColumn]=\"kpiColumn\"\r\n [hiddenColumns]=\"hiddenColumns\"\r\n [tooltipColumn]=\"descColumn\"\r\n [searchStyle]=\"searchType\"\r\n [searchColumn]=\"kpiColumn\"\r\n [multiSelection]=\"true\">\r\n </ngx-selection-table>\r\n </div>\r\n </div>\r\n</div>\r\n<div class=\"message-container\" *ngIf=\"alertMessage\">\r\n <alert [(alertMessage)]=\"alertMessage\" [alertType]=\"alertType\" [alertTimeout]=\"30000\"></alert>\r\n</div>\r\n", styles: [":host *,:host *:before,:host *:after{box-sizing:inherit;display:inherit;font-size:inherit;font-weight:inherit;font-family:inherit}:host .hover-box,:host .nameserver-history-all .toolbar-chart .port-selection .port-load-button button:hover{outline:0;box-shadow:0 0 6px #23adff}:host .dashed-box,:host .nameserver-history-all .toolbar-chart .chart-operation button,:host .nameserver-history-all .toolbar-chart .port-selection,:host .nameserver-history-all .toolbar-chart .input-time,:host .nameserver-history-all .toolbar-chart .upload-box-content{background:#f8f8f8;box-shadow:inset 0 20px 20px -20px #0009;border:1px dashed #0782d0}:host .solid-box,:host .nameserver-history-all .toolbar-chart .port-selection .port-load-button button{background:#fff none;border:1px solid #ccc;border-radius:4px;line-height:1.42857143}:host .nameserver-history-all{width:98%;min-width:1314px;height:auto;border:1px none #0782d0;border-bottom-style:dashed;margin:3px 1%;box-sizing:border-box;display:inline-block;font-size:14px;font-weight:400;font-family:Helvetica,Arial,sans-serif}:host .nameserver-history-all .toolbar-chart{width:100%;height:48px}:host .nameserver-history-all .toolbar-chart button{text-align:center;white-space:nowrap;vertical-align:middle}:host .nameserver-history-all .toolbar-chart button:hover{text-shadow:1px 1px 3px royalblue;cursor:pointer;font-weight:600}:host .nameserver-history-all .toolbar-chart button:disabled{text-shadow:none;opacity:.65;cursor:default;color:#a9a9a9;font-weight:400}:host .nameserver-history-all .toolbar-chart .upload-box-content{width:20%;height:100%;float:left}:host .nameserver-history-all .toolbar-chart .upload-box-content .box-stream-mode-text{text-align:center;color:#00008b}:host .nameserver-history-all .toolbar-chart .input-time{margin-left:1%;margin-right:1%;width:43%;height:100%}:host .nameserver-history-all .toolbar-chart .input-time .input-time-range{height:100%;width:57%;float:left}:host .nameserver-history-all .toolbar-chart .input-time .timezone-selector{margin-top:6px;height:100%;width:42.5%;margin-right:.5%;float:right}:host .nameserver-history-all .toolbar-chart .port-selection{width:14%;margin-right:1%;height:48px}:host .nameserver-history-all .toolbar-chart .port-selection .port-selector{margin-top:6px;margin-left:2%;margin-right:1%;width:47%;float:left}:host .nameserver-history-all .toolbar-chart .port-selection .port-load-button{margin-top:6px;margin-left:1%;margin-right:2%;width:47%;float:right}:host .nameserver-history-all .toolbar-chart .port-selection .port-load-button button{color:#333;width:100%;padding:6px 12px;margin-bottom:0}:host .nameserver-history-all .toolbar-chart .port-selection .port-load-button button:hover{text-shadow:None;font-weight:400}:host .nameserver-history-all .toolbar-chart .port-selection .port-load-button button:disabled{box-shadow:none}:host .nameserver-history-all .toolbar-chart .chart-operation{width:20%;height:48px;float:right}:host .nameserver-history-all .toolbar-chart .chart-operation .left{margin-right:1%;width:49%;height:100%;float:left}:host .nameserver-history-all .toolbar-chart .chart-operation .right{width:50%;height:100%;float:right}:host .nameserver-history-all .toolbar-chart .chart-operation button{width:100%;height:100%;color:#00008b}:host .nameserver-history-all .nameserver-history-content{width:100%;height:730px;margin:5px 5px 5px 0}:host .nameserver-history-all .nameserver-history-content .nameserver-history-content-chart{width:75%;height:100%;position:relative;float:left}:host .nameserver-history-all .nameserver-history-content .nameserver-history-content-controller{width:25%;height:100%;float:right;overflow:auto}:host .message-container{width:98%;margin:0 1%;box-sizing:border-box;display:inline-block}\n"] }]
|
|
3999
4007
|
}], ctorParameters: function () { return [{ type: FileService }, { type: ChartService }, { type: UIService }]; }, propDecorators: { nameserverHistoryAllRef: [{
|
|
4000
4008
|
type: ViewChild,
|
|
4001
4009
|
args: ['nameserverHistoryAll', { read: ElementRef }]
|
|
@@ -4016,6 +4024,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
4016
4024
|
type: Input
|
|
4017
4025
|
}], streamModeFileName: [{
|
|
4018
4026
|
type: Input
|
|
4027
|
+
}], autoDisplay: [{
|
|
4028
|
+
type: Input
|
|
4019
4029
|
}] } });
|
|
4020
4030
|
|
|
4021
4031
|
class NameserverHistoryModule {
|