Fix for moving tool

This commit is contained in:
Piotr Pekala 2019-02-27 01:44:26 -08:00
parent cc9a3a288c
commit a2d81b75b4
4 changed files with 23 additions and 23 deletions

View File

@ -25,8 +25,8 @@ export class DrawingAddingComponent implements OnInit, OnDestroy {
activate() { activate() {
let listener = (event: MouseEvent) => { let listener = (event: MouseEvent) => {
let x = event.pageX - this.context.getZeroZeroTransformationPoint().x; let x = event.pageX - (this.context.getZeroZeroTransformationPoint().x + this.context.transformation.x);
let y = event.pageY - this.context.getZeroZeroTransformationPoint().y; let y = event.pageY - (this.context.getZeroZeroTransformationPoint().y + this.context.transformation.y);
this.drawingsEventSource.pointToAddSelected.emit(new AddedDataEvent(x, y)); this.drawingsEventSource.pointToAddSelected.emit(new AddedDataEvent(x, y));
this.deactivate(); this.deactivate();

View File

@ -54,8 +54,8 @@ export class TextEditorComponent implements OnInit, OnDestroy {
this.drawingsEventSource.textAdded.emit( this.drawingsEventSource.textAdded.emit(
new TextAddedDataEvent( new TextAddedDataEvent(
this.temporaryTextElement.nativeElement.innerText.replace(/\n$/, ''), this.temporaryTextElement.nativeElement.innerText.replace(/\n$/, ''),
event.pageX, event.pageX - this.context.transformation.x,
event.pageY event.pageY - this.context.transformation.y
) )
); );
this.deactivateTextAdding(); this.deactivateTextAdding();
@ -92,8 +92,8 @@ export class TextEditorComponent implements OnInit, OnDestroy {
this.editingDrawingId = textElements[index].parentElement.parentElement.getAttribute('drawing_id'); this.editingDrawingId = textElements[index].parentElement.parentElement.getAttribute('drawing_id');
var transformData = textElements[index].parentElement.getAttribute('transform').split(/\(|\)/); var transformData = textElements[index].parentElement.getAttribute('transform').split(/\(|\)/);
var x = Number(transformData[1].split(/,/)[0]) + this.context.getZeroZeroTransformationPoint().x; var x = Number(transformData[1].split(/,/)[0]) + this.context.getZeroZeroTransformationPoint().x + this.context.transformation.x;
var y = Number(transformData[1].split(/,/)[1]) + this.context.getZeroZeroTransformationPoint().y; var y = Number(transformData[1].split(/,/)[1]) + this.context.getZeroZeroTransformationPoint().y + this.context.transformation.y;
this.leftPosition = x.toString() + 'px'; this.leftPosition = x.toString() + 'px';
this.topPosition = y.toString() + 'px'; this.topPosition = y.toString() + 'px';
this.temporaryTextElement.nativeElement.innerText = elem.text; this.temporaryTextElement.nativeElement.innerText = elem.text;

View File

@ -111,15 +111,15 @@ export class DrawingsWidget implements Widget {
} }
} }
} else { } else {
dy = y - (evt.sourceEvent.pageY - this.context.getZeroZeroTransformationPoint().y); dy = y - (evt.sourceEvent.pageY - (this.context.getZeroZeroTransformationPoint().y + this.context.transformation.y));
y = evt.sourceEvent.pageY - this.context.getZeroZeroTransformationPoint().y; y = evt.sourceEvent.pageY - (this.context.getZeroZeroTransformationPoint().y + this.context.transformation.y);
if (datum.element.height + dy < 0) { if (datum.element.height + dy < 0) {
isReflectedVertical = false; isReflectedVertical = false;
y = topEdge; y = topEdge;
datum.element.height = Math.abs(datum.element.height + evt.dy); datum.element.height = Math.abs(datum.element.height + evt.dy);
} else { } else {
datum.y = evt.sourceEvent.pageY - this.context.getZeroZeroTransformationPoint().y; datum.y = evt.sourceEvent.pageY - (this.context.getZeroZeroTransformationPoint().y + this.context.transformation.y);
datum.element.height += dy; datum.element.height += dy;
if (datum.element instanceof EllipseElement) { if (datum.element instanceof EllipseElement) {
(datum.element as EllipseElement).cy = (datum.element as EllipseElement).cy =
@ -143,7 +143,7 @@ export class DrawingsWidget implements Widget {
let top = drag() let top = drag()
.on('start', (datum: MapDrawing) => { .on('start', (datum: MapDrawing) => {
y = event.sourceEvent.pageY - this.context.getZeroZeroTransformationPoint().y; y = event.sourceEvent.pageY - (this.context.getZeroZeroTransformationPoint().y + this.context.transformation.y);
bottomEdge = y + datum.element.height; bottomEdge = y + datum.element.height;
document.body.style.cursor = 'ns-resize'; document.body.style.cursor = 'ns-resize';
}) })
@ -151,15 +151,15 @@ export class DrawingsWidget implements Widget {
const evt = event; const evt = event;
if (!isReflectedVertical) { if (!isReflectedVertical) {
dy = y - (evt.sourceEvent.pageY - this.context.getZeroZeroTransformationPoint().y); dy = y - (evt.sourceEvent.pageY - (this.context.getZeroZeroTransformationPoint().y + this.context.transformation.y));
y = evt.sourceEvent.pageY - this.context.getZeroZeroTransformationPoint().y; y = evt.sourceEvent.pageY - (this.context.getZeroZeroTransformationPoint().y + this.context.transformation.y);
if (datum.element.height + dy < 0) { if (datum.element.height + dy < 0) {
y = bottomEdge; y = bottomEdge;
isReflectedVertical = true; isReflectedVertical = true;
datum.element.height = Math.abs(datum.element.height + evt.dy); datum.element.height = Math.abs(datum.element.height + evt.dy);
} else { } else {
datum.y = evt.sourceEvent.pageY - this.context.getZeroZeroTransformationPoint().y; datum.y = evt.sourceEvent.pageY - (this.context.getZeroZeroTransformationPoint().y + this.context.transformation.y);
datum.element.height += dy; datum.element.height += dy;
if (datum.element instanceof EllipseElement) { if (datum.element instanceof EllipseElement) {
(datum.element as EllipseElement).cy = (datum.element as EllipseElement).cy =
@ -207,7 +207,7 @@ export class DrawingsWidget implements Widget {
let isReflectedHorizontal: boolean = false; let isReflectedHorizontal: boolean = false;
let right = drag() let right = drag()
.on('start', (datum: MapDrawing) => { .on('start', (datum: MapDrawing) => {
x = event.sourceEvent.pageX - this.context.getZeroZeroTransformationPoint().x; x = event.sourceEvent.pageX - (this.context.getZeroZeroTransformationPoint().x + this.context.transformation.x);
leftEdge = x + datum.element.width; leftEdge = x + datum.element.width;
document.body.style.cursor = 'ew-resize'; document.body.style.cursor = 'ew-resize';
}) })
@ -215,15 +215,15 @@ export class DrawingsWidget implements Widget {
const evt = event; const evt = event;
if (!isReflectedHorizontal) { if (!isReflectedHorizontal) {
dx = x - (evt.sourceEvent.pageX - this.context.getZeroZeroTransformationPoint().x); dx = x - (evt.sourceEvent.pageX - (this.context.getZeroZeroTransformationPoint().x + this.context.transformation.x));
x = evt.sourceEvent.pageX - this.context.getZeroZeroTransformationPoint().x; x = evt.sourceEvent.pageX - (this.context.getZeroZeroTransformationPoint().x + this.context.transformation.x);
if (datum.element.width + dx < 0) { if (datum.element.width + dx < 0) {
x = leftEdge; x = leftEdge;
isReflectedHorizontal = true; isReflectedHorizontal = true;
datum.element.width = Math.abs(datum.element.width + evt.dx); datum.element.width = Math.abs(datum.element.width + evt.dx);
} else { } else {
datum.x = evt.sourceEvent.pageX - this.context.getZeroZeroTransformationPoint().x; datum.x = evt.sourceEvent.pageX - (this.context.getZeroZeroTransformationPoint().x + this.context.transformation.x);
datum.element.width += dx; datum.element.width += dx;
if (datum.element instanceof EllipseElement) { if (datum.element instanceof EllipseElement) {
(datum.element as EllipseElement).cx = (datum.element as EllipseElement).cx =
@ -290,15 +290,15 @@ export class DrawingsWidget implements Widget {
datum.element.width = datum.element.width + evt.dx < 0 ? 1 : (datum.element.width += evt.dx); datum.element.width = datum.element.width + evt.dx < 0 ? 1 : (datum.element.width += evt.dx);
} }
} else { } else {
dx = x - (evt.sourceEvent.pageX - this.context.getZeroZeroTransformationPoint().x); dx = x - (evt.sourceEvent.pageX - (this.context.getZeroZeroTransformationPoint().x + this.context.transformation.x));
x = evt.sourceEvent.pageX - this.context.getZeroZeroTransformationPoint().x; x = evt.sourceEvent.pageX - (this.context.getZeroZeroTransformationPoint().x + this.context.transformation.x);
if (datum.element.width + dx < 0) { if (datum.element.width + dx < 0) {
x = rightEdge; x = rightEdge;
isReflectedHorizontal = false; isReflectedHorizontal = false;
datum.element.width = Math.abs(datum.element.width + evt.dx); datum.element.width = Math.abs(datum.element.width + evt.dx);
} else { } else {
datum.x = evt.sourceEvent.pageX - this.context.getZeroZeroTransformationPoint().x; datum.x = evt.sourceEvent.pageX - (this.context.getZeroZeroTransformationPoint().x + this.context.transformation.x);
datum.element.width += dx; datum.element.width += dx;
if (datum.element instanceof EllipseElement) { if (datum.element instanceof EllipseElement) {
(datum.element as EllipseElement).cx = (datum.element as EllipseElement).cx =

View File

@ -37,15 +37,15 @@
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<mat-header-cell *matHeaderCellDef> Actions </mat-header-cell> <mat-header-cell *matHeaderCellDef> Actions </mat-header-cell>
<mat-cell *matCellDef="let row" style="text-align: right"> <mat-cell *matCellDef="let row" style="text-align: right">
<button mat-icon-button matTooltip="Delete project" (click)="delete(row)" *ngIf="row.status == 'closed'">
<mat-icon aria-label="Delete project">delete</mat-icon>
</button>
<button mat-icon-button matTooltip="Open project" (click)="open(row)" *ngIf="row.status == 'closed'"> <button mat-icon-button matTooltip="Open project" (click)="open(row)" *ngIf="row.status == 'closed'">
<mat-icon aria-label="Open project">play_arrow</mat-icon> <mat-icon aria-label="Open project">play_arrow</mat-icon>
</button> </button>
<button mat-icon-button matTooltip="Close project" (click)="close(row)" *ngIf="row.status == 'opened'"> <button mat-icon-button matTooltip="Close project" (click)="close(row)" *ngIf="row.status == 'opened'">
<mat-icon aria-label="Close project">pause</mat-icon> <mat-icon aria-label="Close project">pause</mat-icon>
</button> </button>
<button mat-icon-button matTooltip="Delete project" (click)="delete(row)" *ngIf="row.status == 'closed'">
<mat-icon aria-label="Open project">delete</mat-icon>
</button>
</mat-cell> </mat-cell>
</ng-container> </ng-container>