From a5c881fc22e4227e292df418e6ac42ffec4ff893 Mon Sep 17 00:00:00 2001 From: Luca Frosini Date: Fri, 11 Oct 2019 18:16:14 +0200 Subject: [PATCH] Implementing UI --- is-monitor-frontend/.vscode/launch.json | 8 + is-monitor-frontend/src/app/ISType.ts | 7 + is-monitor-frontend/src/app/app.module.ts | 5 +- .../src/app/is.service.spec.ts | 12 ++ is-monitor-frontend/src/app/is.service.ts | 48 +++++ .../resource-types-tree.component.html | 2 +- .../resource-types-tree.component.ts | 111 ++++++------ .../src/app/resource-types-tree/types.ts | 164 ----------------- is-monitor-frontend/src/app/type.ts | 23 +++ is-monitor-frontend/src/app/types.ts | 166 ++++++++++++++++++ 10 files changed, 320 insertions(+), 226 deletions(-) create mode 100644 is-monitor-frontend/src/app/ISType.ts create mode 100644 is-monitor-frontend/src/app/is.service.spec.ts create mode 100644 is-monitor-frontend/src/app/is.service.ts delete mode 100644 is-monitor-frontend/src/app/resource-types-tree/types.ts create mode 100644 is-monitor-frontend/src/app/type.ts create mode 100644 is-monitor-frontend/src/app/types.ts diff --git a/is-monitor-frontend/.vscode/launch.json b/is-monitor-frontend/.vscode/launch.json index 7599200..f319c17 100644 --- a/is-monitor-frontend/.vscode/launch.json +++ b/is-monitor-frontend/.vscode/launch.json @@ -11,6 +11,14 @@ "port": 9261, "webRoot": "${workspaceFolder}", "url": "http://localhost:4200/#" + }, + { + "name": "Launch Chrome localhost", + "type": "chrome", + "request": "launch", + "port": 9276, + "webRoot": "${workspaceFolder}", + "url": "http://localhost:4200/" } ] } \ No newline at end of file diff --git a/is-monitor-frontend/src/app/ISType.ts b/is-monitor-frontend/src/app/ISType.ts new file mode 100644 index 0000000..f24a43a --- /dev/null +++ b/is-monitor-frontend/src/app/ISType.ts @@ -0,0 +1,7 @@ +export interface ISType { + name: string; + description: string | null; + abstract: boolean; + superClasses?: string[]; + properties?: any[]; +} diff --git a/is-monitor-frontend/src/app/app.module.ts b/is-monitor-frontend/src/app/app.module.ts index 5edc13b..cc32112 100644 --- a/is-monitor-frontend/src/app/app.module.ts +++ b/is-monitor-frontend/src/app/app.module.ts @@ -1,6 +1,8 @@ import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; +import { HttpClientModule } from '@angular/common/http'; + import { NgbModule } from '@ng-bootstrap/ng-bootstrap'; import { AppComponent } from './app.component'; @@ -17,7 +19,8 @@ import { ResourceTypesTreeComponent } from './resource-types-tree/resource-types ], imports: [ NgbModule, - BrowserModule + BrowserModule, + HttpClientModule ], providers: [], bootstrap: [AppComponent] diff --git a/is-monitor-frontend/src/app/is.service.spec.ts b/is-monitor-frontend/src/app/is.service.spec.ts new file mode 100644 index 0000000..fb5ff9a --- /dev/null +++ b/is-monitor-frontend/src/app/is.service.spec.ts @@ -0,0 +1,12 @@ +import { TestBed } from '@angular/core/testing'; + +import { IsService } from './is.service'; + +describe('IsService', () => { + beforeEach(() => TestBed.configureTestingModule({})); + + it('should be created', () => { + const service: IsService = TestBed.get(IsService); + expect(service).toBeTruthy(); + }); +}); diff --git a/is-monitor-frontend/src/app/is.service.ts b/is-monitor-frontend/src/app/is.service.ts new file mode 100644 index 0000000..77ad97f --- /dev/null +++ b/is-monitor-frontend/src/app/is.service.ts @@ -0,0 +1,48 @@ +import { Injectable } from '@angular/core'; +import { HttpClient } from '@angular/common/http'; +import { Observable, of } from 'rxjs'; +import { catchError, tap } from 'rxjs/operators'; +import { ISType } from './ISType'; +import { types } from './types'; + + +@Injectable({ + providedIn: 'root' +}) +export class IsService { + + constructor(private httpClient: HttpClient) { } + + /* NextNext Token */ + private token = ''; + + /** + * Handle Http operation that failed. + * Let the app continue. + * @param operation - name of the operation that failed + * @param result - optional value to return as the observable result + */ + private handleError(operation = 'operation', result?: T) { + return (error: any): Observable => { + console.error(error); + console.error(`${operation} failed: ${error.message}`); // log to console instead + // Let the app keep running by returning an empty result. + return of(result as T); + }; + } + + public getResourceTypes(): Observable { + + const url = 'http://pc-frosini.isti.cnr.it:8080/resource-registry/types/Resource?polymorphic=true&gcube-token=' + this.token; + // const observable: Observable = of(types); + const observable: Observable = this.httpClient.get(url); + /* + observable.pipe( + tap(_ => console.info('Fetched Resource Types')), + catchError(this.handleError('getResourceTypes()', types)) + ); + */ + return observable + } + +} diff --git a/is-monitor-frontend/src/app/resource-types-tree/resource-types-tree.component.html b/is-monitor-frontend/src/app/resource-types-tree/resource-types-tree.component.html index b5344cd..c284436 100644 --- a/is-monitor-frontend/src/app/resource-types-tree/resource-types-tree.component.html +++ b/is-monitor-frontend/src/app/resource-types-tree/resource-types-tree.component.html @@ -1,7 +1,7 @@
  • - {{ type.name }} + {{ type.name }}
    diff --git a/is-monitor-frontend/src/app/resource-types-tree/resource-types-tree.component.ts b/is-monitor-frontend/src/app/resource-types-tree/resource-types-tree.component.ts index 99c576c..b2d1f04 100644 --- a/is-monitor-frontend/src/app/resource-types-tree/resource-types-tree.component.ts +++ b/is-monitor-frontend/src/app/resource-types-tree/resource-types-tree.component.ts @@ -1,28 +1,7 @@ import { Component, OnInit } from '@angular/core'; -import { types } from './types'; - -export class Type { - - name: string; - description: string; - abstract: boolean; - parent: Type; - children: Type[]; - - constructor(type: { name: string; description: string; superClasses?: string[]; properties?: any; abstract: boolean; }) { - this.name = type.name; - this.description = type.description; - this.abstract = type.abstract; - this.children = new Array(); - } - - addChild(type: Type) { - type.parent = this; - this.children.push(type); - } - -} - +import { IsService } from '../is.service'; +import { Type } from '../type'; +import { ISType } from '../ISType'; @Component({ selector: 'app-resource-types-tree', @@ -33,53 +12,65 @@ export class ResourceTypesTreeComponent implements OnInit { resources: Type[]; - map = new Map(); - - unassociated = new Map(); - - constructor() { } - - analyseUnassociated(type: Type) { - const associated: string[] = new Array(); - - for (const name of this.unassociated.keys()) { - const t = this.unassociated.get(name); - const parent = t.superClasses[0]; - if (parent === type.name) { - type.addChild(this.map.get(t.name)); - associated.push(t.name); - } - } - - for (const a of associated) { - this.unassociated.delete(a); - } - - } + constructor(private isService: IsService) { } ngOnInit() { + this.getResourceTypes(); + } - for (const t of types) { - const type: Type = new Type(t); + private analyseTypes(isTypes: ISType[]): void { - this.map.set(type.name, type); + const map = new Map(); + const unassociated = new Map(); - if (type.name !== 'Resource') { + const analyseUnassociated = function(type: Type) { + const associated: string[] = new Array(); + + for (const name of unassociated.keys()) { + const t = unassociated.get(name); const parent = t.superClasses[0]; - if (this.map.has(parent)) { - this.map.get(parent).addChild(type); - } else { - this.analyseUnassociated(type); - this.unassociated.set(type.name, t); + if (parent === type.name) { + type.addChild(map.get(t.name)); + associated.push(t.name); } } + + for (const a of associated) { + unassociated.delete(a); + } + + }; + + const analyseType = function(isType: ISType) { + + const type: Type = new Type(isType); + + map.set(type.name, type); + + if (type.name !== 'Resource') { + const parent = isType.superClasses[0]; + if (map.has(parent)) { + map.get(parent).addChild(type); + } else { + analyseUnassociated(type); + unassociated.set(type.name, isType); + } + } + }; + + for (const isType of isTypes) { + analyseType(isType); } - this.resources = this.map.get('Resource').children; + this.resources = map.get('Resource').children; + } + private getResourceTypes(): void { + this.isService.getResourceTypes().subscribe(this.analyseTypes); + } + + loadResources(typeName: string) { + window.alert('Loading ' + typeName + ' resources'); } } diff --git a/is-monitor-frontend/src/app/resource-types-tree/types.ts b/is-monitor-frontend/src/app/resource-types-tree/types.ts deleted file mode 100644 index 94dfb03..0000000 --- a/is-monitor-frontend/src/app/resource-types-tree/types.ts +++ /dev/null @@ -1,164 +0,0 @@ -export const types = [ - { - name: 'Resource', - description: '', - superClasses: [ - 'Entity' - ], - properties: null, - abstract: true - }, - { - name: 'Service', - description: 'Collect Service information through the list of its facets', - superClasses: [ - 'Resource' - ], - properties: null, - abstract: true - }, - { - name: 'HostingNode', - description: 'Collect Hosting Node information through the list of its facets', - superClasses: [ - 'Service' - ], - properties: null, - abstract: false - }, - { - name: 'Software', - description: 'Collect Software information through the list of its facets', - superClasses: [ - 'Resource' - ], - properties: null, - abstract: false - }, - { - name: 'Plugin', - description: 'Collect Plugin information through the list of its facets', - superClasses: [ - 'Software' - ], - properties: null, - abstract: false - }, - { - name: 'Actor', - description: 'Any entity (human or machine) playing an active role.', - superClasses: [ - 'Resource' - ], - properties: null, - abstract: true - }, - { - name: 'LegalBody', - description: 'Actor', - superClasses: [ - 'Actor' - ], - properties: null, - abstract: false - }, - { - name: 'Dataset', - description: 'Collect Dataset information through the list of its facets', - superClasses: [ - 'Resource' - ], - properties: null, - abstract: false - }, - { - name: 'Person', - description: 'Person', - superClasses: [ - 'Actor' - ], - properties: null, - abstract: false - }, - { - name: 'Schema', - description: 'Collect Schema information through the list of its facets', - superClasses: [ - 'Resource' - ], - properties: null, - abstract: false - }, - { - name: 'Site', - description: 'Collect Site information through the list of its facets', - superClasses: [ - 'Resource' - ], - properties: null, - abstract: false - }, - { - name: 'ConcreteDataset', - description: 'Collect Dataset information through the list of its facets', - superClasses: [ - 'Dataset' - ], - properties: null, - abstract: false - }, - { - name: 'VirtualMachine', - description: 'Collect Hosting Node information through the list of its facets', - superClasses: [ - 'Service' - ], - properties: null, - abstract: false - }, - { - name: 'ConfigurationTemplate', - description: 'It represents a template for a configuration. It describe how a configuration has to be realized. E.g. Used to define the accounting configuration parameters template.', - superClasses: [ - 'Resource' - ], - properties: null, - abstract: false - }, - { - name: 'Configuration', - description: 'Collect Configuration information through the list of its facets', - superClasses: [ - 'ConfigurationTemplate' - ], - properties: null, - abstract: false - }, - { - name: 'EService', - description: 'Collect Electronic Service (aka Running Service) information through the list of its facets', - superClasses: [ - 'Service' - ], - properties: null, - abstract: false - }, - { - name: 'VirtualService', - description: 'Collect Virtual Service information through the list of its facets', - superClasses: [ - 'Service' - ], - properties: null, - abstract: false - }, - { - name: 'RunningPlugin', - description: 'Collect Running Plugin information through the list of its facets', - superClasses: [ - 'EService' - ], - properties: null, - abstract: false - } -]; diff --git a/is-monitor-frontend/src/app/type.ts b/is-monitor-frontend/src/app/type.ts new file mode 100644 index 0000000..82f93be --- /dev/null +++ b/is-monitor-frontend/src/app/type.ts @@ -0,0 +1,23 @@ +import { ISType } from './ISType'; + +export class Type { + + name: string; + description: string; + abstract: boolean; + parent: Type; + children: Type[]; + + constructor(isType: ISType) { + this.name = isType.name; + this.description = isType.description; + this.abstract = isType.abstract; + this.children = new Array(); + } + + addChild(type: Type) { + type.parent = this; + this.children.push(type); + } + +} \ No newline at end of file diff --git a/is-monitor-frontend/src/app/types.ts b/is-monitor-frontend/src/app/types.ts new file mode 100644 index 0000000..c6a72b8 --- /dev/null +++ b/is-monitor-frontend/src/app/types.ts @@ -0,0 +1,166 @@ +import { ISType } from './ISType'; + +export const types: ISType[] = [ + { + "name": "Resource", + "description": null, + "superClasses": [ + "Entity" + ], + "properties": [], + "abstract": true + }, + { + "name": "Service", + "description": null, + "superClasses": [ + "Resource" + ], + "properties": [], + "abstract": true + }, + { + "name": "ConfigurationTemplate", + "description": null, + "superClasses": [ + "Resource" + ], + "properties": [], + "abstract": false + }, + { + "name": "Dataset", + "description": null, + "superClasses": [ + "Resource" + ], + "properties": [], + "abstract": false + }, + { + "name": "ConcreteDataset", + "description": null, + "superClasses": [ + "Dataset" + ], + "properties": [], + "abstract": false + }, + { + "name": "HostingNode", + "description": null, + "superClasses": [ + "Service" + ], + "properties": [], + "abstract": false + }, + { + "name": "VirtualService", + "description": null, + "superClasses": [ + "Service" + ], + "properties": [], + "abstract": false + }, + { + "name": "EService", + "description": null, + "superClasses": [ + "Service" + ], + "properties": [], + "abstract": false + }, + { + "name": "RunningPlugin", + "description": null, + "superClasses": [ + "EService" + ], + "properties": [], + "abstract": false + }, + { + "name": "Software", + "description": null, + "superClasses": [ + "Resource" + ], + "properties": [], + "abstract": false + }, + { + "name": "Schema", + "description": null, + "superClasses": [ + "Resource" + ], + "properties": [], + "abstract": false + }, + { + "name": "Configuration", + "description": null, + "superClasses": [ + "ConfigurationTemplate" + ], + "properties": [], + "abstract": false + }, + { + "name": "LegalBody", + "description": null, + "superClasses": [ + "Actor" + ], + "properties": [], + "abstract": false + }, + { + "name": "VirtualMachine", + "description": null, + "superClasses": [ + "Service" + ], + "properties": [], + "abstract": false + }, + { + "name": "Site", + "description": null, + "superClasses": [ + "Resource" + ], + "properties": [], + "abstract": false + }, + { + "name": "Person", + "description": null, + "superClasses": [ + "Actor" + ], + "properties": [], + "abstract": false + }, + { + "name": "Plugin", + "description": null, + "superClasses": [ + "Software" + ], + "properties": [], + "abstract": false + }, + { + "name": "Actor", + "description": null, + "superClasses": [ + "Resource" + ], + "properties": [], + "abstract": true + } +]; \ No newline at end of file