diff --git a/projects/editor/src/app/components/canvas/section-menu.component.ts b/projects/editor/src/app/components/canvas/section-menu.component.ts index 4a904ea5c7144b09ee84492f083dd3c10864b8cc..3155ba6d6295390805e2f147242b9ef4dcc67e1c 100644 --- a/projects/editor/src/app/components/canvas/section-menu.component.ts +++ b/projects/editor/src/app/components/canvas/section-menu.component.ts @@ -135,7 +135,7 @@ import { SectionService } from 'editor/src/app/services/unit-services/section.se </mat-menu> <button mat-mini-fab [matTooltip]="'Abschnitt kopieren'" [matTooltipPosition]="'left'" - (click)="copySectionToClipboard()"> + (click)="copySection()"> <mat-icon>content_copy</mat-icon> </button> <button mat-mini-fab @@ -264,6 +264,11 @@ export class SectionMenuComponent implements OnDestroy { this.ngUnsubscribe.complete(); } + copySection() { + this.copySectionToClipboard(); + this.unitService.savedSectionCode = JSON.stringify(this.section); + } + copySectionToClipboard() { this.clipboard.copy(JSON.stringify(this.section)); this.messageService.showSuccess('Abschnitt in Zwischenablage kopiert'); diff --git a/projects/editor/src/app/components/dialogs/section-insert-dialog.component.ts b/projects/editor/src/app/components/dialogs/section-insert-dialog.component.ts index 5ac2431fe7044b12817fe574c58e3a5427ad2eee..e21c07e7f7521dcb8e7de4020c7fc75415a72a46 100644 --- a/projects/editor/src/app/components/dialogs/section-insert-dialog.component.ts +++ b/projects/editor/src/app/components/dialogs/section-insert-dialog.component.ts @@ -1,27 +1,41 @@ -import { Component, Inject } from '@angular/core'; +import { Component, Inject, OnInit } from '@angular/core'; import { Section } from 'common/models/section'; -import { MessageService } from 'common/services/message.service'; import { MAT_DIALOG_DATA } from '@angular/material/dialog'; import { Subject } from 'rxjs'; import { UIElement } from 'common/models/elements/element'; import { TranslateService } from '@ngx-translate/core'; import { IDService } from 'editor/src/app/services/id.service'; +import { UnitService } from 'editor/src/app/services/unit-services/unit.service'; @Component({ - selector: 'app-section-insert-dialog', template: ` + <h2 mat-dialog-title>Seitenabschnitt einfügen</h2> <mat-dialog-content> - <div (mouseenter)="hovered = true;" (mouseleave)="hovered = false;"> - <div class="paste-area" contenteditable="true" *ngIf="isPastedTextPresent === false" - (paste)="pasteSectionFromClipboard($event)"> - </div> - <div *ngIf="!hovered || isPastedTextPresent" class="message-area" [style.background-color]="operationStatus"> + <mat-radio-group [style]="'display: flex; flex-direction: column'" + [(ngModel)]="selectedMethod"> + <mat-radio-button value="savedCode" [disabled]="!savedSectionCode"> + Gespeicherten Abschnitt einfügen + </mat-radio-button> + <p *ngIf="savedSectionCode" class="radio-child-item" [style.color]="'green'"> + Gespeicherter Abschnitt gefunden. + </p> + <p *ngIf="!savedSectionCode" class="radio-child-item" [style.color]="'var(--warn)'"> + Kein gespeicherter Abschnitt gefunden. + </p> + <mat-radio-button value="pastedCode"> + Abschnitt über Zwischenablage einfügen + </mat-radio-button> + <div class="radio-child-item message-area" [style.color]="operationStatus"> {{operationStatusText}} </div> - </div> + <div class="radio-child-item paste-area" contenteditable="true" + (click)="selectedMethod = 'pastedCode'" + (paste)="pasteSectionFromClipboard($event)"> + </div> + </mat-radio-group> </mat-dialog-content> <mat-dialog-actions> - <button mat-button *ngIf="operationStatus === 'green' || operationStatus === 'yellow'" + <button mat-button *ngIf="selectedMethod == 'savedCode' || operationStatus === 'green' || operationStatus === 'orange'" [mat-dialog-close]="newSection"> {{'confirm' | translate }} </button> @@ -29,26 +43,37 @@ import { IDService } from 'editor/src/app/services/id.service'; </mat-dialog-actions> `, styles: [ - '.mat-mdc-dialog-content {width: 448px; height: 240px;}', - '.paste-area {position: absolute; width: 400px; height: 200px; border: 1px solid; overflow: hidden}', - '.message-area {position: absolute; width: 400px; height: 200px; text-align: center; font-size: large;}' + '.paste-area {width: 250px; height: 60px; border: 1px solid; overflow: hidden}', + '.radio-child-item {margin-left: 35px; font-size: smaller;}', + ':host ::ng-deep mat-radio-button .mdc-label {font-size: larger;}' ] }) -export class SectionInsertDialogComponent { +export class SectionInsertDialogComponent implements OnInit { private ngUnsubscribe = new Subject<void>(); - operationStatus: 'red' | 'yellow' | 'green' | 'none' = 'none'; - operationStatusText: string = this.translateService.instant('Bitte kopierten Abschnitt einfügen'); - hovered = false; + operationStatus: 'red' | 'orange' | 'green' | 'none' = 'none'; + operationStatusText: string = 'Kopierten Abschnitt einfügen:'; isPastedTextPresent = false; newSection: Section | null = null; + savedSectionCode: string | undefined; + selectedMethod: 'savedCode' | 'pastedCode' = 'pastedCode'; + constructor(@Inject(MAT_DIALOG_DATA) public data: { existingSection: Section }, - private messageService: MessageService, + private unitService: UnitService, private idManager: IDService, private translateService: TranslateService) { } + ngOnInit(): void { + if (this.unitService.savedSectionCode) { + this.savedSectionCode = this.unitService.savedSectionCode; + this.selectedMethod = 'savedCode'; + this.newSection = new Section(JSON.parse(this.unitService.savedSectionCode)); + } + } + pasteSectionFromClipboard(event: ClipboardEvent): void { + event.preventDefault(); this.isPastedTextPresent = true; const pastedText = event.clipboardData?.getData('Text'); if (!pastedText) { @@ -61,7 +86,7 @@ export class SectionInsertDialogComponent { if (this.findElementsWithDuplicateID(this.newSection.getAllElements()).length > 0) { this.operationStatusText = this.translateService.instant('Doppelte IDs festgestellt. Weiter mit neu generierten IDs?'); - this.operationStatus = 'yellow'; + this.operationStatus = 'orange'; } else { this.operationStatusText = this.translateService.instant('Abschnitt wurde erfolgreich gelesen.'); this.operationStatus = 'green'; diff --git a/projects/editor/src/app/services/unit-services/unit.service.ts b/projects/editor/src/app/services/unit-services/unit.service.ts index 889d923b67ea04883f4980b952378e1def789545..ee96e07e2488d1aa4d57c28409824cf3dd37200e 100644 --- a/projects/editor/src/app/services/unit-services/unit.service.ts +++ b/projects/editor/src/app/services/unit-services/unit.service.ts @@ -27,6 +27,7 @@ export class UnitService { geometryElementPropertyUpdated: Subject<string> = new Subject<string>(); mathTableElementPropertyUpdated: Subject<string> = new Subject<string>(); referenceManager: ReferenceManager; + savedSectionCode: string | undefined; constructor(private selectionService: SelectionService, private veronaApiService: VeronaAPIService,