Integration temporary hawkular-charts

hawkular · Jul 11, 2017 · 5e3bf1c · 5e3bf1c
1 parent cddc1f5
commit 5e3bf1c
Show file tree

Hide file tree

Showing 7 changed files with 30 additions and 9 deletions.
diff --git a/ui/src/main/ngapp/.angular-cli.json b/ui/src/main/ngapp/.angular-cli.json
@@ -23,7 +23,11 @@
         "../node_modules/patternfly/dist/css/patternfly-additions.min.css",
         "styles.css"
       ],
-      "scripts": [],
+      "scripts": [
+        "../node_modules/d3/d3.min.js",
+        "../node_modules/d3-tip/index.js",
+        "../node_modules/moment/moment.js"
+      ],
       "environmentSource": "environments/environment.ts",
       "environments": {
         "dev": "environments/environment.ts",

diff --git a/ui/src/main/ngapp/package.json b/ui/src/main/ngapp/package.json
@@ -1,7 +1,7 @@
 {
   "name": "hawkular-ui",
   "version": "0.0.0",
-  "license": "MIT",
+  "license": "Apache-2.0",
   "scripts": {
     "ng": "ng",
     "start": "ng serve",
@@ -23,6 +23,10 @@
     "@angular/router": "^4.0.0",
     "angular-patternfly": "^4.0.0",
     "core-js": "^2.4.1",
+    "d3": "^3.5.0",
+    "d3-tip": "0.6.7",
+    "moment": "^2.9.0",
+    "hawkular-charts": "file:///work/angular-library-starter/hawkular-charts-2.0.0-alpha.tgz",
     "patternfly": "^3.25.1",
     "rxjs": "^5.1.0",
     "zone.js": "^0.8.4"

diff --git a/ui/src/main/ngapp/src/app/app.component.ts b/ui/src/main/ngapp/src/app/app.component.ts
@@ -1,4 +1,4 @@
-import { Component } from '@angular/core';
+import { Component, Inject } from '@angular/core';
 
 @Component({
   selector: 'app-root',

diff --git a/ui/src/main/ngapp/src/app/app.module.ts b/ui/src/main/ngapp/src/app/app.module.ts
@@ -1,8 +1,10 @@
 import { BrowserModule } from '@angular/platform-browser';
 import { NgModule } from '@angular/core';
-import { FormsModule }   from '@angular/forms';
-import { RouterModule }   from '@angular/router';
-import { HttpModule }    from '@angular/http';
+import { FormsModule } from '@angular/forms';
+import { RouterModule } from '@angular/router';
+import { HttpModule } from '@angular/http';
+
+import { HawkularChartsModule } from 'hawkular-charts';
 
 import { AppComponent } from './app.component';
 import { MetricsPageComponent } from './metrics-page.component';
@@ -20,6 +22,7 @@ import { ChartComponent } from './chart.component';
     BrowserModule,
     FormsModule,
     HttpModule,
+    HawkularChartsModule,
     RouterModule.forRoot([{
         path: '',
         redirectTo: '/metrics',

diff --git a/ui/src/main/ngapp/src/app/chart.component.css b/ui/src/main/ngapp/src/app/chart.component.css
@@ -12,3 +12,7 @@
     float: left;
     margin-bottom: 20px;
 }
+
+.chart {
+    min-height: 400px;
+}
diff --git a/ui/src/main/ngapp/src/app/chart.component.html b/ui/src/main/ngapp/src/app/chart.component.html
@@ -15,5 +15,11 @@ <h3>{{notice}}</h3>
       <option value='30d'>Last month</option>
     </select>
   </div>
-  <div id="line-chart" class="line-chart-pf"></div>
+  <hk-metric-chart *ngIf="metric &amp;&amp; tenant &amp;&amp; type"
+    metricUrl="http://localhost:8080/hawkular/metrics"
+    [metricId]="metric"
+    [metricTenantId]="tenant"
+    [metricType]="type"
+    chartType="line">
+  </hk-metric-chart>
 </div>
diff --git a/ui/src/main/ngapp/src/app/chart.component.ts b/ui/src/main/ngapp/src/app/chart.component.ts
@@ -1,5 +1,6 @@
-import { Component, Input, OnInit } from '@angular/core';
+import { Component, OnInit } from '@angular/core';
 import { ActivatedRoute, Params } from '@angular/router';
+import { MetricChartComponent } from 'hawkular-charts';
 
 @Component({
   selector: 'chart',
@@ -14,7 +15,6 @@ export class ChartComponent implements OnInit {
   type: string;
   metric: string;
   loading = false;
-
   constructor(private route: ActivatedRoute) {
   }