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,7 +6,7 @@ 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
12
|
import { SelectionModel } from '@angular/cdk/collections';
|
|
@@ -511,8 +511,6 @@ function setChartHeight(nsAll, nsContent) {
|
|
|
511
511
|
}
|
|
512
512
|
}
|
|
513
513
|
|
|
514
|
-
// workaround for fixing following error when doing packagr: Cannot call a namespace ('moment')
|
|
515
|
-
const moment$4 = momentImported;
|
|
516
514
|
/**
|
|
517
515
|
* get the time range for all ports
|
|
518
516
|
*/
|
|
@@ -550,7 +548,7 @@ function _getTimeRange(time) {
|
|
|
550
548
|
* get default local time zone
|
|
551
549
|
*/
|
|
552
550
|
function getDefaultTimezone() {
|
|
553
|
-
return moment$
|
|
551
|
+
return moment$2.tz.guess();
|
|
554
552
|
}
|
|
555
553
|
/**
|
|
556
554
|
* Get time from provided timezone, using this only because chart.js doesn't support timezone.
|
|
@@ -563,8 +561,8 @@ function getTimeFromTimeZone(time, timezone) {
|
|
|
563
561
|
timezone = getDefaultTimezone();
|
|
564
562
|
console.warn(`getTimeFromTimeZone - Input timezone is null, returning the local (${timezone}) time. `);
|
|
565
563
|
}
|
|
566
|
-
const utcOffset = moment$
|
|
567
|
-
const currentOffset = moment$
|
|
564
|
+
const utcOffset = moment$2.tz.zone(timezone).utcOffset(time * 1000);
|
|
565
|
+
const currentOffset = moment$2.tz.zone(getDefaultTimezone()).utcOffset(time * 1000);
|
|
568
566
|
// convert to utc and then to selected timezone
|
|
569
567
|
return time + currentOffset * 60 - utcOffset * 60;
|
|
570
568
|
}
|
|
@@ -572,7 +570,7 @@ function getTimeFromTimeZone(time, timezone) {
|
|
|
572
570
|
* Get time formatted with the provided timezone
|
|
573
571
|
*/
|
|
574
572
|
function getTimeString(time) {
|
|
575
|
-
return moment$
|
|
573
|
+
return moment$2(time).format('YYYY-MM-DD HH:mm:ss');
|
|
576
574
|
}
|
|
577
575
|
/**
|
|
578
576
|
* Get the time range string by time array, eg: 2018-10-25 10:10:00 ~ 2018-10-25 12:12:00
|
|
@@ -762,8 +760,6 @@ function blobToFile(theBlob, fileName) {
|
|
|
762
760
|
return theBlob;
|
|
763
761
|
}
|
|
764
762
|
|
|
765
|
-
// workaround for fixing following error when doing packagr: Cannot call a namespace ('moment')
|
|
766
|
-
const moment$3 = momentImported;
|
|
767
763
|
class TimezoneSelectorService {
|
|
768
764
|
/**
|
|
769
765
|
* get the default timezone
|
|
@@ -776,7 +772,7 @@ class TimezoneSelectorService {
|
|
|
776
772
|
*/
|
|
777
773
|
getZones() {
|
|
778
774
|
const timezones = [];
|
|
779
|
-
const zones = moment$
|
|
775
|
+
const zones = moment$2.tz.names();
|
|
780
776
|
zones.forEach(zone => {
|
|
781
777
|
// get region
|
|
782
778
|
let region;
|
|
@@ -807,8 +803,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
807
803
|
type: Injectable
|
|
808
804
|
}] });
|
|
809
805
|
|
|
810
|
-
// workaround for fixing following error when doing packagr: Cannot call a namespace ('moment')
|
|
811
|
-
const moment$2 = momentImported;
|
|
812
806
|
class TimezoneSelectorComponent {
|
|
813
807
|
constructor(service) {
|
|
814
808
|
this.service = service;
|
|
@@ -954,7 +948,7 @@ class PortSelectorComponent {
|
|
|
954
948
|
}
|
|
955
949
|
PortSelectorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PortSelectorComponent, deps: [{ token: PortSelectorService }], target: i0.ɵɵFactoryTarget.Component });
|
|
956
950
|
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>
|
|
951
|
+
<label style="width: 100%">
|
|
958
952
|
<ngx-dropdown-list (selectionChange)="onChange($event)"
|
|
959
953
|
[items]="displayPorts"
|
|
960
954
|
[multiSelection]="false"
|
|
@@ -970,7 +964,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
970
964
|
args: [{
|
|
971
965
|
selector: 'port-selector',
|
|
972
966
|
template: `
|
|
973
|
-
<label>
|
|
967
|
+
<label style="width: 100%">
|
|
974
968
|
<ngx-dropdown-list (selectionChange)="onChange($event)"
|
|
975
969
|
[items]="displayPorts"
|
|
976
970
|
[multiSelection]="false"
|
|
@@ -1068,7 +1062,7 @@ TimeRangeSelectorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0
|
|
|
1068
1062
|
<owl-date-time #dtRange3 (afterPickerClosed)="afterPickerClosed()"></owl-date-time>
|
|
1069
1063
|
</div>
|
|
1070
1064
|
</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
|
|
1065
|
+
`, 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
1066
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TimeRangeSelectorComponent, decorators: [{
|
|
1073
1067
|
type: Component,
|
|
1074
1068
|
args: [{ selector: 'time-range-selector', template: `
|
|
@@ -1090,7 +1084,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
1090
1084
|
<owl-date-time #dtRange3 (afterPickerClosed)="afterPickerClosed()"></owl-date-time>
|
|
1091
1085
|
</div>
|
|
1092
1086
|
</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
|
|
1087
|
+
`, 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
1088
|
}], propDecorators: { disabled: [{
|
|
1095
1089
|
type: Input
|
|
1096
1090
|
}], dateTimeRange: [{
|
|
@@ -1946,11 +1940,16 @@ class ChartService {
|
|
|
1946
1940
|
* generate configuration for chart and create the chart object.
|
|
1947
1941
|
*/
|
|
1948
1942
|
buildChart(time, data, yScale, header, headerKey, selection, tableSource, title, defaultItems, zoomCB) {
|
|
1949
|
-
return new Promise((resolve) => {
|
|
1950
|
-
const ctx = document.getElementById('chartNameServerHistory')
|
|
1951
|
-
|
|
1952
|
-
|
|
1953
|
-
|
|
1943
|
+
return new Promise((resolve, reject) => {
|
|
1944
|
+
const ctx = document.getElementById('chartNameServerHistory')?.getContext('2d');
|
|
1945
|
+
if (ctx) {
|
|
1946
|
+
const cfg = ChartService._generateChartConfig(time, data, yScale, header, headerKey, selection, tableSource, title, defaultItems, zoomCB);
|
|
1947
|
+
this._chart = new Chart$2(ctx, cfg);
|
|
1948
|
+
resolve();
|
|
1949
|
+
}
|
|
1950
|
+
else {
|
|
1951
|
+
reject('Can not find the canvas.');
|
|
1952
|
+
}
|
|
1954
1953
|
});
|
|
1955
1954
|
}
|
|
1956
1955
|
/**
|
|
@@ -3532,9 +3531,19 @@ class NameServerHistoryComponent {
|
|
|
3532
3531
|
this.stepShowChart = false;
|
|
3533
3532
|
this.searchType = SearchType.searchAll;
|
|
3534
3533
|
}
|
|
3535
|
-
|
|
3536
|
-
|
|
3537
|
-
|
|
3534
|
+
async ngOnChanges(changes) {
|
|
3535
|
+
const fbc = changes.fileBuffer;
|
|
3536
|
+
if (fbc && fbc.currentValue && fbc.currentValue !== fbc.previousValue) {
|
|
3537
|
+
// simulate selecting file
|
|
3538
|
+
const simulatedEvent = { target: { files: [blobToFile(this.fileBuffer, this.streamModeFileName)] } };
|
|
3539
|
+
await this.fileSelected(simulatedEvent);
|
|
3540
|
+
this.port = undefined; // clear the port selection
|
|
3541
|
+
if (this.autoDisplay) {
|
|
3542
|
+
this.showChart();
|
|
3543
|
+
}
|
|
3544
|
+
}
|
|
3545
|
+
}
|
|
3546
|
+
ngAfterViewInit() {
|
|
3538
3547
|
// init items' status
|
|
3539
3548
|
// reset chart button will be disable by default later, only be enabled after zoomed
|
|
3540
3549
|
this._toggleItems([
|
|
@@ -3544,19 +3553,12 @@ class NameServerHistoryComponent {
|
|
|
3544
3553
|
{ id: HtmlElement.loadPortsButton, status: true },
|
|
3545
3554
|
{ id: HtmlElement.resetChartButton, status: false }
|
|
3546
3555
|
]);
|
|
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
|
-
}
|
|
3556
|
+
this.onResize(); // update the size, otherwise there may have a scrollbar (because of the toast) if auto display is set to true
|
|
3555
3557
|
}
|
|
3556
3558
|
/**
|
|
3557
|
-
|
|
3558
|
-
|
|
3559
|
-
|
|
3559
|
+
* Reset Chart to initial status
|
|
3560
|
+
* If legend is already selected/unselected from the list, it wouldn't be restored.
|
|
3561
|
+
*/
|
|
3560
3562
|
resetChart() {
|
|
3561
3563
|
this._toggleItems([{ id: HtmlElement.resetChartButton, status: false }]);
|
|
3562
3564
|
if (this.tableSource && this._selection) {
|
|
@@ -3607,12 +3609,12 @@ class NameServerHistoryComponent {
|
|
|
3607
3609
|
/**
|
|
3608
3610
|
* select name server history file, currently only supports 1 file.
|
|
3609
3611
|
*/
|
|
3610
|
-
fileSelected(event) {
|
|
3612
|
+
async fileSelected(event) {
|
|
3611
3613
|
const selectedFile = getFileFromInput(event.target);
|
|
3612
3614
|
if (selectedFile) {
|
|
3613
3615
|
if (!isSameFile(this.file, selectedFile)) {
|
|
3614
3616
|
// init port selector
|
|
3615
|
-
this._initPortSelector().catch(e => this._showMessage(Alert.error, e));
|
|
3617
|
+
await this._initPortSelector().catch(e => this._showMessage(Alert.error, e));
|
|
3616
3618
|
this.file = selectedFile;
|
|
3617
3619
|
this.abbreviatedFileName = getAbbreviatedFileName(this.file.name);
|
|
3618
3620
|
// after file has been selected, the show chart button needs to be enabled
|
|
@@ -3992,10 +3994,10 @@ class NameServerHistoryComponent {
|
|
|
3992
3994
|
}
|
|
3993
3995
|
}
|
|
3994
3996
|
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
|
|
3997
|
+
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
3998
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NameServerHistoryComponent, decorators: [{
|
|
3997
3999
|
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
|
|
4000
|
+
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
4001
|
}], ctorParameters: function () { return [{ type: FileService }, { type: ChartService }, { type: UIService }]; }, propDecorators: { nameserverHistoryAllRef: [{
|
|
4000
4002
|
type: ViewChild,
|
|
4001
4003
|
args: ['nameserverHistoryAll', { read: ElementRef }]
|
|
@@ -4016,6 +4018,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
4016
4018
|
type: Input
|
|
4017
4019
|
}], streamModeFileName: [{
|
|
4018
4020
|
type: Input
|
|
4021
|
+
}], autoDisplay: [{
|
|
4022
|
+
type: Input
|
|
4019
4023
|
}] } });
|
|
4020
4024
|
|
|
4021
4025
|
class NameserverHistoryModule {
|