aboutsummaryrefslogtreecommitdiffstats
path: root/webapp
diff options
context:
space:
mode:
authorSebastien Douheret <sebastien.douheret@iot.bzh>2017-11-14 10:57:48 +0100
committerSebastien Douheret <sebastien.douheret@iot.bzh>2017-11-14 10:57:48 +0100
commitb0d130807fb9bf36f5ac1abe21cbd558eb86d5cc (patch)
treebcd6aefa2117fba70745872214d2d866b6e9ab20 /webapp
parentfb2f6b918beb0a994ad304bfd678ef0c5c562210 (diff)
Fixed webapp build and error message.
Diffstat (limited to 'webapp')
-rw-r--r--webapp/.angular-cli.json106
-rw-r--r--webapp/README.md12
-rw-r--r--webapp/package.json1
-rw-r--r--webapp/src/app/app-alert/app-alert.component.spec.ts (renamed from webapp/src/app/alert/alert.component.spec.ts)12
-rw-r--r--webapp/src/app/app-alert/app-alert.component.ts (renamed from webapp/src/app/alert/alert.component.ts)2
-rw-r--r--webapp/src/app/app-topnav/app-topnav.component.css (renamed from webapp/src/app/app.component.css)0
-rw-r--r--webapp/src/app/app-topnav/app-topnav.component.html24
-rw-r--r--webapp/src/app/app-topnav/app-topnav.component.ts13
-rw-r--r--webapp/src/app/app.component.html25
-rw-r--r--webapp/src/app/app.component.ts3
-rw-r--r--webapp/src/app/app.module.ts8
-rw-r--r--webapp/src/app/services/alert.service.spec.ts14
-rw-r--r--webapp/src/app/services/project.service.spec.ts17
-rw-r--r--webapp/src/app/services/xdsagent.service.ts5
-rw-r--r--webapp/src/styles.css3
15 files changed, 134 insertions, 111 deletions
diff --git a/webapp/.angular-cli.json b/webapp/.angular-cli.json
index 202ea80..42a5dfd 100644
--- a/webapp/.angular-cli.json
+++ b/webapp/.angular-cli.json
@@ -1,62 +1,54 @@
{
- "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
- "project": {
- "name": "xds-dashboard"
- },
- "apps": [
- {
- "root": "src",
- "outDir": "dist",
- "assets": [
- "assets"
- ],
- "index": "index.html",
- "main": "main.ts",
- "polyfills": "polyfills.ts",
- "test": "test.ts",
- "tsconfig": "tsconfig.app.json",
- "testTsconfig": "tsconfig.spec.json",
- "prefix": "xds",
- "styles": [
- "styles.css",
- "../node_modules/font-awesome/css/font-awesome.min.css",
- "../node_modules/font-awesome-animation/dist/font-awesome-animation.min.css",
- "../node_modules/bootstrap/dist/css/bootstrap.min.css"
- ],
- "scripts": [],
- "environmentSource": "environments/environment.ts",
- "environments": {
- "dev": "environments/environment.ts",
- "prod": "environments/environment.prod.ts"
- }
- }
- ],
- "e2e": {
- "protractor": {
- "config": "./protractor.conf.js"
- }
- },
- "lint": [
- {
- "project": "src/tsconfig.app.json",
- "exclude": "**/node_modules/**"
+ "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
+ "project": {
+ "name": "xds-dashboard"
},
- {
- "project": "src/tsconfig.spec.json",
- "exclude": "**/node_modules/**"
+ "apps": [{
+ "root": "src",
+ "outDir": "dist",
+ "assets": [
+ "assets"
+ ],
+ "index": "index.html",
+ "main": "main.ts",
+ "polyfills": "polyfills.ts",
+ "test": "test.ts",
+ "tsconfig": "tsconfig.app.json",
+ "testTsconfig": "tsconfig.spec.json",
+ "prefix": "xds",
+ "styles": ["styles.css"],
+ "scripts": [],
+ "environmentSource": "environments/environment.ts",
+ "environments": {
+ "dev": "environments/environment.ts",
+ "prod": "environments/environment.prod.ts"
+ }
+ }],
+ "e2e": {
+ "protractor": {
+ "config": "./protractor.conf.js"
+ }
},
- {
- "project": "e2e/tsconfig.e2e.json",
- "exclude": "**/node_modules/**"
- }
- ],
- "test": {
- "karma": {
- "config": "./karma.conf.js"
+ "lint": [{
+ "project": "src/tsconfig.app.json",
+ "exclude": "**/node_modules/**"
+ },
+ {
+ "project": "src/tsconfig.spec.json",
+ "exclude": "**/node_modules/**"
+ },
+ {
+ "project": "e2e/tsconfig.e2e.json",
+ "exclude": "**/node_modules/**"
+ }
+ ],
+ "test": {
+ "karma": {
+ "config": "./karma.conf.js"
+ }
+ },
+ "defaults": {
+ "styleExt": "css",
+ "component": {}
}
- },
- "defaults": {
- "styleExt": "css",
- "component": {}
- }
}
diff --git a/webapp/README.md b/webapp/README.md
index acee846..d885042 100644
--- a/webapp/README.md
+++ b/webapp/README.md
@@ -7,7 +7,7 @@ This is the web application dashboard for Cross Development System.
*nodejs* must be installed on your system and the below global node packages must be installed:
-> sudo npm install -g gulp-cli
+> sudo npm install --global @angular/cli
## 2. Installing dependencies
@@ -15,7 +15,7 @@ Install dependencies by running the following command:
> npm install
-`node_modules` and `typings` directories will be created during the install.
+`node_modules` directory will be created during the install.
## 3. Building the project
@@ -33,13 +33,7 @@ Start the application by running the following command:
The application will be displayed in the browser.
-
## TODO
-- Upgrade to angular 2.4.9 or 2.4.10 AND rxjs 5.2.0
-- Complete README + package.json
-- Add prod mode and use update gulpfile tslint: "./tslint/prod.json"
-- Generate a bundle minified file, using systemjs-builder or find a better way
- http://stackoverflow.com/questions/35280582/angular2-too-many-file-requests-on-load
- Add SASS support
- http://foundation.zurb.com/sites/docs/sass.html \ No newline at end of file
+ http://foundation.zurb.com/sites/docs/sass.html
diff --git a/webapp/package.json b/webapp/package.json
index f4f843f..4097e0d 100644
--- a/webapp/package.json
+++ b/webapp/package.json
@@ -19,6 +19,7 @@
"url": "https://github.com/iotbzh/xds-agent/issues"
},
"scripts": {
+ "clean": "rm -rf dist/",
"build": "ng build --prod --verbose",
"start": "ng serve --prod --port=8000",
"watch": "ng build --preserve-symlinks --watch",
diff --git a/webapp/src/app/alert/alert.component.spec.ts b/webapp/src/app/app-alert/app-alert.component.spec.ts
index 3921dd6..7f343dc 100644
--- a/webapp/src/app/alert/alert.component.spec.ts
+++ b/webapp/src/app/app-alert/app-alert.component.spec.ts
@@ -1,20 +1,20 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
-import { AlertComponent } from './alert.component';
+import { AppAlertComponent } from './app-alert.component';
-describe('AlertComponent', () => {
- let component: AlertComponent;
- let fixture: ComponentFixture<AlertComponent>;
+describe('AppAlertComponent', () => {
+ let component: AppAlertComponent;
+ let fixture: ComponentFixture<AppAlertComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
- declarations: [ AlertComponent ]
+ declarations: [ AppAlertComponent ]
})
.compileComponents();
}));
beforeEach(() => {
- fixture = TestBed.createComponent(AlertComponent);
+ fixture = TestBed.createComponent(AppAlertComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
diff --git a/webapp/src/app/alert/alert.component.ts b/webapp/src/app/app-alert/app-alert.component.ts
index 06c9bf5..e6fbd47 100644
--- a/webapp/src/app/alert/alert.component.ts
+++ b/webapp/src/app/app-alert/app-alert.component.ts
@@ -16,7 +16,7 @@ import { AlertService, IAlert } from '../services/alert.service';
`,
})
-export class AlertComponent {
+export class AppAlertComponent {
alerts$: Observable<IAlert[]>;
diff --git a/webapp/src/app/app.component.css b/webapp/src/app/app-topnav/app-topnav.component.css
index a47ad13..a47ad13 100644
--- a/webapp/src/app/app.component.css
+++ b/webapp/src/app/app-topnav/app-topnav.component.css
diff --git a/webapp/src/app/app-topnav/app-topnav.component.html b/webapp/src/app/app-topnav/app-topnav.component.html
new file mode 100644
index 0000000..be2dfa2
--- /dev/null
+++ b/webapp/src/app/app-topnav/app-topnav.component.html
@@ -0,0 +1,24 @@
+<nav class="navbar navbar-fixed-top">
+ <!-- navbar-inverse"> -->
+ <div class="container-fluid">
+ <div class="navbar-header">
+ <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#myNavbar"
+ [attr.aria-expanded]="!isCollapsed" (click)="isCollapsed = !isCollapsed;" [ngClass]="{'collapsed': isCollapsed}">
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ </button>
+
+ <img class="navbar-brand" id="logo-iot" src="assets/images/iot-bzh-logo-small.png">
+ <a class="navbar-brand" href="#">X(cross) Development System Dashboard</a>
+ </div>
+
+ <div class="collapse navbar-collapse" [ngClass]="{'in': !isCollapsed}" id="myNavbar">
+ <ul class="nav navbar-nav navbar-right">
+ <li><a routerLink="/config"><i class="fa fa-2x fa-cog" title="Open configuration page" (click)="isCollapsed=true;"></i></a></li>
+ <li><a routerLink="/devel"><i class="fa fa-2x fa-play-circle" title="Open build page" (click)="isCollapsed=true;"></i></a></li>
+ <li><a routerLink="/home"><i class="fa fa-2x fa-home" title="Back to home page" (click)="isCollapsed=true;"></i></a></li>
+ </ul>
+ </div>
+ </div>
+</nav>
diff --git a/webapp/src/app/app-topnav/app-topnav.component.ts b/webapp/src/app/app-topnav/app-topnav.component.ts
new file mode 100644
index 0000000..9ba4021
--- /dev/null
+++ b/webapp/src/app/app-topnav/app-topnav.component.ts
@@ -0,0 +1,13 @@
+import { Component, ViewEncapsulation } from '@angular/core';
+
+@Component({
+ selector: 'app-topnav',
+ templateUrl: './app-topnav.component.html',
+ styleUrls: ['./app-topnav.component.css'],
+ encapsulation: ViewEncapsulation.None
+})
+export class AppTopnavComponent {
+ public isCollapsed = false;
+
+ constructor() { }
+}
diff --git a/webapp/src/app/app.component.html b/webapp/src/app/app.component.html
index a889b12..6fcb46f 100644
--- a/webapp/src/app/app.component.html
+++ b/webapp/src/app/app.component.html
@@ -1,27 +1,4 @@
-<nav class="navbar navbar-fixed-top">
- <!-- navbar-inverse"> -->
- <div class="container-fluid">
- <div class="navbar-header">
- <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#myNavbar"
- [attr.aria-expanded]="!isCollapsed" (click)="isCollapsed = !isCollapsed;" [ngClass]="{'collapsed': isCollapsed}">
- <span class="icon-bar"></span>
- <span class="icon-bar"></span>
- <span class="icon-bar"></span>
- </button>
-
- <img class="navbar-brand" id="logo-iot" src="assets/images/iot-bzh-logo-small.png">
- <a class="navbar-brand" href="#">X(cross) Development System Dashboard</a>
- </div>
-
- <div class="collapse navbar-collapse" [ngClass]="{'in': !isCollapsed}" id="myNavbar">
- <ul class="nav navbar-nav navbar-right">
- <li><a routerLink="/config"><i class="fa fa-2x fa-cog" title="Open configuration page" (click)="isCollapsed=true;"></i></a></li>
- <li><a routerLink="/devel"><i class="fa fa-2x fa-play-circle" title="Open build page" (click)="isCollapsed=true;"></i></a></li>
- <li><a routerLink="/home"><i class="fa fa-2x fa-home" title="Back to home page" (click)="isCollapsed=true;"></i></a></li>
- </ul>
- </div>
- </div>
-</nav>
+<app-topnav></app-topnav>
<app-alert id="alert"></app-alert>
diff --git a/webapp/src/app/app.component.ts b/webapp/src/app/app.component.ts
index 0d1ce12..b644ecd 100644
--- a/webapp/src/app/app.component.ts
+++ b/webapp/src/app/app.component.ts
@@ -4,8 +4,7 @@ import { ConfigService, IConfig } from './services/config.service';
@Component({
selector: 'app-root',
- templateUrl: 'app.component.html',
- styleUrls: ['app.component.css']
+ templateUrl: 'app.component.html'
})
export class AppComponent implements OnInit, OnDestroy {
diff --git a/webapp/src/app/app.module.ts b/webapp/src/app/app.module.ts
index 31a7c2c..bf63b5e 100644
--- a/webapp/src/app/app.module.ts
+++ b/webapp/src/app/app.module.ts
@@ -20,7 +20,8 @@ import { BsDropdownModule } from 'ngx-bootstrap/dropdown';
// Import the application components and services.
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
-import { AlertComponent } from './alert/alert.component';
+import { AppTopnavComponent } from './app-topnav/app-topnav.component';
+import { AppAlertComponent } from './app-alert/app-alert.component';
import { HomeComponent } from './home/home.component';
import { ConfigComponent } from './config/config.component';
import { DwnlAgentComponent } from './config/downloadXdsAgent.component';
@@ -74,8 +75,9 @@ export function createTranslateLoader(http: HttpClient) {
],
declarations: [
AppComponent,
+ AppTopnavComponent,
+ AppAlertComponent,
HomeComponent,
- AlertComponent,
ConfigComponent,
DwnlAgentComponent,
DevelComponent,
@@ -88,7 +90,7 @@ export function createTranslateLoader(http: HttpClient) {
SdksListAccordionComponent,
SdkSelectDropdownComponent,
SdkAddModalComponent,
- SafePipe
+ SafePipe,
],
providers: [
{
diff --git a/webapp/src/app/services/alert.service.spec.ts b/webapp/src/app/services/alert.service.spec.ts
index 66a8477..b3d364c 100644
--- a/webapp/src/app/services/alert.service.spec.ts
+++ b/webapp/src/app/services/alert.service.spec.ts
@@ -3,13 +3,13 @@ import { TestBed, inject } from '@angular/core/testing';
import { AlertService } from './alert.service';
describe('AlertService', () => {
- beforeEach(() => {
- TestBed.configureTestingModule({
- providers: [AlertService]
+ beforeEach(() => {
+ TestBed.configureTestingModule({
+ providers: [AlertService]
+ });
});
- });
- it('should be created', inject([AlertService], (service: AlertService) => {
- expect(service).toBeTruthy();
- }));
+ it('should be created', inject([AlertService], (service: AlertService) => {
+ expect(service).toBeTruthy();
+ }));
});
diff --git a/webapp/src/app/services/project.service.spec.ts b/webapp/src/app/services/project.service.spec.ts
new file mode 100644
index 0000000..b8edfc7
--- /dev/null
+++ b/webapp/src/app/services/project.service.spec.ts
@@ -0,0 +1,17 @@
+import { TestBed, inject } from '@angular/core/testing';
+
+import { ProjectService } from './project.service';
+
+describe('ProjectService', () => {
+ beforeEach(() => {
+ TestBed.configureTestingModule({
+ providers: [ProjectService]
+ });
+ });
+
+ it('should be created', inject([ProjectService], (service: ProjectService) => {
+ expect(service).toBeTruthy();
+ }));
+
+ // FIXME SEB - add more tests, see https://angular.io/guide/http#mocking-philosophy
+});
diff --git a/webapp/src/app/services/xdsagent.service.ts b/webapp/src/app/services/xdsagent.service.ts
index 23880ff..55653c7 100644
--- a/webapp/src/app/services/xdsagent.service.ts
+++ b/webapp/src/app/services/xdsagent.service.ts
@@ -323,7 +323,7 @@ export class XDSAgentService {
.subscribe(
res => { },
error => {
- this.alert.error('ERROR while registering to all events: ', error);
+ this.alert.error('ERROR while registering to all events: ' + error);
}
);
}
@@ -366,7 +366,7 @@ export class XDSAgentService {
private _decodeError(err: any) {
let e: string;
if (err instanceof HttpErrorResponse) {
- e = err.error || err.message || 'Unknown error';
+ e = (err.error && err.error.error) ? err.error.error : err.message || 'Unknown error';
} else if (typeof err === 'object') {
if (err.statusText) {
e = err.statusText;
@@ -378,6 +378,7 @@ export class XDSAgentService {
} else {
e = err.message ? err.message : err.toString();
}
+ console.log('xdsagent.service - ERROR: ', e);
return Observable.throw(e);
}
}
diff --git a/webapp/src/styles.css b/webapp/src/styles.css
index e69de29..fa725d0 100644
--- a/webapp/src/styles.css
+++ b/webapp/src/styles.css
@@ -0,0 +1,3 @@
+@import '~font-awesome/css/font-awesome.min.css';
+@import '~font-awesome-animation/dist/font-awesome-animation.min.css';
+@import '~bootstrap/dist/css/bootstrap.min.css';