diff --git a/projects/editor/src/app/components/unit-view/unit-view.component.ts b/projects/editor/src/app/components/unit-view/unit-view.component.ts index db225677ab8e502c06d62f6b991f9d606e1091ed..16016ba8ef18ec7e31f4bc4dc549075b9fbcaeb5 100644 --- a/projects/editor/src/app/components/unit-view/unit-view.component.ts +++ b/projects/editor/src/app/components/unit-view/unit-view.component.ts @@ -1,6 +1,6 @@ // eslint-disable-next-line max-classes-per-file import { - AfterViewInit, Component, OnDestroy, OnInit, ViewChild + Component, OnDestroy, OnInit, ViewChild } from '@angular/core'; import { Subscription } from 'rxjs'; import { MatTabGroup } from '@angular/material/tabs'; @@ -21,11 +21,10 @@ import { Unit } from '../../../../../common/unit'; '.show-properties-button span {transform: rotate(90deg); display: inherit;}' ] }) -export class UnitViewComponent implements OnInit, OnDestroy, AfterViewInit { +export class UnitViewComponent implements OnInit, OnDestroy { @ViewChild(MatTabGroup) tabGroup!: MatTabGroup; unit!: Unit; unitSubscription!: Subscription; - selectedPageIndexSubscription!: Subscription; constructor(public unitService: UnitService, public dialog: MatDialog) { } @@ -35,19 +34,13 @@ export class UnitViewComponent implements OnInit, OnDestroy, AfterViewInit { }); } - ngAfterViewInit(): void { - this.selectedPageIndexSubscription = this.unitService.selectedPageIndex.subscribe((index: number) => { - this.tabGroup.selectedIndex = index; - }); - } - selectTab(): void { // eslint-disable-next-line @typescript-eslint/no-non-null-assertion this.unitService.switchPage(this.tabGroup.selectedIndex!); } addPage(): void { - this.unitService.addPage(); + this.tabGroup.selectedIndex = this.unitService.addPage(); } deletePage(): void { @@ -59,14 +52,13 @@ export class UnitViewComponent implements OnInit, OnDestroy, AfterViewInit { dialogRef.afterClosed().subscribe((result: boolean) => { if (result) { // eslint-disable-next-line @typescript-eslint/no-non-null-assertion - this.unitService.deletePage(this.tabGroup.selectedIndex!); + this.tabGroup.selectedIndex = this.unitService.deletePage(this.tabGroup.selectedIndex!); } }); } ngOnDestroy(): void { this.unitSubscription.unsubscribe(); - this.selectedPageIndexSubscription.unsubscribe(); } } diff --git a/projects/editor/src/app/unit.service.ts b/projects/editor/src/app/unit.service.ts index e4f467504c69460c42b17941f1c9684adb83f88e..a1f92fd9d8ba96df70f3cdde3ea35f0aeb65ddd8 100644 --- a/projects/editor/src/app/unit.service.ts +++ b/projects/editor/src/app/unit.service.ts @@ -14,9 +14,10 @@ import { IdService } from './id.service'; providedIn: 'root' }) export class UnitService { + private selectedPageIndex: number = 0; + private _unit: BehaviorSubject<Unit>; private _pages: BehaviorSubject<UnitPage>[]; - private _selectedPageIndex: BehaviorSubject<number>; private _selectedPageSectionIndex: BehaviorSubject<number>; private _selectedElements: BehaviorSubject<UnitUIElement[]>; @@ -30,7 +31,6 @@ export class UnitService { initialPage.sections.push(initialSection); this._unit.getValue().pages.push(initialPage); this._pages = [new BehaviorSubject(initialPage as UnitPage)]; - this._selectedPageIndex = new BehaviorSubject<number>(0); this._selectedPageSectionIndex = new BehaviorSubject<number>(0); this._selectedElements = new BehaviorSubject<UnitUIElement[]>([]); @@ -41,10 +41,6 @@ export class UnitService { return this._unit.asObservable(); } - get selectedPageIndex(): Observable<number> { - return this._selectedPageIndex.asObservable(); - } - get selectedPageSectionIndex(): Observable<number> { return this._selectedPageSectionIndex.asObservable(); } @@ -61,40 +57,47 @@ export class UnitService { return this._selectedElements.value; } - addPage(): void { + getSelectedPageSection(): UnitPageSection { + return this._unit.value.pages[this.selectedPageIndex].sections[this._selectedPageSectionIndex.value]; + } + + /** returns new last index */ + addPage(): number { const newPage = UnitFactory.createUnitPage(); newPage.sections.push(UnitFactory.createUnitPageSection()); this._unit.value.pages.push(newPage); this._pages.push(new BehaviorSubject(newPage as UnitPage)); this._unit.next(this._unit.value); - this._selectedPageIndex.next(this._unit.value.pages.length - 1); + return this._unit.value.pages.length - 1; } - deletePage(index: number):void { + /** returns active/new index */ + deletePage(index: number): number { this._unit.value.pages.splice(index, 1); this._unit.next(this._unit.value); this._pages.splice(index, 1); - if (index === this._selectedPageIndex.value) { - this._selectedPageIndex.next(this._selectedPageIndex.value - 1); + if (index === this.selectedPageIndex) { + return this.selectedPageIndex - 1; } + return this.selectedPageIndex; } addSection(): void { const newSection = UnitFactory.createUnitPageSection(); - this._unit.value.pages[this._selectedPageIndex.value].sections.push(newSection); + this._unit.value.pages[this.selectedPageIndex].sections.push(newSection); this._unit.next(this._unit.value); - this._pages[this._selectedPageIndex.value].next(this._unit.value.pages[this._selectedPageIndex.value]); // TODO auslagern? + this._pages[this.selectedPageIndex].next(this._unit.value.pages[this.selectedPageIndex]); // TODO auslagern? } deleteSection(): void { - if (this._unit.value.pages[this._selectedPageIndex.value].sections.length < 2) { + if (this._unit.value.pages[this.selectedPageIndex].sections.length < 2) { this.messageService.showWarning('cant delete last section'); } else { const index = this._selectedPageSectionIndex.value; - this._unit.value.pages[this._selectedPageIndex.value].sections.splice(index, 1); + this._unit.value.pages[this.selectedPageIndex].sections.splice(index, 1); this._unit.next(this._unit.value); - this._pages[this._selectedPageIndex.value].next(this._unit.value.pages[this._selectedPageIndex.value]); + this._pages[this.selectedPageIndex].next(this._unit.value.pages[this.selectedPageIndex]); if (this._selectedPageSectionIndex.value > 0) { this._selectedPageSectionIndex.next(this._selectedPageSectionIndex.value - 1); } @@ -138,14 +141,13 @@ export class UnitService { throw new Error(`ElementType ${elementType} not found!`); } newElement.id = this.idService.getNewID(elementType); - this._unit.value.pages[this._selectedPageIndex.value] + this._unit.value.pages[this.selectedPageIndex] .sections[this._selectedPageSectionIndex.value].elements.push(newElement!); - this._pages[this._selectedPageIndex.value].next(this._unit.value.pages[this._selectedPageIndex.value]); + this._pages[this.selectedPageIndex].next(this._unit.value.pages[this.selectedPageIndex]); } switchPage(selectedIndex: number): void { - this._selectedPageIndex.next(selectedIndex); this.clearSelectedElements(); this.pageSwitch.next(selectedIndex); } @@ -183,12 +185,12 @@ export class UnitService { } deleteSelectedElements(): void { - const oldElements = this._unit.value.pages[this._selectedPageIndex.value] + const oldElements = this._unit.value.pages[this.selectedPageIndex] .sections[this._selectedPageSectionIndex.value].elements; - this._unit.value.pages[this._selectedPageIndex.value] + this._unit.value.pages[this.selectedPageIndex] .sections[this._selectedPageSectionIndex.value].elements = oldElements.filter(element => !this._selectedElements.value.includes(element)); - this._pages[this._selectedPageIndex.value].next(this._unit.value.pages[this._selectedPageIndex.value]); + this._pages[this.selectedPageIndex].next(this._unit.value.pages[this.selectedPageIndex]); } getUnitAsJSON(): string { @@ -203,7 +205,7 @@ export class UnitService { async loadUnit(): Promise<void> { const unitJSON = await FileService.loadFile(['.json']); const newUnit = JSON.parse(unitJSON); - this._selectedPageIndex.next(0); + this.selectedPageIndex = 0; this._unit.next(newUnit); this._pages = []; this._unit.value.pages.forEach((page: UnitPage) => {