diff --git a/excalidraw-app/App.tsx b/excalidraw-app/App.tsx index 932743ddfd..40c14ca3e3 100644 --- a/excalidraw-app/App.tsx +++ b/excalidraw-app/App.tsx @@ -134,6 +134,7 @@ import DebugCanvas, { } from "./components/DebugCanvas"; import { AIComponents } from "./components/AI"; import { ExcalidrawPlusIframeExport } from "./ExcalidrawPlusIframeExport"; +import { FreedrawDebugSliders } from "./components/FreedrawDebugSliders"; import "./index.scss"; @@ -1142,6 +1143,7 @@ const ExcalidrawWrapper = () => { ref={debugCanvasRef} /> )} + ); diff --git a/excalidraw-app/components/FreedrawDebugSliders.tsx b/excalidraw-app/components/FreedrawDebugSliders.tsx new file mode 100644 index 0000000000..bf8b66b111 --- /dev/null +++ b/excalidraw-app/components/FreedrawDebugSliders.tsx @@ -0,0 +1,88 @@ +import { DRAWING_CONFIGS } from "@excalidraw/element"; +import { useState, useEffect } from "react"; + +export const FreedrawDebugSliders = () => { + const [streamline, setStreamline] = useState( + DRAWING_CONFIGS.default.streamline, + ); + const [simplify, setSimplify] = useState( + DRAWING_CONFIGS.default.simplify, + ); + + useEffect(() => { + if (!window.h) { + window.h = {} as any; + } + if (!window.h.debugFreedraw) { + window.h.debugFreedraw = DRAWING_CONFIGS.default; + } + + setStreamline(window.h.debugFreedraw.streamline); + setSimplify(window.h.debugFreedraw.simplify); + }, []); + + const handleStreamlineChange = (value: number) => { + setStreamline(value); + if (window.h && window.h.debugFreedraw) { + window.h.debugFreedraw.streamline = value; + } + }; + + const handleSimplifyChange = (value: number) => { + setSimplify(value); + if (window.h && window.h.debugFreedraw) { + window.h.debugFreedraw.simplify = value; + } + }; + + return ( +
+
+ +
+
+ +
+
+ ); +}; diff --git a/packages/excalidraw/components/App.tsx b/packages/excalidraw/components/App.tsx index d7750e4dd5..6edfb88d2f 100644 --- a/packages/excalidraw/components/App.tsx +++ b/packages/excalidraw/components/App.tsx @@ -7594,9 +7594,11 @@ class App extends React.Component { simulatePressure, drawingConfigs: { pressureSensitivity: this.state.currentItemPressureSensitivity, - ...(event.pointerType === "pen" - ? DRAWING_CONFIGS.stylus - : DRAWING_CONFIGS.default), + streamline: + window.h?.debugFreedraw?.streamline ?? + DRAWING_CONFIGS.default.streamline, + simplify: + window.h?.debugFreedraw?.simplify ?? DRAWING_CONFIGS.default.simplify, }, locked: false, frameId: topLayerFrame ? topLayerFrame.id : null, @@ -11380,6 +11382,10 @@ declare global { app: InstanceType; history: History; store: Store; + debugFreedraw?: { + streamline: number; + simplify: number; + }; }; } } @@ -11388,6 +11394,9 @@ export const createTestHook = () => { if (isTestEnv() || isDevEnv()) { window.h = window.h || ({} as Window["h"]); + // Initialize debug freedraw parameters + window.h.debugFreedraw = window.h.debugFreedraw || DRAWING_CONFIGS.default; + Object.defineProperties(window.h, { elements: { configurable: true, diff --git a/packages/excalidraw/tests/data/__snapshots__/restore.test.ts.snap b/packages/excalidraw/tests/data/__snapshots__/restore.test.ts.snap index c389dc629e..cc9e0b987d 100644 --- a/packages/excalidraw/tests/data/__snapshots__/restore.test.ts.snap +++ b/packages/excalidraw/tests/data/__snapshots__/restore.test.ts.snap @@ -170,11 +170,6 @@ exports[`restoreElements > should restore freedraw element correctly 1`] = ` "backgroundColor": "transparent", "boundElements": [], "customData": undefined, - "drawingConfigs": { - "pressureSensitivity": 1, - "simplify": "0.10000", - "streamline": "0.25000", - }, "fillStyle": "solid", "frameId": null, "groupIds": [], @@ -196,6 +191,7 @@ exports[`restoreElements > should restore freedraw element correctly 1`] = ` 10, ], ], + "pressureSensitivity": 1, "pressures": [], "roughness": 1, "roundness": {