ngx-hana-nameserver-history-viewer 1.2.1 → 21.1.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ngx-hana-nameserver-history-viewer",
-  "version": "1.2.1",
+  "version": "21.1.0",
   "private": false,
   "author": {
     "name": "Kuang Cheng",
@@ -25,38 +25,31 @@
     "url": "https://github.com/ckyycc/ngx-hana-nameserver-history-viewer/issues"
   },
   "peerDependencies": {
-    "@angular/animations": "^13.3.9",
-    "@angular/cdk": "^13.3.9",
-    "@angular/common": "^13.3.9",
-    "@angular/core": "^13.3.9",
-    "@angular/forms": "^13.3.9",
-    "@angular/platform-browser": "^13.3.9",
-    "@danielmoncada/angular-datetime-picker": "^14.1.0",
-    "chart.js": "2.7.3",
-    "hammerjs": "^2.0.8",
-    "moment-timezone": "^0.5.34",
-    "ngx-dropdown-list": "^1.2.0",
-    "ngx-selection-table": "^1.2.0",
-    "papaparse": "^5.3.2",
-    "zone.js": "^0.11.5"
+    "@angular/animations": "^21.1.1",
+    "@angular/cdk": "^21.1.1",
+    "@angular/common": "^21.1.1",
+    "@angular/core": "^21.1.1",
+    "@angular/forms": "^21.1.1",
+    "@angular/platform-browser": "^21.1.1",
+    "chart.js": "4.5.1",
+    "chartjs-plugin-zoom": "2.2.0",
+    "chartjs-adapter-moment": "^1.0.1",
+    "moment-timezone": "^0.6.0",
+    "ngx-dropdown-list": "^21.0.2",
+    "ngx-selection-table": "^21.0.2",
+    "nshviewer-angular-datetime-picker": "^21.0.0",
+    "papaparse": "^5.4.1",
+    "zone.js": "^0.16.0"
   },
-  "module": "fesm2015/ngx-hana-nameserver-history-viewer.mjs",
-  "es2020": "fesm2020/ngx-hana-nameserver-history-viewer.mjs",
-  "esm2020": "esm2020/ngx-hana-nameserver-history-viewer.mjs",
-  "fesm2020": "fesm2020/ngx-hana-nameserver-history-viewer.mjs",
-  "fesm2015": "fesm2015/ngx-hana-nameserver-history-viewer.mjs",
-  "typings": "ngx-hana-nameserver-history-viewer.d.ts",
+  "module": "fesm2022/ngx-hana-nameserver-history-viewer.mjs",
+  "typings": "types/ngx-hana-nameserver-history-viewer.d.ts",
   "exports": {
     "./package.json": {
       "default": "./package.json"
     },
     ".": {
-      "types": "./ngx-hana-nameserver-history-viewer.d.ts",
-      "esm2020": "./esm2020/ngx-hana-nameserver-history-viewer.mjs",
-      "es2020": "./fesm2020/ngx-hana-nameserver-history-viewer.mjs",
-      "es2015": "./fesm2015/ngx-hana-nameserver-history-viewer.mjs",
-      "node": "./fesm2015/ngx-hana-nameserver-history-viewer.mjs",
-      "default": "./fesm2020/ngx-hana-nameserver-history-viewer.mjs"
+      "types": "./types/ngx-hana-nameserver-history-viewer.d.ts",
+      "default": "./fesm2022/ngx-hana-nameserver-history-viewer.mjs"
     }
   },
   "sideEffects": false,

package/types/ngx-hana-nameserver-history-viewer.d.ts

