Commit add6524b authored by rhenck's avatar rhenck
Browse files

Fix setting sub-properties

Player, Posiiton, Styling
parent 3943a461
......@@ -21,7 +21,19 @@ export abstract class UIElement {
}
setProperty(property: string, value: UIElementValue): void {
(this as UIElement)[property] = value;
this[property] = value;
}
setStyleProperty(property: string, value: any): void {
(this.styling as { [key: string]: any })[property] = value;
}
setPositionProperty(property: string, value: any): void {
(this.position as { [key: string]: any })[property] = value;
}
setPlayerProperty(property: string, value: any): void {
(this.player as { [key: string]: any })[property] = value;
}
}
......
......@@ -52,45 +52,45 @@ export abstract class ElementFactory {
console.log('createElement', elementType, defaultValues);
switch (elementType) {
case 'text':
return new TextElement(defaultValues as TextElement);
return new TextElement({ type: elementType, ...defaultValues } as TextElement);
case 'button':
return new ButtonElement(defaultValues as ButtonElement);
return new ButtonElement({ type: elementType, ...defaultValues } as ButtonElement);
case 'text-field':
return new TextFieldElement(defaultValues as TextFieldElement);
return new TextFieldElement({ type: elementType, ...defaultValues } as TextFieldElement);
case 'text-field-simple':
return new TextFieldSimpleElement(defaultValues as TextFieldSimpleElement);
return new TextFieldSimpleElement({ type: elementType, ...defaultValues } as TextFieldSimpleElement);
case 'text-area':
return new TextAreaElement(defaultValues as TextAreaElement);
return new TextAreaElement({ type: elementType, ...defaultValues } as TextAreaElement);
case 'checkbox':
return new CheckboxElement(defaultValues as CheckboxElement);
return new CheckboxElement({ type: elementType, ...defaultValues } as CheckboxElement);
case 'dropdown':
return new DropdownElement(defaultValues as DropdownElement);
return new DropdownElement({ type: elementType, ...defaultValues } as DropdownElement);
case 'radio':
return new RadioButtonGroupElement(defaultValues as RadioButtonGroupElement);
return new RadioButtonGroupElement({ type: elementType, ...defaultValues } as RadioButtonGroupElement);
case 'image':
return new ImageElement(defaultValues as ImageElement);
return new ImageElement({ type: elementType, ...defaultValues } as ImageElement);
case 'audio':
return new AudioElement(defaultValues as AudioElement);
return new AudioElement({ type: elementType, ...defaultValues } as AudioElement);
case 'video':
return new VideoElement(defaultValues as VideoElement);
return new VideoElement({ type: elementType, ...defaultValues } as VideoElement);
case 'likert':
return new LikertElement(defaultValues as LikertElement);
return new LikertElement({ type: elementType, ...defaultValues } as LikertElement);
case 'radio-group-images':
return new RadioButtonGroupComplexElement(defaultValues as RadioButtonGroupComplexElement);
return new RadioButtonGroupComplexElement({ type: elementType, ...defaultValues } as RadioButtonGroupComplexElement);
case 'drop-list':
return new DropListElement(defaultValues as DropListElement);
return new DropListElement({ type: elementType, ...defaultValues } as DropListElement);
case 'drop-list-simple':
return new DropListSimpleElement(defaultValues as DropListSimpleElement);
return new DropListSimpleElement({ type: elementType, ...defaultValues } as DropListSimpleElement);
case 'cloze':
return new ClozeElement(defaultValues as ClozeElement);
return new ClozeElement({ type: elementType, ...defaultValues } as ClozeElement);
case 'slider':
return new SliderElement(defaultValues as SliderElement);
return new SliderElement({ type: elementType, ...defaultValues } as SliderElement);
case 'spell-correct':
return new SpellCorrectElement(defaultValues as SpellCorrectElement);
return new SpellCorrectElement({ type: elementType, ...defaultValues } as SpellCorrectElement);
case 'frame':
return new FrameElement(defaultValues as FrameElement);
return new FrameElement({ type: elementType, ...defaultValues } as FrameElement);
case 'toggle-button':
return new ToggleButtonElement(defaultValues as ToggleButtonElement);
return new ToggleButtonElement({ type: elementType, ...defaultValues } as ToggleButtonElement);
default:
throw new Error(`ElementType ${elementType} not found!`);
}
......
......@@ -50,7 +50,7 @@ export class CanvasComponent {
if (this.page.hasMaxWidth && newXPosition > this.page.maxWidth - element.width) {
newXPosition = this.page.maxWidth - element.width;
}
this.unitService.updateElementProperty([element], 'xPosition', newXPosition);
this.unitService.updateElementsPositionProperty([element], 'xPosition', newXPosition);
let newYPosition = element.position.yPosition + event.distance.y;
if (newYPosition < 0) {
......@@ -59,7 +59,7 @@ export class CanvasComponent {
if (newYPosition > this.getPageHeight() - element.height) {
newYPosition = this.getPageHeight() - element.height;
}
this.unitService.updateElementProperty([element], 'yPosition', newYPosition);
this.unitService.updateElementsPositionProperty([element], 'yPosition', newYPosition);
});
}
}
......
......@@ -109,23 +109,23 @@ export class DynamicSectionHelperGridComponent implements OnInit, OnChanges {
});
}
if (dragItemData.dragType === 'move') {
this.unitService.updateElementProperty(
this.unitService.updateElementsProperty(
[event.item.data.element],
'gridColumn',
event.container.data.gridCoordinates![0]
);
this.unitService.updateElementProperty(
this.unitService.updateElementsProperty(
[dragItemData.element],
'gridRow',
event.container.data.gridCoordinates![1]
);
} else if (event.item.data.dragType === 'resize') {
this.unitService.updateElementProperty(
this.unitService.updateElementsProperty(
[dragItemData.element],
'gridColumnEnd',
event.container.data.gridCoordinates![0] + 1
);
this.unitService.updateElementProperty(
this.unitService.updateElementsProperty(
[dragItemData.element],
'gridRowEnd',
event.container.data.gridCoordinates![1] + 1
......
......@@ -65,12 +65,12 @@ export class StaticCanvasOverlayComponent extends CanvasElementOverlay {
}
updateModel(event: CdkDragEnd): void {
this.unitService.updateElementProperty(
this.unitService.updateElementsProperty(
this.selectionService.getSelectedElements(),
'width',
Math.max(this.oldX + event.distance.x, 0)
);
this.unitService.updateElementProperty(
this.unitService.updateElementsProperty(
this.selectionService.getSelectedElements(),
'height',
Math.max(this.oldY + event.distance.y, 0)
......
......@@ -29,8 +29,7 @@
<aspect-element-postion-properties [dimensions]="{ width: combinedProperties.width,
height: combinedProperties.height,
dynamicWidth: $any(combinedProperties.dynamicWidth)}"
[positionProperties]="combinedProperties.position"
(updateModel)="updateModel($event.property, $event.value, $event.isInputValid)">
[positionProperties]="combinedProperties.position">
</aspect-element-postion-properties>
</mat-tab>
......@@ -38,8 +37,7 @@
<ng-template mat-tab-label>
<mat-icon class="example-tab-icon">palette</mat-icon>
</ng-template>
<aspect-element-style-properties [styles]="$any(combinedProperties.styling)"
(updateModel)="updateModel($event.property, $event.value)">
<aspect-element-style-properties [styles]="$any(combinedProperties.styling)">
</aspect-element-style-properties>
</mat-tab>
</mat-tab-group>
......
......@@ -94,7 +94,7 @@ export class ElementPropertiesPanelComponent implements OnInit, OnDestroy {
TextImageLabel[] | DragNDropValueObject[] | null,
isInputValid: boolean | null = true): void {
if (isInputValid) {
this.unitService.updateElementProperty(this.selectedElements, property, value);
this.unitService.updateElementsProperty(this.selectedElements, property, value);
} else {
this.messageService.showWarning(this.translateService.instant('inputInvalid'));
}
......
......@@ -8,12 +8,11 @@ import { UnitService } from '../../../services/unit.service';
import {
TextImageLabel,
DragNDropValueObject,
InputElementValue
} from 'common/interfaces/elements';
import { SelectionService } from '../../../services/selection.service';
import { DialogService } from '../../../services/dialog.service';
import { DomSanitizer } from '@angular/platform-browser';
import { UIElement } from 'common/classes/element';
import { InputElementValue, UIElement } from 'common/classes/element';
import { LikertRowElement } from 'common/ui-elements/likert/likert-row';
import { LikertElement } from 'common/ui-elements/likert/likert';
......@@ -105,24 +104,24 @@ export class ElementModelPropertiesComponent {
.subscribe((result: LikertRowElement) => {
if (result) {
if (result.id !== row.id) {
this.unitService.updateElementProperty(
this.unitService.updateElementsProperty(
[row],
'id',
result.id
);
}
if (result.rowLabel !== row.rowLabel) {
this.unitService.updateElementProperty([row], 'rowLabel', result.rowLabel);
this.unitService.updateElementsProperty([row], 'rowLabel', result.rowLabel);
}
if (result.value !== row.value) {
this.unitService.updateElementProperty(
this.unitService.updateElementsProperty(
[row],
'value',
result.value
);
}
if (result.verticalButtonAlignment !== row.verticalButtonAlignment) {
this.unitService.updateElementProperty(
this.unitService.updateElementsProperty(
[row],
'verticalButtonAlignment',
result.verticalButtonAlignment
......
import {
Component, Input, Output, EventEmitter
Component, Input
} from '@angular/core';
import { UnitService } from '../../../services/unit.service';
import { SelectionService } from '../../../services/selection.service';
......@@ -9,14 +9,17 @@ import { PositionedUIElement, PositionProperties } from 'common/classes/element'
selector: 'aspect-element-postion-properties',
template: `
<div fxLayout="column">
<aspect-position-field-set *ngIf="positionProperties"
[positionProperties]="positionProperties"
(updateModel)="this.updateModel.emit($event)">
<aspect-position-field-set
*ngIf="positionProperties"
[positionProperties]="positionProperties"
(updateModel)="unitService.updateSelectedElementsPositionProperty($event.property, $event.value)">
</aspect-position-field-set>
<aspect-dimension-field-set [positionProperties]="positionProperties"
[dimensions]="dimensions"
(updateModel)="this.updateModel.emit($event)">
<aspect-dimension-field-set
[positionProperties]="positionProperties"
[dimensions]="dimensions"
(updateModel)="unitService.updateElementsProperty(
this.selectionService.getSelectedElements(), $event.property, $event.value)">
</aspect-dimension-field-set>
<ng-container *ngIf="(selectionService.selectedElements | async)!.length > 1">
......@@ -47,10 +50,8 @@ import { PositionedUIElement, PositionProperties } from 'common/classes/element'
export class ElementPositionPropertiesComponent {
@Input() dimensions!: { width: number; height: number; dynamicWidth: boolean; };
@Input() positionProperties: PositionProperties | undefined;
@Output() updateModel =
new EventEmitter<{ property: string; value: string | number | boolean, isInputValid?: boolean | null }>();
constructor(private unitService: UnitService, public selectionService: SelectionService) { }
constructor(public unitService: UnitService, public selectionService: SelectionService) { }
alignElements(direction: 'left' | 'right' | 'top' | 'bottom'): void {
this.unitService.alignElements(this.selectionService.getSelectedElements() as PositionedUIElement[], direction);
......
......@@ -2,6 +2,7 @@ import {
Component, EventEmitter, Input, Output
} from '@angular/core';
import { BasicStyles, ExtendedStyles } from 'common/classes/element';
import { UnitService } from 'editor/src/app/services/unit.service';
@Component({
selector: 'aspect-element-style-properties',
......@@ -9,7 +10,7 @@ import { BasicStyles, ExtendedStyles } from 'common/classes/element';
<div fxLayout="column">
<mat-checkbox *ngIf="styles.lineColoring !== undefined"
[checked]="$any(styles.lineColoring)"
(change)="updateModel.emit({ property: 'lineColoring', value: $event.checked })">
(change)="unitService.updateSelectedElementsStyleProperty('lineColoring', $event.checked)">
{{'propertiesPanel.lineColoring' | translate }}
</mat-checkbox>
......@@ -17,123 +18,119 @@ import { BasicStyles, ExtendedStyles } from 'common/classes/element';
appearance="fill" class="mdInput textsingleline">
<mat-label>{{'propertiesPanel.lineColoringColor' | translate }}</mat-label>
<input matInput type="text" [value]="styles.lineColoringColor"
(input)="updateModel.emit({ property: 'lineColoringColor', value: $any($event.target).value })">
(input)="unitService.updateSelectedElementsStyleProperty('lineColoringColor', $any($event.target).value)">
<button mat-icon-button matSuffix (click)="lineColorInput.click()">
<mat-icon>edit</mat-icon>
</button>
</mat-form-field>
<input matInput type="color" hidden #lineColorInput
[value]="styles.lineColoringColor"
(input)="updateModel.emit({ property: 'lineColoringColor', value: $any($event.target).value })">
(input)="unitService.updateSelectedElementsStyleProperty('lineColoringColor', $any($event.target).value)">
<mat-form-field *ngIf="styles.selectionColor !== undefined" appearance="fill">
<mat-label>{{'propertiesPanel.selectionColor' | translate }}</mat-label>
<input matInput type="text" [value]="styles.selectionColor"
(input)="updateModel.emit({ property: 'selectionColor', value: $any($event.target).value })">
(input)="unitService.updateSelectedElementsStyleProperty('selectionColor', $any($event.target).value)">
<button mat-icon-button matSuffix (click)="selectionColorInput.click()">
<mat-icon>edit</mat-icon>
</button>
</mat-form-field>
<input matInput type="color" hidden #selectionColorInput
[value]="styles.selectionColor"
(input)="updateModel.emit({ property: 'selectionColor', value: $any($event.target).value })">
(input)="unitService.updateSelectedElementsStyleProperty('selectionColor', $any($event.target).value)">
<mat-form-field *ngIf="styles.borderRadius !== undefined" appearance="fill">
<mat-label>{{'propertiesPanel.borderRadius' | translate }}</mat-label>
<input matInput type="number" [ngModel]="styles.borderRadius"
(input)="updateModel.emit({ property: 'borderRadius', value: $any($event.target).value })">
(input)="unitService.updateSelectedElementsStyleProperty('borderRadius', $any($event.target).value)">
</mat-form-field>
<mat-form-field *ngIf="styles.itemBackgroundColor !== undefined"
appearance="fill" class="mdInput textsingleline">
<mat-label>{{'propertiesPanel.itemBackgroundColor' | translate }}</mat-label>
<input matInput type="text" [value]="styles.itemBackgroundColor"
(input)="updateModel.emit({ property: 'itemBackgroundColor', value: $any($event.target).value })">
(input)="unitService.updateSelectedElementsStyleProperty('itemBackgroundColor', $any($event.target).value)">
<button mat-icon-button matSuffix (click)="itembackgroundColorInput.click()">
<mat-icon>edit</mat-icon>
</button>
</mat-form-field>
<input matInput type="color" hidden #itembackgroundColorInput
[value]="styles.itemBackgroundColor"
(input)="updateModel.emit({ property: 'itemBackgroundColor', value: $any($event.target).value })">
(input)="unitService.updateSelectedElementsStyleProperty('itemBackgroundColor', $any($event.target).value)">
<mat-form-field *ngIf="styles.backgroundColor !== undefined"
appearance="fill" class="mdInput textsingleline">
<mat-label>{{'propertiesPanel.backgroundColor' | translate }}</mat-label>
<input matInput type="text" [value]="styles.backgroundColor"
(input)="updateModel.emit({ property: 'backgroundColor', value: $any($event.target).value })">
(input)="unitService.updateSelectedElementsStyleProperty('backgroundColor', $any($event.target).value)">
<button mat-icon-button matSuffix (click)="backgroundColorInput.click()">
<mat-icon>edit</mat-icon>
</button>
</mat-form-field>
<input matInput type="color" hidden #backgroundColorInput
[value]="styles.backgroundColor"
(input)="updateModel.emit({ property: 'backgroundColor', value: $any($event.target).value })">
(input)="unitService.updateSelectedElementsStyleProperty('backgroundColor', $any($event.target).value)">
<mat-form-field *ngIf="styles.borderColor !== undefined"
appearance="fill" class="mdInput textsingleline">
<mat-label>{{'propertiesPanel.borderColor' | translate }}</mat-label>
<input matInput type="text" [value]="styles.borderColor"
(input)="updateModel.emit({ property: 'borderColor', value: $any($event.target).value })">
(input)="unitService.updateSelectedElementsStyleProperty('borderColor', $any($event.target).value)">
<button mat-icon-button matSuffix (click)="borderColorInput.click()">
<mat-icon>edit</mat-icon>
</button>
</mat-form-field>
<input matInput type="color" hidden #borderColorInput
[value]="styles.borderColor"
(input)="updateModel.emit({ property: 'borderColor', value: $any($event.target).value })">
(input)="unitService.updateSelectedElementsStyleProperty('borderColor', $any($event.target).value)">
<mat-form-field *ngIf="styles.fontColor !== undefined"
appearance="fill" class="mdInput textsingleline">
<mat-label>{{'propertiesPanel.fontColor' | translate }}</mat-label>
<input matInput type="text" [value]="styles.fontColor"
(input)="updateModel.emit({ property: 'fontColor', value: $any($event.target).value })">
(input)="unitService.updateSelectedElementsStyleProperty('fontColor', $any($event.target).value)">
<button mat-icon-button matSuffix (click)="fontColorInput.click()">
<mat-icon>edit</mat-icon>
</button>
</mat-form-field>
<input matInput type="color" hidden #fontColorInput
[value]="styles.fontColor"
(input)="updateModel.emit({ property: 'fontColor', value: $any($event.target).value })">
(input)="unitService.updateSelectedElementsStyleProperty('fontColor', $any($event.target).value)">
<mat-form-field *ngIf="styles.font !== undefined"
appearance="fill" class="mdInput textsingleline">
<mat-label>{{'propertiesPanel.font' | translate }}</mat-label>
<input matInput type="text" [value]="styles.font" disabled
(input)="updateModel.emit({ property: 'font', value: $any($event.target).value })">
(input)="unitService.updateSelectedElementsStyleProperty('font', $any($event.target).value)">
</mat-form-field>
<mat-form-field *ngIf="styles.fontSize !== undefined"
appearance="fill" class="mdInput textsingleline">
<mat-label>{{'propertiesPanel.fontSize' | translate }}</mat-label>
<input matInput type="number" #fontSize="ngModel" min="0"
[ngModel]="styles.fontSize"
(ngModelChange)="updateModel.emit({ property: 'fontSize',
value: $event,
isInputValid: fontSize.valid && $event !== null})">
(ngModelChange)="unitService.updateSelectedElementsStyleProperty('fontSize', $event)">
</mat-form-field>
<mat-form-field *ngIf="styles.lineHeight !== undefined"
appearance="fill" class="mdInput textsingleline">
<mat-label>{{'propertiesPanel.lineHeight' | translate }}</mat-label>
<input matInput type="number" #lineHeight="ngModel" min="0"
[ngModel]="styles.lineHeight"
(ngModelChange)="updateModel.emit({ property: 'lineHeight',
value: $event,
isInputValid: lineHeight.valid && $event !== null })">
(ngModelChange)="unitService.updateSelectedElementsStyleProperty('lineHeight', $event)">
</mat-form-field>
<mat-checkbox *ngIf="styles.bold !== undefined"
[checked]="$any(styles.bold)"
(change)="updateModel.emit({ property: 'bold', value: $event.checked })">
(change)="unitService.updateSelectedElementsStyleProperty('bold', $event.checked)">
{{'propertiesPanel.bold' | translate }}
</mat-checkbox>
<mat-checkbox *ngIf="styles.italic !== undefined"
[checked]="$any(styles.italic)"
(change)="updateModel.emit({ property: 'italic', value: $event.checked })">
(change)="unitService.updateSelectedElementsStyleProperty('italic', $event.checked)">
{{'propertiesPanel.italic' | translate }}
</mat-checkbox>
<mat-checkbox *ngIf="styles.underline !== undefined"
[checked]="$any(styles.underline)"
(change)="updateModel.emit({ property: 'underline', value: $event.checked })">
(change)="unitService.updateSelectedElementsStyleProperty('underline', $event.checked)">
{{'propertiesPanel.underline' | translate }}
</mat-checkbox>
......@@ -141,7 +138,7 @@ import { BasicStyles, ExtendedStyles } from 'common/classes/element';
appearance="fill">
<mat-label>{{'propertiesPanel.borderStyle' | translate }}</mat-label>
<mat-select [value]="styles.borderStyle"
(selectionChange)="updateModel.emit({ property: 'borderStyle', value: $event.value })">
(selectionChange)="unitService.updateSelectedElementsStyleProperty('borderStyle', $event.value)">
<mat-option *ngFor="let option of ['solid', 'dotted', 'dashed',
'double', 'groove', 'ridge', 'inset', 'outset']"
[value]="option">
......@@ -153,20 +150,15 @@ import { BasicStyles, ExtendedStyles } from 'common/classes/element';
<mat-form-field *ngIf="styles.borderWidth !== undefined"
appearance="fill" class="mdInput textsingleline">
<mat-label>{{'propertiesPanel.borderWidth' | translate }}</mat-label>
<input matInput type="number" #borderWidth="ngModel" min="0"
<input matInput type="number" #borderWidth="ngModel"
[ngModel]="styles.borderWidth"
(ngModelChange)="updateModel.emit({ property: 'borderWidth',
value: $event,
isInputValid: borderWidth.valid && $event !== null })">
(ngModelChange)="unitService.updateSelectedElementsStyleProperty('borderWidth', $event)">
</mat-form-field>
</div>
`
})
export class ElementStylePropertiesComponent {
@Input() styles!: BasicStyles & ExtendedStyles;
@Output() updateModel = new EventEmitter<{
property: string;
value: string | boolean,
isInputValid?: boolean | null
}>();
constructor(public unitService: UnitService) { }
}
......@@ -139,7 +139,6 @@ export class UnitService {
}
newElement = ElementFactory.createElement(
elementType, {
type: elementType,
id: this.idService.getNewID(elementType),
src: mediaSrc,
position: {
......@@ -149,7 +148,6 @@ export class UnitService {
} else {
newElement = ElementFactory.createElement(
elementType, {
type: elementType,
id: this.idService.getNewID(elementType),
position: {
dynamicPositioning: section.dynamicPositioning
......@@ -253,10 +251,10 @@ export class UnitService {
this.veronaApiService.sendVoeDefinitionChangedNotification(this.unit);
}
updateElementProperty(elements: UIElement[],
property: string,
value: InputElementValue | TextImageLabel | TextImageLabel[] | ClozeDocument |
DragNDropValueObject[] | null): void {
updateElementsProperty(elements: UIElement[],
property: string,
value: InputElementValue | TextImageLabel | TextImageLabel[] | ClozeDocument |
DragNDropValueObject[] | null): void {
console.log('updateElementProperty', elements, property, value);
elements.forEach(element => {
if (property === 'id') {
......@@ -277,21 +275,7 @@ export class UnitService {
(element as LikertElement).rows.forEach(row => {
row.readOnly = value as boolean;
});
// } else if (['fixedSize', 'dynamicPositioning', 'xPosition', 'yPosition', 'useMinHeight', 'gridColumn',
// 'gridColumnRange', 'gridRow', 'gridRowRange', 'marginLeft', 'marginRight', 'marginTop',
// 'marginBottom', 'zIndex'].includes(property)) {
// element.position![property] = Copy.getCopy(value);
// } else if (['fontColor', 'font', 'fontSize', 'lineHeight', 'bold', 'italic', 'underline',
// 'backgroundColor', 'borderRadius', 'itemBackgroundColor', 'borderWidth', 'borderColor', 'selectionColor',
// 'borderStyle', 'lineColoring', 'lineColoringColor'].includes(property)) {
// element.styling![property] = Copy.getCopy(value);
// } else if (['autostart', 'autostartDelay', 'loop', 'startControl', 'pauseControl',
// 'progressBar', 'interactiveProgressbar', 'volumeControl', 'defaultVolume', 'minVolume',
// 'muteControl', 'interactiveMuteControl', 'hintLabel', 'hintLabelDelay', 'activeAfterID',
// 'minRuns', 'maxRuns', 'showRestRuns', 'showRestTime', 'playbackTime'].includes(property)) {
// element.player![property] = Copy.getCopy(value);
} else {
// element[property] = Copy.getCopy(value);
element.setProperty(property, value);
}
});
......@@ -299,6 +283,35 @@ export class UnitService {
this.veronaApiService.sendVoeDefinitionChangedNotification(this.unit);
}
updateSelectedElementsPositionProperty(property: string, value: any): void {
this.updateElementsPositionProperty(this.selectionService.getSelectedElements(), property, value);
}
updateElementsPositionProperty(elements: UIElement[], property: string, value: any): void {
elements.forEach(element => {
element.setPositionProperty(property, value);
});
this.elementPropertyUpdated.next();
this.veronaApiService.sendVoeDefinitionChangedNotification(this.unit);
}
updateSelectedElementsStyleProperty(property: string, value: any): void {
const elements = this.selectionService.getSelectedElements();
elements.forEach(element => {
element.setStyleProperty(property, value);
});
this.elementPropertyUpdated.next();
this.veronaApiService.sendVoeDefinitionChangedNotification(this.unit);
}
updateElementsPlayerProperty(elements: UIElement[], property: string, value: any): void {
elements.forEach(element => {
element.setPlayerProperty(property, value);
});
this.elementPropertyUpdated.next();
this.veronaApiService.sendVoeDefinitionChangedNotification(this.unit);
}
createLikertRowElement(rowLabelText: string, columnCount: number): LikertRowElement {
return new LikertRowElement({
id: this.idService.getNewID('likert_row'),
......@@ -314,28 +327,28 @@ export class UnitService {
alignElements(elements: PositionedUIElement[], alignmentDirection: 'left' | 'right' | 'top' | 'bottom'): void {
switch (alignmentDirection) {
case 'left':
this.updateElementProperty(
this.updateElementsProperty(
elements,
'xPosition',
Math.min(...elements.map(element => element.position.xPosition))
);
break;
case 'right':
this.updateElementProperty(