diff --git a/src/pods/thumb-pages/components/thumb-page.business.spec.ts b/src/pods/thumb-pages/components/thumb-page.business.spec.ts deleted file mode 100644 index c918baf7..00000000 --- a/src/pods/thumb-pages/components/thumb-page.business.spec.ts +++ /dev/null @@ -1,29 +0,0 @@ -// calculateScaleBasedOnBounds.test.ts -import { calculateScaleBasedOnBounds } from '@/pods/thumb-pages/components/thumb-page.business'; -import { CanvasBounds } from '@/pods/toolbar/components/export-button/export-button.utils'; - -describe('calculateScaleBasedOnBounds', () => { - it('should return the correct scale when canvas bounds exceed 800x600', () => { - const canvasBounds: CanvasBounds = { x: 0, y: 0, width: 1000, height: 800 }; - const scale = calculateScaleBasedOnBounds(canvasBounds); - expect(scale).toBeCloseTo(0.225); - }); - - it('should return the correct scale when canvas bounds are smaller than 800x600', () => { - const canvasBounds: CanvasBounds = { x: 0, y: 0, width: 400, height: 300 }; - const scale = calculateScaleBasedOnBounds(canvasBounds); - expect(scale).toBeCloseTo(0.3); - }); - - it('should calculate correctly when width is smaller but height is larger than minimum values', () => { - const canvasBounds: CanvasBounds = { x: 0, y: 0, width: 400, height: 1000 }; - const scale = calculateScaleBasedOnBounds(canvasBounds); - expect(scale).toBeCloseTo(0.18); - }); - - it('should calculate correctly when height is smaller but width is larger than minimum values', () => { - const canvasBounds: CanvasBounds = { x: 0, y: 0, width: 1000, height: 400 }; - const scale = calculateScaleBasedOnBounds(canvasBounds); - expect(scale).toBeCloseTo(0.25); - }); -}); diff --git a/src/pods/thumb-pages/components/thumb-page.business.ts b/src/pods/thumb-pages/components/thumb-page.business.ts index a495a6b9..523197f3 100644 --- a/src/pods/thumb-pages/components/thumb-page.business.ts +++ b/src/pods/thumb-pages/components/thumb-page.business.ts @@ -1,5 +1,24 @@ -import { CanvasBounds } from '@/pods/toolbar/components/export-button/export-button.utils'; +import { ShapeModel } from '@/core/model'; +import { calculateCanvasBounds } from '@/pods/toolbar/components/export-button/export-button.utils'; +export const calculateScaleBasedOnBounds = (shapes: ShapeModel[]) => { + const bounds = calculateCanvasBounds(shapes); + const canvasSizeRough = { + width: bounds.x + bounds.width, + height: bounds.y + bounds.height, + }; + + const canvasSize = { + width: canvasSizeRough.width > 800 ? canvasSizeRough.width : 800, + height: canvasSizeRough.height > 600 ? canvasSizeRough.height : 600, + }; + + const scaleFactorX = 200 / canvasSize.width; + const scaleFactorY = 180 / canvasSize.height; + return Math.min(scaleFactorX, scaleFactorY); +}; + +/* export const calculateScaleBasedOnBounds = ( canvasBounds: CanvasBounds ): number => { @@ -16,4 +35,4 @@ export const calculateScaleBasedOnBounds = ( const scaleFactorX = 250 / newCanvasBounds.width; const scaleFactorY = 180 / newCanvasBounds.height; return Math.min(scaleFactorX, scaleFactorY); -}; +};*/ diff --git a/src/pods/thumb-pages/components/thumb-page.tsx b/src/pods/thumb-pages/components/thumb-page.tsx index f91864de..5157a905 100644 --- a/src/pods/thumb-pages/components/thumb-page.tsx +++ b/src/pods/thumb-pages/components/thumb-page.tsx @@ -1,7 +1,6 @@ import { ShapeRefs } from '@/core/model'; import { useCanvasContext } from '@/core/providers'; import { renderShapeComponent } from '@/pods/canvas/shape-renderer'; -import { calculateCanvasBounds } from '@/pods/toolbar/components/export-button/export-button.utils'; import { KonvaEventObject } from 'konva/lib/Node'; import { createRef, useRef } from 'react'; import { Layer, Stage } from 'react-konva'; @@ -24,9 +23,7 @@ export const ThumbPage: React.FunctionComponent = props => { const shapes = page.shapes; const fakeShapeRefs = useRef({}); - const bounds = calculateCanvasBounds(shapes); - - const finalScale = calculateScaleBasedOnBounds(bounds); + const finalScale = calculateScaleBasedOnBounds(shapes); const { showContextMenu,