From 4cab13fa5fa7d975c1f5e5a5264cbfc6f99f6fef Mon Sep 17 00:00:00 2001
From: rhenck <richard.henck@iqb.hu-berlin.de>
Date: Wed, 1 Nov 2023 19:30:11 +0100
Subject: [PATCH] [editor] Refactor duplication logic
---
docs/release-notes-editor.md | 16 +++++---
.../common/models/elements/button/button.ts | 9 ++--
.../cloze-child-elements/text-field-simple.ts | 6 ++-
.../cloze-child-elements/toggle-button.ts | 6 ++-
.../elements/compound-elements/cloze/cloze.ts | 10 +++--
.../compound-elements/likert/likert-row.ts | 4 ++
.../compound-elements/likert/likert.ts | 10 +++--
projects/common/models/elements/element.ts | 6 ++-
.../common/models/elements/frame/frame.ts | 8 +++-
.../models/elements/geometry/geometry.ts | 6 ++-
.../elements/input-elements/checkbox.ts | 14 +++++--
.../elements/input-elements/drop-list.ts | 6 ++-
.../elements/input-elements/dropdown.ts | 8 +++-
.../elements/input-elements/hotspot-image.ts | 6 ++-
.../elements/input-elements/math-field.ts | 8 +++-
.../radio-button-group-complex.ts | 8 +++-
.../input-elements/radio-button-group.ts | 8 +++-
.../models/elements/input-elements/slider.ts | 8 +++-
.../elements/input-elements/spell-correct.ts | 8 +++-
.../elements/input-elements/text-area.ts | 8 +++-
.../elements/input-elements/text-field.ts | 8 +++-
.../models/elements/media-elements/audio.ts | 6 ++-
.../models/elements/media-elements/image.ts | 6 ++-
.../models/elements/media-elements/video.ts | 6 ++-
projects/common/models/elements/text/text.ts | 8 +++-
projects/common/models/section.ts | 12 +++---
.../element-properties-panel.component.ts | 6 +--
.../editor/src/app/services/unit.service.ts | 41 +++++++++++--------
28 files changed, 180 insertions(+), 76 deletions(-)
diff --git a/docs/release-notes-editor.md b/docs/release-notes-editor.md
index 3933614c7..b5c2bc21b 100644
--- a/docs/release-notes-editor.md
+++ b/docs/release-notes-editor.md
@@ -1,17 +1,21 @@
Editor
======
-## 2.1.2
+## 2.1.1
### Änderungen
+- Duplizierte Elemente verlieren ihren Wert für Spalte/Zeile (Raster - dynamisches Layout)
+ Damit liegen duplizierte Elemente nicht mehr deckungsgleich übereinander.
+ (Gilt nicht für Elemente duplizierter Seitenabschnitte.)
- "Zurücksetzen"-Knopf des Geogebra-Elements
- Position oberhalb des Elements
- mit Beschriftung "neu anlegen"
- neues Icon
-
-## 2.1.1 deleted
+### Fehlerbehebungen
+- Sichtbarkeitseinstellungen duplizierter Abschnitte repariert
+ Einstellungen an Kopien werden nicht mehr auf das Ursprungselement angewendet.
## 2.1.0
### Neue Funktionen
-- Für die Bedingungen zur Sichtbarkeit von Abschnitten kann nun die
+- Für die Bedingungen zur Sichtbarkeit von Abschnitten kann nun die
logische Verknüpfung festgelegt werden: UND / ODER
### Fehlerbehebungen
@@ -24,8 +28,8 @@ Editor
- Optionsfelder mit Bild: Optionen richten sich wieder nach unten aus
## 2.0.2
-### Änderungen
-- Passt das Einbinden des Symbols für den Radiergummi an die Sicherheitseinstellungen des Testcenters an
+### Änderungen
+- Passt das Einbinden des Symbols für den Radiergummi an die Sicherheitseinstellungen des Testcenters an
## 2.0.1
diff --git a/projects/common/models/elements/button/button.ts b/projects/common/models/elements/button/button.ts
index e2d08d341..8a6cedab0 100644
--- a/projects/common/models/elements/button/button.ts
+++ b/projects/common/models/elements/button/button.ts
@@ -18,10 +18,10 @@ export class ButtonElement extends UIElement implements ButtonProperties {
asLink: boolean = false;
action: null | ButtonAction = null;
actionParam: null | UnitNavParam | number | string = null;
- styling: BasicStyles & BorderStyles;
tooltipText: string = '';
tooltipPosition: TooltipPosition = 'below';
labelAlignment: 'super' | 'sub' | 'baseline' = 'baseline';
+ styling: BasicStyles & BorderStyles;
constructor(element?: ButtonProperties) {
super(element);
@@ -31,10 +31,10 @@ export class ButtonElement extends UIElement implements ButtonProperties {
this.asLink = element.asLink;
this.action = element.action;
this.actionParam = element.actionParam;
- this.styling = element.styling;
this.tooltipText = element.tooltipText;
this.tooltipPosition = element.tooltipPosition;
this.labelAlignment = element.labelAlignment;
+ this.styling = { ...element.styling };
} else {
if (environment.strictInstantiation) {
throw new InstantiationEror('Error at Button instantiation', element);
@@ -47,7 +47,6 @@ export class ButtonElement extends UIElement implements ButtonProperties {
if (element?.tooltipText !== undefined) this.tooltipText = element.tooltipText;
if (element?.tooltipPosition !== undefined) this.tooltipPosition = element.tooltipPosition;
if (element?.labelAlignment !== undefined) this.labelAlignment = element.labelAlignment;
- this.position = PropertyGroupGenerators.generatePositionProps(element?.position);
this.styling = {
...PropertyGroupGenerators.generateBasicStyleProps(element?.styling),
...PropertyGroupGenerators.generateBorderStylingProps(element?.styling)
@@ -55,6 +54,10 @@ export class ButtonElement extends UIElement implements ButtonProperties {
}
}
+ getDuplicate(): ButtonElement {
+ return new ButtonElement(this);
+ }
+
getElementComponent(): Type<ElementComponent> {
return ButtonComponent;
}
diff --git a/projects/common/models/elements/compound-elements/cloze/cloze-child-elements/text-field-simple.ts b/projects/common/models/elements/compound-elements/cloze/cloze-child-elements/text-field-simple.ts
index abf491992..d4da4fe8b 100644
--- a/projects/common/models/elements/compound-elements/cloze/cloze-child-elements/text-field-simple.ts
+++ b/projects/common/models/elements/compound-elements/cloze/cloze-child-elements/text-field-simple.ts
@@ -38,7 +38,7 @@ export class TextFieldSimpleElement extends TextInputElement implements TextFiel
this.pattern = element.pattern;
this.patternWarnMessage = element.patternWarnMessage;
this.clearable = element.clearable;
- this.styling = element.styling;
+ this.styling = { ...element.styling };
} else {
if (environment.strictInstantiation) {
throw new InstantiationEror('Error at TextFieldSimple instantiation', element);
@@ -83,6 +83,10 @@ export class TextFieldSimpleElement extends TextInputElement implements TextFiel
getElementComponent(): Type<ElementComponent> {
return TextFieldSimpleComponent;
}
+
+ getDuplicate(): TextFieldSimpleElement {
+ return new TextFieldSimpleElement(this);
+ }
}
export interface TextFieldSimpleProperties extends TextInputElementProperties {
diff --git a/projects/common/models/elements/compound-elements/cloze/cloze-child-elements/toggle-button.ts b/projects/common/models/elements/compound-elements/cloze/cloze-child-elements/toggle-button.ts
index 061504e93..3b327fb9b 100644
--- a/projects/common/models/elements/compound-elements/cloze/cloze-child-elements/toggle-button.ts
+++ b/projects/common/models/elements/compound-elements/cloze/cloze-child-elements/toggle-button.ts
@@ -32,7 +32,7 @@ export class ToggleButtonElement extends InputElement implements ToggleButtonPro
this.strikeOtherOptions = element.strikeOtherOptions;
this.strikeSelectedOption = element.strikeSelectedOption;
this.verticalOrientation = element.verticalOrientation;
- this.styling = element.styling;
+ this.styling = { ...element.styling };
} else {
if (environment.strictInstantiation) {
throw new InstantiationEror('Error at ToggleButton instantiation', element);
@@ -84,6 +84,10 @@ export class ToggleButtonElement extends InputElement implements ToggleButtonPro
getNewOptionLabel(optionText: string): TextLabel {
return UIElement.createOptionLabel(optionText) as TextLabel;
}
+
+ getDuplicate(): ToggleButtonElement {
+ return new ToggleButtonElement(this);
+ }
}
export interface ToggleButtonProperties extends InputElementProperties {
diff --git a/projects/common/models/elements/compound-elements/cloze/cloze.ts b/projects/common/models/elements/compound-elements/cloze/cloze.ts
index 0423a13cc..3f53cc7b6 100644
--- a/projects/common/models/elements/compound-elements/cloze/cloze.ts
+++ b/projects/common/models/elements/compound-elements/cloze/cloze.ts
@@ -35,10 +35,10 @@ export class ClozeElement extends CompoundElement implements PositionedUIElement
super(element);
if (element && isValid(element)) {
this.columnCount = element.columnCount;
- this.document = element.document;
+ this.document = { ...element.document };
this.instantiateChildElements();
- this.position = element.position;
- this.styling = element.styling;
+ this.position = { ...element.position };
+ this.styling = { ...element.styling };
} else {
if (environment.strictInstantiation) {
throw new InstantiationEror('Error at Cloze instantiation', element);
@@ -111,6 +111,10 @@ export class ClozeElement extends CompoundElement implements PositionedUIElement
return ClozeComponent;
}
+ getDuplicate(): ClozeElement {
+ return new ClozeElement(this);
+ }
+
getChildElements(): UIElement[] {
return ClozeElement.getCustomNodes(this.document.content).map(el => el.attrs.model);
}
diff --git a/projects/common/models/elements/compound-elements/likert/likert-row.ts b/projects/common/models/elements/compound-elements/likert/likert-row.ts
index be2750013..de636e5b8 100644
--- a/projects/common/models/elements/compound-elements/likert/likert-row.ts
+++ b/projects/common/models/elements/compound-elements/likert/likert-row.ts
@@ -66,6 +66,10 @@ export class LikertRowElement extends InputElement implements LikertRowPropertie
getElementComponent(): Type<ElementComponent> {
return LikertRadioButtonGroupComponent;
}
+
+ getDuplicate(): LikertRowElement {
+ return new LikertRowElement(this);
+ }
}
export interface LikertRowProperties extends InputElementProperties {
diff --git a/projects/common/models/elements/compound-elements/likert/likert.ts b/projects/common/models/elements/compound-elements/likert/likert.ts
index c2166d0a7..1cf31804e 100644
--- a/projects/common/models/elements/compound-elements/likert/likert.ts
+++ b/projects/common/models/elements/compound-elements/likert/likert.ts
@@ -31,14 +31,14 @@ export class LikertElement extends CompoundElement implements PositionedUIElemen
constructor(element?: LikertProperties) {
super(element);
if (element && isValid(element)) {
- this.options = element.options;
+ this.options = [...element.options];
this.firstColumnSizeRatio = element.firstColumnSizeRatio;
this.rows = element.rows.map(row => new LikertRowElement(row));
this.label = element.label;
this.label2 = element.label2;
this.stickyHeader = element.stickyHeader;
- this.position = element.position;
- this.styling = element.styling;
+ this.position = { ...element.position };
+ this.styling = { ...element.styling };
} else {
if (environment.strictInstantiation) {
throw new InstantiationEror('Error at Likert instantiation', element);
@@ -107,6 +107,10 @@ export class LikertElement extends CompoundElement implements PositionedUIElemen
getChildElements(): UIElement[] {
return this.rows;
}
+
+ getDuplicate(): LikertElement {
+ return new LikertElement(this);
+ }
}
export interface LikertProperties extends UIElementProperties {
diff --git a/projects/common/models/elements/element.ts b/projects/common/models/elements/element.ts
index 6d1b826d4..ba5d7e565 100644
--- a/projects/common/models/elements/element.ts
+++ b/projects/common/models/elements/element.ts
@@ -71,8 +71,8 @@ export abstract class UIElement implements UIElementProperties {
this.id = element.id;
this.isRelevantForPresentationComplete = element.isRelevantForPresentationComplete;
this.dimensions = element.dimensions;
- this.position = element.position;
- this.styling = element.styling;
+ if (element.position) this.position = { ...element.position };
+ if (element.styling) this.styling = { ...element.styling };
} else {
if (environment.strictInstantiation) {
throw new InstantiationEror('Error at UIElement instantiation', element);
@@ -129,6 +129,8 @@ export abstract class UIElement implements UIElementProperties {
imgPosition: addImg ? 'above' : undefined
};
}
+
+ abstract getDuplicate(): UIElement;
}
export type InputElementValue = string[] | string | number | boolean | TextLabel[] | null | Hotspot[] | boolean[];
diff --git a/projects/common/models/elements/frame/frame.ts b/projects/common/models/elements/frame/frame.ts
index 8284d7743..955eef5ed 100644
--- a/projects/common/models/elements/frame/frame.ts
+++ b/projects/common/models/elements/frame/frame.ts
@@ -26,8 +26,8 @@ export class FrameElement extends UIElement implements PositionedUIElement, Fram
this.hasBorderBottom = element.hasBorderBottom;
this.hasBorderLeft = element.hasBorderLeft;
this.hasBorderRight = element.hasBorderRight;
- this.position = element.position;
- this.styling = element.styling;
+ this.position = { ...element.position };
+ this.styling = { ...element.styling };
} else {
if (environment.strictInstantiation) {
throw new InstantiationEror('Error at Frame instantiation', element);
@@ -53,6 +53,10 @@ export class FrameElement extends UIElement implements PositionedUIElement, Fram
getElementComponent(): Type<ElementComponent> {
return FrameComponent;
}
+
+ getDuplicate(): FrameElement {
+ return new FrameElement(this);
+ }
}
export interface FrameProperties extends UIElementProperties {
diff --git a/projects/common/models/elements/geometry/geometry.ts b/projects/common/models/elements/geometry/geometry.ts
index 22093c0a0..2af924257 100644
--- a/projects/common/models/elements/geometry/geometry.ts
+++ b/projects/common/models/elements/geometry/geometry.ts
@@ -35,7 +35,7 @@ export class GeometryElement extends UIElement implements PositionedUIElement, G
this.showZoomButtons = element.showZoomButtons;
this.showFullscreenButton = element.showFullscreenButton;
this.customToolbar = element.customToolbar;
- this.position = element.position;
+ this.position = { ...element.position };
} else {
if (environment.strictInstantiation) {
throw new InstantiationEror('Error at Geometry instantiation', element);
@@ -76,6 +76,10 @@ export class GeometryElement extends UIElement implements PositionedUIElement, G
getElementComponent(): Type<ElementComponent> {
return GeometryComponent;
}
+
+ getDuplicate(): GeometryElement {
+ return new GeometryElement(this);
+ }
}
export interface GeometryProperties extends UIElementProperties {
diff --git a/projects/common/models/elements/input-elements/checkbox.ts b/projects/common/models/elements/input-elements/checkbox.ts
index 4ed705803..dfcee227f 100644
--- a/projects/common/models/elements/input-elements/checkbox.ts
+++ b/projects/common/models/elements/input-elements/checkbox.ts
@@ -6,7 +6,7 @@ import { ElementComponent } from 'common/directives/element-component.directive'
import { CheckboxComponent } from 'common/components/input-elements/checkbox.component';
import { AnswerScheme, AnswerSchemeValue } from 'common/models/elements/answer-scheme-interfaces';
import {
- BasicStyles, PropertyGroupGenerators, PropertyGroupValidators
+ BasicStyles, PositionProperties, PropertyGroupGenerators, PropertyGroupValidators
} from 'common/models/elements/property-group-interfaces';
import { environment } from 'common/environment';
import { InstantiationEror } from 'common/util/errors';
@@ -14,14 +14,15 @@ import { InstantiationEror } from 'common/util/errors';
export class CheckboxElement extends InputElement implements CheckboxProperties {
type: UIElementType = 'checkbox';
crossOutChecked: boolean = false;
+ position: PositionProperties;
styling: BasicStyles;
constructor(element?: CheckboxProperties) {
super(element);
if (element && isValid(element)) {
this.crossOutChecked = element.crossOutChecked;
- this.position = element.position;
- this.styling = element.styling;
+ this.position = { ...element.position };
+ this.styling = { ...element.styling };
} else {
if (environment.strictInstantiation) {
throw new InstantiationEror('Error at Checkbox instantiation', element);
@@ -31,10 +32,15 @@ export class CheckboxElement extends InputElement implements CheckboxProperties
width: 215,
...element?.dimensions
});
+ this.position = PropertyGroupGenerators.generatePositionProps(element?.position);
this.styling = PropertyGroupGenerators.generateBasicStyleProps(element?.styling);
}
}
+ getDuplicate(): CheckboxElement {
+ return new CheckboxElement(this);
+ }
+
hasAnswerScheme(): boolean {
return Boolean(this.getAnswerScheme);
}
@@ -65,11 +71,13 @@ export class CheckboxElement extends InputElement implements CheckboxProperties
export interface CheckboxProperties extends InputElementProperties {
crossOutChecked: boolean;
+ position: PositionProperties;
styling: BasicStyles;
}
function isValid(blueprint?: CheckboxProperties): boolean {
if (!blueprint) return false;
return blueprint.crossOutChecked !== undefined &&
+ PropertyGroupValidators.isValidPosition(blueprint.position) &&
PropertyGroupValidators.isValidBasicStyles(blueprint.styling);
}
diff --git a/projects/common/models/elements/input-elements/drop-list.ts b/projects/common/models/elements/input-elements/drop-list.ts
index d56bc2320..e8be7f772 100644
--- a/projects/common/models/elements/input-elements/drop-list.ts
+++ b/projects/common/models/elements/input-elements/drop-list.ts
@@ -38,7 +38,7 @@ export class DropListElement extends InputElement implements DropListProperties
this.orientation = element.orientation;
this.highlightReceivingDropList = element.highlightReceivingDropList;
this.highlightReceivingDropListColor = element.highlightReceivingDropListColor;
- this.styling = element.styling;
+ this.styling = { ...element.styling };
} else {
if (environment.strictInstantiation) {
throw new InstantiationEror('Error at DropList instantiation', element);
@@ -71,6 +71,10 @@ export class DropListElement extends InputElement implements DropListProperties
}
}
+ getDuplicate(): DropListElement {
+ return new DropListElement(this);
+ }
+
/* Set originListID and originListIndex if applicable. */
setProperty(property: string, value: UIElementValue): void {
super.setProperty(property, value);
diff --git a/projects/common/models/elements/input-elements/dropdown.ts b/projects/common/models/elements/input-elements/dropdown.ts
index 341f0e397..384c155fa 100644
--- a/projects/common/models/elements/input-elements/dropdown.ts
+++ b/projects/common/models/elements/input-elements/dropdown.ts
@@ -24,8 +24,8 @@ export class DropdownElement extends InputElement implements PositionedUIElement
if (element && isValid(element)) {
this.options = element.options;
this.allowUnset = element.allowUnset;
- this.position = element.position;
- this.styling = element.styling;
+ this.position = { ...element.position };
+ this.styling = { ...element.styling };
} else {
if (environment.strictInstantiation) {
throw new InstantiationEror('Error at Dropdown instantiation', element);
@@ -42,6 +42,10 @@ export class DropdownElement extends InputElement implements PositionedUIElement
}
}
+ getDuplicate(): DropdownElement {
+ return new DropdownElement(this);
+ }
+
hasAnswerScheme(): boolean {
return Boolean(this.getAnswerScheme);
}
diff --git a/projects/common/models/elements/input-elements/hotspot-image.ts b/projects/common/models/elements/input-elements/hotspot-image.ts
index 4a18bf4b3..255dbf756 100644
--- a/projects/common/models/elements/input-elements/hotspot-image.ts
+++ b/projects/common/models/elements/input-elements/hotspot-image.ts
@@ -39,7 +39,7 @@ export class HotspotImageElement extends InputElement implements PositionedUIEle
if (element && isValid(element)) {
this.value = element.value;
this.src = element.src;
- this.position = element.position;
+ this.position = { ...element.position };
} else {
if (environment.strictInstantiation) {
throw new InstantiationEror('Error at HotspotImage instantiation', element);
@@ -54,6 +54,10 @@ export class HotspotImageElement extends InputElement implements PositionedUIEle
}
}
+ getDuplicate(): HotspotImageElement {
+ return new HotspotImageElement(this);
+ }
+
hasAnswerScheme(): boolean {
return Boolean(this.getAnswerScheme);
}
diff --git a/projects/common/models/elements/input-elements/math-field.ts b/projects/common/models/elements/input-elements/math-field.ts
index 4713b930d..35af41021 100644
--- a/projects/common/models/elements/input-elements/math-field.ts
+++ b/projects/common/models/elements/input-elements/math-field.ts
@@ -23,8 +23,8 @@ export class MathFieldElement extends InputElement implements MathFieldPropertie
super(element);
if (element && isValid(element)) {
this.enableModeSwitch = element.enableModeSwitch;
- this.position = element.position;
- this.styling = element.styling;
+ this.position = { ...element.position };
+ this.styling = { ...element.styling };
} else {
if (environment.strictInstantiation) {
throw new InstantiationEror('Error at Mathfield instantiation', element);
@@ -38,6 +38,10 @@ export class MathFieldElement extends InputElement implements MathFieldPropertie
}
}
+ getDuplicate(): MathFieldElement {
+ return new MathFieldElement(this);
+ }
+
hasAnswerScheme(): boolean {
return Boolean(this.getAnswerScheme);
}
diff --git a/projects/common/models/elements/input-elements/radio-button-group-complex.ts b/projects/common/models/elements/input-elements/radio-button-group-complex.ts
index b7d2facde..f0f36ddeb 100644
--- a/projects/common/models/elements/input-elements/radio-button-group-complex.ts
+++ b/projects/common/models/elements/input-elements/radio-button-group-complex.ts
@@ -25,8 +25,8 @@ export class RadioButtonGroupComplexElement extends InputElement
if (element && isValid(element)) {
this.options = element.options;
this.itemsPerRow = element.itemsPerRow;
- this.position = element.position;
- this.styling = element.styling;
+ this.position = { ...element.position };
+ this.styling = { ...element.styling };
} else {
if (environment.strictInstantiation) {
throw new InstantiationEror('Error at RadioButtonGroupComplex instantiation', element);
@@ -44,6 +44,10 @@ export class RadioButtonGroupComplexElement extends InputElement
}
}
+ getDuplicate(): RadioButtonGroupComplexElement {
+ return new RadioButtonGroupComplexElement(this);
+ }
+
hasAnswerScheme(): boolean {
return Boolean(this.getAnswerScheme);
}
diff --git a/projects/common/models/elements/input-elements/radio-button-group.ts b/projects/common/models/elements/input-elements/radio-button-group.ts
index baddbf3e2..705696534 100644
--- a/projects/common/models/elements/input-elements/radio-button-group.ts
+++ b/projects/common/models/elements/input-elements/radio-button-group.ts
@@ -29,8 +29,8 @@ export class RadioButtonGroupElement extends InputElement
this.options = element.options;
this.alignment = element.alignment;
this.strikeOtherOptions = element.strikeOtherOptions;
- this.position = element.position;
- this.styling = element.styling;
+ this.position = { ...element.position };
+ this.styling = { ...element.styling };
} else {
if (environment.strictInstantiation) {
throw new InstantiationEror('Error at RadioButtonGroupElement instantiation', element);
@@ -50,6 +50,10 @@ export class RadioButtonGroupElement extends InputElement
}
}
+ getDuplicate(): RadioButtonGroupElement {
+ return new RadioButtonGroupElement(this);
+ }
+
hasAnswerScheme(): boolean {
return Boolean(this.getAnswerScheme);
}
diff --git a/projects/common/models/elements/input-elements/slider.ts b/projects/common/models/elements/input-elements/slider.ts
index 7c4333c38..dc66dd07b 100644
--- a/projects/common/models/elements/input-elements/slider.ts
+++ b/projects/common/models/elements/input-elements/slider.ts
@@ -31,8 +31,8 @@ export class SliderElement extends InputElement implements PositionedUIElement,
this.showValues = element.showValues;
this.barStyle = element.barStyle;
this.thumbLabel = element.thumbLabel;
- this.position = element.position;
- this.styling = element.styling;
+ this.position = { ...element.position };
+ this.styling = { ...element.styling };
} else {
if (environment.strictInstantiation) {
throw new InstantiationEror('Error at Slider instantiation', element);
@@ -75,6 +75,10 @@ export class SliderElement extends InputElement implements PositionedUIElement,
getElementComponent(): Type<ElementComponent> {
return SliderComponent;
}
+
+ getDuplicate(): SliderElement {
+ return new SliderElement(this);
+ }
}
export interface SliderProperties extends InputElementProperties {
diff --git a/projects/common/models/elements/input-elements/spell-correct.ts b/projects/common/models/elements/input-elements/spell-correct.ts
index 3b2d337a2..ba27df0b3 100644
--- a/projects/common/models/elements/input-elements/spell-correct.ts
+++ b/projects/common/models/elements/input-elements/spell-correct.ts
@@ -19,8 +19,8 @@ export class SpellCorrectElement extends TextInputElement implements PositionedU
constructor(element?: SpellCorrectProperties) {
super(element);
if (element && isValid(element)) {
- this.position = element.position;
- this.styling = element.styling;
+ this.position = { ...element.position };
+ this.styling = { ...element.styling };
} else {
if (environment.strictInstantiation) {
throw new InstantiationEror('Error at SpellCorrect instantiation', element);
@@ -54,6 +54,10 @@ export class SpellCorrectElement extends TextInputElement implements PositionedU
getElementComponent(): Type<ElementComponent> {
return SpellCorrectComponent;
}
+
+ getDuplicate(): SpellCorrectElement {
+ return new SpellCorrectElement(this);
+ }
}
export interface SpellCorrectProperties extends TextInputElementProperties {
diff --git a/projects/common/models/elements/input-elements/text-area.ts b/projects/common/models/elements/input-elements/text-area.ts
index 2a3cb9369..4131c66d9 100644
--- a/projects/common/models/elements/input-elements/text-area.ts
+++ b/projects/common/models/elements/input-elements/text-area.ts
@@ -37,8 +37,8 @@ export class TextAreaElement extends TextInputElement implements PositionedUIEle
this.expectedCharactersCount = element.expectedCharactersCount;
this.hasReturnKey = element.hasReturnKey;
this.hasKeyboardIcon = element.hasKeyboardIcon;
- this.position = element.position;
- this.styling = element.styling;
+ this.position = { ...element.position };
+ this.styling = { ...element.styling };
} else {
if (environment.strictInstantiation) {
throw new InstantiationEror('Error at TextArea instantiation', element);
@@ -82,6 +82,10 @@ export class TextAreaElement extends TextInputElement implements PositionedUIEle
getElementComponent(): Type<ElementComponent> {
return TextAreaComponent;
}
+
+ getDuplicate(): TextAreaElement {
+ return new TextAreaElement(this);
+ }
}
export interface TextAreaProperties extends TextInputElementProperties {
diff --git a/projects/common/models/elements/input-elements/text-field.ts b/projects/common/models/elements/input-elements/text-field.ts
index ccd15aadc..4132d7187 100644
--- a/projects/common/models/elements/input-elements/text-field.ts
+++ b/projects/common/models/elements/input-elements/text-field.ts
@@ -41,8 +41,8 @@ export class TextFieldElement extends TextInputElement implements PositionedUIEl
this.patternWarnMessage = element.patternWarnMessage;
this.clearable = element.clearable;
this.hasKeyboardIcon = element.hasKeyboardIcon;
- this.position = element.position;
- this.styling = element.styling;
+ this.position = { ...element.position };
+ this.styling = { ...element.styling };
} else {
if (environment.strictInstantiation) {
throw new InstantiationEror('Error at TextField instantiation', element);
@@ -89,6 +89,10 @@ export class TextFieldElement extends TextInputElement implements PositionedUIEl
getElementComponent(): Type<ElementComponent> {
return TextFieldComponent;
}
+
+ getDuplicate(): TextFieldElement {
+ return new TextFieldElement(this);
+ }
}
export interface TextFieldProperties extends TextInputElementProperties {
diff --git a/projects/common/models/elements/media-elements/audio.ts b/projects/common/models/elements/media-elements/audio.ts
index c93d72581..d5dde5b28 100644
--- a/projects/common/models/elements/media-elements/audio.ts
+++ b/projects/common/models/elements/media-elements/audio.ts
@@ -19,7 +19,7 @@ export class AudioElement extends PlayerElement implements PositionedUIElement,
super(element);
if (element && isValid(element)) {
this.src = element.src;
- this.position = element.position;
+ this.position = { ...element.position };
} else {
if (environment.strictInstantiation) {
throw new InstantiationEror('Error at Audio instantiation', element);
@@ -34,6 +34,10 @@ export class AudioElement extends PlayerElement implements PositionedUIElement,
}
}
+ getDuplicate(): AudioElement {
+ return new AudioElement(this);
+ }
+
getElementComponent(): Type<ElementComponent> {
return AudioComponent;
}
diff --git a/projects/common/models/elements/media-elements/image.ts b/projects/common/models/elements/media-elements/image.ts
index 99e36f825..46731dc65 100644
--- a/projects/common/models/elements/media-elements/image.ts
+++ b/projects/common/models/elements/media-elements/image.ts
@@ -33,7 +33,7 @@ export class ImageElement extends UIElement implements PositionedUIElement, Imag
this.magnifierSize = element.magnifierSize;
this.magnifierZoom = element.magnifierZoom;
this.magnifierUsed = element.magnifierUsed;
- this.position = element.position;
+ this.position = { ...element.position };
} else {
if (environment.strictInstantiation) {
throw new InstantiationEror('Error at Image instantiation', element);
@@ -72,6 +72,10 @@ export class ImageElement extends UIElement implements PositionedUIElement, Imag
valuesComplete: true
};
}
+
+ getDuplicate(): ImageElement {
+ return new ImageElement(this);
+ }
}
export interface ImageProperties extends UIElementProperties {
diff --git a/projects/common/models/elements/media-elements/video.ts b/projects/common/models/elements/media-elements/video.ts
index 6a6e5848e..d26ed22c3 100644
--- a/projects/common/models/elements/media-elements/video.ts
+++ b/projects/common/models/elements/media-elements/video.ts
@@ -21,7 +21,7 @@ export class VideoElement extends PlayerElement implements PositionedUIElement,
if (element && isValid(element)) {
this.src = element.src;
this.scale = element.scale;
- this.position = element.position;
+ this.position = { ...element.position };
} else {
if (environment.strictInstantiation) {
throw new InstantiationEror('Error at Video instantiation', element);
@@ -40,6 +40,10 @@ export class VideoElement extends PlayerElement implements PositionedUIElement,
getElementComponent(): Type<ElementComponent> {
return VideoComponent;
}
+
+ getDuplicate(): VideoElement {
+ return new VideoElement(this);
+ }
}
export interface VideoProperties extends PlayerElementBlueprint {
diff --git a/projects/common/models/elements/text/text.ts b/projects/common/models/elements/text/text.ts
index 32970bba8..b33abbdde 100644
--- a/projects/common/models/elements/text/text.ts
+++ b/projects/common/models/elements/text/text.ts
@@ -35,8 +35,8 @@ export class TextElement extends UIElement implements PositionedUIElement, TextP
this.highlightableYellow = element.highlightableYellow;
this.hasSelectionPopup = element.hasSelectionPopup;
this.columnCount = element.columnCount;
- this.position = element.position;
- this.styling = element.styling;
+ this.position = { ...element.position };
+ this.styling = { ...element.styling };
} else {
if (environment.strictInstantiation) {
throw new InstantiationEror('Error at Text instantiation', element);
@@ -59,6 +59,10 @@ export class TextElement extends UIElement implements PositionedUIElement, TextP
}
}
+ getDuplicate(): TextElement {
+ return new TextElement(this);
+ }
+
private isHighlightable(): boolean {
return this.highlightableYellow ||
this.highlightableTurquoise ||
diff --git a/projects/common/models/section.ts b/projects/common/models/section.ts
index b460deef6..d888d1992 100644
--- a/projects/common/models/section.ts
+++ b/projects/common/models/section.ts
@@ -37,13 +37,13 @@ export class Section {
this.dynamicPositioning = section.dynamicPositioning;
this.autoColumnSize = section.autoColumnSize;
this.autoRowSize = section.autoRowSize;
- this.gridColumnSizes = section.gridColumnSizes;
- this.gridRowSizes = section.gridRowSizes;
+ this.gridColumnSizes = { ...section.gridColumnSizes };
+ this.gridRowSizes = { ...section.gridRowSizes };
this.visibilityDelay = section.visibilityDelay;
this.animatedVisibility = section.animatedVisibility;
this.enableReHide = section.enableReHide;
this.logicalConnectiveOfRules = section.logicalConnectiveOfRules;
- this.visibilityRules = section.visibilityRules;
+ this.visibilityRules = section.visibilityRules.map(rule => ({ ...rule }));
this.elements = section.elements
.map(element => ElementFactory.createElement(element)) as PositionedUIElement[];
} else {
@@ -55,13 +55,13 @@ export class Section {
if (section?.dynamicPositioning !== undefined) this.dynamicPositioning = section.dynamicPositioning;
if (section?.autoColumnSize !== undefined) this.autoColumnSize = section.autoColumnSize;
if (section?.autoRowSize !== undefined) this.autoRowSize = section.autoRowSize;
- if (section?.gridColumnSizes !== undefined) this.gridColumnSizes = section.gridColumnSizes;
- if (section?.gridRowSizes !== undefined) this.gridRowSizes = section.gridRowSizes;
+ if (section?.gridColumnSizes !== undefined) this.gridColumnSizes = { ...section.gridColumnSizes };
+ if (section?.gridRowSizes !== undefined) this.gridRowSizes = { ...section.gridRowSizes };
if (section?.visibilityDelay !== undefined) this.visibilityDelay = section.visibilityDelay;
if (section?.animatedVisibility !== undefined) this.animatedVisibility = section.animatedVisibility;
if (section?.enableReHide !== undefined) this.enableReHide = section.enableReHide;
if (section?.logicalConnectiveOfRules !== undefined) this.logicalConnectiveOfRules = section.logicalConnectiveOfRules;
- if (section?.visibilityRules !== undefined) this.visibilityRules = section.visibilityRules;
+ if (section?.visibilityRules !== undefined) this.visibilityRules = section.visibilityRules.map(rule => ({ ...rule }));
this.elements = section?.elements !== undefined ?
section.elements.map(element => ElementFactory.createElement(element)) as PositionedUIElement[] :
[];
diff --git a/projects/editor/src/app/components/properties-panel/element-properties-panel.component.ts b/projects/editor/src/app/components/properties-panel/element-properties-panel.component.ts
index cf9ec2ad4..47f770c32 100644
--- a/projects/editor/src/app/components/properties-panel/element-properties-panel.component.ts
+++ b/projects/editor/src/app/components/properties-panel/element-properties-panel.component.ts
@@ -125,11 +125,7 @@ export class ElementPropertiesPanelComponent implements OnInit, OnDestroy {
}
duplicateElement(): void {
- this.unitService.duplicateElementsInSection(
- this.selectedElements,
- this.selectionService.selectedPageIndex,
- this.selectionService.selectedPageSectionIndex
- );
+ this.unitService.duplicateSelectedElements();
}
ngOnDestroy(): void {
diff --git a/projects/editor/src/app/services/unit.service.ts b/projects/editor/src/app/services/unit.service.ts
index 6b863ee96..dc4c86438 100644
--- a/projects/editor/src/app/services/unit.service.ts
+++ b/projects/editor/src/app/services/unit.service.ts
@@ -7,7 +7,11 @@ import { FileService } from 'common/services/file.service';
import { MessageService } from 'common/services/message.service';
import { ArrayUtils } from 'common/util/array';
import { Unit, UnitProperties } from 'common/models/unit';
-import { PlayerProperties, PositionProperties } from 'common/models/elements/property-group-interfaces';
+import {
+ PlayerProperties,
+ PositionProperties,
+ PropertyGroupGenerators
+} from 'common/models/elements/property-group-interfaces';
import { DragNDropValueObject, TextLabel } from 'common/models/elements/label-interfaces';
import { Hotspot } from 'common/models/elements/input-elements/hotspot-image';
import {
@@ -209,6 +213,7 @@ export class UnitService {
section.addElement(ElementFactory.createElement({
type: elementType,
+ position: PropertyGroupGenerators.generatePositionProps(newElementProperties.position),
...newElementProperties,
id: this.idService.getAndRegisterNewID(elementType)
}) as PositionedUIElement);
@@ -274,33 +279,35 @@ export class UnitService {
this.veronaApiService.sendVoeDefinitionChangedNotification(this.unit);
}
- duplicateElementsInSection(elements: UIElement[], pageIndex: number, sectionIndex: number): void {
- const section = this.unit.pages[pageIndex].sections[sectionIndex];
- elements.forEach((element: UIElement) => {
- section.elements.push(this.duplicateElement(element) as PositionedUIElement);
+ duplicateSelectedElements(): void {
+ const selectedSection =
+ this.unit.pages[this.selectionService.selectedPageIndex].sections[this.selectionService.selectedPageSectionIndex];
+ this.selectionService.getSelectedElements().forEach((element: UIElement) => {
+ selectedSection.elements.push(this.duplicateElement(element, true) as PositionedUIElement);
});
this.veronaApiService.sendVoeDefinitionChangedNotification(this.unit);
}
- private duplicateElement(element: UIElement): UIElement {
- const newElement = ElementFactory.createElement(JSON.parse(JSON.stringify(element)));
- newElement.id = this.idService.getAndRegisterNewID(newElement.type);
+ /* - Also changes position of the element to not cover copied element.
+ - Also changes and registers all copied IDs. */
+ private duplicateElement(element: UIElement, adjustPosition: boolean = false): UIElement {
+ const newElement = element.getDuplicate();
- if (newElement.position) {
+ if (newElement.position && adjustPosition) {
newElement.position.xPosition += 10;
newElement.position.yPosition += 10;
+ newElement.position.gridRow = null;
+ newElement.position.gridColumn = null;
}
- if (newElement.type === 'likert') { // replace row Ids with fresh ones (likert)
- (newElement.rows as LikertRowElement[]).forEach((rowObject: { id: string }) => {
- rowObject.id = this.idService.getAndRegisterNewID('likert-row');
- });
- }
- if (newElement.type === 'cloze') {
- ClozeElement.getDocumentChildElements((newElement as ClozeElement).document).forEach(clozeChild => {
- clozeChild.id = this.idService.getAndRegisterNewID(clozeChild.type);
+ newElement.id = this.idService.getAndRegisterNewID(newElement.type);
+ if (newElement instanceof CompoundElement) {
+ newElement.getChildElements().forEach((child: UIElement) => {
+ child.id = this.idService.getAndRegisterNewID(child.type);
});
}
+
+ // Special care with DropLists as they are no CompoundElement yet still have children with IDs
if (newElement.type === 'drop-list') {
(newElement.value as DragNDropValueObject[]).forEach(valueObject => {
valueObject.id = this.idService.getAndRegisterNewID('value');
--
GitLab