Minor cleanups

dkreft · Dec 27, 2022 · 414263c · 414263c
1 parent e78804b
commit 414263c
Show file tree

Hide file tree

Showing 8 changed files with 33 additions and 18 deletions.
diff --git a/index.html b/index.html
@@ -2,7 +2,6 @@
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
-    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Vite + React</title>
   </head>

diff --git a/public/vite.svg b/public/vite.svg
diff --git a/src/assets/react.svg b/src/assets/react.svg
diff --git 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() {
     </div>
   )
 }
+
+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
@@ -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
@@ -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
@@ -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
@@ -3,5 +3,6 @@ import react from '@vitejs/plugin-react'
 
 // https://vitejs.dev/config/
 export default defineConfig({
+  base: '',
   plugins: [react()]
 })