From 414263c3873617e15e782d21ac88d1c3ac114ed5 Mon Sep 17 00:00:00 2001 From: Dan Kreft Date: Tue, 27 Dec 2022 12:09:48 -0800 Subject: [PATCH] Minor cleanups --- index.html | 1 - public/vite.svg | 1 - src/assets/react.svg | 1 - src/components/App/App.jsx | 32 ++++++++++++++++++----- src/components/App/Fractal/Fractal.jsx | 8 ------ src/components/App/Fractal/lib/fractal.js | 5 ++++ src/index.css | 2 +- vite.config.js | 1 + 8 files changed, 33 insertions(+), 18 deletions(-) delete mode 100644 public/vite.svg delete mode 100644 src/assets/react.svg diff --git a/index.html b/index.html index 79c4701..b9bb266 100644 --- a/index.html +++ b/index.html @@ -2,7 +2,6 @@ - Vite + React diff --git a/public/vite.svg b/public/vite.svg deleted file mode 100644 index e7b8dfb..0000000 --- a/public/vite.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/assets/react.svg b/src/assets/react.svg deleted file mode 100644 index 6c87de9..0000000 --- a/src/assets/react.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/components/App/App.jsx b/src/components/App/App.jsx index acfd800..830998d 100644 --- a/src/components/App/App.jsx +++ b/src/components/App/App.jsx @@ -12,7 +12,12 @@ import Styles from './styles.module.sass' const PARAMS = new URLSearchParams(window.location.search) -const DIRECTION = 0 +const DEFAULTS = { + length: 500, + limit: 5, + ratio: 0.5, + shiftAngle: 60, +} const LENGTH = 500 const LIMIT = Math.pow(2, 5) + 7 const RATIO = 0.5 @@ -21,12 +26,14 @@ const SHIFT_ANGLE = 60 export default function App() { + // console.log(getDefaultState()) + const count = React.useRef(0) + const [state, setState] = useState({ - direction: Number(PARAMS.get('direction') || DIRECTION), - length: Number(PARAMS.get('length') || LENGTH), - limit: Number(PARAMS.get('limit') || LIMIT), - ratio: Number(PARAMS.get('ratio') || RATIO), - shiftAngle: Number(PARAMS.get('shiftAngle') || SHIFT_ANGLE), + length: getNumParam('length', LENGTH), + limit: getNumParam('limit', LIMIT), + ratio: getNumParam('ratio', RATIO), + shiftAngle: getNumParam('shiftAngle', SHIFT_ANGLE), }) const handleChange = useCallback(({ name, value }) => { @@ -52,3 +59,16 @@ export default function App() { ) } + +function getDefaultState() { + return Object + .entries(DEFAULTS) + .reduce((defaults, [key, value]) => ({ + ...defaults, + [key]: getNumParam(key, value), + }), {}) +} + +function getNumParam(name, defaultValue) { + return Number(PARAMS.get(name)) || defaultValue +} diff --git a/src/components/App/Fractal/Fractal.jsx b/src/components/App/Fractal/Fractal.jsx index 24a7959..87a37fd 100644 --- a/src/components/App/Fractal/Fractal.jsx +++ b/src/components/App/Fractal/Fractal.jsx @@ -11,14 +11,6 @@ import Styles from './styles.module.sass' export default function Fractal(props) { - const { - direction, - length, - limit, - ratio, - shiftAngle, - } = props - const ref = useRef() const canvasSize = useSize(ref) diff --git a/src/components/App/Fractal/lib/fractal.js b/src/components/App/Fractal/lib/fractal.js index c8801d6..58dda51 100644 --- a/src/components/App/Fractal/lib/fractal.js +++ b/src/components/App/Fractal/lib/fractal.js @@ -26,12 +26,14 @@ export default function drawFractal(canvas, opts = {}) { }) ] + let count = 0 while ( shapesToDraw.length ) { const shape = shapesToDraw.shift() lengths.add(shape.length) drawPolygon(ctx, shape, STROKE_COLOR) + ++count if ( lengths.size >= opts.limit ) { continue @@ -65,6 +67,9 @@ export default function drawFractal(canvas, opts = {}) { shapesToDraw.push(child) } } + + console.log('Shapes drawn: %o', count) + return count } function makeContext(canvas) { diff --git a/src/index.css b/src/index.css index 212195a..71ee8a9 100644 --- a/src/index.css +++ b/src/index.css @@ -30,7 +30,7 @@ a:hover { body { margin: 0; - lace-items: center; + place-items: center; height: 100%; width: 100%; } diff --git a/vite.config.js b/vite.config.js index b1b5f91..2fc5de4 100644 --- a/vite.config.js +++ b/vite.config.js @@ -3,5 +3,6 @@ import react from '@vitejs/plugin-react' // https://vitejs.dev/config/ export default defineConfig({ + base: '', plugins: [react()] })