Merge branch 'master' into add-text

This commit is contained in:
Piotr Pekala 2018-12-13 01:05:59 -08:00
commit f859dc0c22
23 changed files with 195 additions and 138 deletions

View File

@ -23,7 +23,7 @@ import { HttpServer, ServerErrorHandler } from "./services/http-server.service";
import { SnapshotService } from "./services/snapshot.service";
import { ProgressDialogService } from "./common/progress-dialog/progress-dialog.service";
import { NodeService } from "./services/node.service";
import { ApplianceService } from "./services/appliance.service";
import { TemplateService } from "./services/template.service";
import { LinkService } from "./services/link.service";
import { ProjectsComponent } from './components/projects/projects.component';
@ -39,8 +39,8 @@ import { ServersComponent, AddServerDialogComponent } from './components/servers
import { NodeContextMenuComponent } from './components/project-map/node-context-menu/node-context-menu.component';
import { StartNodeActionComponent } from './components/project-map/node-context-menu/actions/start-node-action/start-node-action.component';
import { StopNodeActionComponent } from './components/project-map/node-context-menu/actions/stop-node-action/stop-node-action.component';
import { ApplianceComponent } from './components/appliance/appliance.component';
import { ApplianceListDialogComponent } from './components/appliance/appliance-list-dialog/appliance-list-dialog.component';
import { TemplateComponent } from './components/template/template.component';
import { TemplateListDialogComponent } from './components/template/template-list-dialog/template-list-dialog.component';
import { CartographyModule } from './cartography/cartography.module';
import { ToasterService } from './services/toaster.service';
import { ProjectWebServiceHandler } from "./handlers/project-web-service-handler";
@ -106,8 +106,8 @@ if (environment.production) {
NodeContextMenuComponent,
StartNodeActionComponent,
StopNodeActionComponent,
ApplianceComponent,
ApplianceListDialogComponent,
TemplateComponent,
TemplateListDialogComponent,
MoveLayerDownActionComponent,
MoveLayerUpActionComponent,
ProjectMapShortcutsComponent,
@ -142,7 +142,7 @@ if (environment.production) {
ProjectService,
SymbolService,
ServerService,
ApplianceService,
TemplateService,
NodeService,
LinkService,
DrawingService,
@ -167,7 +167,7 @@ if (environment.production) {
AddServerDialogComponent,
CreateSnapshotDialogComponent,
ProgressDialogComponent,
ApplianceListDialogComponent,
TemplateListDialogComponent,
AddBlankProjectDialogComponent,
ImportProjectDialogComponent,
ConfirmationDialogComponent

View File

@ -15,7 +15,7 @@ describe('FontBBoxCalculator', () => {
expect(box.width).toEqual(41.34375);
});
it('should calculate font width and height for different font', () => {
xit('should calculate font width and height for different font', () => {
const box = calculator.calculate("My text", "font-family:Tahoma; font-size: 14px; font-weight:bold");
expect(box.height).toEqual(15);

View File

@ -1,3 +0,0 @@
<button mat-icon-button (click)="listAppliancesModal()">
<mat-icon>add_to_queue</mat-icon>
</button>

View File

@ -1,36 +0,0 @@
import {Component, EventEmitter, Input, OnInit, Output} from '@angular/core';
import {MatDialog} from "@angular/material";
import {ApplianceListDialogComponent} from "./appliance-list-dialog/appliance-list-dialog.component";
import {Server} from "../../models/server";
import {Appliance} from "../../models/appliance";
@Component({
selector: 'app-appliance',
templateUrl: './appliance.component.html',
styleUrls: ['./appliance.component.scss']
})
export class ApplianceComponent implements OnInit {
@Input() server: Server;
@Output() onNodeCreation = new EventEmitter<any>();
constructor(private dialog: MatDialog) { }
ngOnInit() {}
listAppliancesModal() {
const dialogRef = this.dialog.open(ApplianceListDialogComponent, {
width: '600px',
height: '560px',
data: {
'server': this.server
}
});
dialogRef.afterClosed().subscribe((appliance: Appliance) => {
if (appliance !== null) {
this.onNodeCreation.emit(appliance);
}
});
}
}

View File

@ -31,10 +31,18 @@ g.node:hover {
outline: none;
}
.mat-drawer-content {
display: inline !important;
@-moz-document url-prefix() {
/** fixes gray background of drawing menu on Firefox **/
.mat-drawer-content {
display: inline !important;
}
}
.mat-drawer-content {
height: auto !important;
}
.drawer-container {
height: 72px !important;
background: transparent;
@ -92,10 +100,6 @@ g.node:hover {
background-color: transparent;
}
.selected {
stroke: #0097a7!important;
}
.project-toolbar .mat-toolbar-multiple-rows {
width: auto !important;
}

View File

@ -91,16 +91,16 @@
</mat-toolbar-row>
<mat-toolbar-row *ngIf="!readonly" >
<app-appliance
<app-template
[server]="server"
(onNodeCreation)="onNodeCreation($event)"
></app-appliance>
></app-template>
</mat-toolbar-row>
</mat-toolbar>
</div>
<div class="draw-menu">
<div class="draw-menu" *ngIf="!inReadOnlyMode">
<mat-drawer-container [ngClass]="{shadow: drawTools.visibility}" class="drawer-container">
<mat-drawer #drawer class="drawer">
<div class="drawer-buttons">

View File

@ -41,6 +41,7 @@ import { MapDrawing } from '../../cartography/models/map/map-drawing';
import { HttpServer } from '../../services/http-server.service';
import { Server } from '../../models/server';
import { ResizedDataEvent } from '../../cartography/events/event-source';
import { MapLabelToLabelConverter } from '../../cartography/converters/map/map-label-to-label-converter';
export class MockedProgressService {
public activate() {}
@ -118,7 +119,8 @@ describe('ProjectMapComponent', () => {
{ provide: MapDrawingToSvgConverter, useValue: {
convert: () => { return ''}
} },
{ provide: SettingsService, useClass: MockedSettingsService }
{ provide: SettingsService, useClass: MockedSettingsService },
{ provide: MapLabelToLabelConverter}
],
declarations: [
ProjectMapComponent,

View File

@ -13,7 +13,7 @@ import { ProjectService } from '../../services/project.service';
import { Server } from "../../models/server";
import { Drawing } from "../../cartography/models/drawing";
import { NodeContextMenuComponent } from "./node-context-menu/node-context-menu.component";
import { Appliance } from "../../models/appliance";
import { Template } from "../../models/template";
import { NodeService } from "../../services/node.service";
import { Symbol } from "../../models/symbol";
import { LinkService } from "../../services/link.service";
@ -260,9 +260,9 @@ export class ProjectMapComponent implements OnInit, OnDestroy {
this.mapChangeDetectorRef.detectChanges();
}
onNodeCreation(appliance: Appliance) {
onNodeCreation(template: Template) {
this.nodeService
.createFromAppliance(this.server, this.project, appliance, 0, 0, 'local')
.createFromTemplate(this.server, this.project, template, 0, 0, 'local')
.subscribe((createdNode: Node) => {
this.projectService
.nodes(this.server, this.project.project_id)

View File

@ -1,7 +1,7 @@
<div mat-dialog-content>
<div class="example-header">
<mat-form-field floatPlaceholder="never">
<input matInput #filter placeholder="Filter appliances">
<input matInput #filter placeholder="Filter templates">
</mat-form-field>
</div>

View File

@ -1,20 +1,20 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { ApplianceListDialogComponent } from './appliance-list-dialog.component';
import { TemplateListDialogComponent } from './template-list-dialog.component';
describe('ApplianceListDialogComponent', () => {
let component: ApplianceListDialogComponent;
let fixture: ComponentFixture<ApplianceListDialogComponent>;
describe('TemplateListDialogComponent', () => {
let component: TemplateListDialogComponent;
let fixture: ComponentFixture<TemplateListDialogComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ ApplianceListDialogComponent ]
declarations: [ TemplateListDialogComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(ApplianceListDialogComponent);
fixture = TestBed.createComponent(TemplateListDialogComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});

View File

@ -6,33 +6,33 @@ import { Observable, BehaviorSubject, fromEvent, merge } from "rxjs";
import { debounceTime, distinctUntilChanged, map } from "rxjs/operators";
import { Server } from "../../../models/server";
import { ApplianceService } from "../../../services/appliance.service";
import { Appliance } from "../../../models/appliance";
import { TemplateService } from "../../../services/template.service";
import { Template } from "../../../models/template";
@Component({
selector: 'app-appliance-list-dialog',
templateUrl: './appliance-list-dialog.component.html',
styleUrls: ['./appliance-list-dialog.component.scss']
selector: 'app-template-list-dialog',
templateUrl: './template-list-dialog.component.html',
styleUrls: ['./template-list-dialog.component.scss']
})
export class ApplianceListDialogComponent implements OnInit {
export class TemplateListDialogComponent implements OnInit {
server: Server;
applianceDatabase: ApplianceDatabase;
dataSource: ApplianceDataSource;
templateDatabase: TemplateDatabase;
dataSource: TemplateDataSource;
displayedColumns = ['name'];
@ViewChild('filter') filter: ElementRef;
constructor(
public dialogRef: MatDialogRef<ApplianceListDialogComponent>,
private applianceService: ApplianceService,
public dialogRef: MatDialogRef<TemplateListDialogComponent>,
private templateService: TemplateService,
@Inject(MAT_DIALOG_DATA) public data: any) {
this.server = data['server'];
}
ngOnInit() {
this.applianceDatabase = new ApplianceDatabase(this.server, this.applianceService);
this.dataSource = new ApplianceDataSource(this.applianceDatabase);
this.templateDatabase = new TemplateDatabase(this.server, this.templateService);
this.dataSource = new TemplateDataSource(this.templateDatabase);
fromEvent(this.filter.nativeElement, 'keyup').pipe(
debounceTime(150),
@ -49,48 +49,48 @@ export class ApplianceListDialogComponent implements OnInit {
this.dialogRef.close();
}
addNode(appliance: Appliance): void {
this.dialogRef.close(appliance);
addNode(template: Template): void {
this.dialogRef.close(template);
}
}
export class ApplianceDatabase {
dataChange: BehaviorSubject<Appliance[]> = new BehaviorSubject<Appliance[]>([]);
export class TemplateDatabase {
dataChange: BehaviorSubject<Template[]> = new BehaviorSubject<Template[]>([]);
get data(): Appliance[] {
get data(): Template[] {
return this.dataChange.value;
}
constructor(private server: Server, private applianceService: ApplianceService) {
this.applianceService
constructor(private server: Server, private templateService: TemplateService) {
this.templateService
.list(this.server)
.subscribe((appliances) => {
this.dataChange.next(appliances);
.subscribe((templates) => {
this.dataChange.next(templates);
});
}
};
export class ApplianceDataSource extends DataSource<Appliance> {
export class TemplateDataSource extends DataSource<Template> {
filterChange = new BehaviorSubject('');
get filter(): string { return this.filterChange.value; }
set filter(filter: string) { this.filterChange.next(filter); }
constructor(private applianceDatabase: ApplianceDatabase) {
constructor(private templateDatabase: TemplateDatabase) {
super();
}
connect(): Observable<Appliance[]> {
connect(): Observable<Template[]> {
const displayDataChanges = [
this.applianceDatabase.dataChange,
this.templateDatabase.dataChange,
this.filterChange,
];
return merge(...displayDataChanges).pipe(map(() => {
return this.applianceDatabase.data.slice().filter((item: Appliance) => {
return this.templateDatabase.data.slice().filter((item: Template) => {
const searchStr = (item.name).toLowerCase();
return searchStr.indexOf(this.filter.toLowerCase()) !== -1;
});

View File

@ -0,0 +1,3 @@
<button mat-icon-button (click)="listTemplatesModal()">
<mat-icon>add_to_queue</mat-icon>
</button>

View File

@ -1,20 +1,20 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { ApplianceComponent } from './appliance.component';
import { TemplateComponent } from './template.component';
describe('ApplianceComponent', () => {
let component: ApplianceComponent;
let fixture: ComponentFixture<ApplianceComponent>;
describe('TemplateComponent', () => {
let component: TemplateComponent;
let fixture: ComponentFixture<TemplateComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ ApplianceComponent ]
declarations: [ TemplateComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(ApplianceComponent);
fixture = TestBed.createComponent(TemplateComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});

View File

@ -0,0 +1,36 @@
import {Component, EventEmitter, Input, OnInit, Output} from '@angular/core';
import {MatDialog} from "@angular/material";
import {TemplateListDialogComponent} from "./template-list-dialog/template-list-dialog.component";
import {Server} from "../../models/server";
import {Template} from "../../models/template";
@Component({
selector: 'app-template',
templateUrl: './template.component.html',
styleUrls: ['./template.component.scss']
})
export class TemplateComponent implements OnInit {
@Input() server: Server;
@Output() onNodeCreation = new EventEmitter<any>();
constructor(private dialog: MatDialog) { }
ngOnInit() {}
listTemplatesModal() {
const dialogRef = this.dialog.open(TemplateListDialogComponent, {
width: '600px',
height: '560px',
data: {
'server': this.server
}
});
dialogRef.afterClosed().subscribe((template: Template) => {
if (template !== null) {
this.onNodeCreation.emit(template);
}
});
}
}

View File

@ -1,5 +1,5 @@
export class Appliance {
appliance_id: string;
export class Template {
template_id: string;
builtin: boolean;
category: string;
compute_id: string;

View File

@ -58,6 +58,22 @@ describe('DrawingService', () => {
});
}));
it('should updatePosition of drawing and round to integer', inject([DrawingService], (service: DrawingService) => {
const drawing = new Drawing();
drawing.project_id = "myproject";
drawing.drawing_id = "id";
service.updatePosition(server, drawing, 10.1, 20.6).subscribe();
const req = httpTestingController.expectOne(
'http://127.0.0.1:3080/v2/projects/myproject/drawings/id');
expect(req.request.method).toEqual("PUT");
expect(req.request.body).toEqual({
'x': 10,
'y': 21
});
}));
it('should update size and position of drawing', inject([DrawingService], (service: DrawingService) => {
const drawing = new Drawing();
drawing.project_id = "myproject";
@ -76,6 +92,24 @@ describe('DrawingService', () => {
});
}));
it('should update size and position of drawing and round to integer', inject([DrawingService], (service: DrawingService) => {
const drawing = new Drawing();
drawing.project_id = "myproject";
drawing.drawing_id = "id";
let svgSample = "<svg><test></svg>"
service.updateSizeAndPosition(server, drawing, 100.1, 100.6, svgSample).subscribe();
const req = httpTestingController.expectOne(
'http://127.0.0.1:3080/v2/projects/myproject/drawings/id');
expect(req.request.method).toEqual("PUT");
expect(req.request.body).toEqual({
'x': 100,
'y': 101,
'svg': svgSample
});
}));
it('should update drawing', inject([DrawingService], (service: DrawingService) => {
const drawing = new Drawing();
drawing.project_id = "myproject";

View File

@ -16,16 +16,16 @@ export class DrawingService {
return this.httpServer
.post<Drawing>(server, `/projects/${project_id}/drawings`, {
'svg': svg,
'x': x,
'y': y
'x': Math.round(x),
'y': Math.round(y)
});
}
updatePosition(server: Server, drawing: Drawing, x: number, y: number): Observable<Drawing> {
return this.httpServer
.put<Drawing>(server, `/projects/${drawing.project_id}/drawings/${drawing.drawing_id}`, {
'x': x,
'y': y
'x': Math.round(x),
'y': Math.round(y)
});
}
@ -33,8 +33,8 @@ export class DrawingService {
return this.httpServer
.put<Drawing>(server, `/projects/${drawing.project_id}/drawings/${drawing.drawing_id}`, {
'svg': svg,
'x': x,
'y': y
'x': Math.round(x),
'y': Math.round(y)
})
}
@ -42,8 +42,8 @@ export class DrawingService {
return this.httpServer
.put<Drawing>(server, `/projects/${drawing.project_id}/drawings/${drawing.drawing_id}`, {
'svg': svg,
'x': drawing.x,
'y': drawing.y,
'x': Math.round(drawing.x),
'y': Math.round(drawing.y),
'z': drawing.z
});
}
@ -51,8 +51,8 @@ export class DrawingService {
update(server: Server, drawing: Drawing): Observable<Drawing> {
return this.httpServer
.put<Drawing>(server, `/projects/${drawing.project_id}/drawings/${drawing.drawing_id}`, {
'x': drawing.x,
'y': drawing.y,
'x': Math.round(drawing.x),
'y': Math.round(drawing.y),
'z': drawing.z
});
}

View File

@ -7,7 +7,7 @@ import { Server } from '../models/server';
import { Node } from '../cartography/models/node';
import { getTestServer } from './testing';
import { NodeService } from './node.service';
import { Appliance } from '../models/appliance';
import { Template } from '../models/template';
import { Project } from '../models/project';
import { AppTestingModule } from "../testing/app-testing/app-testing.module";
import { Label } from '../cartography/models/label';
@ -72,16 +72,16 @@ describe('NodeService', () => {
expect(req.request.body).toEqual({});
}));
it('should createFromAppliance node', inject([NodeService], (service: NodeService) => {
it('should createFromTemplate node', inject([NodeService], (service: NodeService) => {
const project = new Project();
project.project_id = "myproject";
const appliance = new Appliance();
appliance.appliance_id = "myappliance";
const template = new Template();
template.template_id = "mytemplate";
service.createFromAppliance(server, project, appliance, 10, 20, "compute").subscribe();
service.createFromTemplate(server, project, template, 10, 20, "compute").subscribe();
const req = httpTestingController.expectOne(
'http://127.0.0.1:3080/v2/projects/myproject/appliances/myappliance');
'http://127.0.0.1:3080/v2/projects/myproject/templates/mytemplate');
expect(req.request.method).toEqual("POST");
expect(req.request.body).toEqual({
'x': 10, 'y': 20, 'compute_id': 'compute'});
@ -103,6 +103,23 @@ describe('NodeService', () => {
});
}));
it('should updatePosition of node and round to integer', inject([NodeService], (service: NodeService) => {
const node = new Node();
node.project_id = "myproject";
node.node_id = "id";
service.updatePosition(server, node, 10.1, 20.6).subscribe();
const req = httpTestingController.expectOne(
'http://127.0.0.1:3080/v2/projects/myproject/nodes/id');
expect(req.request.method).toEqual("PUT");
expect(req.request.body).toEqual({
'x': 10,
'y': 21
});
}));
it('should update label of node', inject([NodeService], (service: NodeService) => {
const node = new Node();
node.project_id = "myproject";

View File

@ -6,7 +6,7 @@ import { Observable } from 'rxjs';
import 'rxjs/add/operator/map';
import { Server } from "../models/server";
import { HttpServer } from "./http-server.service";
import {Appliance} from "../models/appliance";
import {Template} from "../models/template";
import { Label } from '../cartography/models/label';
@ -25,21 +25,21 @@ export class NodeService {
.post<Node>(server, `/projects/${node.project_id}/nodes/${node.node_id}/stop`, {});
}
createFromAppliance(
server: Server, project: Project, appliance: Appliance,
createFromTemplate(
server: Server, project: Project, template: Template,
x: number, y: number, compute_id: string) {
return this.httpServer
.post(
server,
`/projects/${project.project_id}/appliances/${appliance.appliance_id}`,
{'x': x, 'y': y, 'compute_id': compute_id});
`/projects/${project.project_id}/templates/${template.template_id}`,
{'x': Math.round(x), 'y': Math.round(y), 'compute_id': compute_id});
}
updatePosition(server: Server, node: Node, x: number, y: number): Observable<Node> {
return this.httpServer
.put<Node>(server, `/projects/${node.project_id}/nodes/${node.node_id}`, {
'x': x,
'y': y
'x': Math.round(x),
'y': Math.round(y)
});
}
@ -50,8 +50,8 @@ export class NodeService {
'rotation': label.rotation,
'style': label.style,
'text': label.text,
'x': label.x,
'y': label.y
'x': Math.round(label.x),
'y': Math.round(label.y)
}
});
}
@ -59,8 +59,8 @@ export class NodeService {
update(server: Server, node: Node): Observable<Node> {
return this.httpServer
.put<Node>(server, `/projects/${node.project_id}/nodes/${node.node_id}`, {
'x': node.x,
'y': node.y,
'x': Math.round(node.x),
'y': Math.round(node.y),
'z': node.z
});
}

View File

@ -2,17 +2,17 @@ import { TestBed, } from '@angular/core/testing';
import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing';
import { HttpClient } from "@angular/common/http";
import { ApplianceService } from './appliance.service';
import { TemplateService } from './template.service';
import { Server } from '../models/server';
import { HttpServer } from './http-server.service';
import { AppTestingModule } from "../testing/app-testing/app-testing.module";
describe('ApplianceService', () => {
describe('TemplateService', () => {
let httpClient: HttpClient;
let httpTestingController: HttpTestingController;
let service: ApplianceService;
let service: TemplateService;
beforeEach(() => {
TestBed.configureTestingModule({
@ -21,14 +21,14 @@ describe('ApplianceService', () => {
AppTestingModule
],
providers: [
ApplianceService,
TemplateService,
HttpServer
]
});
httpClient = TestBed.get(HttpClient);
httpTestingController = TestBed.get(HttpTestingController);
service = TestBed.get(ApplianceService);
service = TestBed.get(TemplateService);
});
afterEach(() => {
@ -43,7 +43,7 @@ describe('ApplianceService', () => {
service.list(server).subscribe(() => {});
httpTestingController.expectOne('http://127.0.0.1:3080/v2/appliances');
httpTestingController.expectOne('http://127.0.0.1:3080/v2/templates');
});
});

View File

@ -3,17 +3,17 @@ import { Injectable } from '@angular/core';
import 'rxjs/add/operator/map';
import { Server } from "../models/server";
import { HttpServer } from "./http-server.service";
import {Appliance} from "../models/appliance";
import {Template} from "../models/template";
import {Observable} from "rxjs";
@Injectable()
export class ApplianceService {
export class TemplateService {
constructor(private httpServer: HttpServer) { }
list(server: Server): Observable<Appliance[]> {
list(server: Server): Observable<Template[]> {
return this.httpServer
.get<Appliance[]>(server, '/appliances') as Observable<Appliance[]>;
.get<Template[]>(server, '/templates') as Observable<Template[]>;
}
}