fixed physics build bug

index.html

@@ -4,8 +4,8 @@
 		<title>Orion Reed</title>
 		<meta charset="UTF-8" />
 		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
-		<link rel="icon" type="image/x-icon" href="src/assets/favicon.ico?v=4" />
+		<link rel="icon" type="image/x-icon" href="src/public/favicon.ico?v=4" />
-		<link rel="shortcut icon" type="image/x-icon" href="src/assets/favicon.ico?v=4" />
+		<link rel="shortcut icon" type="image/x-icon" href="src/public/favicon.ico?v=4" />
 		<link rel="preconnect" href="https://fonts.googleapis.com" />
 		<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
 		<link

package.json

@@ -6,13 +6,13 @@
 	"scripts": {
 		"dev": "vite",
 		"build": "tsc && vite build --base=./",
-		"preview": "vite preview"
+		"preview": "tsc && vite build --base=./ && vite preview"
 	},
 	"keywords": [],
 	"author": "Orion Reed",
 	"license": "ISC",
 	"dependencies": {
-		"@dimforge/rapier2d": "latest",
+		"@dimforge/rapier2d": "^0.11.2",
 		"@tldraw/tldraw": "2.0.2",
 		"react": "^18.2.0",
 		"react-dom": "^18.2.0",
@@ -29,4 +29,4 @@
 		"vite-plugin-top-level-await": "^1.3.1",
 		"vite-plugin-wasm": "^3.2.2"
 	}
-}
+}

src/App.tsx

@@ -2,13 +2,13 @@ import "@tldraw/tldraw/tldraw.css";
 import "@/css/style.css"
 import React, { } from "react";
 import ReactDOM from "react-dom/client";
-import { Default } from "@/ts/components/Default";
+import { Default } from "@/components/Default";
-import { Canvas } from "@/ts/components/Canvas";
+import { Canvas } from "@/components/Canvas";
-import { Toggle } from "@/ts/components/Toggle";
+import { Toggle } from "@/components/Toggle";
-import { usePhysics } from "@/ts/hooks/usePhysics.ts"
+import { usePhysics } from "@/hooks/usePhysics"
 import { createShapes } from "@/utils";
 import { BrowserRouter, Route, Routes } from 'react-router-dom';
-import { Contact } from "@/ts/components/Contact.tsx";
+import { Contact } from "@/components/Contact";
 
 ReactDOM.createRoot(document.getElementById("root")!).render(<App />);
 

src/components/Canvas.tsx

@@ -1,6 +1,6 @@
 import { Tldraw, TLShape, TLUiComponents } from "@tldraw/tldraw";
-import { SimController } from "@/ts/physics/PhysicsControls";
+import { SimController } from "@/physics/PhysicsControls";
-import { HTMLShapeUtil } from "@/ts/shapes/HTMLShapeUtil";
+import { HTMLShapeUtil } from "@/shapes/HTMLShapeUtil";
 
 const components: TLUiComponents = {
   HelpMenu: null,

src/components/Toggle.tsx

@@ -2,7 +2,7 @@ export function Toggle() {
   return (
     <>
       <button id="toggle-physics" onClick={() => window.dispatchEvent(new CustomEvent('togglePhysicsEvent'))}>
-        <img src="assets/gravity.svg" alt="Toggle Physics" />
+        <img src="/gravity-button.svg" alt="Toggle Physics" />
       </button>
     </>
   );

src/css/style.css

@@ -142,7 +142,8 @@ ul {
 
 .fade-out {
   opacity: 0 !important;
-  transition: opacity 0.2s ease-in-out;
+  transition: opacity 0.5s ease-in-out;
+  transition-delay: 0.25s;
   /* visibility: hidden; */
   /* display: none; */
 }

src/physics/simulation.ts

@@ -9,7 +9,7 @@ type BodyWithShapeData = RAPIER.RigidBody & {
 };
 type RigidbodyLookup = { [key: TLShapeId]: RAPIER.RigidBody };
 
-const START_DELAY = 1500;
+const START_DELAY = 500;
 
 export class PhysicsWorld {
   private editor: Editor;
@@ -30,7 +30,6 @@ export class PhysicsWorld {
   public start() {
     this.world = new RAPIER.World(GRAVITY);
 
-    // setTimeout(() => {
     this.addShapes(this.editor.getCurrentPageShapes());
 
     const simLoop = () => {
@@ -41,7 +40,6 @@ export class PhysicsWorld {
     };
     simLoop();
     return () => cancelAnimationFrame(this.animFrame);
-    // }, START_DELAY);
   };
 
   public stop() {
@@ -77,7 +75,6 @@ export class PhysicsWorld {
   }
 
   createShape(shape: TLGeoShape | TLDrawShape) {
-    console.log('creating shape');
     if (!shape.meta.fixed) {
       const rb = this.createRigidbody(shape, 1);
       this.createCollider(shape, rb);
@@ -383,7 +380,7 @@ export function usePhysicsSimulation(editor: Editor, enabled: boolean) {
 
   useEffect(() => {
     if (enabled) {
-      sim.current.start();
+      setTimeout(() => sim.current.start(), START_DELAY);
       return () => sim.current.stop();
     }
   }, [enabled, sim]);

vite.config.ts

@@ -9,6 +9,10 @@ export default defineConfig({
     wasm(),
     topLevelAwait()
   ],
+  build: {
+    sourcemap: true, // Enable source maps for production
+  },
+  publicDir: 'src/public',
   resolve: {
     alias: {
       '@': '/src',