smig/excalidraw
1
0
Fork 0
mirror of https://github.com/excalidraw/excalidraw.git synced 2025-05-03 10:00:07 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: content background type by constant

Browse source
This commit is contained in:
Arnošt Pleskot 2023-09-20 17:20:56 +02:00
parent f6cb510f6a
commit 9f17998427
No known key found for this signature in database
2 changed files with 29 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/appState.ts
View file

@ -66,7 +66,7 @@ export const getDefaultAppState = (): Omit<
openMenu: null, openMenu: null,
openPopup: null, openPopup: null,
openSidebar: null, openSidebar: null,
openDialog: null, openDialog: "imageExport",
pasteDialog: { shown: false, data: null }, pasteDialog: { shown: false, data: null },
previousSelectedElementIds: {}, previousSelectedElementIds: {},
resizingElement: null, resizingElement: null,
@ -95,7 +95,7 @@ export const getDefaultAppState = (): Omit<
pendingImageElementId: null, pendingImageElementId: null,
showHyperlinkPopup: false, showHyperlinkPopup: false,
selectedLinearElement: null, selectedLinearElement: null,
fancyBackgroundImageKey: DEFAULT_FANCY_BACKGROUND_IMAGE, fancyBackgroundImageKey: "bubbles",
}; };
}; };

24
src/scene/fancyBackground.ts
View file

@ -7,6 +7,7 @@ import {
FANCY_BG_LOGO_BOTTOM_PADDING, FANCY_BG_LOGO_BOTTOM_PADDING,
FANCY_BG_LOGO_PADDING, FANCY_BG_LOGO_PADDING,
FANCY_BG_PADDING, FANCY_BG_PADDING,
FANCY_BG_STRETCH_CONTENT_BACKGROUND,
IMAGE_INVERT_FILTER, IMAGE_INVERT_FILTER,
SVG_NS, SVG_NS,
THEME, THEME,
@ -26,13 +27,21 @@ export const getFancyBackgroundPadding = (
], ],
includeLogo = false, includeLogo = false,
): ExportPadding => ): ExportPadding =>
exportPadding.map( FANCY_BG_STRETCH_CONTENT_BACKGROUND
? (exportPadding.map(
(padding) =>
FANCY_BG_PADDING +
FANCY_BG_LOGO_PADDING +
FANCY_BG_BORDER_RADIUS +
padding,
) as [number, number, number, number])
: (exportPadding.map(
(padding, index) => (padding, index) =>
FANCY_BG_PADDING + FANCY_BG_PADDING +
FANCY_BG_BORDER_RADIUS + FANCY_BG_BORDER_RADIUS +
padding + padding +
(index === 2 && includeLogo ? FANCY_BG_LOGO_PADDING : 0), (index === 2 && includeLogo ? FANCY_BG_LOGO_PADDING : 0),
) as [number, number, number, number]; ) as [number, number, number, number]);
const addImageBackground = ( const addImageBackground = (
context: CanvasRenderingContext2D, context: CanvasRenderingContext2D,
@ -90,6 +99,17 @@ const getContentBackgound = (
exportScale: number, exportScale: number,
includeLogo: boolean, includeLogo: boolean,
): { x: number; y: number; width: number; height: number } => { ): { x: number; y: number; width: number; height: number } => {
if (FANCY_BG_STRETCH_CONTENT_BACKGROUND) {
const padding = FANCY_BG_PADDING + FANCY_BG_LOGO_PADDING;
return {
x: padding,
y: padding,
width: normalizedCanvasDimensions.width - padding * 2,
height: normalizedCanvasDimensions.height - padding * 2,
};
}
const totalPaddingAndRadius = DEFAULT_EXPORT_PADDING + FANCY_BG_BORDER_RADIUS; const totalPaddingAndRadius = DEFAULT_EXPORT_PADDING + FANCY_BG_BORDER_RADIUS;
const width = const width =