From c749f6d87599b0ca4f403c36cfc10ff716df1727 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Cl=C3=A9ment=20Pasteau?= <4895034+ClementPasteau@users.noreply.github.com> Date: Fri, 13 Dec 2024 17:00:45 +0100 Subject: [PATCH] Move declarations up to test --- .../CustomObjectLayoutingModel.spec.js | 922 +++++++++--------- 1 file changed, 461 insertions(+), 461 deletions(-) diff --git a/newIDE/app/src/ObjectsRendering/Renderers/CustomObjectLayoutingModel.spec.js b/newIDE/app/src/ObjectsRendering/Renderers/CustomObjectLayoutingModel.spec.js index c6418604df01..f6b9591e6dbc 100644 --- a/newIDE/app/src/ObjectsRendering/Renderers/CustomObjectLayoutingModel.spec.js +++ b/newIDE/app/src/ObjectsRendering/Renderers/CustomObjectLayoutingModel.spec.js @@ -8,6 +8,263 @@ import { const gd: libGDevelop = global.gd; +class MockedChildRenderedInstance implements ChildRenderedInstance { + _instance: gdInitialInstance; + _pixiObject: { height: number }; + defaultWidth: number; + defaultHeight: number; + originX: number; + originY: number; + // TODO use this attribute to simulate TextObject children. + heightAfterUpdate: ?number; + + constructor( + childInstance: gdInitialInstance, + { + defaultWidth, + defaultHeight, + originX, + originY, + }: MockedRenderedInstanceConfiguration + ) { + this._instance = childInstance; + this._pixiObject = { height: 0 }; + this.defaultWidth = defaultWidth; + this.defaultHeight = defaultHeight; + this.originX = originX || 0; + this.originY = originY || 0; + this.heightAfterUpdate = defaultHeight; + } + + getWidth(): number { + return this._instance.hasCustomSize() + ? this._instance.getCustomWidth() + : this.getDefaultWidth(); + } + + getHeight(): number { + return this._instance.hasCustomSize() + ? this._instance.getCustomHeight() + : this.getDefaultHeight(); + } + + getDefaultWidth(): number { + return this.defaultWidth; + } + + getDefaultHeight(): number { + return this.defaultHeight; + } + + getOriginX(): number { + return (this.originX * this.getWidth()) / this.getDefaultWidth(); + } + + getOriginY(): number { + return (this.originY * this.getHeight()) / this.getDefaultHeight(); + } + + update(): void { + this._pixiObject.height = + this.heightAfterUpdate || + (this._instance.hasCustomSize() + ? this._instance.getCustomHeight() + : this.defaultHeight); + } +} + +type MockedRenderedInstanceConfiguration = {| + defaultWidth: number, + defaultHeight: number, + originX?: number, + originY?: number, +|}; + +class MockedParent implements LayoutedParent { + eventBasedObject: gdEventsBasedObject | null; + width: number; + height: number; + renderedInstances = new Map(); + layoutedInstances = new Map(); + mockedRenderedInstanceConfigurations = new Map< + string, + MockedRenderedInstanceConfiguration + >(); + + constructor( + eventBasedObject: gdEventsBasedObject, + width: number, + height: number + ) { + this.eventBasedObject = eventBasedObject; + this.width = width; + this.height = height; + } + + getWidth() { + return this.width; + } + + getHeight() { + return this.height; + } + + getDepth() { + return 0; + } + + getLayoutedInstance = (instance: gdInitialInstance): LayoutedInstance => { + let layoutedInstance = this.layoutedInstances.get(instance.ptr); + if (!layoutedInstance) { + layoutedInstance = new LayoutedInstance(instance); + this.layoutedInstances.set(instance.ptr, layoutedInstance); + } + return layoutedInstance; + }; + + getRendererOfInstance = ( + instance: gdInitialInstance + ): MockedChildRenderedInstance => { + let renderedInstance = this.renderedInstances.get(instance.ptr); + if (!renderedInstance) { + const configuration = this.mockedRenderedInstanceConfigurations.get( + instance.getObjectName() + ); + if (!configuration) { + throw new Error('Unregisted child: ' + instance.getObjectName()); + } + renderedInstance = new MockedChildRenderedInstance( + instance, + configuration + ); + this.renderedInstances.set(instance.ptr, renderedInstance); + } + return renderedInstance; + }; + + registerChild( + name: string, + configuration: MockedRenderedInstanceConfiguration + ) { + this.mockedRenderedInstanceConfigurations.set(name, configuration); + } +} + +const getHorizontalAnchorFor = ( + anchor: ?CustomObjectConfiguration_EdgeAnchor +) => + anchor === gd.CustomObjectConfiguration.MinEdge + ? 'Window left' + : anchor === gd.CustomObjectConfiguration.MaxEdge + ? 'Window right' + : anchor === gd.CustomObjectConfiguration.Center + ? 'Window center' + : anchor === gd.CustomObjectConfiguration.Proportional + ? 'Proportional' + : 'None'; + +const getVerticalAnchorFor = (anchor: ?CustomObjectConfiguration_EdgeAnchor) => + anchor === gd.CustomObjectConfiguration.MinEdge + ? 'Window top' + : anchor === gd.CustomObjectConfiguration.MaxEdge + ? 'Window bottom' + : anchor === gd.CustomObjectConfiguration.Center + ? 'Window center' + : anchor === gd.CustomObjectConfiguration.Proportional + ? 'Proportional' + : 'None'; + +const getLayoutedRenderedInstanceFor = (props: { + project: gdProject, + innerArea: { + minX: number, + minY: number, + maxX: number, + maxY: number, + }, + parent: { width: number, height: number }, + child: MockedRenderedInstanceConfiguration, + instance: { + x: number, + y: number, + customSize: { width: number, height: number } | null, + }, + anchor: { + left?: CustomObjectConfiguration_EdgeAnchor, + top?: CustomObjectConfiguration_EdgeAnchor, + right?: CustomObjectConfiguration_EdgeAnchor, + bottom?: CustomObjectConfiguration_EdgeAnchor, + } | null, +}) => { + const project = props.project; + const extension = project.insertNewEventsFunctionsExtension('MyExtension', 0); + const eventBasedObject = extension + .getEventsBasedObjects() + .insertNew('MyCustomObject', 0); + eventBasedObject.markAsInnerAreaFollowingParentSize(true); + eventBasedObject.setAreaMinX(props.innerArea.minX); + eventBasedObject.setAreaMinY(props.innerArea.minY); + eventBasedObject.setAreaMaxX(props.innerArea.maxX); + eventBasedObject.setAreaMaxY(props.innerArea.maxY); + const childrenObjects = eventBasedObject.getObjects(); + const childObject = childrenObjects.insertNewObject( + props.project, + 'Sprite', + 'Child', + 0 + ); + const anchorProps = props.anchor; + if (anchorProps) { + const anchor = childObject.addNewBehavior( + project, + 'AnchorBehavior::AnchorBehavior', + 'Anchor' + ); + anchor.updateProperty( + 'leftEdgeAnchor', + getHorizontalAnchorFor(anchorProps.left) + ); + anchor.updateProperty( + 'topEdgeAnchor', + getVerticalAnchorFor(anchorProps.top) + ); + anchor.updateProperty( + 'rightEdgeAnchor', + getHorizontalAnchorFor(anchorProps.right) + ); + anchor.updateProperty( + 'bottomEdgeAnchor', + getVerticalAnchorFor(anchorProps.bottom) + ); + } + const initialInstances = eventBasedObject.getInitialInstances(); + const initialInstance = initialInstances.insertNewInitialInstance(); + initialInstance.setObjectName('Child'); + initialInstance.setX(props.instance.x); + initialInstance.setY(props.instance.y); + const customSize = props.instance.customSize; + if (customSize) { + initialInstance.setHasCustomSize(true); + initialInstance.setCustomWidth(customSize.width); + initialInstance.setCustomHeight(customSize.height); + } + const parent = new MockedParent( + eventBasedObject, + props.parent.width, + props.parent.height + ); + parent.registerChild('Child', props.child); + + const layoutedRenderedInstance = getLayoutedRenderedInstance( + parent, + initialInstance + ); + if (!layoutedRenderedInstance) { + throw new Error('No layouted instance returned'); + } + return layoutedRenderedInstance; +}; + describe('getLayoutedRenderedInstance', () => { it('can fill the parent with a child (with custom size)', () => { const project = gd.ProjectHelper.createNewGDJSProject(); @@ -140,165 +397,28 @@ describe('getLayoutedRenderedInstance', () => { maxY: 100, }, parent: { width: 300, height: 200 }, - child: { defaultWidth: 64, defaultHeight: 64 }, - instance: { x: 0, y: 0, customSize: { width: 100, height: 100 } }, - anchor: { - left: gd.CustomObjectConfiguration.Proportional, - top: gd.CustomObjectConfiguration.Proportional, - right: gd.CustomObjectConfiguration.Proportional, - bottom: gd.CustomObjectConfiguration.Proportional, - }, - }); - const instance = layoutedRenderedInstance._instance; - expect(instance.getX()).toBe(0); - expect(instance.getY()).toBe(0); - expect(instance.hasCustomSize()).toBe(true); - expect(instance.getCustomWidth()).toBe(300); - expect(instance.getCustomHeight()).toBe(200); - - project.delete(); - }); - - describe('(anchor horizontal edge)', () => { - ['right', 'left'].forEach(objectEdge => { - it(`anchors the ${objectEdge} edge of object to window left (fixed)`, () => { - const project = gd.ProjectHelper.createNewGDJSProject(); - const layoutedRenderedInstance = getLayoutedRenderedInstanceFor({ - project, - innerArea: { - minX: 0, - minY: 0, - maxX: 1000, - maxY: 1000, - }, - parent: { width: 2000, height: 2000 }, - child: { defaultWidth: 10, defaultHeight: 10 }, - instance: { x: 500, y: 500, customSize: null }, - // $FlowIgnore - anchor: { [objectEdge]: gd.CustomObjectConfiguration.MinEdge }, - }); - const instance = layoutedRenderedInstance._instance; - expect(instance.getX()).toBe(500); - expect(instance.getY()).toBe(500); - expect(instance.hasCustomSize()).toBe(true); - expect(instance.getCustomWidth()).toBe(10); - expect(instance.getCustomHeight()).toBe(10); - - project.delete(); - }); - }); - ['right', 'left'].forEach(objectEdge => { - it(`anchors the ${objectEdge} edge of object to window right (fixed)`, () => { - const project = gd.ProjectHelper.createNewGDJSProject(); - const layoutedRenderedInstance = getLayoutedRenderedInstanceFor({ - project, - innerArea: { - minX: 0, - minY: 0, - maxX: 1000, - maxY: 1000, - }, - parent: { width: 2000, height: 2000 }, - child: { defaultWidth: 10, defaultHeight: 10 }, - instance: { x: 500, y: 500, customSize: null }, - // $FlowIgnore - anchor: { [objectEdge]: gd.CustomObjectConfiguration.MaxEdge }, - }); - const instance = layoutedRenderedInstance._instance; - expect(instance.getX()).toBe(1500); - expect(instance.getY()).toBe(500); - expect(instance.hasCustomSize()).toBe(true); - expect(instance.getCustomWidth()).toBe(10); - expect(instance.getCustomHeight()).toBe(10); - - project.delete(); - }); - }); - ['right', 'left'].forEach(objectEdge => { - it(`anchors the ${objectEdge} edge of object to window center (fixed)`, () => { - const project = gd.ProjectHelper.createNewGDJSProject(); - const layoutedRenderedInstance = getLayoutedRenderedInstanceFor({ - project, - innerArea: { - minX: 0, - minY: 0, - maxX: 1000, - maxY: 1000, - }, - parent: { width: 2000, height: 2000 }, - child: { defaultWidth: 10, defaultHeight: 10 }, - instance: { x: 500, y: 500, customSize: null }, - // $FlowIgnore - anchor: { [objectEdge]: gd.CustomObjectConfiguration.Center }, - }); - const instance = layoutedRenderedInstance._instance; - expect(instance.getX()).toBe(1000); - expect(instance.getY()).toBe(500); - expect(instance.hasCustomSize()).toBe(true); - expect(instance.getCustomWidth()).toBe(10); - expect(instance.getCustomHeight()).toBe(10); - - project.delete(); - }); - }); - - it('anchors the right and left edge of object (fixed)', () => { - const project = gd.ProjectHelper.createNewGDJSProject(); - const layoutedRenderedInstance = getLayoutedRenderedInstanceFor({ - project, - innerArea: { - minX: 0, - minY: 0, - maxX: 1000, - maxY: 1000, - }, - parent: { width: 2000, height: 2000 }, - child: { defaultWidth: 10, defaultHeight: 10 }, - instance: { x: 500, y: 500, customSize: null }, - anchor: { - left: gd.CustomObjectConfiguration.MinEdge, - right: gd.CustomObjectConfiguration.MaxEdge, - }, - }); - const instance = layoutedRenderedInstance._instance; - expect(instance.getX()).toBe(500); - expect(instance.getY()).toBe(500); - expect(instance.hasCustomSize()).toBe(true); - expect(instance.getCustomWidth()).toBe(1010); - expect(instance.getCustomHeight()).toBe(10); - - project.delete(); - }); - - it('anchors the left edge of object (proportional)', () => { - const project = gd.ProjectHelper.createNewGDJSProject(); - const layoutedRenderedInstance = getLayoutedRenderedInstanceFor({ - project, - innerArea: { - minX: 0, - minY: 0, - maxX: 1000, - maxY: 1000, - }, - parent: { width: 2000, height: 2000 }, - child: { defaultWidth: 10, defaultHeight: 10 }, - instance: { x: 500, y: 500, customSize: null }, - anchor: { left: gd.CustomObjectConfiguration.Proportional }, - }); - const instance = layoutedRenderedInstance._instance; - expect(instance.getX()).toBe(1000); - expect(instance.getY()).toBe(500); - expect(instance.hasCustomSize()).toBe(true); - expect(instance.getCustomWidth()).toBe(10); - expect(instance.getCustomHeight()).toBe(10); - - project.delete(); + child: { defaultWidth: 64, defaultHeight: 64 }, + instance: { x: 0, y: 0, customSize: { width: 100, height: 100 } }, + anchor: { + left: gd.CustomObjectConfiguration.Proportional, + top: gd.CustomObjectConfiguration.Proportional, + right: gd.CustomObjectConfiguration.Proportional, + bottom: gd.CustomObjectConfiguration.Proportional, + }, }); + const instance = layoutedRenderedInstance._instance; + expect(instance.getX()).toBe(0); + expect(instance.getY()).toBe(0); + expect(instance.hasCustomSize()).toBe(true); + expect(instance.getCustomWidth()).toBe(300); + expect(instance.getCustomHeight()).toBe(200); + + project.delete(); }); - describe('(anchor vertical edge)', () => { - ['top', 'bottom'].forEach(objectEdge => { - it(`anchors the ${objectEdge} edge of object to window top (fixed)`, () => { + describe('(anchor horizontal edge)', () => { + ['right', 'left'].forEach(objectEdge => { + it(`anchors the ${objectEdge} edge of object to window left (fixed)`, () => { const project = gd.ProjectHelper.createNewGDJSProject(); const layoutedRenderedInstance = getLayoutedRenderedInstanceFor({ project, @@ -324,8 +444,8 @@ describe('getLayoutedRenderedInstance', () => { project.delete(); }); }); - ['top', 'bottom'].forEach(objectEdge => { - it(`anchors the ${objectEdge} edge of object to window bottom (fixed)`, () => { + ['right', 'left'].forEach(objectEdge => { + it(`anchors the ${objectEdge} edge of object to window right (fixed)`, () => { const project = gd.ProjectHelper.createNewGDJSProject(); const layoutedRenderedInstance = getLayoutedRenderedInstanceFor({ project, @@ -342,8 +462,8 @@ describe('getLayoutedRenderedInstance', () => { anchor: { [objectEdge]: gd.CustomObjectConfiguration.MaxEdge }, }); const instance = layoutedRenderedInstance._instance; - expect(instance.getX()).toBe(500); - expect(instance.getY()).toBe(1500); + expect(instance.getX()).toBe(1500); + expect(instance.getY()).toBe(500); expect(instance.hasCustomSize()).toBe(true); expect(instance.getCustomWidth()).toBe(10); expect(instance.getCustomHeight()).toBe(10); @@ -351,7 +471,7 @@ describe('getLayoutedRenderedInstance', () => { project.delete(); }); }); - ['top', 'bottom'].forEach(objectEdge => { + ['right', 'left'].forEach(objectEdge => { it(`anchors the ${objectEdge} edge of object to window center (fixed)`, () => { const project = gd.ProjectHelper.createNewGDJSProject(); const layoutedRenderedInstance = getLayoutedRenderedInstanceFor({ @@ -369,8 +489,8 @@ describe('getLayoutedRenderedInstance', () => { anchor: { [objectEdge]: gd.CustomObjectConfiguration.Center }, }); const instance = layoutedRenderedInstance._instance; - expect(instance.getX()).toBe(500); - expect(instance.getY()).toBe(1000); + expect(instance.getX()).toBe(1000); + expect(instance.getY()).toBe(500); expect(instance.hasCustomSize()).toBe(true); expect(instance.getCustomWidth()).toBe(10); expect(instance.getCustomHeight()).toBe(10); @@ -379,316 +499,196 @@ describe('getLayoutedRenderedInstance', () => { }); }); - it('anchors the top and bottom edge of object (fixed)', () => { - const project = gd.ProjectHelper.createNewGDJSProject(); - const layoutedRenderedInstance = getLayoutedRenderedInstanceFor({ - project, - innerArea: { - minX: 0, - minY: 0, - maxX: 1000, - maxY: 1000, - }, - parent: { width: 2000, height: 2000 }, - child: { defaultWidth: 10, defaultHeight: 10 }, - instance: { x: 500, y: 500, customSize: null }, - anchor: { - top: gd.CustomObjectConfiguration.MinEdge, - bottom: gd.CustomObjectConfiguration.MaxEdge, - }, - }); - const instance = layoutedRenderedInstance._instance; - expect(instance.getX()).toBe(500); - expect(instance.getY()).toBe(500); - expect(instance.hasCustomSize()).toBe(true); - expect(instance.getCustomWidth()).toBe(10); - expect(instance.getCustomHeight()).toBe(1010); - - project.delete(); - }); - - it('anchors the top edge of object (proportional)', () => { + it('anchors the right and left edge of object (fixed)', () => { const project = gd.ProjectHelper.createNewGDJSProject(); const layoutedRenderedInstance = getLayoutedRenderedInstanceFor({ project, innerArea: { - minX: 0, - minY: 0, - maxX: 1000, - maxY: 1000, - }, - parent: { width: 2000, height: 2000 }, - child: { defaultWidth: 10, defaultHeight: 10 }, - instance: { x: 500, y: 500, customSize: null }, - anchor: { - top: gd.CustomObjectConfiguration.Proportional, - }, - }); - const instance = layoutedRenderedInstance._instance; - expect(instance.getX()).toBe(500); - expect(instance.getY()).toBe(1000); - expect(instance.hasCustomSize()).toBe(true); - expect(instance.getCustomWidth()).toBe(10); - expect(instance.getCustomHeight()).toBe(10); - - project.delete(); - }); - }); -}); - -const getLayoutedRenderedInstanceFor = (props: { - project: gdProject, - innerArea: { - minX: number, - minY: number, - maxX: number, - maxY: number, - }, - parent: { width: number, height: number }, - child: MockedRenderedInstanceConfiguration, - instance: { - x: number, - y: number, - customSize: { width: number, height: number } | null, - }, - anchor: { - left?: CustomObjectConfiguration_EdgeAnchor, - top?: CustomObjectConfiguration_EdgeAnchor, - right?: CustomObjectConfiguration_EdgeAnchor, - bottom?: CustomObjectConfiguration_EdgeAnchor, - } | null, -}) => { - const project = props.project; - const extension = project.insertNewEventsFunctionsExtension('MyExtension', 0); - const eventBasedObject = extension - .getEventsBasedObjects() - .insertNew('MyCustomObject', 0); - eventBasedObject.markAsInnerAreaFollowingParentSize(true); - eventBasedObject.setAreaMinX(props.innerArea.minX); - eventBasedObject.setAreaMinY(props.innerArea.minY); - eventBasedObject.setAreaMaxX(props.innerArea.maxX); - eventBasedObject.setAreaMaxY(props.innerArea.maxY); - const childrenObjects = eventBasedObject.getObjects(); - const childObject = childrenObjects.insertNewObject( - props.project, - 'Sprite', - 'Child', - 0 - ); - const anchorProps = props.anchor; - if (anchorProps) { - const anchor = childObject.addNewBehavior( - project, - 'AnchorBehavior::AnchorBehavior', - 'Anchor' - ); - anchor.updateProperty( - 'leftEdgeAnchor', - getHorizontalAnchorFor(anchorProps.left) - ); - anchor.updateProperty( - 'topEdgeAnchor', - getVerticalAnchorFor(anchorProps.top) - ); - anchor.updateProperty( - 'rightEdgeAnchor', - getHorizontalAnchorFor(anchorProps.right) - ); - anchor.updateProperty( - 'bottomEdgeAnchor', - getVerticalAnchorFor(anchorProps.bottom) - ); - } - const initialInstances = eventBasedObject.getInitialInstances(); - const initialInstance = initialInstances.insertNewInitialInstance(); - initialInstance.setObjectName('Child'); - initialInstance.setX(props.instance.x); - initialInstance.setY(props.instance.y); - const customSize = props.instance.customSize; - if (customSize) { - initialInstance.setHasCustomSize(true); - initialInstance.setCustomWidth(customSize.width); - initialInstance.setCustomHeight(customSize.height); - } - const parent = new MockedParent( - eventBasedObject, - props.parent.width, - props.parent.height - ); - parent.registerChild('Child', props.child); - - const layoutedRenderedInstance = getLayoutedRenderedInstance( - parent, - initialInstance - ); - if (!layoutedRenderedInstance) { - throw new Error('No layouted instance returned'); - } - return layoutedRenderedInstance; -}; - -const getHorizontalAnchorFor = ( - anchor: ?CustomObjectConfiguration_EdgeAnchor -) => - anchor === gd.CustomObjectConfiguration.MinEdge - ? 'Window left' - : anchor === gd.CustomObjectConfiguration.MaxEdge - ? 'Window right' - : anchor === gd.CustomObjectConfiguration.Center - ? 'Window center' - : anchor === gd.CustomObjectConfiguration.Proportional - ? 'Proportional' - : 'None'; - -const getVerticalAnchorFor = (anchor: ?CustomObjectConfiguration_EdgeAnchor) => - anchor === gd.CustomObjectConfiguration.MinEdge - ? 'Window top' - : anchor === gd.CustomObjectConfiguration.MaxEdge - ? 'Window bottom' - : anchor === gd.CustomObjectConfiguration.Center - ? 'Window center' - : anchor === gd.CustomObjectConfiguration.Proportional - ? 'Proportional' - : 'None'; - -class MockedChildRenderedInstance implements ChildRenderedInstance { - _instance: gdInitialInstance; - _pixiObject: { height: number }; - defaultWidth: number; - defaultHeight: number; - originX: number; - originY: number; - // TODO use this attribute to simulate TextObject children. - heightAfterUpdate: ?number; - - constructor( - childInstance: gdInitialInstance, - { - defaultWidth, - defaultHeight, - originX, - originY, - }: MockedRenderedInstanceConfiguration - ) { - this._instance = childInstance; - this._pixiObject = { height: 0 }; - this.defaultWidth = defaultWidth; - this.defaultHeight = defaultHeight; - this.originX = originX || 0; - this.originY = originY || 0; - this.heightAfterUpdate = defaultHeight; - } - - getWidth(): number { - return this._instance.hasCustomSize() - ? this._instance.getCustomWidth() - : this.getDefaultWidth(); - } - - getHeight(): number { - return this._instance.hasCustomSize() - ? this._instance.getCustomHeight() - : this.getDefaultHeight(); - } - - getDefaultWidth(): number { - return this.defaultWidth; - } - - getDefaultHeight(): number { - return this.defaultHeight; - } - - getOriginX(): number { - return (this.originX * this.getWidth()) / this.getDefaultWidth(); - } + minX: 0, + minY: 0, + maxX: 1000, + maxY: 1000, + }, + parent: { width: 2000, height: 2000 }, + child: { defaultWidth: 10, defaultHeight: 10 }, + instance: { x: 500, y: 500, customSize: null }, + anchor: { + left: gd.CustomObjectConfiguration.MinEdge, + right: gd.CustomObjectConfiguration.MaxEdge, + }, + }); + const instance = layoutedRenderedInstance._instance; + expect(instance.getX()).toBe(500); + expect(instance.getY()).toBe(500); + expect(instance.hasCustomSize()).toBe(true); + expect(instance.getCustomWidth()).toBe(1010); + expect(instance.getCustomHeight()).toBe(10); - getOriginY(): number { - return (this.originY * this.getHeight()) / this.getDefaultHeight(); - } + project.delete(); + }); - update(): void { - this._pixiObject.height = - this.heightAfterUpdate || - (this._instance.hasCustomSize() - ? this._instance.getCustomHeight() - : this.defaultHeight); - } -} + it('anchors the left edge of object (proportional)', () => { + const project = gd.ProjectHelper.createNewGDJSProject(); + const layoutedRenderedInstance = getLayoutedRenderedInstanceFor({ + project, + innerArea: { + minX: 0, + minY: 0, + maxX: 1000, + maxY: 1000, + }, + parent: { width: 2000, height: 2000 }, + child: { defaultWidth: 10, defaultHeight: 10 }, + instance: { x: 500, y: 500, customSize: null }, + anchor: { left: gd.CustomObjectConfiguration.Proportional }, + }); + const instance = layoutedRenderedInstance._instance; + expect(instance.getX()).toBe(1000); + expect(instance.getY()).toBe(500); + expect(instance.hasCustomSize()).toBe(true); + expect(instance.getCustomWidth()).toBe(10); + expect(instance.getCustomHeight()).toBe(10); -type MockedRenderedInstanceConfiguration = {| - defaultWidth: number, - defaultHeight: number, - originX?: number, - originY?: number, -|}; + project.delete(); + }); + }); -class MockedParent implements LayoutedParent { - eventBasedObject: gdEventsBasedObject | null; - width: number; - height: number; - renderedInstances = new Map(); - layoutedInstances = new Map(); - mockedRenderedInstanceConfigurations = new Map< - string, - MockedRenderedInstanceConfiguration - >(); + describe('(anchor vertical edge)', () => { + ['top', 'bottom'].forEach(objectEdge => { + it(`anchors the ${objectEdge} edge of object to window top (fixed)`, () => { + const project = gd.ProjectHelper.createNewGDJSProject(); + const layoutedRenderedInstance = getLayoutedRenderedInstanceFor({ + project, + innerArea: { + minX: 0, + minY: 0, + maxX: 1000, + maxY: 1000, + }, + parent: { width: 2000, height: 2000 }, + child: { defaultWidth: 10, defaultHeight: 10 }, + instance: { x: 500, y: 500, customSize: null }, + // $FlowIgnore + anchor: { [objectEdge]: gd.CustomObjectConfiguration.MinEdge }, + }); + const instance = layoutedRenderedInstance._instance; + expect(instance.getX()).toBe(500); + expect(instance.getY()).toBe(500); + expect(instance.hasCustomSize()).toBe(true); + expect(instance.getCustomWidth()).toBe(10); + expect(instance.getCustomHeight()).toBe(10); - constructor( - eventBasedObject: gdEventsBasedObject, - width: number, - height: number - ) { - this.eventBasedObject = eventBasedObject; - this.width = width; - this.height = height; - } + project.delete(); + }); + }); + ['top', 'bottom'].forEach(objectEdge => { + it(`anchors the ${objectEdge} edge of object to window bottom (fixed)`, () => { + const project = gd.ProjectHelper.createNewGDJSProject(); + const layoutedRenderedInstance = getLayoutedRenderedInstanceFor({ + project, + innerArea: { + minX: 0, + minY: 0, + maxX: 1000, + maxY: 1000, + }, + parent: { width: 2000, height: 2000 }, + child: { defaultWidth: 10, defaultHeight: 10 }, + instance: { x: 500, y: 500, customSize: null }, + // $FlowIgnore + anchor: { [objectEdge]: gd.CustomObjectConfiguration.MaxEdge }, + }); + const instance = layoutedRenderedInstance._instance; + expect(instance.getX()).toBe(500); + expect(instance.getY()).toBe(1500); + expect(instance.hasCustomSize()).toBe(true); + expect(instance.getCustomWidth()).toBe(10); + expect(instance.getCustomHeight()).toBe(10); - getWidth() { - return this.width; - } + project.delete(); + }); + }); + ['top', 'bottom'].forEach(objectEdge => { + it(`anchors the ${objectEdge} edge of object to window center (fixed)`, () => { + const project = gd.ProjectHelper.createNewGDJSProject(); + const layoutedRenderedInstance = getLayoutedRenderedInstanceFor({ + project, + innerArea: { + minX: 0, + minY: 0, + maxX: 1000, + maxY: 1000, + }, + parent: { width: 2000, height: 2000 }, + child: { defaultWidth: 10, defaultHeight: 10 }, + instance: { x: 500, y: 500, customSize: null }, + // $FlowIgnore + anchor: { [objectEdge]: gd.CustomObjectConfiguration.Center }, + }); + const instance = layoutedRenderedInstance._instance; + expect(instance.getX()).toBe(500); + expect(instance.getY()).toBe(1000); + expect(instance.hasCustomSize()).toBe(true); + expect(instance.getCustomWidth()).toBe(10); + expect(instance.getCustomHeight()).toBe(10); - getHeight() { - return this.height; - } + project.delete(); + }); + }); - getDepth() { - return 0; - } + it('anchors the top and bottom edge of object (fixed)', () => { + const project = gd.ProjectHelper.createNewGDJSProject(); + const layoutedRenderedInstance = getLayoutedRenderedInstanceFor({ + project, + innerArea: { + minX: 0, + minY: 0, + maxX: 1000, + maxY: 1000, + }, + parent: { width: 2000, height: 2000 }, + child: { defaultWidth: 10, defaultHeight: 10 }, + instance: { x: 500, y: 500, customSize: null }, + anchor: { + top: gd.CustomObjectConfiguration.MinEdge, + bottom: gd.CustomObjectConfiguration.MaxEdge, + }, + }); + const instance = layoutedRenderedInstance._instance; + expect(instance.getX()).toBe(500); + expect(instance.getY()).toBe(500); + expect(instance.hasCustomSize()).toBe(true); + expect(instance.getCustomWidth()).toBe(10); + expect(instance.getCustomHeight()).toBe(1010); - getLayoutedInstance = (instance: gdInitialInstance): LayoutedInstance => { - let layoutedInstance = this.layoutedInstances.get(instance.ptr); - if (!layoutedInstance) { - layoutedInstance = new LayoutedInstance(instance); - this.layoutedInstances.set(instance.ptr, layoutedInstance); - } - return layoutedInstance; - }; + project.delete(); + }); - getRendererOfInstance = ( - instance: gdInitialInstance - ): MockedChildRenderedInstance => { - let renderedInstance = this.renderedInstances.get(instance.ptr); - if (!renderedInstance) { - const configuration = this.mockedRenderedInstanceConfigurations.get( - instance.getObjectName() - ); - if (!configuration) { - throw new Error('Unregisted child: ' + instance.getObjectName()); - } - renderedInstance = new MockedChildRenderedInstance( - instance, - configuration - ); - this.renderedInstances.set(instance.ptr, renderedInstance); - } - return renderedInstance; - }; + it('anchors the top edge of object (proportional)', () => { + const project = gd.ProjectHelper.createNewGDJSProject(); + const layoutedRenderedInstance = getLayoutedRenderedInstanceFor({ + project, + innerArea: { + minX: 0, + minY: 0, + maxX: 1000, + maxY: 1000, + }, + parent: { width: 2000, height: 2000 }, + child: { defaultWidth: 10, defaultHeight: 10 }, + instance: { x: 500, y: 500, customSize: null }, + anchor: { + top: gd.CustomObjectConfiguration.Proportional, + }, + }); + const instance = layoutedRenderedInstance._instance; + expect(instance.getX()).toBe(500); + expect(instance.getY()).toBe(1000); + expect(instance.hasCustomSize()).toBe(true); + expect(instance.getCustomWidth()).toBe(10); + expect(instance.getCustomHeight()).toBe(10); - registerChild( - name: string, - configuration: MockedRenderedInstanceConfiguration - ) { - this.mockedRenderedInstanceConfigurations.set(name, configuration); - } -} + project.delete(); + }); + }); +});