From 5269a5f40029b28cb9f85a4eae02c666c78acdb1 Mon Sep 17 00:00:00 2001
From: rhenck <richard.henck@iqb.hu-berlin.de>
Date: Fri, 17 Dec 2021 15:11:15 +0100
Subject: [PATCH] [editor] Fix element alignment
- Move the method to the unit service, so the proper
updateElementProperty method can be used.
- Also improve the logic, reducing variables.
---
projects/common/models/section.ts | 31 -----------------
.../element-sizing-properties.component.ts | 2 +-
.../editor/src/app/services/unit.service.ts | 34 +++++++++++++++++--
3 files changed, 33 insertions(+), 34 deletions(-)
diff --git a/projects/common/models/section.ts b/projects/common/models/section.ts
index e5edf3c99..756515f75 100644
--- a/projects/common/models/section.ts
+++ b/projects/common/models/section.ts
@@ -47,35 +47,4 @@ export class Section {
element.positionProps.dynamicPositioning = value;
});
}
-
- static alignElements(elements: PositionedElement[], alignmentDirection: 'left' | 'right' | 'top' | 'bottom'): void {
- let newValue: number;
- switch (alignmentDirection) {
- case 'left':
- newValue = Math.min(...elements.map(element => element.positionProps.xPosition));
- elements.forEach((element: UIElement) => {
- element.xPosition = newValue;
- });
- break;
- case 'right':
- newValue = Math.max(...elements.map(element => element.positionProps.xPosition + element.width));
- elements.forEach((element: UIElement) => {
- element.xPosition = newValue - element.width;
- });
- break;
- case 'top':
- newValue = Math.min(...elements.map(element => element.positionProps.yPosition));
- elements.forEach((element: UIElement) => {
- element.yPosition = newValue;
- });
- break;
- case 'bottom':
- newValue = Math.max(...elements.map(element => element.positionProps.yPosition + element.height));
- elements.forEach((element: UIElement) => {
- element.yPosition = newValue - element.height;
- });
- break;
- // no default
- }
- }
}
diff --git a/projects/editor/src/app/components/unit-view/page-view/properties-panel/element-sizing-properties.component.ts b/projects/editor/src/app/components/unit-view/page-view/properties-panel/element-sizing-properties.component.ts
index a18a1981b..bb15abac8 100644
--- a/projects/editor/src/app/components/unit-view/page-view/properties-panel/element-sizing-properties.component.ts
+++ b/projects/editor/src/app/components/unit-view/page-view/properties-panel/element-sizing-properties.component.ts
@@ -200,6 +200,6 @@ export class ElementSizingPropertiesComponent {
constructor(private unitService: UnitService, public selectionService: SelectionService) { }
alignElements(direction: 'left' | 'right' | 'top' | 'bottom'): void {
- this.unitService.alignElements(this.selectionService.getSelectedElements(), direction);
+ this.unitService.alignElements(this.selectionService.getSelectedElements() as PositionedElement[], direction);
}
}
diff --git a/projects/editor/src/app/services/unit.service.ts b/projects/editor/src/app/services/unit.service.ts
index d37fcd65b..f1c2acd1d 100644
--- a/projects/editor/src/app/services/unit.service.ts
+++ b/projects/editor/src/app/services/unit.service.ts
@@ -354,8 +354,38 @@ export class UnitService {
);
}
- alignElements(elements: UIElement[], alignmentDirection: 'left' | 'right' | 'top' | 'bottom'): void {
- Section.alignElements(elements as PositionedElement[], alignmentDirection);
+ alignElements(elements: PositionedElement[], alignmentDirection: 'left' | 'right' | 'top' | 'bottom'): void {
+ switch (alignmentDirection) {
+ case 'left':
+ this.updateElementProperty(
+ elements,
+ 'xPosition',
+ Math.min(...elements.map(element => element.positionProps.xPosition))
+ );
+ break;
+ case 'right':
+ this.updateElementProperty(
+ elements,
+ 'xPosition',
+ Math.max(...elements.map(element => element.positionProps.xPosition))
+ );
+ break;
+ case 'top':
+ this.updateElementProperty(
+ elements,
+ 'yPosition',
+ Math.min(...elements.map(element => element.positionProps.yPosition))
+ );
+ break;
+ case 'bottom':
+ this.updateElementProperty(
+ elements,
+ 'yPosition',
+ Math.max(...elements.map(element => element.positionProps.yPosition))
+ );
+ break;
+ // no default
+ }
this.elementPropertyUpdated.next();
this.veronaApiService.sendVoeDefinitionChangedNotification();
}
--
GitLab