From 753dec0f00447d0f48e44cef03e2ea2ff0996319 Mon Sep 17 00:00:00 2001
From: rhenck <richard.henck@iqb.hu-berlin.de>
Date: Mon, 16 Aug 2021 20:22:13 +0200
Subject: [PATCH] [editor] Add logic to prohibit section widths bigger than
their page's
---
.../canvas/page-canvas.component.html | 2 +-
.../section-properties.component.ts | 25 ++++++++++++++++---
2 files changed, 23 insertions(+), 4 deletions(-)
diff --git a/projects/editor/src/app/components/unit-view/page-view/canvas/page-canvas.component.html b/projects/editor/src/app/components/unit-view/page-view/canvas/page-canvas.component.html
index 58eca749e..fd12230d3 100644
--- a/projects/editor/src/app/components/unit-view/page-view/canvas/page-canvas.component.html
+++ b/projects/editor/src/app/components/unit-view/page-view/canvas/page-canvas.component.html
@@ -1,5 +1,5 @@
<div class="canvasBackground" fxFlex>
- <div class="canvasFrame"
+ <div class="canvasFrame" [style.width.px]="page.width"
[style.padding.px]="page.margin"
[style.background-color]="page.backgroundColor">
<div cdkDropListGroup class="section-list">
diff --git a/projects/editor/src/app/components/unit-view/page-view/properties/section-properties.component.ts b/projects/editor/src/app/components/unit-view/page-view/properties/section-properties.component.ts
index 28723ba9a..e411f82c1 100644
--- a/projects/editor/src/app/components/unit-view/page-view/properties/section-properties.component.ts
+++ b/projects/editor/src/app/components/unit-view/page-view/properties/section-properties.component.ts
@@ -2,10 +2,11 @@ import {
Component, OnDestroy, OnInit
} from '@angular/core';
import { Subject } from 'rxjs';
-import { takeUntil } from 'rxjs/operators';
-import { UnitPageSection } from '../../../../../../../common/unit';
+import { take, takeUntil } from 'rxjs/operators';
+import { UnitPage, UnitPageSection } from '../../../../../../../common/unit';
import { UnitService } from '../../../../unit.service';
import { SelectionService } from '../../../../selection.service';
+import { MessageService } from '../../../../../../../common/message.service';
// TODO besseres Layout for grid Spalten und Zeilen. Versuch auskommentiert, weil buggy.
@@ -118,7 +119,9 @@ export class SectionPropertiesComponent implements OnInit, OnDestroy {
selectedPageSection!: UnitPageSection;
private ngUnsubscribe = new Subject<void>();
- constructor(public selectionService: SelectionService, public unitService: UnitService) { }
+ constructor(public selectionService: SelectionService,
+ public unitService: UnitService,
+ protected messageService: MessageService) { }
ngOnInit(): void {
this.selectionService.selectedPageSection
@@ -128,6 +131,22 @@ export class SectionPropertiesComponent implements OnInit, OnDestroy {
});
}
+ updateModel(property: string, value: string | number | boolean): void {
+ let selectedPage: UnitPage;
+ this.selectionService.selectedPage
+ .pipe(take(1))
+ .subscribe(_selectedPage => {
+ selectedPage = _selectedPage;
+ })
+ .unsubscribe();
+
+ if (property === 'width' && value > selectedPage!.width) {
+ this.messageService.showError('Darf nicht breiter als die Seite sein.');
+ } else {
+ this.unitService.updateSectionProperty(this.selectedPageSection, property, value);
+ }
+ }
+
ngOnDestroy(): void {
this.ngUnsubscribe.next();
this.ngUnsubscribe.complete();
--
GitLab