123

Profice WebSite/scripts/tech-onepager.js

@@ -29,17 +29,37 @@ document.addEventListener('DOMContentLoaded', function() {
         // Also redraw after a short delay for CSS transitions
         setTimeout(drawConnections, 300);
         setTimeout(drawConnections, 600);
+        setTimeout(drawConnections, 1000);
         
-        // Redraw on resize
+        // Redraw on resize with multiple delayed calls to handle CSS transitions
         let resizeTimeout;
+        let resizeRAF;
         window.addEventListener('resize', function() {
+            // Cancel any pending animation frame
+            if (resizeRAF) cancelAnimationFrame(resizeRAF);
             clearTimeout(resizeTimeout);
-            resizeTimeout = setTimeout(drawConnections, 100);
+            
+            // Immediate redraw
+            resizeRAF = requestAnimationFrame(drawConnections);
+            
+            // Delayed redraws to catch CSS transition completion
+            resizeTimeout = setTimeout(() => {
+                drawConnections();
+                setTimeout(drawConnections, 200);
+                setTimeout(drawConnections, 400);
+            }, 100);
         });
         
         // Redraw on orientation change (mobile)
         window.addEventListener('orientationchange', function() {
             setTimeout(drawConnections, 300);
+            setTimeout(drawConnections, 600);
+            setTimeout(drawConnections, 1000);
+        });
+        
+        // Also listen for transitionend on the system graphic
+        systemGraphic.addEventListener('transitionend', function() {
+            requestAnimationFrame(drawConnections);
         });
         
         // Initialize tooltip system