From 6b804fa525c985c80f92acd231062cc43a26553f Mon Sep 17 00:00:00 2001 From: Piotr Pekala Date: Thu, 24 Oct 2019 07:34:01 -0700 Subject: [PATCH] Snap to grid for nodes applied --- .../drawing-dragged.component.ts | 4 +++- .../node-dragged/node-dragged.component.ts | 4 +++- .../project-map/project-map.component.html | 4 ++-- src/app/services/drawing.service.ts | 14 +++++++++++--- src/app/services/node.service.ts | 17 ++++++++++++++--- 5 files changed, 33 insertions(+), 10 deletions(-) diff --git a/src/app/components/drawings-listeners/drawing-dragged/drawing-dragged.component.ts b/src/app/components/drawings-listeners/drawing-dragged/drawing-dragged.component.ts index 14dccf64..2050a031 100644 --- a/src/app/components/drawings-listeners/drawing-dragged/drawing-dragged.component.ts +++ b/src/app/components/drawings-listeners/drawing-dragged/drawing-dragged.component.ts @@ -7,6 +7,7 @@ import { DraggedDataEvent } from '../../../cartography/events/event-source'; import { MapDrawing } from '../../../cartography/models/map/map-drawing'; import { Drawing } from '../../../cartography/models/drawing'; import { DrawingsEventSource } from '../../../cartography/events/drawings-event-source'; +import { Project } from '../../../models/project'; @Component({ selector: 'app-drawing-dragged', @@ -15,6 +16,7 @@ import { DrawingsEventSource } from '../../../cartography/events/drawings-event- }) export class DrawingDraggedComponent implements OnInit, OnDestroy { @Input() server: Server; + @Input() project: Project; private drawingDragged: Subscription; constructor( @@ -33,7 +35,7 @@ export class DrawingDraggedComponent implements OnInit, OnDestroy { drawing.y += draggedEvent.dy; this.drawingService - .updatePosition(this.server, drawing, drawing.x, drawing.y) + .updatePosition(this.server, this.project, drawing, drawing.x, drawing.y) .subscribe((serverDrawing: Drawing) => { this.drawingsDataSource.update(serverDrawing); }); diff --git a/src/app/components/drawings-listeners/node-dragged/node-dragged.component.ts b/src/app/components/drawings-listeners/node-dragged/node-dragged.component.ts index 8c976075..695c46c7 100644 --- a/src/app/components/drawings-listeners/node-dragged/node-dragged.component.ts +++ b/src/app/components/drawings-listeners/node-dragged/node-dragged.component.ts @@ -7,6 +7,7 @@ import { Server } from '../../../models/server'; import { NodesEventSource } from '../../../cartography/events/nodes-event-source'; import { MapNode } from '../../../cartography/models/map/map-node'; import { Subscription } from 'rxjs'; +import { Project } from '../../../models/project'; @Component({ selector: 'app-node-dragged', @@ -15,6 +16,7 @@ import { Subscription } from 'rxjs'; }) export class NodeDraggedComponent implements OnInit, OnDestroy { @Input() server: Server; + @Input() project: Project private nodeDragged: Subscription; constructor( @@ -32,7 +34,7 @@ export class NodeDraggedComponent implements OnInit, OnDestroy { node.x += draggedEvent.dx; node.y += draggedEvent.dy; - this.nodeService.updatePosition(this.server, node, node.x, node.y).subscribe((serverNode: Node) => { + this.nodeService.updatePosition(this.server, this.project, node, node.x, node.y).subscribe((serverNode: Node) => { this.nodesDataSource.update(serverNode); }); } diff --git a/src/app/components/project-map/project-map.component.html b/src/app/components/project-map/project-map.component.html index 5db22022..9ef53af4 100644 --- a/src/app/components/project-map/project-map.component.html +++ b/src/app/components/project-map/project-map.component.html @@ -158,11 +158,11 @@ - + - + diff --git a/src/app/services/drawing.service.ts b/src/app/services/drawing.service.ts index 5542fbd9..cb440fd9 100644 --- a/src/app/services/drawing.service.ts +++ b/src/app/services/drawing.service.ts @@ -5,6 +5,7 @@ import { Observable } from 'rxjs'; import 'rxjs/add/operator/map'; import { Server } from '../models/server'; import { HttpServer } from './http-server.service'; +import { Project } from '../models/project'; @Injectable() export class DrawingService { @@ -29,10 +30,17 @@ export class DrawingService { }); } - updatePosition(server: Server, drawing: Drawing, x: number, y: number): Observable { + updatePosition(server: Server, project: Project, drawing: Drawing, x: number, y: number): Observable { + let xPosition: number = Math.round(x); + let yPosition: number = Math.round(y); + + if (project.snap_to_grid) { + + } + return this.httpServer.put(server, `/projects/${drawing.project_id}/drawings/${drawing.drawing_id}`, { - x: Math.round(x), - y: Math.round(y) + x: xPosition, + y: yPosition }); } diff --git a/src/app/services/node.service.ts b/src/app/services/node.service.ts index 8de3b672..8808f03a 100644 --- a/src/app/services/node.service.ts +++ b/src/app/services/node.service.ts @@ -53,10 +53,21 @@ export class NodeService { }); } - updatePosition(server: Server, node: Node, x: number, y: number): Observable { + updatePosition(server: Server, project: Project, node: Node, x: number, y: number): Observable { + let xPosition: number = Math.round(x); + let yPosition: number = Math.round(y); + + if (project.snap_to_grid) { + xPosition = Math.round(xPosition / project.grid_size) * project.grid_size; + yPosition = Math.round(yPosition / project.grid_size) * project.grid_size; + + xPosition = Math.round(xPosition - node.width/2); + yPosition = Math.round(yPosition - node.height/2); + } + return this.httpServer.put(server, `/projects/${node.project_id}/nodes/${node.node_id}`, { - x: Math.round(x), - y: Math.round(y) + x: xPosition, + y: yPosition }); }