@@ -0,0 +1,545 @@
+import * as i0 from '@angular/core';
+import { OnChanges, AfterViewInit, ElementRef, SimpleChanges } from '@angular/core';
+import { SelectionModel } from '@angular/cdk/collections';
+
+declare enum Item {
+    kpi = "KPI",
+    yScale = "Y-Scale",
+    yScaleGroup = "_YScaleGroup",
+    unit = "Unit",
+    max = "Max",
+    average = "Average",
+    sum = "Sum",
+    last = "Last",
+    description = "Description",
+    header = "header"
+}
+
+declare enum Alert {
+    success = "success",
+    error = "error",
+    info = "info",
+    warning = "warning"
+}
+
+interface ColorRgba {
+    red: number;
+    green: number;
+    blue: number;
+    alpha: number;
+}
+
+interface Port {
+    id: string;
+    text: string;
+    selected?: boolean;
+}
+
+declare enum Abort {
+    maxLineNumReached = 0,
+    maxTimeRangeReached = 1
+}
+
+interface ChartContentDataItem {
+    x: number;
+    y: number;
+}
+
+interface ChartContentData {
+    [index: string]: ChartContentDataItem[][];
+}
+
+interface ChartContentTime {
+    [index: string]: Array<number>;
+}
+
+interface ChartContent {
+    header: string[];
+    host: string;
+    time: ChartContentTime;
+    data: ChartContentData;
+    aborted: Abort;
+}
+
+interface ChartContentHeader {
+    key: string;
+    text: string;
+}
+
+interface LegendColor {
+    [index: string]: ColorRgba;
+}
+
+declare class ChartService {
+    private _chart;
+    /**
+     * toggle the dataset status of the chart, synchronously
+     */
+    private static _toggleDataSet;
+    private static _restoreDataSetStatus;
+    /**
+     * initialize/clear the configuration for the chart
+     */
+    private static _initConfig;
+    /**
+     * Generate DataSets by the data and header information
+     */
+    private static _generateDataSets;
+    private static _generateScales;
+    /**
+     * generate configuration for chart
+     */
+    private static _generateChartConfig;
+    private _getDataSetIndexByLabel;
+    /**
+     * WORKAROUND: Setup mousemove event listener to fix Chart.js tooltip issue
+     * Issue: https://github.com/chartjs/Chart.js/issues/11972
+     * TODO: Remove this entire method when the Chart.js bug is fixed
+     */
+    private _setupTooltipWorkaround;
+    /**
+     * WORKAROUND: Clean up mousemove event listener for Chart.js tooltip issue
+     * Issue: https://github.com/chartjs/Chart.js/issues/11972
+     * TODO: Remove this entire method when the Chart.js bug is fixed
+     */
+    private _cleanupTooltipWorkaround;
+    /**
+     * destroy the chart, release the resource of the chart
+     */
+    private _destroyChart;
+    /**
+     * update/refresh the chart
+     */
+    private _updateChart;
+    /**
+     * reset zoom of the chart
+     */
+    private _resetZoom;
+    /**
+     * Reset Chart to initial status
+     * If legend is already selected/unselected from the list, it wouldn't be restored.
+     * @param dataSourceData the data sets of the chart
+     * @param selection selection status list
+     */
+    resetChart(dataSourceData: any, selection: SelectionModel<any>): Promise<any>;
+    /**
+     * destroy the chart and reinitialize the configuration of the chart
+     */
+    destroyChart(): Promise<any>;
+    /**
+     * generate configuration for chart and create the chart object.
+     */
+    buildChart(time: number[], data: ChartContentDataItem[][], yScale: number[], header: string[], headerKey: string[], selection: SelectionModel<any>, tableSource: any, title: string, defaultItems: string[], zoomCB: any): Promise<void>;
+    /**
+     * show/hide the relative data set
+     */
+    toggleDataInChart(label: string, hide: boolean): Promise<any>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ChartService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<ChartService>;
+}
+
+declare class FileService {
+    /**
+     * prevent browser from crashing, set the max rows limitation.
+     * @param limitation if this parameter is not null, the default value will be overwritten by this one.
+     */
+    private static _getMaxRowsLimitation;
+    /**
+     * get all available ports from data
+     */
+    private static _getPorts;
+    /**
+     * get the time column from the analyzed data
+     * @param data the analyzed data
+     * @param firstChunk whether it's first chunk or not
+     * @param startTime selected starting time. It's millisecond, need to be converted second.
+     * @param endTime selected ending time. It's millisecond, need to be converted second.
+     * @param lastProcessedTime last processed time form last chunk
+     * @param time time object which contains the time data for all ports
+     * @param selectedPort if the selected port is empty (did not select any port), all ports info are needed
+     * @param isMDC flag for MDC system
+     * @param timezone selected timezone
+     * @param maxRowsLimitation prevent browser from crashing, set the max rows limitation.
+     * This comes from the input: maxRowsLimitation of the component.
+     */
+    private static _getTimeColumn;
+    /**
+     * Get data for all columns
+     * @param columnNum the total number of columns. For mdc system,
+     *                  the length of each row is different. Host relative data does not exist in tenant line.
+     *                  Needs to use column number from the first line.
+     * @param data      data parsed by papa
+     * @param firstChunk the flag which identifies whether it's the first chunk or not.
+     * @param time
+     * @param indexStart
+     * @param indexEnd
+     * @param lastProcessedLine
+     * @param resultData   the result data after analyzed
+     * @param selectedPort
+     * @param isMDC
+     */
+    private static _getDataColumns;
+    /**
+     * Get Chart data from provided file.
+     * @param file the nameserver history file
+     * @param startTime
+     * @param endTime
+     * @param port
+     * @param timezone
+     * @param maxRowsLimitation prevent browser from crashing, set the max rows limitation.
+     * @param progress call back function for updating progress
+     */
+    getChartContentFromFile(file: File, startTime: number, endTime: number, port: string, timezone: string, maxRowsLimitation: any, progress: any): Promise<ChartContent>;
+    /**
+     * Get all ports from the name server history file
+     * @param file the name server history file
+     * @param progress call back for updating the progress
+     */
+    getPortsFromFile(file: File, progress: any): Promise<string[]>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<FileService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<FileService>;
+}
+
+declare class UIService {
+    private readonly _DEFAULT_DISPLAY_ITEMS;
+    private readonly _HIDED_COLUMNS;
+    private readonly _MEASURE_COLUMNS;
+    private _loadHistoryInfos;
+    /**
+     * get the colors for legends
+     */
+    static getColors(alpha?: number): LegendColor;
+    private static get _unitType();
+    /**
+     * get yScale group list from the enum ScaleGroup
+     */
+    private static get _YScaleGroupList();
+    /**
+     * Generate one item by the provided attributes and values
+     * @param args the dynamic parameter of [attribute, value]
+     */
+    private static _generateLoadHistoryInfoItem;
+    /**
+     * generate the loadHistoryInfo object with default values.
+     */
+    private static _generateLoadHistoryInfo;
+    /**
+     * get rgbcolor object via red, green, blue and alpha.
+     */
+    private static _getRgbColor;
+    private static _getYScaleForItem;
+    private static _getMaxValueOfGroup;
+    private _getLoadHistoryInfo;
+    private _getProcessingUnit;
+    private _setOverview;
+    /**
+     * convert unit values (eg: byte to MB or GB) and generate the control data (sum, max, avg) for one row
+     */
+    private _convertUnitAndGenerateRowControlData;
+    /**
+     * Loop from all history items, put those history items which
+     * have the same yScaleGroup together, using yScaleGroup as key.
+     * eg: {__SCALE_GROUP_CPU:[item1, item2...], __SCALE_GROUP_UNKNOWN:[item3, item4...]}
+     */
+    private _getYScaleGroupWithHistoryItems;
+    private _setYScaleOfGroup;
+    private _getItemByKey;
+    /**
+     * reset the load history info object, to prevent memory leak
+     */
+    clearLoadHistoryInfos(): void;
+    /**
+     * get all the data for the selection table
+     */
+    getSelectionTableRows(headerKeys: string[], port: string, defaultDisplayItems: string[]): any[];
+    /**
+     * get all hidden columns. Those hidden columns = input hidden columns + default hidden columns
+     * @param hideMeasureColumns the array contains the columns list that need to be hidden.
+     */
+    getHiddenColumns(hideMeasureColumns: string[]): string[];
+    /**
+     * get header information and format it to {headKey: key, headText: text}
+     */
+    getHeader(keys: string[], port: string): ChartContentHeader[];
+    /**
+     * Get the selected items, which need to be displayed on the chart.
+     * @param headerKeys array that contains the keys of header
+     * @param port the relative port
+     * @param defaultDisplayItems the items list that will be displayed by default.
+     */
+    getDisplayItems(headerKeys: string[], port: string, defaultDisplayItems: string[]): string[];
+    /**
+     * Get the Y Scale by the keys and port
+     */
+    getYScale(keys: string[], port: string): number[];
+    /**
+     * Generate Y Scale for the port
+     */
+    generateYScale(port: string): void;
+    /**
+     * convert unit values (eg: byte to MB or GB) and generate the control data (sum, max, avg)
+     * @param data the nameserver history data
+     * @param header header list
+     * @param port selected port
+     */
+    convertUnitAndGenerateControlData(data: ChartContentDataItem[][], header: string[], port: string): Promise<any>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<UIService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<UIService>;
+}
+
+declare enum SearchType {
+    searchWithSubHeader = "searchWithSubHeader",
+    searchAll = "searchAll",
+    searchInChildren = "searchInChildren"
+}
+declare class NameServerHistoryComponent implements OnChanges, AfterViewInit {
+    private fileService;
+    private chartService;
+    private uiService;
+    nameserverHistoryAllRef: ElementRef;
+    nameserverHistoryContentRef: ElementRef;
+    /**
+     * Input (optional) bind to [defaultSelectedItems]
+     */
+    defaultSelectedItems: string[];
+    /**
+     * Input (optional) bind to [hideMeasureColumns]
+     */
+    hideMeasureColumns: string[];
+    /**
+     * Input (optional) bind to [maxRowsLimitation]
+     */
+    maxRowsLimitation: number;
+    /**
+     * Input (optional) bind to [showInstruction]
+     */
+    showInstruction: boolean;
+    /**
+     * Input (optional) bind to [timezone]
+     */
+    timezone: string;
+    /**
+     * file buffer, use this for stream mode
+     */
+    fileBuffer: Blob;
+    /**
+     * file name for stream mode
+     */
+    streamModeFileName: string;
+    /**
+     * auto display the chart in stream mode
+     */
+    autoDisplay: boolean;
+    /**
+     * selected name server history file
+     */
+    file: File;
+    /**
+     * time info of the name server history file
+     */
+    time: ChartContentTime;
+    /**
+     * data of the name server history file
+     */
+    data: ChartContentData;
+    /**
+     * header of the name server history file
+     */
+    header: ChartContentHeader[];
+    /**
+     * host of the name server history file
+     */
+    host: string;
+    /**
+     * alert message content
+     */
+    alertMessage: string;
+    /**
+     * alert message type
+     */
+    alertType: Alert;
+    /**
+     * selected port
+     */
+    port: string;
+    /**
+     * all the ports from the nameserver history file
+     */
+    ports: Port[];
+    /**
+     * selected time range
+     */
+    dateTimeRange: Date[];
+    /**
+     * data source for the selection table (right part of the chart)
+     */
+    tableSource: any[];
+    /**
+     * the progress for reading file
+     */
+    readProgress: number;
+    /**
+     * selected/dropped file name (abbreviation), full file name will be shown via the tooltips
+     */
+    abbreviatedFileName: string;
+    /**
+     * for the instruction step 4
+     */
+    stepShowChart: boolean;
+    /**
+     * control flag for showing the name server history chart
+     */
+    showChartFlag: boolean;
+    /**
+     * control flag for showing the file reading progress
+     */
+    showReadFileProgress: boolean;
+    /**
+     * control flag for "Load" ports button
+     */
+    enableLoadPortsButton: boolean;
+    /**
+     * control flag for enabling "Show" chart button
+     */
+    enableShowChartButton: boolean;
+    /**
+     * control flag for "Reset" chart button
+     */
+    enableResetChartButton: boolean;
+    searchType: SearchType;
+    /**
+     * selection information for the selection table
+     */
+    private _selection;
+    /**
+     * current displaying port
+     */
+    private _currentChartPort;
+    constructor(fileService: FileService, chartService: ChartService, uiService: UIService);
+    ngOnChanges(changes: SimpleChanges): Promise<void>;
+    ngAfterViewInit(): void;
+    /**
+     * Reset Chart to initial status
+     * If legend is already selected/unselected from the list, it wouldn't be restored.
+     */
+    resetChart(): void;
+    /**
+     * read the file and display the chart
+     */
+    showChart(): void;
+    /**
+     * load all ports from file
+     */
+    loadPorts(): void;
+    /**
+     * select name server history file, currently only supports 1 file.
+     */
+    fileSelected(event: any): Promise<void>;
+    /**
+     * drop name server history file, currently only supports 1 file.
+     */
+    fileDropped(event: any): void;
+    /**
+     * Select one item from selection table, relative dataset will be shown or hidden
+     */
+    selectItem(event: any): void;
+    /**
+     * recalculating chart height when resizing
+     */
+    onResize(): void;
+    /**
+     * Switch port and reinitialize chart, triggered by changing the port
+     * @param port the selected port
+     */
+    switchPortForChart(port: string): void;
+    /**
+     * get the columns which need to be hidden from the selection table
+     */
+    get hiddenColumns(): string[];
+    /**
+     * get default timezone
+     */
+    get defaultTimezone(): string;
+    /**
+     * get the key column (KPI)
+     */
+    get kpiColumn(): Item;
+    /**
+     * get the key column (KPI)
+     */
+    get descColumn(): Item;
+    /**
+     * get the selected time range, set second and millisecond part to 0
+     */
+    private get _selectedTimeRange();
+    /**
+     * get the time range string, eg: 2018-10-25 10:25 ~ 2018-10-26 10:26
+     */
+    private get _selectedTimeRangeString();
+    /**
+     * get array of header key
+     */
+    private get _headerKey();
+    /**
+     * get array of header text
+     */
+    private get _headerText();
+    /**
+     * read ports from the selected nameserver history file
+     * @param file nameserver history file
+     */
+    private _readPortsFromFile;
+    /**
+     * build chart from the selected nameserver history file
+     * @param file the nameserver history file
+     * @param startTime start time
+     * @param endTime end time
+     * @param selectedPort selected port for nameserver history file (MDC system)
+     */
+    private _buildChartFromDataFile;
+    /**
+     * reinitialize the port selector with the ports
+     */
+    private _initPortSelector;
+    /**
+     * build and display the chart on page
+     * @param port the selected port
+     * @param ports all available ports
+     * @param switchFlag indicates whether this function is triggered from switching ports (no init port selector needed)
+     */
+    private _buildChart;
+    /**
+     * get the string that will be displayed on the title area of the chart
+     * eg: host1 - 30040 (2018-09-05 15:32:32 ~ 2018-09-07 15:32:15)
+     * @param port selected port
+     */
+    private _getHostTitle;
+    /**
+     * after zoom, enable the reset button.
+     */
+    private _onZoom;
+    /**
+     * initialize chart, including: destroy current chart, initialize config, initialize all relative data
+     */
+    private _initChartEnv;
+    /**
+     * Load settings for the selection table (the right part of the chart)
+     * @param port the selected port
+     */
+    private _loadSettingsForSelectionsTable;
+    /**
+     * Show messages
+     * @param type type of the message
+     * @param message message text
+     */
+    private _showMessage;
+    /**
+     * toggle items with the provided status (show or hide the relative element on the page)
+     * @param items items with the relative id and status.
+     */
+    private _toggleItems;
+    static ɵfac: i0.ɵɵFactoryDeclaration<NameServerHistoryComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<NameServerHistoryComponent, "ngx-hana-nameserver-history-viewer", never, { "defaultSelectedItems": { "alias": "defaultSelectedItems"; "required": false; }; "hideMeasureColumns": { "alias": "hideMeasureColumns"; "required": false; }; "maxRowsLimitation": { "alias": "maxRowsLimitation"; "required": false; }; "showInstruction": { "alias": "showInstruction"; "required": false; }; "timezone": { "alias": "timezone"; "required": false; }; "fileBuffer": { "alias": "fileBuffer"; "required": false; }; "streamModeFileName": { "alias": "streamModeFileName"; "required": false; }; "autoDisplay": { "alias": "autoDisplay"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+export { NameServerHistoryComponent };

package/esm2020/ngx-hana-nameserver-history-viewer.mjs

@@ -1,5 +0,0 @@
-/**
- * Generated bundle index. Do not edit.
- */
-export * from './public-api';
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmd4LWhhbmEtbmFtZXNlcnZlci1oaXN0b3J5LXZpZXdlci5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uL25neC1oYW5hLW5hbWVzZXJ2ZXItaGlzdG9yeS12aWV3ZXIudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7O0dBRUc7QUFFSCxjQUFjLGNBQWMsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogR2VuZXJhdGVkIGJ1bmRsZSBpbmRleC4gRG8gbm90IGVkaXQuXG4gKi9cblxuZXhwb3J0ICogZnJvbSAnLi9wdWJsaWMtYXBpJztcbiJdfQ==

package/esm2020/public-api.mjs

@@ -1,2 +0,0 @@
-export * from './src/nameserver-history-viewer/index';
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljLWFwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uL3B1YmxpYy1hcGkudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsY0FBYyx1Q0FBdUMsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCAqIGZyb20gJy4vc3JjL25hbWVzZXJ2ZXItaGlzdG9yeS12aWV3ZXIvaW5kZXgnO1xyXG4iXX0=