Update viewer.js

viewer.js

@@ -7,7 +7,6 @@ export let app = null;
 let cameraEntity   = null;
 let modelEntity    = null;
 let viewerInitialized = false;
-let resizeObserver = null; // will hold our ResizeObserver
 
 let chosenCameraX, chosenCameraY, chosenCameraZ;
 let minZoom, maxZoom, minAngle, maxAngle, minAzimuth, maxAzimuth, minPivotY, minY;
@@ -138,7 +137,7 @@ export async function initializeViewer(config, instanceId) {
       pc.GSplatHandler
     ];
 
-    // ─── REPLACED: use pc.Application ───────────────────────────────────────────
+    // ─── REPLACED: use pc.Application (instead of deprecated / removed AppBase) ──
     app = new pc.Application(canvas, createOptions);
 
     // Configure application
@@ -166,7 +165,7 @@ export async function initializeViewer(config, instanceId) {
       hdr: new pc.Asset(
         'hdr',
         'texture',
-        { url: `https://huggingface.co/datasets/bilca/ply_files/resolve/main/galeries/blanc.png` },
+        { url: https://huggingface.co/datasets/bilca/ply_files/resolve/main/galeries/blanc.png },
         { type: pc.TEXTURETYPE_RGBP, mipmaps: false }
       )
     };
@@ -179,7 +178,7 @@ export async function initializeViewer(config, instanceId) {
     });
     assets.model.on('error', (err) => {
       console.error("Error loading PLY file:", err);
-      progressDialog.innerHTML = `<p style="color: red">Error loading model: ${err}</p>`;
+      progressDialog.innerHTML = <p style="color: red">Error loading model: ${err}</p>;
     });
 
     const checkProgress = () => {
@@ -308,17 +307,6 @@ export async function initializeViewer(config, instanceId) {
       // 9f. Resize canvas one last time to fit container
       app.resizeCanvas(viewerContainerElem.clientWidth, viewerContainerElem.clientHeight);
 
-      // ─── NEW: Attach ResizeObserver to keep canvas in sync ─────────────────
-      resizeObserver = new ResizeObserver(entries => {
-        for (let entry of entries) {
-          const { width, height } = entry.contentRect;
-          if (app) {
-            app.resizeCanvas(width, height);
-          }
-        }
-      });
-      resizeObserver.observe(viewerContainerElem);
-
       // ─── NEW: Load & initialize the tooltips module ──────────────────────
       try {
         const tooltipsModule = await import('./tooltips.js');
@@ -340,7 +328,7 @@ export async function initializeViewer(config, instanceId) {
 
   } catch (error) {
     console.error("Error initializing PlayCanvas viewer:", error);
-    progressDialog.innerHTML = `<p style="color: red">Error loading viewer: ${error.message}</p>`;
+    progressDialog.innerHTML = <p style="color: red">Error loading viewer: ${error.message}</p>;
   }
 }
 
@@ -405,8 +393,7 @@ export function resetViewerCamera() {
 /**
  * cleanupViewer()
  *
- * Destroys the PlayCanvas `app` (if it exists) and clears references.  Called when the user clicks “X”.
- * Also disconnects the ResizeObserver to prevent memory leaks.
+ * Destroys the PlayCanvas app (if it exists) and clears references.  Called when the user clicks “X”.
  */
 export function cleanupViewer() {
   if (app) {
@@ -417,11 +404,7 @@ export function cleanupViewer() {
     }
     app = null;
   }
-  if (resizeObserver && viewerContainerElem) {
-    resizeObserver.disconnect();
-    resizeObserver = null;
-  }
   cameraEntity   = null;
   modelEntity    = null;
   viewerInitialized = false;
-}
+}