From dcd4878d31056872b18b796921d98abdf4dadbf5 Mon Sep 17 00:00:00 2001 From: Eugene Ghanizadeh Date: Thu, 15 Feb 2024 21:32:04 +0100 Subject: [PATCH] remove element centering (#342) --- src/main/components/store/model-state.ts | 30 ++-------------- src/main/components/store/model-store.tsx | 4 +-- src/tests/unit/apollon-editor-test.tsx | 1 + .../unit/components/store/model-state-test.ts | 35 ++----------------- .../unit/test-resources/class-diagram-v2.json | 2 +- .../unit/test-resources/class-diagram.json | 2 +- .../communication-diagram-v2.json | 4 +-- .../test-resources/communication-diagram.json | 4 +-- 8 files changed, 13 insertions(+), 69 deletions(-) diff --git a/src/main/components/store/model-state.ts b/src/main/components/store/model-state.ts index 8a7e2aaf6..94f48bc76 100644 --- a/src/main/components/store/model-state.ts +++ b/src/main/components/store/model-state.ts @@ -54,7 +54,7 @@ export interface ModelState { // the boundary of the diagram is determined by some relationship. export class ModelState { - static fromModel(compatModel: UMLModelCompat, repositionRoots = true): PartialModelState { + static fromModel(compatModel: UMLModelCompat): PartialModelState { const model = backwardsCompatibleModel(compatModel); const apollonElements = model.elements; @@ -89,17 +89,6 @@ export class ModelState { return relationship; }); - if (repositionRoots) { - const roots = [...elements.filter((element) => !element.owner), ...relationships]; - const bounds = computeBoundingBoxForElements(roots); - bounds.width = Math.ceil(bounds.width / 20) * 20; - bounds.height = Math.ceil(bounds.height / 20) * 20; - for (const element of roots) { - element.bounds.x -= bounds.x + bounds.width / 2; - element.bounds.y -= bounds.y + bounds.height / 2; - } - } - // set diagram to keep diagram type const diagram: UMLDiagram = new UMLDiagram(); diagram.type = model.type as UMLDiagramType; @@ -131,7 +120,7 @@ export class ModelState { }; } - static toModel(state: ModelState, repositionRoots = true): Apollon.UMLModel { + static toModel(state: ModelState): Apollon.UMLModel { const elements = Object.values(state.elements) .map((element) => UMLElementRepository.get(element)) .reduce<{ [id: string]: UMLElement }>((acc, val) => ({ ...acc, ...(val && { [val.id]: val }) }), {}); @@ -172,21 +161,6 @@ export class ModelState { relationship.serialize(), ); - if (repositionRoots) { - const roots = [...apollonElementsArray, ...apollonRelationships].filter((element) => !element.owner); - const bounds = computeBoundingBoxForElements(roots); - bounds.width = Math.ceil(bounds.width / 20) * 20; - bounds.height = Math.ceil(bounds.height / 20) * 20; - for (const element of apollonElementsArray) { - element.bounds.x -= bounds.x; - element.bounds.y -= bounds.y; - } - for (const element of apollonRelationships) { - element.bounds.x -= bounds.x; - element.bounds.y -= bounds.y; - } - } - const interactive: Apollon.Selection = { elements: arrayToInclusionMap(state.interactive.filter((id) => UMLElement.isUMLElement(state.elements[id]))), relationships: arrayToInclusionMap( diff --git a/src/main/components/store/model-store.tsx b/src/main/components/store/model-store.tsx index 0155fc6a2..08145397c 100644 --- a/src/main/components/store/model-store.tsx +++ b/src/main/components/store/model-store.tsx @@ -49,7 +49,7 @@ export const createReduxStore = ( const patchReducer = patcher && createPatcherReducer(patcher, { - transform: (model) => ModelState.fromModel(model, false) as ModelState, + transform: (model) => ModelState.fromModel(model) as ModelState, merge, }); @@ -73,7 +73,7 @@ export const createReduxStore = ( createPatcherMiddleware(patcher, { selectDiscrete: (action) => isDiscreteAction(action) || isSelectionAction(action), selectContinuous: (action) => isContinuousAction(action), - transform: (state) => ModelState.toModel(state, false), + transform: (state) => ModelState.toModel(state), }), ] : []), diff --git a/src/tests/unit/apollon-editor-test.tsx b/src/tests/unit/apollon-editor-test.tsx index c359f216a..257471f22 100644 --- a/src/tests/unit/apollon-editor-test.tsx +++ b/src/tests/unit/apollon-editor-test.tsx @@ -26,6 +26,7 @@ afterEach(() => { }); }); +// eslint-disable-next-line @typescript-eslint/no-var-requires const testClassDiagramAsSVG = require('./test-resources/class-diagram-as-svg.json') as string; const ignoreSVGClassNames = (svgString: string): string => { diff --git a/src/tests/unit/components/store/model-state-test.ts b/src/tests/unit/components/store/model-state-test.ts index f3feabeca..89b2cf1d3 100644 --- a/src/tests/unit/components/store/model-state-test.ts +++ b/src/tests/unit/components/store/model-state-test.ts @@ -4,22 +4,14 @@ import { computeBoundingBoxForElements } from '../../../../main/utils/geometry/b import diagram from '../../test-resources/class-diagram.json'; describe('model state.', () => { - it('centers a model when imported.', () => { + it('does not center the model when imported.', () => { const state = ModelState.fromModel(diagram as any); const bounds = computeBoundingBoxForElements(Object.values(state.elements as any)); - expect(Math.abs(bounds.x + bounds.width / 2)).toBeLessThan(40); - expect(Math.abs(bounds.y + bounds.height / 2)).toBeLessThan(40); - }); - - it('does not center the model when imported, given the option.', () => { - const state = ModelState.fromModel(diagram as any, false); - const bounds = computeBoundingBoxForElements(Object.values(state.elements as any)); - expect(bounds.x).toBe(0); }); - it('puts model on 0,0 when exporting.', () => { + it('deos not put model on 0,0 when exporting.', () => { const state = ModelState.fromModel(diagram as any); expect(state.elements).toBeDefined(); state.elements && @@ -38,29 +30,6 @@ describe('model state.', () => { const exp = ModelState.toModel(state as any); const bounds = computeBoundingBoxForElements([...Object.values(exp.elements), ...Object.values(exp.relationships)]); - expect(bounds.x).toBe(0); - expect(bounds.y).toBe(0); - }); - - it('deos not put model on 0,0 when exporting, given the option.', () => { - const state = ModelState.fromModel(diagram as any); - expect(state.elements).toBeDefined(); - state.elements && - Object.values(state.elements).forEach((element) => { - if (UMLRelationship.isUMLRelationship(element)) { - element.path.forEach((point) => { - point.x += 100; - point.y += 100; - }); - } - - element.bounds.x += 100; - element.bounds.y += 100; - }); - - const exp = ModelState.toModel(state as any, false); - const bounds = computeBoundingBoxForElements([...Object.values(exp.elements), ...Object.values(exp.relationships)]); - expect(bounds.x).not.toBe(0); expect(bounds.y).not.toBe(0); }); diff --git a/src/tests/unit/test-resources/class-diagram-v2.json b/src/tests/unit/test-resources/class-diagram-v2.json index 31219a36f..7cf4db3d3 100644 --- a/src/tests/unit/test-resources/class-diagram-v2.json +++ b/src/tests/unit/test-resources/class-diagram-v2.json @@ -1,7 +1,7 @@ { "version": "2.0.0", "type": "ClassDiagram", - "size": { "width": 860, "height": 260 }, + "size": { "width": 1680, "height": 480 }, "interactive": { "elements": [], "relationships": [] }, "elements": [ { diff --git a/src/tests/unit/test-resources/class-diagram.json b/src/tests/unit/test-resources/class-diagram.json index a417921e0..d6a2f281e 100644 --- a/src/tests/unit/test-resources/class-diagram.json +++ b/src/tests/unit/test-resources/class-diagram.json @@ -1,7 +1,7 @@ { "version": "3.0.0", "type": "ClassDiagram", - "size": { "width": 860, "height": 260 }, + "size": { "width": 1680, "height": 480 }, "interactive": { "elements": {}, "relationships": {} }, "elements": { "c10b995a-036c-4e9e-aa67-0570ada5cb6a": { diff --git a/src/tests/unit/test-resources/communication-diagram-v2.json b/src/tests/unit/test-resources/communication-diagram-v2.json index a6e533fac..33dc3fe45 100644 --- a/src/tests/unit/test-resources/communication-diagram-v2.json +++ b/src/tests/unit/test-resources/communication-diagram-v2.json @@ -2,8 +2,8 @@ "version": "2.0.0", "type": "CommunicationDiagram", "size": { - "width": 380, - "height": 240 + "width": 700, + "height": 405 }, "interactive": { "elements": [], diff --git a/src/tests/unit/test-resources/communication-diagram.json b/src/tests/unit/test-resources/communication-diagram.json index 22761a833..e3a0f2376 100644 --- a/src/tests/unit/test-resources/communication-diagram.json +++ b/src/tests/unit/test-resources/communication-diagram.json @@ -2,8 +2,8 @@ "version": "3.0.0", "type": "CommunicationDiagram", "size": { - "width": 380, - "height": 240 + "width": 700, + "height": 405 }, "interactive": { "elements": {},