Update interface.js

interface.js

@@ -27,12 +27,9 @@ const currentScriptTag = document.currentScript;
       const response = await fetch(configUrl);
       config = await response.json();
     } catch (error) {
-      // Silent fail, but log in dev environments
-      // console.error("Error loading config file:", error);
       return;
     }
   } else {
-    // console.error("No config file provided. Please set a data-config attribute on the <script> tag.");
     return;
   }
 
@@ -72,7 +69,7 @@ const currentScriptTag = document.currentScript;
     }
   }
 
-  // 5. Create the widget container (no GIF preview, no close button)
+  // 5. Create the widget container
   const widgetContainer = document.createElement('div');
   widgetContainer.id = 'ply-widget-container-' + instanceId;
   widgetContainer.classList.add('ply-widget-container');
@@ -80,12 +77,10 @@ const currentScriptTag = document.currentScript;
   widgetContainer.style.paddingBottom = aspectPercent;
   widgetContainer.setAttribute('data-original-aspect', aspectPercent);
 
-  // Conditionally include the “tooltips-toggle” button only if config.tooltips_url is defined
   const tooltipsButtonHTML = config.tooltips_url
     ? `<button id="tooltips-toggle-${instanceId}" class="widget-button tooltips-toggle">⦿</button>`
     : '';
 
-  // Add the 3D-viewer HTML + tooltip + help HTML (all HTML in a template literal!)
   widgetContainer.innerHTML = `
     <div id="viewer-container-${instanceId}" class="viewer-container">
       <div id="progress-dialog-${instanceId}" class="progress-dialog">
@@ -111,7 +106,6 @@ const currentScriptTag = document.currentScript;
     </div>
   `;
 
-  // Append the widget container immediately after the <script> tag
   scriptTag.parentNode.appendChild(widgetContainer);
 
   // 6. Grab references to new DOM elements
@@ -134,14 +128,22 @@ const currentScriptTag = document.currentScript;
   const isIOS    = /iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream;
   const isMobile = isIOS || /Android/i.test(navigator.userAgent);
 
-  // Conditionally include the French tooltip instruction line if tooltips_url exists
+  // Prevent iOS pinch-zoom and double-tap zoom on the container
+  if (isIOS) {
+    widgetContainer.style.touchAction = "none";
+    widgetContainer.addEventListener('touchmove', function(e) {
+      // Prevent all default browser zooms/scrolls on the widget area
+      if (e.touches.length > 1) e.preventDefault();
+    }, { passive: false });
+  }
+
+  // French help/instructions
   const tooltipInstruction = config.tooltips_url
     ? '- Cliquez sur ⦿ pour afficher/masquer les tooltips.<br>'
     : '';
 
-  // Fill help text with instructions plus the two new French lines
   if (isMobile) {
-    helpTextDiv.innerHTML = 
+    helpTextDiv.innerHTML =
       '- Pour vous déplacer, glissez deux doigts sur l\'écran.<br>' +
       '- Pour orbiter, utilisez un doigt.<br>' +
       '- Pour zoomer, pincez avec deux doigts.<br>' +
@@ -149,7 +151,7 @@ const currentScriptTag = document.currentScript;
       '- ⟲ Réinitialise la caméra.<br>' +
       '- ⇱ Passe en plein écran.<br>';
   } else {
-    helpTextDiv.innerHTML = 
+    helpTextDiv.innerHTML =
       '- orbitez avec le clic droit<br>' +
       '- zoomez avec la molette<br>' +
       '- déplacez vous avec le clic gauche<br>' +
@@ -158,14 +160,12 @@ const currentScriptTag = document.currentScript;
       '- ⇱ Passe en plein écran.<br>';
   }
 
-  // Ensure instructions panel is visible by default
   menuContent.style.display = 'block';
   viewerContainerElem.style.display = 'block';
 
   // Variable to hold the drag-hide listener reference
   let dragHide = null;
 
-  // Utilities to hide panels
   function hideTooltipPanel() {
     if (dragHide) {
       viewerContainerElem.removeEventListener('pointermove', dragHide);
@@ -183,13 +183,24 @@ const currentScriptTag = document.currentScript;
     viewerModule = await import('https://mikafil-viewer-gs.static.hf.space/viewer.js');
     await viewerModule.initializeViewer(config, instanceId);
   } catch (err) {
-    // Do not break UI, but don't continue
     return;
   }
 
   const canvasId = 'canvas-' + instanceId;
   const canvasEl = document.getElementById(canvasId);
 
+  // Prevent iOS double-tap to zoom on the canvas
+  if (isIOS && canvasEl) {
+    let lastTouch = 0;
+    canvasEl.addEventListener('touchend', function(e) {
+      const now = new Date().getTime();
+      if (now - lastTouch <= 400) {
+        e.preventDefault();
+      }
+      lastTouch = now;
+    }, { passive: false });
+  }
+
   // 8. Conditional display of tooltips-toggle button
   if (tooltipsToggleBtn) {
     if (!config.tooltips_url) {
@@ -372,8 +383,16 @@ const currentScriptTag = document.currentScript;
   });
 
   if (canvasEl) {
+    // Prevent pinch-zoom and double-tap zoom on iOS (extra guard)
+    if (isIOS) {
+      canvasEl.style.touchAction = "none";
+      canvasEl.addEventListener('gesturestart', e => e.preventDefault());
+      canvasEl.addEventListener('gesturechange', e => e.preventDefault());
+      canvasEl.addEventListener('gestureend', e => e.preventDefault());
+    }
     canvasEl.addEventListener('wheel', hideTooltipPanel, { passive: true });
   }
+
   document.addEventListener('keydown', (e) => {
     if ((e.key === 'Escape' || e.key === 'Esc') && isFullscreen) exitFullscreen();
   });