some tweaking

Author: soohoonc

public/index.html

@@ -41,9 +41,9 @@
     }
 
     #content {
-      background: #FFFFFFEE;
-      border: 1px solid black;
-      padding: 1.2em;
+      background: #FFFFFF;
+      opacity: 0.88;
+      padding: 1em;
       max-width: 480px;
       position: relative;
       z-index: 1;

public/scripts/skull.js

@@ -60,18 +60,14 @@ function initializeSkull(geometry) {
   myMesh.geometry.computeBoundingBox();
 
   const bbox = myMesh.geometry.boundingBox;
-  myMesh.position.set(0, 0, 0);
+  myMesh.position.set(0, 0, 2);
   myMesh.rotation.x = 0.2;
 
   if (window.innerWidth < window.innerHeight) {
     myMesh.rotation.x = 0.2 - Math.PI / 2;
   }
-
-  const screenArea = window.innerWidth * window.innerHeight;
-  const referenceArea = 1920 * 1080;
-  const scaleFactor = Math.sqrt(screenArea / referenceArea);
 
-  camera.position.x = (bbox.max.x * (window.innerWidth < window.innerHeight ? 4 : 6))/ scaleFactor;
+  camera.position.x = bbox.max.x * (5 / Math.sqrt((Math.max(window.innerWidth, 480) * window.innerHeight) / (1440 * 1196)));
   camera.position.y = 0;
   camera.position.z = 0;
   camera.lookAt(0, 0, 0);
@@ -105,12 +101,4 @@ window.addEventListener('resize', function () {
   } else {
     myMesh.rotation.x = 0.2;
   }
-
-  if (myMesh.geometry) {
-    const bbox = myMesh.geometry.boundingBox;
-    const screenArea = window.innerWidth * window.innerHeight;
-    const referenceArea = 1920 * 1080;
-    const scaleFactor = Math.sqrt(screenArea / referenceArea);
-    camera.position.x = (bbox.max.x * (window.innerWidth < window.innerHeight ? 4 : 6)) / scaleFactor;
-  }
 });