From ce392fca7baf26e2c987ea71e5bc77f4f577fb98 Mon Sep 17 00:00:00 2001
From: rhenck <richard.henck@iqb.hu-berlin.de>
Date: Fri, 10 Dec 2021 22:20:01 +0100
Subject: [PATCH] Improve code style
Variable naming, reorder imports etc.
---
.../input-background-color.directive.ts | 2 +-
projects/common/models/page.ts | 2 -
.../ui-elements/frame/frame.component.ts | 3 +-
projects/common/util/element.factory.ts | 6 +--
projects/editor/src/app/app.module.ts | 23 ++++++----
.../editor/src/app/services/dialog.service.ts | 44 +++++--------------
.../src/app/services/id.service.spec.ts | 2 +-
.../editor/src/app/services/unit.service.ts | 10 +----
8 files changed, 34 insertions(+), 58 deletions(-)
diff --git a/projects/common/directives/input-background-color.directive.ts b/projects/common/directives/input-background-color.directive.ts
index a13ae77a4..325d82536 100644
--- a/projects/common/directives/input-background-color.directive.ts
+++ b/projects/common/directives/input-background-color.directive.ts
@@ -21,7 +21,7 @@ export class InputBackgroundColorDirective implements OnChanges {
}
private setBackgroundColor(): void {
- let targetElements: HTMLElement[] = [];
+ let targetElements: HTMLElement[];
if (this.appearance === 'outline') {
targetElements = this.elementRef.nativeElement.querySelector('div.mat-form-field-outline')?.children;
} else {
diff --git a/projects/common/models/page.ts b/projects/common/models/page.ts
index b7c3345fa..44ac7973b 100644
--- a/projects/common/models/page.ts
+++ b/projects/common/models/page.ts
@@ -1,7 +1,5 @@
import { Section } from './section';
import { moveArrayItem } from '../util/array';
-import { UIElement } from './uI-element';
-import { IdService } from '../../editor/src/app/services/id.service';
export class Page {
[index: string]: string | number | boolean | Section[] | undefined | ((...args: any) => any);
diff --git a/projects/common/ui-elements/frame/frame.component.ts b/projects/common/ui-elements/frame/frame.component.ts
index dde15dea6..06945d71b 100644
--- a/projects/common/ui-elements/frame/frame.component.ts
+++ b/projects/common/ui-elements/frame/frame.component.ts
@@ -1,5 +1,6 @@
import { Component, Input } from '@angular/core';
import { FrameElement } from './frame-element';
+import { ElementComponent } from '../../directives/element-component.directive';
@Component({
selector: 'app-frame',
@@ -18,6 +19,6 @@ import { FrameElement } from './frame-element';
</div>
`
})
-export class FrameComponent {
+export class FrameComponent extends ElementComponent {
@Input() elementModel!: FrameElement;
}
diff --git a/projects/common/util/element.factory.ts b/projects/common/util/element.factory.ts
index 8bc4db917..3766bc978 100644
--- a/projects/common/util/element.factory.ts
+++ b/projects/common/util/element.factory.ts
@@ -34,6 +34,7 @@ import { SliderComponent } from '../ui-elements/slider/slider.component';
import { SpellCorrectComponent } from '../ui-elements/spell-correct/spell-correct.component';
import { FrameComponent } from '../ui-elements/frame/frame.component';
import { FrameElement } from '../ui-elements/frame/frame-element';
+import { ElementComponent } from '../directives/element-component.directive';
export abstract class ElementFactory {
static createElement(elementModel: Partial<UIElement>): UIElement {
@@ -93,14 +94,13 @@ export abstract class ElementFactory {
default:
throw new Error(`ElementType ${elementModel.type} not found!`);
}
- console.log('newElement', newElement);
+ // console.log('newElement', newElement);
return newElement;
}
static getComponentFactory(
elementType: string, componentFactoryResolver: ComponentFactoryResolver
- ): ComponentFactory<any> {
- // TODO: Find better solution than any
+ ): ComponentFactory<ElementComponent> {
switch (elementType) {
case 'text':
return componentFactoryResolver.resolveComponentFactory(TextComponent);
diff --git a/projects/editor/src/app/app.module.ts b/projects/editor/src/app/app.module.ts
index 83d8b11aa..60aea9f31 100644
--- a/projects/editor/src/app/app.module.ts
+++ b/projects/editor/src/app/app.module.ts
@@ -17,24 +17,31 @@ import { MatToolbarModule } from '@angular/material/toolbar';
import { MatSidenavModule } from '@angular/material/sidenav';
import { MatDividerModule } from '@angular/material/divider';
import { MatInputModule } from '@angular/material/input';
+import { MatListModule } from '@angular/material/list';
import { AppComponent } from './app.component';
import { ToolbarComponent } from './components/toolbar/toolbar.component';
-import { UiElementToolboxComponent } from './components/unit-view/page-view/new-ui-element-panel/ui-element-toolbox.component';
+import { UiElementToolboxComponent } from
+ './components/unit-view/page-view/new-ui-element-panel/ui-element-toolbox.component';
import { UnitViewComponent } from './components/unit-view/unit-view.component';
import { PageViewComponent } from './components/unit-view/page-view/page-view.component';
import { CanvasComponent } from './components/unit-view/page-view/canvas/canvas.component';
-import { StaticCanvasOverlayComponent } from './components/unit-view/page-view/canvas/overlays/static-canvas-overlay.component';
-import { DynamicCanvasOverlayComponent } from './components/unit-view/page-view/canvas/overlays/dynamic-canvas-overlay.component';
+import { StaticCanvasOverlayComponent } from
+ './components/unit-view/page-view/canvas/overlays/static-canvas-overlay.component';
+import { DynamicCanvasOverlayComponent } from
+ './components/unit-view/page-view/canvas/overlays/dynamic-canvas-overlay.component';
import { SharedModule } from '../../../common/shared.module';
import { EditorTranslateLoader } from './editor-translate-loader';
-import { ElementPropertiesComponent } from './components/unit-view/page-view/properties-panel/element-properties.component';
+import { ElementPropertiesComponent } from
+ './components/unit-view/page-view/properties-panel/element-properties.component';
import { SectionMenuComponent } from './components/unit-view/page-view/canvas/section-menu.component';
import { SectionStaticComponent } from './components/unit-view/page-view/canvas/section-static.component';
import { SectionDynamicComponent } from './components/unit-view/page-view/canvas/section-dynamic.component';
import { RichTextEditorComponent } from './text-editor/rich-text-editor.component';
-import { ElementStylePropertiesComponent } from './components/unit-view/page-view/properties-panel/element-style-properties.component';
-import { ElementSizingPropertiesComponent } from './components/unit-view/page-view/properties-panel/element-sizing-properties.component';
+import { ElementStylePropertiesComponent } from
+ './components/unit-view/page-view/properties-panel/element-style-properties.component';
+import { ElementSizingPropertiesComponent } from
+ './components/unit-view/page-view/properties-panel/element-sizing-properties.component';
import { ConfirmationDialogComponent } from './components/dialogs/confirmation-dialog.component';
import { TextEditDialogComponent } from './components/dialogs/text-edit-dialog.component';
import { TextEditMultilineDialogComponent } from './components/dialogs/text-edit-multiline-dialog.component';
@@ -42,9 +49,9 @@ import { PlayerEditDialogComponent } from './components/dialogs/player-edit-dial
import { LikertColumnEditDialogComponent } from './components/dialogs/likert-column-edit-dialog.component';
import { LikertRowEditDialogComponent } from './components/dialogs/likert-row-edit-dialog.component';
import { RichTextEditDialogComponent } from './components/dialogs/rich-text-edit-dialog.component';
-import { ElementModelPropertiesComponent } from './components/unit-view/page-view/properties-panel/element-model-properties.component';
+import { ElementModelPropertiesComponent } from
+ './components/unit-view/page-view/properties-panel/element-model-properties.component';
import { DropListOptionEditDialogComponent } from './components/dialogs/drop-list-option-edit-dialog.component';
-import { MatListModule } from '@angular/material/list';
@NgModule({
declarations: [
diff --git a/projects/editor/src/app/services/dialog.service.ts b/projects/editor/src/app/services/dialog.service.ts
index 70c2c6c34..eb0e2cdfd 100644
--- a/projects/editor/src/app/services/dialog.service.ts
+++ b/projects/editor/src/app/services/dialog.service.ts
@@ -10,10 +10,7 @@ import { PlayerEditDialogComponent } from '../components/dialogs/player-edit-dia
import { LikertColumnEditDialogComponent } from '../components/dialogs/likert-column-edit-dialog.component';
import { LikertRowEditDialogComponent } from '../components/dialogs/likert-row-edit-dialog.component';
import {
- DragNDropValueObject,
- LikertColumn,
- PlayerElement,
- PlayerProperties
+ DragNDropValueObject, LikertColumn, PlayerProperties
} from '../../../../common/models/uI-element';
import { DropListOptionEditDialogComponent } from '../components/dialogs/drop-list-option-edit-dialog.component';
@@ -25,46 +22,35 @@ export class DialogService {
showConfirmDialog(text: string): Observable<boolean> {
const dialogRef = this.dialog.open(ConfirmationDialogComponent, {
- data: {
- text: text
- }
+ data: { text }
});
return dialogRef.afterClosed();
}
showTextEditDialog(text: string): Observable<string> {
const dialogRef = this.dialog.open(TextEditDialogComponent, {
- data: {
- text: text
- }
+ data: { text }
});
return dialogRef.afterClosed();
}
showDropListOptionEditDialog(value: DragNDropValueObject): Observable<DragNDropValueObject> {
const dialogRef = this.dialog.open(DropListOptionEditDialogComponent, {
- data: {
- value: value
- }
+ data: { value }
});
return dialogRef.afterClosed();
}
showMultilineTextEditDialog(text: string): Observable<string> {
const dialogRef = this.dialog.open(TextEditMultilineDialogComponent, {
- data: {
- text: text
- }
+ data: { text }
});
return dialogRef.afterClosed();
}
showRichTextEditDialog(text: string, defaultFontSize: number): Observable<string> {
const dialogRef = this.dialog.open(RichTextEditDialogComponent, {
- data: {
- text: text,
- defaultFontSize: defaultFontSize
- },
+ data: { text, defaultFontSize },
autoFocus: false
});
return dialogRef.afterClosed();
@@ -72,10 +58,7 @@ export class DialogService {
showClozeTextEditDialog(text: string): Observable<string> {
const dialogRef = this.dialog.open(RichTextEditDialogComponent, {
- data: {
- text: text,
- showCloseElements: true
- },
+ data: { text, showCloseElements: true },
autoFocus: false
});
return dialogRef.afterClosed();
@@ -83,28 +66,21 @@ export class DialogService {
showPlayerEditDialog(playerProps: PlayerProperties): Observable<PlayerProperties> {
const dialogRef = this.dialog.open(PlayerEditDialogComponent, {
- data: {
- playerProps: playerProps
- }
+ data: { playerProps }
});
return dialogRef.afterClosed();
}
showLikertColumnEditDialog(column: LikertColumn): Observable<LikertColumn> {
const dialogRef = this.dialog.open(LikertColumnEditDialogComponent, {
- data: {
- column: column
- }
+ data: { column }
});
return dialogRef.afterClosed();
}
showLikertRowEditDialog(row: LikertElementRow, columns: LikertColumn[]): Observable<LikertElementRow> {
const dialogRef = this.dialog.open(LikertRowEditDialogComponent, {
- data: {
- row: row,
- columns: columns
- }
+ data: { row, columns }
});
return dialogRef.afterClosed();
}
diff --git a/projects/editor/src/app/services/id.service.spec.ts b/projects/editor/src/app/services/id.service.spec.ts
index 6acd950f6..bda20f979 100644
--- a/projects/editor/src/app/services/id.service.spec.ts
+++ b/projects/editor/src/app/services/id.service.spec.ts
@@ -17,7 +17,7 @@ describe('IDService', () => {
expect(service.getNewID('text')).toBe('text_1');
});
- it('getNewID should return different IDs counting up', () => {
+ it('getNewID should return different IDs - counting up', () => {
service.getNewID('text');
expect(service.getNewID('text')).toBe('text_2');
});
diff --git a/projects/editor/src/app/services/unit.service.ts b/projects/editor/src/app/services/unit.service.ts
index 4728b9a88..cf8ca0c3e 100644
--- a/projects/editor/src/app/services/unit.service.ts
+++ b/projects/editor/src/app/services/unit.service.ts
@@ -1,6 +1,6 @@
import { Injectable } from '@angular/core';
import { DomSanitizer } from '@angular/platform-browser';
-import { BehaviorSubject, Observable, Subject } from 'rxjs';
+import { Subject } from 'rxjs';
import { TranslateService } from '@ngx-translate/core';
import { FileService } from './file.service';
import { MessageService } from '../../../../common/services/message.service';
@@ -360,14 +360,8 @@ export class UnitService {
this.veronaApiService.sendVoeDefinitionChangedNotification();
}
- getUnitAsJSON(): string {
- return JSON.stringify({
- ...this.unit
- });
- }
-
saveUnit(): void {
- FileService.saveUnitToFile(this.getUnitAsJSON());
+ FileService.saveUnitToFile(JSON.stringify(this.unit));
}
async loadUnitFromFile(): Promise<void> {
--
GitLab