mirror of
https://github.com/GNS3/gns3-web-ui.git
synced 2025-05-30 22:14:13 +00:00
Fixes after review
This commit is contained in:
parent
79f174faea
commit
085b099e96
@ -75,6 +75,8 @@ import { MatSidenavModule } from '@angular/material';
|
||||
import { NodeSelectInterfaceComponent } from './components/project-map/node-select-interface/node-select-interface.component';
|
||||
import { DrawLinkToolComponent } from './components/project-map/draw-link-tool/draw-link-tool.component';
|
||||
import { AddDrawingComponent } from './components/project-map/add-drawing/add-drawing.component';
|
||||
import { DrawingResizedComponent } from './components/drawings-listeners/drawing-resized/drawing-resized.component';
|
||||
import { TextEditedComponent } from './components/drawings-listeners/text-edited/text-edited.component';
|
||||
|
||||
|
||||
if (environment.production) {
|
||||
@ -118,7 +120,9 @@ if (environment.production) {
|
||||
ServerDiscoveryComponent,
|
||||
NodeSelectInterfaceComponent,
|
||||
DrawLinkToolComponent,
|
||||
AddDrawingComponent
|
||||
AddDrawingComponent,
|
||||
DrawingResizedComponent,
|
||||
TextEditedComponent
|
||||
],
|
||||
imports: [
|
||||
BrowserModule,
|
||||
|
@ -4,7 +4,7 @@ import { MatMenuModule, MatIconModule } from '@angular/material';
|
||||
|
||||
import { CssFixer } from './helpers/css-fixer';
|
||||
import { FontFixer } from './helpers/font-fixer';
|
||||
import { DrawingsFactory } from './helpers/drawings-factory';
|
||||
import { DefaultDrawingsFactory } from './helpers/default-drawings-factory';
|
||||
import { MultiLinkCalculatorHelper } from './helpers/multi-link-calculator-helper';
|
||||
import { SvgToDrawingConverter } from './helpers/svg-to-drawing-converter';
|
||||
import { QtDasharrayFixer } from './helpers/qt-dasharray-fixer';
|
||||
@ -46,6 +46,10 @@ import { TextAddingComponent } from './components/text-adding/text-adding.compon
|
||||
import { TextEditingComponent } from './components/text-editing/text-editing.component';
|
||||
import { FontBBoxCalculator } from './helpers/font-bbox-calculator';
|
||||
import { StylesToFontConverter } from './converters/styles-to-font-converter';
|
||||
import { TextElementFactory } from './helpers/drawings-factory/text-element-factory';
|
||||
import { EllipseElementFactory } from './helpers/drawings-factory/ellipse-element-factory';
|
||||
import { RectangleElementFactory } from './helpers/drawings-factory/rectangle-element-factory';
|
||||
import { LineElementFactory } from './helpers/drawings-factory/line-element-factory';
|
||||
|
||||
|
||||
@NgModule({
|
||||
@ -68,7 +72,11 @@ import { StylesToFontConverter } from './converters/styles-to-font-converter';
|
||||
providers: [
|
||||
CssFixer,
|
||||
FontFixer,
|
||||
DrawingsFactory,
|
||||
DefaultDrawingsFactory,
|
||||
TextElementFactory,
|
||||
EllipseElementFactory,
|
||||
RectangleElementFactory,
|
||||
LineElementFactory,
|
||||
MultiLinkCalculatorHelper,
|
||||
SvgToDrawingConverter,
|
||||
QtDasharrayFixer,
|
||||
|
@ -7,17 +7,26 @@ import { DrawingElementFactory } from './drawings-factory/drawing-element-factor
|
||||
import { MapDrawing } from '../models/map/map-drawing';
|
||||
|
||||
@Injectable()
|
||||
export class DrawingsFactory {
|
||||
export class DefaultDrawingsFactory {
|
||||
private factory: DrawingElementFactory;
|
||||
private availablefactories = {
|
||||
'text': new TextElementFactory,
|
||||
'ellipse': new EllipseElementFactory,
|
||||
'rectangle': new RectangleElementFactory,
|
||||
'line': new LineElementFactory
|
||||
};
|
||||
private availableFactories: {[ key: string]: DrawingElementFactory};
|
||||
|
||||
constructor(
|
||||
private textElementFactory: TextElementFactory,
|
||||
private ellipseElementFactory: EllipseElementFactory,
|
||||
private rectangleElementFactory: RectangleElementFactory,
|
||||
private lineElementFactory: LineElementFactory
|
||||
){
|
||||
this.availableFactories = {
|
||||
'text': this.textElementFactory,
|
||||
'ellipse': this.ellipseElementFactory,
|
||||
'rectangle': this.rectangleElementFactory,
|
||||
'line': this.lineElementFactory
|
||||
};
|
||||
}
|
||||
|
||||
getDrawingMock(drawingType: string){
|
||||
this.factory = this.availablefactories[drawingType];
|
||||
this.factory = this.availableFactories[drawingType];
|
||||
|
||||
let mapDrawing = new MapDrawing();
|
||||
mapDrawing.element = this.factory.getDrawingElement();
|
@ -1,7 +1,9 @@
|
||||
import { DrawingElementFactory } from './drawing-element-factory';
|
||||
import { DrawingElement } from '../../models/drawings/drawing-element';
|
||||
import { EllipseElement } from '../../models/drawings/ellipse-element';
|
||||
import { Injectable } from '@angular/core';
|
||||
|
||||
@Injectable()
|
||||
export class EllipseElementFactory implements DrawingElementFactory{
|
||||
|
||||
getDrawingElement(): DrawingElement{
|
||||
|
@ -1,7 +1,9 @@
|
||||
import { DrawingElementFactory } from './drawing-element-factory';
|
||||
import { DrawingElement } from '../../models/drawings/drawing-element';
|
||||
import { LineElement } from '../../models/drawings/line-element';
|
||||
import { Injectable } from '@angular/core';
|
||||
|
||||
@Injectable()
|
||||
export class LineElementFactory implements DrawingElementFactory{
|
||||
|
||||
getDrawingElement(): DrawingElement{
|
||||
|
@ -1,7 +1,9 @@
|
||||
import { DrawingElementFactory } from './drawing-element-factory';
|
||||
import { DrawingElement } from '../../models/drawings/drawing-element';
|
||||
import { RectElement } from '../../models/drawings/rect-element';
|
||||
import { Injectable } from '@angular/core';
|
||||
|
||||
@Injectable()
|
||||
export class RectangleElementFactory implements DrawingElementFactory{
|
||||
|
||||
getDrawingElement() : DrawingElement {
|
||||
|
@ -1,7 +1,9 @@
|
||||
import { DrawingElementFactory } from './drawing-element-factory';
|
||||
import { DrawingElement } from '../../models/drawings/drawing-element';
|
||||
import { TextElement } from '../../models/drawings/text-element';
|
||||
import { Injectable } from '@angular/core';
|
||||
|
||||
@Injectable()
|
||||
export class TextElementFactory implements DrawingElementFactory{
|
||||
|
||||
getDrawingElement(): DrawingElement {
|
||||
|
@ -0,0 +1,47 @@
|
||||
import { Component, Input, OnInit, OnDestroy } from "@angular/core";
|
||||
import { DrawingService } from '../../../services/drawing.service';
|
||||
import { DrawingsDataSource } from '../../../cartography/datasources/drawings-datasource';
|
||||
import { DrawingsEventSource } from '../../../cartography/events/drawings-event-source';
|
||||
import { MapDrawingToSvgConverter } from '../../../cartography/converters/map/map-drawing-to-svg-converter';
|
||||
import { Server } from '../../../models/server';
|
||||
import { ResizedDataEvent } from '../../../cartography/events/event-source';
|
||||
import { MapDrawing } from '../../../cartography/models/map/map-drawing';
|
||||
import { Drawing } from '../../../cartography/models/drawing';
|
||||
import { Subscription } from 'rxjs';
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'app-drawing-resized',
|
||||
templateUrl: './drawing-resized.component.html',
|
||||
styleUrls: ['./drawing-resized.component.css']
|
||||
})
|
||||
export class DrawingResizedComponent implements OnInit, OnDestroy{
|
||||
@Input() server: Server;
|
||||
private drawingResized: Subscription;
|
||||
|
||||
constructor(
|
||||
private drawingService: DrawingService,
|
||||
private drawingsDataSource: DrawingsDataSource,
|
||||
private drawingsEventSource: DrawingsEventSource,
|
||||
private mapDrawingToSvgConverter: MapDrawingToSvgConverter
|
||||
){}
|
||||
|
||||
ngOnInit(){
|
||||
this.drawingResized = this.drawingsEventSource.resized.subscribe((evt) => this.onDrawingResized(evt))
|
||||
}
|
||||
|
||||
public onDrawingResized(resizedEvent: ResizedDataEvent<MapDrawing>) {
|
||||
const drawing = this.drawingsDataSource.get(resizedEvent.datum.id);
|
||||
let svgString = this.mapDrawingToSvgConverter.convert(resizedEvent.datum);
|
||||
|
||||
this.drawingService
|
||||
.updateSizeAndPosition(this.server, drawing, resizedEvent.x, resizedEvent.y, svgString)
|
||||
.subscribe((serverDrawing: Drawing) => {
|
||||
this.drawingsDataSource.update(serverDrawing);
|
||||
});
|
||||
}
|
||||
|
||||
ngOnDestroy(){
|
||||
this.drawingResized.unsubscribe();
|
||||
}
|
||||
}
|
@ -0,0 +1,53 @@
|
||||
import { Component, OnInit, OnDestroy, Input } from "@angular/core";
|
||||
import { TextEditedDataEvent } from '../../../cartography/events/event-source';
|
||||
import { MapDrawing } from '../../../cartography/models/map/map-drawing';
|
||||
import { TextElement } from '../../../cartography/models/drawings/text-element';
|
||||
import { Drawing } from '../../../cartography/models/drawing';
|
||||
import { Server } from '../../../models/server';
|
||||
import { Subscription } from 'rxjs';
|
||||
import { DrawingService } from '../../../services/drawing.service';
|
||||
import { DrawingsDataSource } from '../../../cartography/datasources/drawings-datasource';
|
||||
import { DrawingsEventSource } from '../../../cartography/events/drawings-event-source';
|
||||
import { MapDrawingToSvgConverter } from '../../../cartography/converters/map/map-drawing-to-svg-converter';
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'app-text-edited',
|
||||
templateUrl: './text-edited.component.html',
|
||||
styleUrls: ['./text-edited.component.css']
|
||||
})
|
||||
export class TextEditedComponent implements OnInit, OnDestroy{
|
||||
@Input() server: Server;
|
||||
private textEdited: Subscription;
|
||||
|
||||
constructor(
|
||||
private drawingService: DrawingService,
|
||||
private drawingsDataSource: DrawingsDataSource,
|
||||
private drawingsEventSource: DrawingsEventSource,
|
||||
private mapDrawingToSvgConverter: MapDrawingToSvgConverter
|
||||
){}
|
||||
|
||||
ngOnInit(){
|
||||
this.textEdited = this.drawingsEventSource.textEdited.subscribe((evt) => this.onTextEdited(evt));
|
||||
}
|
||||
|
||||
public onTextEdited(evt: TextEditedDataEvent){
|
||||
let mapDrawing: MapDrawing = new MapDrawing();
|
||||
mapDrawing.element = evt.textElement;
|
||||
(mapDrawing.element as TextElement).text = evt.editedText;
|
||||
let svgString = this.mapDrawingToSvgConverter.convert(mapDrawing);
|
||||
|
||||
let drawing = this.drawingsDataSource.get(evt.textDrawingId);
|
||||
|
||||
this.drawingService
|
||||
.updateText(this.server, drawing, svgString)
|
||||
.subscribe((serverDrawing: Drawing) => {
|
||||
this.drawingsDataSource.update(serverDrawing);
|
||||
this.drawingsEventSource.textSaved.emit(true);
|
||||
});
|
||||
}
|
||||
|
||||
ngOnDestroy(){
|
||||
this.textEdited.unsubscribe();
|
||||
}
|
||||
}
|
@ -1,6 +1,6 @@
|
||||
import { AddDrawingComponent } from "./add-drawing.component";
|
||||
import { ComponentFixture, TestBed, async } from '@angular/core/testing';
|
||||
import { DrawingsFactory } from '../../../cartography/helpers/drawings-factory';
|
||||
import { DefaultDrawingsFactory } from '../../../cartography/helpers/default-drawings-factory';
|
||||
import { DrawingService } from '../../../services/drawing.service';
|
||||
import { DrawingsDataSource } from '../../../cartography/datasources/drawings-datasource';
|
||||
import { MapDrawingToSvgConverter } from '../../../cartography/converters/map/map-drawing-to-svg-converter';
|
||||
@ -15,7 +15,7 @@ describe('AddDrawingComponent', () => {
|
||||
providers: [
|
||||
{ provide: DrawingService },
|
||||
{ provide: DrawingsDataSource },
|
||||
{ provide: DrawingsFactory },
|
||||
{ provide: DefaultDrawingsFactory },
|
||||
{ provide: MapDrawingToSvgConverter },
|
||||
{ provide: Context }
|
||||
],
|
||||
|
@ -1,7 +1,7 @@
|
||||
import { Component, Input, OnChanges, SimpleChange, Output, EventEmitter } from "@angular/core";
|
||||
import { DrawingsDataSource } from '../../../cartography/datasources/drawings-datasource';
|
||||
import { DrawingService } from '../../../services/drawing.service';
|
||||
import { DrawingsFactory } from '../../../cartography/helpers/drawings-factory';
|
||||
import { DefaultDrawingsFactory } from '../../../cartography/helpers/default-drawings-factory';
|
||||
import { MapDrawingToSvgConverter } from '../../../cartography/converters/map/map-drawing-to-svg-converter';
|
||||
import { Project } from '../../../models/project';
|
||||
import { Server } from '../../../models/server';
|
||||
@ -27,7 +27,7 @@ export class AddDrawingComponent implements OnChanges {
|
||||
constructor(
|
||||
private drawingService: DrawingService,
|
||||
private drawingsDataSource: DrawingsDataSource,
|
||||
private drawingsFactory: DrawingsFactory,
|
||||
private drawingsFactory: DefaultDrawingsFactory,
|
||||
private mapDrawingToSvgConverter: MapDrawingToSvgConverter,
|
||||
private context: Context
|
||||
){}
|
||||
|
@ -154,3 +154,6 @@
|
||||
[selectedDrawing]="selectedDrawing"
|
||||
(drawingSaved)="onDrawingSaved($event)">
|
||||
</app-add-drawing>
|
||||
|
||||
<app-drawing-resized [server]="server"></app-drawing-resized>
|
||||
<app-text-edited [server]="server"></app-text-edited>
|
||||
|
@ -42,7 +42,7 @@ 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';
|
||||
import { DrawingsFactory } from '../../cartography/helpers/drawings-factory';
|
||||
import { DefaultDrawingsFactory } from '../../cartography/helpers/default-drawings-factory';
|
||||
|
||||
export class MockedProgressService {
|
||||
public activate() {}
|
||||
@ -117,7 +117,7 @@ describe('ProjectMapComponent', () => {
|
||||
{ provide: NodesEventSource },
|
||||
{ provide: DrawingsEventSource },
|
||||
{ provide: LinksEventSource },
|
||||
{ provide: DrawingsFactory },
|
||||
{ provide: DefaultDrawingsFactory },
|
||||
{ provide: MapDrawingToSvgConverter, useValue: {
|
||||
convert: () => { return ''}
|
||||
} },
|
||||
|
@ -26,7 +26,7 @@ import { MapChangeDetectorRef } from '../../cartography/services/map-change-dete
|
||||
import { NodeContextMenu } from '../../cartography/events/nodes';
|
||||
import { MapLinkCreated } from '../../cartography/events/links';
|
||||
import { NodeWidget } from '../../cartography/widgets/node';
|
||||
import { DraggedDataEvent, ResizedDataEvent, TextEditedDataEvent, TextAddedDataEvent } from '../../cartography/events/event-source';
|
||||
import { DraggedDataEvent } from '../../cartography/events/event-source';
|
||||
import { DrawingService } from '../../services/drawing.service';
|
||||
import { MapNodeToNodeConverter } from '../../cartography/converters/map/map-node-to-node-converter';
|
||||
import { NodesEventSource } from '../../cartography/events/nodes-event-source';
|
||||
@ -40,9 +40,8 @@ import { SettingsService, Settings } from '../../services/settings.service';
|
||||
import { MapLabel } from '../../cartography/models/map/map-label';
|
||||
import { D3MapComponent } from '../../cartography/components/d3-map/d3-map.component';
|
||||
import { MapLinkNode } from '../../cartography/models/map/map-link-node';
|
||||
import { TextElement } from '../../cartography/models/drawings/text-element';
|
||||
import { MapLabelToLabelConverter } from '../../cartography/converters/map/map-label-to-label-converter';
|
||||
import { DrawingsFactory } from '../../cartography/helpers/drawings-factory';
|
||||
import { DefaultDrawingsFactory } from '../../cartography/helpers/default-drawings-factory';
|
||||
|
||||
|
||||
@Component({
|
||||
@ -109,7 +108,7 @@ export class ProjectMapComponent implements OnInit, OnDestroy {
|
||||
private mapDrawingToSvgConverter: MapDrawingToSvgConverter,
|
||||
private settingsService: SettingsService,
|
||||
private mapLabelToLabel: MapLabelToLabelConverter,
|
||||
private drawingsFactory: DrawingsFactory
|
||||
private drawingsFactory: DefaultDrawingsFactory
|
||||
) {}
|
||||
|
||||
ngOnInit() {
|
||||
@ -187,14 +186,6 @@ export class ProjectMapComponent implements OnInit, OnDestroy {
|
||||
this.drawingsEventSource.dragged.subscribe((evt) => this.onDrawingDragged(evt))
|
||||
);
|
||||
|
||||
this.subscriptions.push(
|
||||
this.drawingsEventSource.resized.subscribe((evt) => this.onDrawingResized(evt))
|
||||
);
|
||||
|
||||
this.subscriptions.push(
|
||||
this.drawingsEventSource.textEdited.subscribe((evt) => this.onTextEdited(evt))
|
||||
);
|
||||
|
||||
this.subscriptions.push(
|
||||
this.linksEventSource.created.subscribe((evt) => this.onLinkCreated(evt))
|
||||
);
|
||||
@ -338,37 +329,10 @@ export class ProjectMapComponent implements OnInit, OnDestroy {
|
||||
});
|
||||
}
|
||||
|
||||
public onDrawingResized(resizedEvent: ResizedDataEvent<MapDrawing>) {
|
||||
const drawing = this.drawingsDataSource.get(resizedEvent.datum.id);
|
||||
let svgString = this.mapDrawingToSvgConverter.convert(resizedEvent.datum);
|
||||
|
||||
this.drawingService
|
||||
.updateSizeAndPosition(this.server, drawing, resizedEvent.x, resizedEvent.y, svgString)
|
||||
.subscribe((serverDrawing: Drawing) => {
|
||||
this.drawingsDataSource.update(serverDrawing);
|
||||
});
|
||||
}
|
||||
|
||||
public onDrawingSaved(evt: boolean){
|
||||
this.resetDrawToolChoice();
|
||||
}
|
||||
|
||||
public onTextEdited(evt: TextEditedDataEvent){
|
||||
let mapDrawing: MapDrawing = new MapDrawing();
|
||||
mapDrawing.element = evt.textElement;
|
||||
(mapDrawing.element as TextElement).text = evt.editedText;
|
||||
let svgString = this.mapDrawingToSvgConverter.convert(mapDrawing);
|
||||
|
||||
let drawing = this.drawingsDataSource.get(evt.textDrawingId);
|
||||
|
||||
this.drawingService
|
||||
.updateText(this.server, drawing, svgString)
|
||||
.subscribe((serverDrawing: Drawing) => {
|
||||
this.drawingsDataSource.update(serverDrawing);
|
||||
this.drawingsEventSource.textSaved.emit(true);
|
||||
});
|
||||
}
|
||||
|
||||
public set readonly(value) {
|
||||
this.inReadOnlyMode = value;
|
||||
if (value) {
|
||||
|
Loading…
x
Reference in New Issue
Block a user