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

Move selectedContainerId and selectedSymbolId to Editor component

Browse source
This commit is contained in:
Eric NGUYEN 2023-02-24 14:18:53 +01:00
parent f74405f002
commit c725b107a4
11 changed files with 165 additions and 252 deletions
Download patch file Download diff file Expand all files Collapse all files

210
src/Events/EditorEvents.ts
View file

@ -4,13 +4,11 @@ import {
AddContainerToSelectedContainer as AddContainerToSelectedContainerAction
} from '../Components/Editor/Actions/AddContainer';
import {
DeleteContainer as DeleteContainerAction,
SelectContainer as SelectContainerAction
DeleteContainer as DeleteContainerAction
} from '../Components/Editor/Actions/ContainerOperations';
import {
AddSymbol as AddSymbolAction,
DeleteSymbol as DeleteSymbolAction,
SelectSymbol as SelectSymbolAction
DeleteSymbol as DeleteSymbolAction
} from '../Components/Editor/Actions/SymbolOperations';
import { GetCurrentHistory } from '../Components/Editor/Editor';
import { type IConfiguration } from '../Interfaces/IConfiguration';
@ -37,13 +35,13 @@ export const events: IEditorEvent[] = [
{ name: 'getCurrentHistoryState', func: GetCurrentHistoryState },
{ name: 'appendNewState', func: AppendNewState },
{ name: 'addContainer', func: AddContainer },
{ name: 'addContainerToSelectedContainer', func: AddContainerToSelectedContainer },
// { name: 'addContainerToSelectedContainer', func: AddContainerToSelectedContainer },
{ name: 'appendContainer', func: AppendContainer },
{ name: 'appendContainerToSelectedContainer', func: AppendContainerToSelectedContainer },
{ name: 'selectContainer', func: SelectContainer },
// { name: 'appendContainerToSelectedContainer', func: AppendContainerToSelectedContainer },
// { name: 'selectContainer', func: SelectContainer },
{ name: 'deleteContainer', func: DeleteContainer },
{ name: 'addSymbol', func: AddSymbol },
{ name: 'selectSymbol', func: SelectSymbol },
// { name: 'selectSymbol', func: SelectSymbol },
{ name: 'deleteSymbol', func: DeleteSymbol }
];
@ -203,36 +201,36 @@ function AddContainer({
root.dispatchEvent(customEvent);
}
function AddContainerToSelectedContainer({
root,
editorState,
setNewHistory,
eventInitDict
}: IEditorEventParams): void {
const {
index,
type
} = eventInitDict?.detail;
// function AddContainerToSelectedContainer({
// root,
// editorState,
// setNewHistory,
// eventInitDict
// }: IEditorEventParams): void {
// const {
// index,
// type
// } = eventInitDict?.detail;
const history = GetCurrentHistory(editorState.history, editorState.historyCurrentStep);
const currentState = history[editorState.historyCurrentStep];
// const history = GetCurrentHistory(editorState.history, editorState.historyCurrentStep);
// const currentState = history[editorState.historyCurrentStep];
const newHistory = AddContainerAction(
index,
type,
currentState.selectedContainerId,
editorState.configuration,
history,
editorState.historyCurrentStep
);
setNewHistory(newHistory);
// const newHistory = AddContainerAction(
// index,
// type,
// currentState.selectedContainerId,
// editorState.configuration,
// history,
// editorState.historyCurrentStep
// );
// setNewHistory(newHistory);
const customEvent = new CustomEvent<IHistoryState>(
'addContainerToSelectedContainer',
{ detail: structuredClone(editorState.history[editorState.historyCurrentStep]) }
);
root.dispatchEvent(customEvent);
}
// const customEvent = new CustomEvent<IHistoryState>(
// 'addContainerToSelectedContainer',
// { detail: structuredClone(editorState.history[editorState.historyCurrentStep]) }
// );
// root.dispatchEvent(customEvent);
// }
function AppendContainer({
root,
@ -267,63 +265,63 @@ function AppendContainer({
root.dispatchEvent(customEvent);
}
function AppendContainerToSelectedContainer({
root,
editorState,
setNewHistory,
eventInitDict
}: IEditorEventParams): void {
const {
type
} = eventInitDict?.detail;
// function AppendContainerToSelectedContainer({
// root,
// editorState,
// setNewHistory,
// eventInitDict
// }: IEditorEventParams): void {
// const {
// type
// } = eventInitDict?.detail;
const history = GetCurrentHistory(editorState.history, editorState.historyCurrentStep);
const currentState = history[editorState.historyCurrentStep];
// const history = GetCurrentHistory(editorState.history, editorState.historyCurrentStep);
// const currentState = history[editorState.historyCurrentStep];
const selected = FindContainerById(currentState.containers, currentState.selectedContainerId);
// const selected = FindContainerById(currentState.containers, currentState.selectedContainerId);
if (selected !== null && selected !== undefined) {
setNewHistory(AddContainerToSelectedContainerAction(
type,
selected,
editorState.configuration,
history,
editorState.historyCurrentStep
));
}
// if (selected !== null && selected !== undefined) {
// setNewHistory(AddContainerToSelectedContainerAction(
// type,
// selected,
// editorState.configuration,
// history,
// editorState.historyCurrentStep
// ));
// }
const customEvent = new CustomEvent<IHistoryState>(
'appendContainerToSelectedContainer',
{ detail: structuredClone(editorState.history[editorState.historyCurrentStep]) }
);
root.dispatchEvent(customEvent);
}
// const customEvent = new CustomEvent<IHistoryState>(
// 'appendContainerToSelectedContainer',
// { detail: structuredClone(editorState.history[editorState.historyCurrentStep]) }
// );
// root.dispatchEvent(customEvent);
// }
function SelectContainer({
root,
editorState,
setNewHistory,
eventInitDict
}: IEditorEventParams): void {
const {
containerId
} = eventInitDict?.detail;
// function SelectContainer({
// root,
// editorState,
// setNewHistory,
// eventInitDict
// }: IEditorEventParams): void {
// const {
// containerId
// } = eventInitDict?.detail;
const history = GetCurrentHistory(editorState.history, editorState.historyCurrentStep);
// const history = GetCurrentHistory(editorState.history, editorState.historyCurrentStep);
const newHistory = SelectContainerAction(
containerId,
history,
editorState.historyCurrentStep
);
setNewHistory(newHistory);
// const newHistory = SelectContainerAction(
// containerId,
// history,
// editorState.historyCurrentStep
// );
// setNewHistory(newHistory);
const customEvent = new CustomEvent<IHistoryState>(
'selectContainer',
{ detail: structuredClone(editorState.history[editorState.historyCurrentStep]) }
);
root.dispatchEvent(customEvent);
}
// const customEvent = new CustomEvent<IHistoryState>(
// 'selectContainer',
// { detail: structuredClone(editorState.history[editorState.historyCurrentStep]) }
// );
// root.dispatchEvent(customEvent);
// }
function DeleteContainer({
root,
@ -378,31 +376,31 @@ function AddSymbol({
root.dispatchEvent(customEvent);
}
function SelectSymbol({
root,
editorState,
setNewHistory,
eventInitDict
}: IEditorEventParams): void {
const {
symbolId
} = eventInitDict?.detail;
// function SelectSymbol({
// root,
// editorState,
// setNewHistory,
// eventInitDict
// }: IEditorEventParams): void {
// const {
// symbolId
// } = eventInitDict?.detail;
const history = GetCurrentHistory(editorState.history, editorState.historyCurrentStep);
// const history = GetCurrentHistory(editorState.history, editorState.historyCurrentStep);
const newHistory = SelectSymbolAction(
symbolId,
history,
editorState.historyCurrentStep
);
setNewHistory(newHistory);
// const newHistory = SelectSymbolAction(
// symbolId,
// history,
// editorState.historyCurrentStep
// );
// setNewHistory(newHistory);
const customEvent = new CustomEvent<IHistoryState>(
'SelectSymbol',
{ detail: structuredClone(editorState.history[editorState.historyCurrentStep]) }
);
root.dispatchEvent(customEvent);
}
// const customEvent = new CustomEvent<IHistoryState>(
// 'SelectSymbol',
// { detail: structuredClone(editorState.history[editorState.historyCurrentStep]) }
// );
// root.dispatchEvent(customEvent);
// }
function DeleteSymbol({
root,