Move out responsibilities to project-map

This commit is contained in:
ziajka 2018-11-16 11:38:42 +01:00
parent 5a8206750e
commit 8de7e58dec
8 changed files with 69 additions and 74 deletions

View File

@ -38,6 +38,7 @@ import { GraphDataManager } from './managers/graph-data-manager';
import { SelectionUpdateListener } from './listeners/selection-update-listener';
import { MapNodesDataSource, MapLinksDataSource, MapDrawingsDataSource, MapSymbolsDataSource } from './datasources/map-datasource';
import { SelectionListener } from './listeners/selection-listener';
import { LinksEventSource } from './events/links-event-source';
@NgModule({
@ -67,6 +68,7 @@ import { SelectionListener } from './listeners/selection-listener';
SelectionListener,
DrawingsEventSource,
NodesEventSource,
LinksEventSource,
DrawingToMapDrawingConverter,
LabelToMapLabelConverter,
LinkToMapLinkConverter,

View File

@ -7,6 +7,7 @@ import { NodeClicked } from '../../events/nodes';
import { NodeWidget } from '../../widgets/node';
import { MapNode } from '../../models/map/map-node';
import { MapPort } from '../../models/map/map-port';
import { LinksEventSource } from '../../events/links-event-source';
@Component({
@ -17,13 +18,14 @@ import { MapPort } from '../../models/map/map-port';
export class DrawLinkToolComponent implements OnInit, OnDestroy {
@ViewChild(NodeSelectInterfaceComponent) nodeSelectInterfaceMenu: NodeSelectInterfaceComponent;
@Output('linkCreated') linkCreated = new EventEmitter<MapLinkCreated>();
// @Output('linkCreated') linkCreated = new EventEmitter<MapLinkCreated>();
private onNodeClicked: Subscription;
constructor(
private drawingLineTool: DrawingLineWidget,
private nodeWidget: NodeWidget
private nodeWidget: NodeWidget,
private linksEventSource: LinksEventSource
) { }
ngOnInit() {
@ -48,7 +50,7 @@ export class DrawLinkToolComponent implements OnInit, OnDestroy {
const port: MapPort = event.port;
if (this.drawingLineTool.isDrawing()) {
const data = this.drawingLineTool.stop();
this.linkCreated.emit(new MapLinkCreated(data['node'], data['port'], node, port));
this.linksEventSource.created.emit(new MapLinkCreated(data['node'], data['port'], node, port));
} else {
this.drawingLineTool.start(node.x + node.width / 2., node.y + node.height / 2., {
'node': node,

View File

@ -7,4 +7,4 @@
</filter>
</svg>
<app-draw-link-tool *ngIf="drawLinkTool" (linkCreated)="linkCreated($event)"></app-draw-link-tool>
<app-draw-link-tool *ngIf="drawLinkTool"></app-draw-link-tool>

Before

(image error) Size: 271 B

After

(image error) Size: 235 B

View File

@ -12,21 +12,14 @@ import { InterfaceLabelWidget } from '../../widgets/interface-label';
import { SelectionTool } from '../../tools/selection-tool';
import { MovingTool } from '../../tools/moving-tool';
import { MapChangeDetectorRef } from '../../services/map-change-detector-ref';
import { LinkCreated } from '../../events/links';
import { CanvasSizeDetector } from '../../helpers/canvas-size-detector';
import { MapListeners } from '../../listeners/map-listeners';
import { DraggedDataEvent } from '../../events/event-source';
import { NodesEventSource } from '../../events/nodes-event-source';
import { DrawingsEventSource } from '../../events/drawings-event-source';
import { DrawingsWidget } from '../../widgets/drawings';
import { Node } from '../../models/node';
import { Link } from '../../../models/link';
import { Drawing } from '../../models/drawing';
import { Symbol } from '../../../models/symbol';
import { MapNodeToNodeConverter } from '../../converters/map/map-node-to-node-converter';
import { MapPortToPortConverter } from '../../converters/map/map-port-to-port-converter';
import { GraphDataManager } from '../../managers/graph-data-manager';
import { MapDrawingToDrawingConverter } from '../../converters/map/map-drawing-to-drawing-converter';
@Component({
@ -43,16 +36,10 @@ export class MapComponent implements OnInit, OnChanges, OnDestroy {
@Input() width = 1500;
@Input() height = 600;
@Output() nodeDragged = new EventEmitter<DraggedDataEvent<Node>>();
@Output() drawingDragged = new EventEmitter<DraggedDataEvent<Drawing>>();
@Output() onLinkCreated = new EventEmitter<LinkCreated>();
private parentNativeElement: any;
private svg: Selection<SVGSVGElement, any, null, undefined>;
private onChangesDetected: Subscription;
private nodeDraggedSub: Subscription;
private drawingDraggedSub: Subscription;
protected settings = {
'show_interface_labels': true
@ -64,9 +51,6 @@ export class MapComponent implements OnInit, OnChanges, OnDestroy {
private mapChangeDetectorRef: MapChangeDetectorRef,
private canvasSizeDetector: CanvasSizeDetector,
private mapListeners: MapListeners,
private mapNodeToNode: MapNodeToNodeConverter,
private mapPortToPort: MapPortToPortConverter,
private mapDrawingToDrawing: MapDrawingToDrawingConverter,
protected element: ElementRef,
protected nodesWidget: NodesWidget,
protected drawingsWidget: DrawingsWidget,
@ -74,8 +58,6 @@ export class MapComponent implements OnInit, OnChanges, OnDestroy {
protected selectionToolWidget: SelectionTool,
protected movingToolWidget: MovingTool,
public graphLayout: GraphLayout,
private nodesEventSource: NodesEventSource,
private drawingsEventSource: DrawingsEventSource,
) {
this.parentNativeElement = element.nativeElement;
}
@ -136,14 +118,6 @@ export class MapComponent implements OnInit, OnChanges, OnDestroy {
}
});
this.nodeDraggedSub = this.nodesEventSource.dragged.subscribe((evt) => {
this.nodeDragged.emit(new DraggedDataEvent<Node>(this.mapNodeToNode.convert(evt.datum), evt.dx, evt.dy));
});
this.drawingDraggedSub = this.drawingsEventSource.dragged.subscribe((evt) => {
this.drawingDragged.emit(new DraggedDataEvent<Drawing>(this.mapDrawingToDrawing.convert(evt.datum), evt.dx, evt.dy));
});
this.mapListeners.onInit(this.svg);
}
@ -151,8 +125,6 @@ export class MapComponent implements OnInit, OnChanges, OnDestroy {
this.graphLayout.disconnect(this.svg);
this.onChangesDetected.unsubscribe();
this.mapListeners.onDestroy();
this.nodeDraggedSub.unsubscribe();
this.drawingDraggedSub.unsubscribe();
}
public createGraph(domElement: HTMLElement) {
@ -167,17 +139,6 @@ export class MapComponent implements OnInit, OnChanges, OnDestroy {
return this.canvasSizeDetector.getOptimalSize(this.width, this.height);
}
protected linkCreated(evt) {
const linkCreated = new LinkCreated(
this.mapNodeToNode.convert(evt.sourceNode),
this.mapPortToPort.convert(evt.sourcePort),
this.mapNodeToNode.convert(evt.targetNode),
this.mapPortToPort.convert(evt.targetPort)
);
this.onLinkCreated.emit(linkCreated);
}
private changeLayout() {
if (this.parentNativeElement != null) {
this.context.size = this.getSize();

View File

@ -0,0 +1,8 @@
import { Injectable, EventEmitter } from "@angular/core";
import { MapLinkCreated } from "./links";
@Injectable()
export class LinksEventSource {
public created = new EventEmitter<MapLinkCreated>();
}

View File

@ -1,17 +1,15 @@
import { Port } from "../../models/port";
import { Node } from "../models/node";
import { MapNode } from "../models/map/map-node";
import { MapPort } from "../models/map/map-port";
export class LinkCreated {
constructor(
public sourceNode: Node,
public sourcePort: Port,
public targetNode: Node,
public targetPort: Port
) {}
}
// export class LinkCreated {
// constructor(
// public sourceNode: Node,
// public sourcePort: Port,
// public targetNode: Node,
// public targetPort: Port
// ) {}
// }
export class MapLinkCreated {
constructor(

View File

@ -11,9 +11,6 @@
[moving-tool]="tools.moving"
[draw-link-tool]="tools.draw_link"
[readonly]="inReadOnlyMode"
(nodeDragged)="onNodeDragged($event)"
(drawingDragged)="onDrawingDragged($event)"
(onLinkCreated)="onLinkCreated($event)"
></app-map>
<div class="project-toolbar">
<mat-toolbar color="primary" class="project-toolbar">

View File

@ -26,11 +26,17 @@ import { DrawingsDataSource } from "../../cartography/datasources/drawings-datas
import { ProgressService } from "../../common/progress/progress.service";
import { MapChangeDetectorRef } from '../../cartography/services/map-change-detector-ref';
import { NodeContextMenu } from '../../cartography/events/nodes';
import { LinkCreated } from '../../cartography/events/links';
import { MapLinkCreated } from '../../cartography/events/links';
import { NodeWidget } from '../../cartography/widgets/node';
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';
import { DrawingsEventSource } from '../../cartography/events/drawings-event-source';
import { MapNode } from '../../cartography/models/map/map-node';
import { LinksEventSource } from '../../cartography/events/links-event-source';
import { MapDrawing } from '../../cartography/models/map/map-drawing';
import { MapPortToPortConverter } from '../../cartography/converters/map/map-port-to-port-converter';
@Component({
@ -77,9 +83,13 @@ export class ProjectMapComponent implements OnInit, OnDestroy {
private mapChangeDetectorRef: MapChangeDetectorRef,
private nodeWidget: NodeWidget,
private mapNodeToNode: MapNodeToNodeConverter,
protected nodesDataSource: NodesDataSource,
protected linksDataSource: LinksDataSource,
protected drawingsDataSource: DrawingsDataSource,
private mapPortToPort: MapPortToPortConverter,
private nodesDataSource: NodesDataSource,
private linksDataSource: LinksDataSource,
private drawingsDataSource: DrawingsDataSource,
private nodesEventSource: NodesEventSource,
private drawingsEventSource: DrawingsEventSource,
private linksEventSource: LinksEventSource
) {}
ngOnInit() {
@ -145,6 +155,18 @@ export class ProjectMapComponent implements OnInit, OnDestroy {
this.mapChangeDetectorRef.detectChanges();
})
);
this.subscriptions.push(
this.nodesEventSource.dragged.subscribe((evt) => this.onNodeDragged(evt))
);
this.subscriptions.push(
this.drawingsEventSource.dragged.subscribe((evt) => this.onDrawingDragged(evt))
);
this.subscriptions.push(
this.linksEventSource.created.subscribe((evt) => this.onLinkCreated(evt))
);
}
onProjectLoad(project: Project) {
@ -211,8 +233,8 @@ export class ProjectMapComponent implements OnInit, OnDestroy {
});
}
onNodeDragged(draggedEvent: DraggedDataEvent<Node>) {
const node = this.nodesDataSource.get(draggedEvent.datum.node_id);
private onNodeDragged(draggedEvent: DraggedDataEvent<MapNode>) {
const node = this.nodesDataSource.get(draggedEvent.datum.id);
node.x += draggedEvent.dx;
node.y += draggedEvent.dy;
@ -223,8 +245,8 @@ export class ProjectMapComponent implements OnInit, OnDestroy {
});
}
onDrawingDragged(draggedEvent: DraggedDataEvent<Drawing>) {
const drawing = this.drawingsDataSource.get(draggedEvent.datum.drawing_id);
private onDrawingDragged(draggedEvent: DraggedDataEvent<MapDrawing>) {
const drawing = this.drawingsDataSource.get(draggedEvent.datum.id);
drawing.x += draggedEvent.dx;
drawing.y += draggedEvent.dy;
@ -235,6 +257,21 @@ export class ProjectMapComponent implements OnInit, OnDestroy {
});
}
private onLinkCreated(linkCreated: MapLinkCreated) {
const sourceNode = this.mapNodeToNode.convert(linkCreated.sourceNode);
const sourcePort = this.mapPortToPort.convert(linkCreated.sourcePort);
const targetNode = this.mapNodeToNode.convert(linkCreated.targetNode);
const targetPort = this.mapPortToPort.convert(linkCreated.targetPort);
this.linkService
.createLink(this.server, sourceNode, sourcePort, targetNode, targetPort)
.subscribe(() => {
this.projectService.links(this.server, this.project.project_id).subscribe((links: Link[]) => {
this.linksDataSource.set(links);
});
});
}
public set readonly(value) {
this.inReadOnlyMode = value;
if (value) {
@ -259,16 +296,6 @@ export class ProjectMapComponent implements OnInit, OnDestroy {
this.tools.draw_link = !this.tools.draw_link;
}
public onLinkCreated(linkCreated: LinkCreated) {
this.linkService
.createLink(this.server, linkCreated.sourceNode, linkCreated.sourcePort, linkCreated.targetNode, linkCreated.targetPort)
.subscribe(() => {
this.projectService.links(this.server, this.project.project_id).subscribe((links: Link[]) => {
this.linksDataSource.set(links);
});
});
}
public toggleShowInterfaceLabels(enabled: boolean) {
this.project.show_interface_labels = enabled;
}