Move dev scene into userScene/main.ts

eulertour · eulertour · commit 2df88aa7489d · 2025-02-26T13:33:21.000-05:00
diff --git a/index.html b/index.html
@@ -9,49 +9,15 @@
   <body>
     <canvas id="canvas" style="border: 1px solid black; height: 420px"></canvas>
     <script type="module">
-      import { Geometry, Animation, THREE, SceneController } from "./src/index";
-
-      class Scene {
-        constructor(scene, camera, renderer) {
-          this.scene = scene;
-          this.camera = camera;
-          this.renderer = renderer;
-
-          const triangle = new Geometry.Polygon(
-            [
-              new THREE.Vector3(-1, -1, 0),
-              new THREE.Vector3(1, 1, 0),
-              new THREE.Vector3(1, -1, 0),
-            ],
-            {
-              strokeWidth: 4,
-              fillColor: new THREE.Color("red"),
-              fillOpacity: 0.5,
-              strokeColor: new THREE.Color("red"),
-            },
-          );
-          scene.add(triangle);
-
-          this.animations = [
-            new Animation.Wait(),
-
-            new Animation.Animation((t, dt) => {
-              triangle.reshape([
-                new THREE.Vector3(-1, -1, 0),
-                new THREE.Vector3(1 + t, 1, 0),
-                new THREE.Vector3(1, -1, 0),
-              ]);
-            }),
-          ];
-        }
-      }
+      import { SceneController } from "./src/index";
+      import UserScene from "./userScene/main.ts";
 
       const canvas = document.querySelector("#canvas");
       if (canvas === null) {
         throw new Error("canvas is null");
       }
 
-      const sceneController = new SceneController(Scene, canvas, {
+      const sceneController = new SceneController(UserScene, canvas, {
         aspectRatio: 16 / 9,
         pixelHeight: 720,
         coordinateHeight: 8,
diff --git a/tsconfig.json b/tsconfig.json
@@ -26,5 +26,5 @@
 		"noImplicitReturns": true,
 		"noUncheckedIndexedAccess": true
   },
-  "include": ["src"]
+  "include": ["src", "userScene"]
 }
diff --git a/userScene/main.ts b/userScene/main.ts
@@ -0,0 +1,44 @@
+import {
+  Geometry,
+  Animation,
+  StudioScene,
+  AnimationRepresentation,
+} from "../src/index.js";
+import * as THREE from "three";
+
+export default class Scene implements StudioScene {
+  animations?: Array<AnimationRepresentation>;
+
+  constructor(
+    public scene: THREE.Scene,
+    public camera: THREE.OrthographicCamera,
+    public renderer: THREE.WebGLRenderer,
+  ) {
+    const triangle = new Geometry.Polygon(
+      [
+        new THREE.Vector3(-1, -1, 0),
+        new THREE.Vector3(1, 1, 0),
+        new THREE.Vector3(1, -1, 0),
+      ],
+      {
+        strokeWidth: 4,
+        fillColor: new THREE.Color("red"),
+        fillOpacity: 0.5,
+        strokeColor: new THREE.Color("red"),
+      },
+    );
+    scene.add(triangle);
+
+    this.animations = [
+      new Animation.Wait(),
+
+      new Animation.Animation((t, _) => {
+        triangle.reshape([
+          new THREE.Vector3(-1, -1, 0),
+          new THREE.Vector3(1 + t, 1, 0),
+          new THREE.Vector3(1, -1, 0),
+        ]);
+      }),
+    ];
+  }
+}

Original file line number	Diff line number	Diff line change
`@@ -26,5 +26,5 @@`
`26`	`26`	`"noImplicitReturns": true,`
`27`	`27`	`"noUncheckedIndexedAccess": true`
`28`	`28`	`},`
`29`		`- "include": ["src"]`
	`29`	`+ "include": ["src", "userScene"]`
`30`	`30`	`}`