diff --git a/package.json b/package.json
index dfab23e..314f4f8 100644
--- a/package.json
+++ b/package.json
@@ -17,44 +17,40 @@
"@angular/common": "^5.2.1",
"@angular/compiler": "^5.2.1",
"@angular/core": "^5.2.1",
- "@angular/flex-layout": "^2.0.0-beta.12",
+ "@angular/flex-layout": "^5.0.0-beta.13",
"@angular/forms": "^5.2.1",
"@angular/material": "^5.1.0",
"@angular/platform-browser": "^5.2.1",
"@angular/platform-browser-dynamic": "^5.2.1",
"@angular/router": "^5.2.1",
- "@covalent/core": "^1.0.0-rc.4",
- "@covalent/dynamic-forms": "^1.0.0-rc.4",
- "@covalent/highlight": "^1.0.0-rc.4",
- "@covalent/http": "^1.0.0-rc.4",
- "@covalent/markdown": "^1.0.0-rc.4",
"@ngrx/core": "^1.2.0",
"@ngrx/effects": "^5.2.0",
"@ngrx/entity": "^5.2.0",
"@ngrx/router-store": "^5.2.0",
"@ngrx/store": "^5.2.0",
"@ngrx/store-devtools": "^5.2.0",
- "@swimlane/ngx-charts": "^7.1.1",
"angular-tree-component": "^7.0.1",
+ "angularx-qrcode": "^1.0.1",
+ "angular-l10n": "^4.1.5",
"core-js": "^2.5.3",
- "d3": "^4.13.0",
+ "d3": "^3.5.17",
"hammerjs": "^2.0.8",
"ng2-odometer": "^1.1.3",
"ngx-cookie-service": "^1.0.10",
- "ng2-nvd3": "^2.0.0",
"ngx-perfect-scrollbar": "^5.3.1",
+ "nvd3": "^1.8.6",
"rxjs": "^5.5.6",
- "zone.js": "^0.8.20",
- "angularx-qrcode": "^1.0.1",
- "angular-l10n": "^4.1.5"
+ "zone.js": "^0.8.20"
},
"devDependencies": {
"@angular/cli": "1.6.5",
"@angular/compiler-cli": "^5.2.1",
"@angular/language-service": "^5.2.1",
+ "@types/d3": "^5.0.0",
"@types/jasmine": "~2.8.5",
"@types/jasminewd2": "~2.0.3",
"@types/node": "~6.0.60",
+ "@types/nvd3": "^1.8.38",
"codelyzer": "^4.1.0",
"jasmine-core": "~2.8.0",
"jasmine-spec-reporter": "~4.2.1",
diff --git a/src/app/app-store.module.ts b/src/app/app-store.module.ts
index 3eb054e..bbb2785 100644
--- a/src/app/app-store.module.ts
+++ b/src/app/app-store.module.ts
@@ -9,7 +9,7 @@ import {
import { EffectsModule } from '@ngrx/effects';
import { combineReducers, ActionReducer, ActionReducerMap, MetaReducer } from '@ngrx/store';
-import { SimpleRouterStateSerializer } from 'packages/commons/util/router/state/serializer/simple-router-state-serializer';
+import { SimpleRouterStateSerializer } from './commons/util/ngrx/router-store/serializer/simple-router-state-serializer';
import { environment } from '../environments/environment';
import { EFFECTS } from './commons/store';
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index e9092dc..26e2411 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -24,7 +24,6 @@ import { AppStoreModule } from './app-store.module';
import { AppL10NModule } from './app-l10n.module';
import { MaterialModule } from './commons/ui/material/material.module';
-import { CovalentModule } from './commons/ui/covalent/covalent.module';
import { AppComponent } from './app.component';
@@ -42,7 +41,6 @@ import { AuthGuard } from './commons/guard/auth.guard';
AppStoreModule,
AppL10NModule,
MaterialModule,
- CovalentModule,
HttpClientModule,
MemberModule,
],
diff --git a/src/app/commons/component/app-summary-card/app-summary-card.component.html b/src/app/commons/component/app-summary-card/app-summary-card.component.html
index 727a5e3..0b028e3 100644
--- a/src/app/commons/component/app-summary-card/app-summary-card.component.html
+++ b/src/app/commons/component/app-summary-card/app-summary-card.component.html
@@ -4,6 +4,6 @@
Applications
-
-
+
\ No newline at end of file
diff --git a/src/app/commons/component/host-summary-card/host-summary-card.component.html b/src/app/commons/component/host-summary-card/host-summary-card.component.html
index 42f3057..2504303 100644
--- a/src/app/commons/component/host-summary-card/host-summary-card.component.html
+++ b/src/app/commons/component/host-summary-card/host-summary-card.component.html
@@ -4,6 +4,6 @@
Hosts
-
-
+
\ No newline at end of file
diff --git a/src/app/commons/ui/covalent/covalent.module.ts b/src/app/commons/ui/covalent/covalent.module.ts
deleted file mode 100644
index 5476306..0000000
--- a/src/app/commons/ui/covalent/covalent.module.ts
+++ /dev/null
@@ -1,41 +0,0 @@
-import { NgModule } from '@angular/core';
-import {
- CovalentCommonModule, CovalentLayoutModule, CovalentMediaModule, CovalentExpansionPanelModule,
- CovalentStepsModule, CovalentLoadingModule, CovalentDialogsModule, CovalentSearchModule, CovalentPagingModule,
- CovalentNotificationsModule, CovalentMenuModule, CovalentDataTableModule, CovalentMessageModule
- } from '@covalent/core';
-
-@NgModule({
- imports: [
- CovalentCommonModule,
- CovalentLayoutModule,
- CovalentMediaModule,
- CovalentExpansionPanelModule,
- CovalentStepsModule,
- CovalentDialogsModule,
- CovalentLoadingModule,
- CovalentSearchModule,
- CovalentPagingModule,
- CovalentNotificationsModule,
- CovalentMenuModule,
- CovalentDataTableModule,
- CovalentMessageModule,
- ],
- exports : [
- CovalentCommonModule,
- CovalentLayoutModule,
- CovalentMediaModule,
- CovalentExpansionPanelModule,
- CovalentStepsModule,
- CovalentDialogsModule,
- CovalentLoadingModule,
- CovalentSearchModule,
- CovalentPagingModule,
- CovalentNotificationsModule,
- CovalentMenuModule,
- CovalentDataTableModule,
- CovalentMessageModule,
- ]
-})
-
-export class CovalentModule { }
diff --git a/src/packages/commons/util/router/state/serializer/simple-router-state-serializer.ts b/src/app/commons/util/ngrx/router-store/serializer/simple-router-state-serializer.ts
similarity index 100%
rename from src/packages/commons/util/router/state/serializer/simple-router-state-serializer.ts
rename to src/app/commons/util/ngrx/router-store/serializer/simple-router-state-serializer.ts
diff --git a/src/app/pages/overview/overview-page.module.ts b/src/app/pages/overview/overview-page.module.ts
index 949b038..ad803ec 100644
--- a/src/app/pages/overview/overview-page.module.ts
+++ b/src/app/pages/overview/overview-page.module.ts
@@ -9,7 +9,6 @@ import { AddDashboardDialogComponent } from './add-dashboard-dialog/add-dashboar
import { PerfectScrollbarModule } from 'ngx-perfect-scrollbar';
import { SensorSummaryComponent } from '../../commons/component/sensor-summary/sensor-summary.component';
import { SensorItemFilterComponent } from '../../commons/component/sensor-item-filter/sensor-item-filter.component';
-import { NgxChartsModule } from '@swimlane/ngx-charts';
import { HostSummaryCardComponent } from '../../commons/component/host-summary-card/host-summary-card.component';
import { AppSummaryCardComponent } from '../../commons/component/app-summary-card/app-summary-card.component';
import { FormsModule } from '@angular/forms';
@@ -22,7 +21,6 @@ import { SensorItemModule } from 'packages/sensor-item/sensor-item.module';
DashboardCardModule,
MaterialModule,
PerfectScrollbarModule,
- NgxChartsModule,
FormsModule,
SensorItemModule,
],
diff --git a/src/app/pages/pages.module.ts b/src/app/pages/pages.module.ts
index d2afbba..abea3b6 100644
--- a/src/app/pages/pages.module.ts
+++ b/src/app/pages/pages.module.ts
@@ -3,7 +3,6 @@ import { CommonModule } from '@angular/common';
import { PagesComponent } from './pages.component';
import { PagesRoutingModule } from './pages-routing.module';
import { SidebarComponent } from 'app/commons/component/sidebar/sidebar.component';
-import { CovalentModule } from 'app/commons/ui/covalent/covalent.module';
import { MaterialModule } from 'app/commons/ui/material/material.module';
import { HeaderComponent } from 'app/commons/component/header/header.component';
import { FooterComponent } from 'app/commons/component/footer/footer.component';
@@ -28,7 +27,6 @@ const DEFAULT_PERFECT_SCROLLBAR_CONFIG: PerfectScrollbarConfigInterface = {
imports: [
CommonModule,
PagesRoutingModule,
- CovalentModule,
MaterialModule,
PerfectScrollbarModule,
NotificationModule,
diff --git a/src/packages/commons/chart/area/area.module.ts b/src/packages/commons/chart/area/area.module.ts
new file mode 100644
index 0000000..051d39a
--- /dev/null
+++ b/src/packages/commons/chart/area/area.module.ts
@@ -0,0 +1,20 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+
+import { NvD3Module } from 'packages/commons/chart/core/nvd3/nvd3.module';
+
+import { AreaComponent } from './component/area.component';
+
+@NgModule({
+ imports: [
+ CommonModule,
+ NvD3Module,
+ ],
+ exports: [
+ AreaComponent,
+ ],
+ declarations: [
+ AreaComponent,
+ ],
+})
+export class AreaModule { }
diff --git a/src/packages/commons/chart/area/component/area.component.html b/src/packages/commons/chart/area/component/area.component.html
new file mode 100644
index 0000000..699c854
--- /dev/null
+++ b/src/packages/commons/chart/area/component/area.component.html
@@ -0,0 +1,6 @@
+
diff --git a/src/packages/commons/chart/area/component/area.component.scss b/src/packages/commons/chart/area/component/area.component.scss
new file mode 100644
index 0000000..e69de29
diff --git a/src/packages/commons/chart/area/component/area.component.spec.ts b/src/packages/commons/chart/area/component/area.component.spec.ts
new file mode 100644
index 0000000..3ecaeae
--- /dev/null
+++ b/src/packages/commons/chart/area/component/area.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { AreaComponent } from './area.component';
+
+describe('AreaComponent', () => {
+ let component: AreaComponent;
+ let fixture: ComponentFixture;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ AreaComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(AreaComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/packages/commons/chart/area/component/area.component.ts b/src/packages/commons/chart/area/component/area.component.ts
new file mode 100644
index 0000000..70338e3
--- /dev/null
+++ b/src/packages/commons/chart/area/component/area.component.ts
@@ -0,0 +1,16 @@
+import { Component, OnInit, ViewEncapsulation } from '@angular/core';
+
+@Component({
+ selector: 'of-chart-area',
+ templateUrl: './area.component.html',
+ styleUrls: ['./area.component.scss'],
+ encapsulation: ViewEncapsulation.None,
+})
+export class AreaComponent implements OnInit {
+
+ constructor() { }
+
+ ngOnInit() {
+ }
+
+}
diff --git a/src/packages/commons/chart/core/nvd3/component/nvd3.component.spec.ts b/src/packages/commons/chart/core/nvd3/component/nvd3.component.spec.ts
new file mode 100644
index 0000000..1fcdd2a
--- /dev/null
+++ b/src/packages/commons/chart/core/nvd3/component/nvd3.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { NvD3Component } from './nvd3.component';
+
+describe('NvD3Component', () => {
+ let component: NvD3Component;
+ let fixture: ComponentFixture;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ NvD3Component ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(NvD3Component);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/packages/commons/chart/core/nvd3/component/nvd3.component.ts b/src/packages/commons/chart/core/nvd3/component/nvd3.component.ts
new file mode 100644
index 0000000..5796897
--- /dev/null
+++ b/src/packages/commons/chart/core/nvd3/component/nvd3.component.ts
@@ -0,0 +1,289 @@
+import { Component, OnChanges, OnDestroy, ElementRef, Input, SimpleChanges } from '@angular/core';
+
+import * as nvd3 from 'nvd3';
+import * as d3 from 'd3';
+
+@Component({
+ selector: 'of-nvd3',
+ template: ``,
+})
+export class NvD3Component implements OnChanges, OnDestroy {
+ @Input() options: any;
+ @Input() data: any;
+ el: HTMLElement;
+ chart: any;
+ chartType: string;
+ svg: any;
+
+ constructor(
+ elementRef: ElementRef
+ ) {
+ this.el = elementRef.nativeElement;
+ }
+
+ ngOnChanges(changes: SimpleChanges): void {
+ if (this.options) {
+ if (!this.chart || this.chartType !== this.options.chart.type) {
+ this.initChart(this.options);
+ } else {
+ this.updateWithOptions(this.options);
+ }
+ }
+ }
+
+ ngOnDestroy(): void {
+ this.clearElement();
+ }
+
+ initChart(options) {
+ // Clearing
+ this.clearElement();
+
+ if (!options) {
+ return;
+ }
+
+ // Initialize chart with specific type
+ this.chart = nvd3.models[options.chart.type]();
+ this.chartType = this.options.chart.type;
+
+ // Generate random chart ID
+ this.chart.id = Math.random().toString(36).substr(2, 15);
+
+ this.updateWithOptions(options);
+
+ nvd3.addGraph(() => {
+ if (!this.chart) {
+ return;
+ }
+
+ // Remove resize handler. Due to async execution should be placed here, not in the clearElement
+ if (this.chart.resizeHandler) {
+ this.chart.resizeHandler.clear();
+ }
+
+ // Update the chart when window resizes
+ this.chart.resizeHandler = nvd3.utils.windowResize(() => {
+ return this.chart && this.chart.update && this.chart.update();
+ });
+
+ return this.chart;
+ }, options.chart['callback']);
+ }
+
+ /**
+ * Update chart with new options.
+ * @param options
+ */
+ updateWithOptions(options) {
+ // Exit if options are not yet bound
+ if (!options) {
+ return;
+ }
+
+ for (const key in this.chart) {
+ if (!this.chart.hasOwnProperty(key)) {
+ continue;
+ }
+
+ const value = this.chart[key];
+
+ if (key[0] === '_') {
+ } else if ([
+ 'clearHighlights',
+ 'highlightPoint',
+ 'id',
+ 'options',
+ 'resizeHandler',
+ 'state',
+ 'open',
+ 'close',
+ 'tooltipContent'
+ ].indexOf(key) >= 0) {
+ } else if (key === 'dispatch') {
+ this.configureEvents(this.chart[key], options.chart[key]);
+ } else if ([
+ 'bars',
+ 'bars1',
+ 'bars2',
+ 'boxplot',
+ 'bullet',
+ 'controls',
+ 'discretebar',
+ 'distX',
+ 'distY',
+ 'interactiveLayer',
+ 'legend',
+ 'lines',
+ 'lines1',
+ 'lines2',
+ 'multibar',
+ 'pie',
+ 'scatter',
+ 'scatters1',
+ 'scatters2',
+ 'sparkline',
+ 'stack1',
+ 'stack2',
+ 'sunburst',
+ 'tooltip',
+ 'x2Axis',
+ 'xAxis',
+ 'y1Axis',
+ 'y2Axis',
+ 'y3Axis',
+ 'y4Axis',
+ 'yAxis',
+ 'yAxis1',
+ 'yAxis2',
+ 'sankeyChart'
+ ].indexOf(key) >= 0 ||
+ // stacked is a component for stackedAreaChart, but a boolean for multiBarChart and multiBarHorizontalChart
+ (key === 'stacked' && options.chart.type === 'stackedAreaChart')) {
+ this.configure(this.chart[key], options.chart[key], options.chart.type);
+ } else if ((key === 'xTickFormat' || key === 'yTickFormat') && options.chart.type === 'lineWithFocusChart') {
+ } else if ((key === 'tooltips') && options.chart.type === 'boxPlotChart') {
+ } else if ((key === 'tooltipXContent' || key === 'tooltipYContent') && options.chart.type === 'scatterChart') {
+ } else if (options.chart[key] === undefined || options.chart[key] === null) {
+ } else {
+ this.chart[key](options.chart[key]);
+ }
+ }
+
+ this.updateWithData(this.data);
+ }
+
+ /**
+ * Update chart with new data.
+ * @param data
+ */
+ updateWithData(data) {
+ if (data) {
+
+ // Select the add