From 64f3dbd13849fa6b5bdc074f605a21017300d7b5 Mon Sep 17 00:00:00 2001
From: Trent Larson <trent@trentlarson.com>
Date: Tue, 16 May 2023 07:49:44 -0600
Subject: [PATCH] play with sizing, and stop bobbing and rotation

---
 .../World/components/objects/terrain.js           |  6 ++++++
 src/components/World/systems/Resizer.js           | 11 +++++++++--
 src/components/World/systems/controls.js          |  4 ++--
 src/views/StatisticsView.vue                      | 15 +++------------
 4 files changed, 20 insertions(+), 16 deletions(-)

diff --git a/src/components/World/components/objects/terrain.js b/src/components/World/components/objects/terrain.js
index 8aa36cea..97c69704 100644
--- a/src/components/World/components/objects/terrain.js
+++ b/src/components/World/components/objects/terrain.js
@@ -34,6 +34,11 @@ export default function createTerrain(props) {
 
   plane.geometry.attributes.position.randomValues = props.randVertexArr;
 
+  // eslint-disable-next-line @typescript-eslint/no-empty-function
+  plane.tick = () => {};
+  /**
+   * This makes the terrain bob up and down.
+   *
   let frame = 0;
   plane.tick = () => {
     frame += 0.01;
@@ -55,6 +60,7 @@ export default function createTerrain(props) {
     }
     plane.geometry.attributes.position.needsUpdate = true;
   };
+   **/
 
   return plane;
 }
diff --git a/src/components/World/systems/Resizer.js b/src/components/World/systems/Resizer.js
index bf41d66d..3ffe3e4f 100644
--- a/src/components/World/systems/Resizer.js
+++ b/src/components/World/systems/Resizer.js
@@ -1,8 +1,15 @@
 const setSize = (container, camera, renderer) => {
-  camera.aspect = window.innerWidth / window.innerHeight;
+  // These are great for full-screen, which adjusts to a window.
+  const height = window.innerHeight;
+  const width = window.innerWidth - 50;
+  // These are better for fitting in a container, which stays that size.
+  //const height = container.scrollHeight;
+  //const width = container.scrollWidth;
+
+  camera.aspect = width / height;
   camera.updateProjectionMatrix();
 
-  renderer.setSize(window.innerWidth, window.innerHeight);
+  renderer.setSize(width, height);
   renderer.setPixelRatio(window.devicePixelRatio);
 };
 
diff --git a/src/components/World/systems/controls.js b/src/components/World/systems/controls.js
index d8f05e19..cd901f47 100644
--- a/src/components/World/systems/controls.js
+++ b/src/components/World/systems/controls.js
@@ -6,8 +6,8 @@ function createControls(camera, canvas) {
 
   //enable controls?
   controls.enabled = true;
-  controls.autoRotate = true;
-  controls.autoRotateSpeed = 0.2;
+  controls.autoRotate = false;
+  //controls.autoRotateSpeed = 0.2;
 
   // control limits
   // It's recommended to set some control boundaries,
diff --git a/src/views/StatisticsView.vue b/src/views/StatisticsView.vue
index 6b02fe02..34c41fb7 100644
--- a/src/views/StatisticsView.vue
+++ b/src/views/StatisticsView.vue
@@ -53,8 +53,9 @@
     <h1 id="ViewHeading" class="text-4xl text-center font-light pt-4 mb-8">
       Your Statistics
     </h1>
-    <div id="scene-container"></div>
-    <canvas ref="worldCanvas"></canvas>
+
+    <!-- Another place to play with the sizing is in Resizer.setSize -->
+    <div id="scene-container" class="h-screen"></div>
   </section>
 </template>
 
@@ -71,13 +72,3 @@ export default class StatisticsView extends Vue {
   }
 }
 </script>
-
-<style>
-#scene-container {
-  position: fixed;
-  width: 100%;
-  height: 100%;
-  left: 0;
-  top: 0;
-}
-</style>