Siklos/svg-layout-designer-react
1
1
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Final fix for XPositionReference : We are now lying to the user in the form. The transformation is applied to the value that is shown but the transformation is restored for the computing afterward

Browse source
This commit is contained in:
Eric NGUYEN 2022-08-16 16:34:32 +02:00
parent 7014f520b9
commit 1622816035
6 changed files with 59 additions and 45 deletions
Download patch file Download diff file Expand all files Collapse all files

36
src/Components/Editor/PropertiesOperations.ts
View file

@ -6,6 +6,7 @@ import { getCurrentHistory } from './Editor';
import { RecalculatePhysics } from './Behaviors/RigidBodyBehaviors';
import { INPUT_TYPES } from '../Properties/PropertiesInputTypes';
import { ImposePosition } from './Behaviors/AnchorBehaviors';
import { restoreX } from '../SVG/Elements/Container';
/**
* Handled the property change event in the properties form
@ -40,11 +41,7 @@ export function OnPropertyChange(
if (isStyle) {
(container.properties.style as any)[key] = value;
} else {
if (INPUT_TYPES[key] === 'number') {
(container.properties as any)[key] = Number(value);
} else {
(container.properties as any)[key] = value;
}
(container.properties as any)[key] = value;
}
if (container.properties.isAnchor) {
@ -104,10 +101,33 @@ export function OnPropertiesSubmit(
}
if (input instanceof HTMLInputElement) {
(container.properties as any)[property] = input.value;
if (INPUT_TYPES[property] === 'number') {
if (property === 'x') {
// Hardcoded fix for XPositionReference
const inputWidth: HTMLInputElement | null = (event.target as HTMLFormElement).querySelector('#width');
const inputRadio: HTMLDivElement | null = (event.target as HTMLFormElement).querySelector('#XPositionReference');
if (inputWidth === null || inputRadio === null) {
throw new Error('[OnPropertiesSubmit] Missing inputs for width or XPositionReference');
}
const radiobutton: HTMLInputElement | null = inputRadio.querySelector('input[name="XPositionReference"]:checked');
if (radiobutton === null) {
throw new Error('[OnPropertiesSubmit] Missing inputs for XPositionReference');
}
const x = restoreX(Number(input.value), Number(inputWidth.value), Number(radiobutton.value));
(container.properties as any)[property] = x;
continue;
}
(container.properties as any)[property] = Number(input.value);
continue;
}
(container.properties as any)[property] = input.value;
} else if (input instanceof HTMLDivElement) {
const radiobutton: HTMLInputElement | null = input.querySelector(`input[name="${property}"]:checked`);
@ -115,10 +135,12 @@ export function OnPropertiesSubmit(
continue;
}
(container.properties as any)[property] = radiobutton.value;
if (INPUT_TYPES[property] === 'number') {
(container.properties as any)[property] = Number(radiobutton.value);
continue;
}
(container.properties as any)[property] = radiobutton.value;
}
}