Update viewer.js

viewer.js

@@ -1,5 +1,3 @@
-// viewer.js
-
 let pc;            // will hold the PlayCanvas module once imported
 export let app = null;
 let cameraEntity   = null;
@@ -12,20 +10,15 @@ let minZoom, maxZoom, minAngle, maxAngle, minAzimuth, maxAzimuth, minPivotY, min
 let modelX, modelY, modelZ, modelScale, modelRotationX, modelRotationY, modelRotationZ;
 let plyUrl, glbUrl;
 
-// iOS & Safari detection
-function isIOS() {
-  return /iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream;
-}
-function isSafari() {
-  return /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
-}
-
 /**
  * initializeViewer(config, instanceId)
  */
 export async function initializeViewer(config, instanceId) {
   if (viewerInitialized) return;
 
+  const isIOS    = /iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream;
+  const isMobile = isIOS || /Android/i.test(navigator.userAgent);
+
   // 1. Read config
   plyUrl = config.ply_url;
   glbUrl = config.glb_url;
@@ -53,10 +46,9 @@ export async function initializeViewer(config, instanceId) {
   const cameraYPhone = (config.cameraYPhone !== undefined) ? parseFloat(config.cameraYPhone) : cameraY;
   const cameraZPhone = (config.cameraZPhone !== undefined) ? parseFloat(config.cameraZPhone) : (cameraZ * 1.5);
 
-  const mobile = isIOS() || /Android/i.test(navigator.userAgent);
-  chosenCameraX = mobile ? cameraXPhone : cameraX;
-  chosenCameraY = mobile ? cameraYPhone : cameraY;
-  chosenCameraZ = mobile ? cameraZPhone : cameraZ;
+  chosenCameraX = isMobile ? cameraXPhone : cameraX;
+  chosenCameraY = isMobile ? cameraYPhone : cameraY;
+  chosenCameraZ = isMobile ? cameraZPhone : cameraZ;
 
   // 2. Grab DOM
   const canvasId          = 'canvas-' + instanceId;
@@ -94,21 +86,16 @@ export async function initializeViewer(config, instanceId) {
   if (!pc) {
     pc = await import("https://esm.run/playcanvas");
     window.pc = pc;
-    alert('[viewer.js] PlayCanvas module loaded.');
   }
 
   try {
     // 6. Setup device & app
-    alert('[viewer.js] Creating graphics device...');
     const device = await pc.createGraphicsDevice(canvas, {
       deviceTypes: ["webgl2"],
       glslangUrl:  "https://playcanvas.vercel.app/static/lib/glslang/glslang.js",
       twgslUrl:    "https://playcanvas.vercel.app/static/lib/twgsl/twgsl.js",
-      antialias:   false,
-      preserveDrawingBuffer: isIOS() || isSafari() ? true : false,
-      alpha: false
+      antialias:   false
     });
-    alert('[viewer.js] Graphics device created!');
     device.maxPixelRatio = Math.min(window.devicePixelRatio, 2);
 
     const opts = new pc.AppOptions();
@@ -134,8 +121,8 @@ export async function initializeViewer(config, instanceId) {
     app = new pc.Application(canvas, opts);
     app.setCanvasFillMode(pc.FILLMODE_NONE);
     app.setCanvasResolution(pc.RESOLUTION_AUTO);
-
-    alert('[viewer.js] PlayCanvas application created!');
+    //app.scene.exposure    = 0.5;
+    //app.scene.toneMapping = pc.TONEMAP_ACES;
 
     // Attach ResizeObserver to keep canvas in sync with container size
     resizeObserver = new ResizeObserver(entries => {
@@ -167,12 +154,9 @@ export async function initializeViewer(config, instanceId) {
 
     const loader = new pc.AssetListLoader(Object.values(assets), app.assets);
     let lastProg = 0;
-    assets.model.on('load', () => {
-      progressDialog.style.display = 'none';
-      alert('[viewer.js] PLY/GSplat asset loaded!');
-    });
+    assets.model.on('load', () => progressDialog.style.display = 'none');
     assets.model.on('error', err => {
-      alert('[viewer.js] Error loading model: ' + err);
+      console.error("Error loading PLY file:", err);
       progressDialog.innerHTML = <p style="color: red">Error loading model: ${err}</p>;
     });
 
@@ -188,7 +172,6 @@ export async function initializeViewer(config, instanceId) {
     }, 100);
 
     loader.load(async () => {
-      alert('[viewer.js] All assets loaded; starting app.');
       app.start();
       app.scene.envAtlas = assets.hdr.resource;
 
@@ -199,7 +182,6 @@ export async function initializeViewer(config, instanceId) {
       modelEntity.setLocalEulerAngles(modelRotationX, modelRotationY, modelRotationZ);
       modelEntity.setLocalScale(modelScale, modelScale, modelScale);
       app.root.addChild(modelEntity);
-      alert('[viewer.js] Model entity added to scene!');
 
       // Light
       const dirLight = new pc.Entity('Cascaded Light');
@@ -223,11 +205,8 @@ export async function initializeViewer(config, instanceId) {
       app.root.addChild(dirLight);
 
       // Gallery GLB
-      if (assets.galerie && assets.galerie.resource) {
-        const galleryEntity = assets.galerie.resource.instantiateRenderEntity();
-        app.root.addChild(galleryEntity);
-        alert('[viewer.js] GLB entity added to scene!');
-      }
+      const galleryEntity = assets.galerie.resource.instantiateRenderEntity();
+      app.root.addChild(galleryEntity);
 
       // Camera setup
       cameraEntity = new pc.Entity('camera');
@@ -235,6 +214,7 @@ export async function initializeViewer(config, instanceId) {
         clearColor: config.canvas_background
           ? parseInt(config.canvas_background.substr(1, 2), 16) / 255
           : 0,
+        //toneMapping: pc.TONEMAP_ACES
       });
       cameraEntity.setPosition(chosenCameraX, chosenCameraY, chosenCameraZ);
       cameraEntity.lookAt(modelEntity.getPosition());
@@ -256,8 +236,8 @@ export async function initializeViewer(config, instanceId) {
       });
       cameraEntity.script.create('orbitCameraInputMouse', {
         attributes: {
-          orbitSensitivity: mobile ? 0.6 : 0.3,
-          distanceSensitivity: mobile ? 0.5 : 0.4
+          orbitSensitivity: isMobile ? 0.6 : 0.3,
+          distanceSensitivity: isMobile ? 0.5 : 0.4
         }
       });
       if (cameraEntity.script.orbitCameraInputMouse) {
@@ -270,13 +250,9 @@ export async function initializeViewer(config, instanceId) {
         }
       });
       app.root.addChild(cameraEntity);
-      alert('[viewer.js] Camera entity added to scene!');
 
       // Reset & constrain updates
-      app.once('update', () => {
-        alert('[viewer.js] First app update! Resetting camera.');
-        resetViewerCamera();
-      });
+      app.once('update', () => resetViewerCamera());
       app.on('update', dt => {
         if (cameraEntity) {
           const pos = cameraEntity.getPosition();
@@ -284,11 +260,6 @@ export async function initializeViewer(config, instanceId) {
             cameraEntity.setPosition(pos.x, minY, pos.z);
           }
         }
-        // Diagnostics: Only show once
-        if (!window._pcFirstUpdate) {
-          window._pcFirstUpdate = true;
-          alert('[viewer.js] Entered update/render loop!');
-        }
       });
 
       // Final resize
@@ -311,11 +282,9 @@ export async function initializeViewer(config, instanceId) {
 
       progressDialog.style.display = 'none';
       viewerInitialized = true;
-      alert('[viewer.js] Viewer fully initialized and running!');
     });
 
   } catch (error) {
-    alert("[viewer.js] Error initializing PlayCanvas viewer: " + error.message);
     console.error("Error initializing PlayCanvas viewer:", error);
     progressDialog.innerHTML = <p style="color: red">Error loading viewer: ${error.message}</p>;
   }