202511261413

frontend/protos/scroll.js

@@ -0,0 +1,182 @@
+  const scrollThrottleCallback = (callback, timeout) => {
+    let wait = false;
+    return () => {
+      if (wait) return;
+      callback.call();
+      wait = true;
+      setTimeout(() => { wait = false; }, timeout);
+    };
+  };
+
+  
+  function getAbsolutePosition(element) {
+    const rect = element.getBoundingClientRect();
+    
+    return {
+        top: rect.top + window.scrollY,    // Add vertical scroll
+        left: rect.left + window.scrollX,  // Add horizontal scroll
+        bottom: rect.bottom + window.scrollY,
+        right: rect.right + window.scrollX
+    };
+  }
+  function getPositionRelativeToParent(element) {
+    const parent = element.parentElement;
+    const parentRect = parent.getBoundingClientRect();
+    const elementRect = element.getBoundingClientRect();
+    
+    return {
+        top: elementRect.top - parentRect.top,
+        left: elementRect.left - parentRect.left,
+        bottom: elementRect.bottom - parentRect.top,
+        right: elementRect.right - parentRect.left
+    };
+  }
+
+  function smoothScrollToElement(element, offset = 0) {
+    const elementPosition = getAbsolutePosition(element);
+    const targetScroll = elementPosition.top - offset;
+    
+    // Smooth scroll with animation
+    window.scrollTo({
+        top: targetScroll,
+        behavior: 'smooth'
+    });
+  }
+
+  // Enhanced version with progress callback
+  function scrollToElementWithProgress(element, offset = 0, onProgress) {
+    const start = window.scrollY;
+    const elementPosition = getAbsolutePosition(element);
+    const target = elementPosition.top - offset;
+    const distance = target - start;
+    const duration = 1000; // ms
+    const startTime = performance.now();
+    
+    function animate(currentTime) {
+        const elapsed = currentTime - startTime;
+        const progress = Math.min(elapsed / duration, 1);
+        
+        // Easing function for smooth animation
+        const easeProgress = 1 - Math.pow(1 - progress, 3);
+        
+        const currentPosition = start + (distance * easeProgress);
+        window.scrollTo(0, currentPosition);
+        
+        if (onProgress) {
+            onProgress(progress);
+        }
+        
+        if (progress < 1) {
+            requestAnimationFrame(animate);
+        }
+    }
+    
+    requestAnimationFrame(animate);
+  }
+
+  function scrollToElement(elementSelector) {
+    const element = document.querySelector(elementSelector);
+    if (element) {
+      const methode=1;
+      switch (methode) {
+        case 1 :
+          element.scrollIntoView();
+          break;
+        case 2 :
+          smoothScrollToElement(element);
+          break;
+        case 3 :
+          scrollToElementWithProgress(element, 0, (progress) => {
+            logMsg('htmlElement',`Scroll progress: ${Math.round(progress * 100)}%`);
+          });
+          break;
+      }
+    }
+    logMsg('htmlElement','scrollTo '+elementSelector);
+  }
+
+  function getAbsolutePosition(element) {
+    const rect = element.getBoundingClientRect();
+    
+    return {
+        top: rect.top + window.scrollY,    // Add vertical scroll
+        left: rect.left + window.scrollX,  // Add horizontal scroll
+        bottom: rect.bottom + window.scrollY,
+        right: rect.right + window.scrollX
+    };
+  }
+  function getPositionRelativeToParent(element) {
+    const parent = element.parentElement;
+    const parentRect = parent.getBoundingClientRect();
+    const elementRect = element.getBoundingClientRect();
+    
+    return {
+        top: elementRect.top - parentRect.top,
+        left: elementRect.left - parentRect.left,
+        bottom: elementRect.bottom - parentRect.top,
+        right: elementRect.right - parentRect.left
+    };
+  }
+
+  function smoothScrollToElement(element, offset = 0) {
+    const elementPosition = getAbsolutePosition(element);
+    const targetScroll = elementPosition.top - offset;
+    
+    // Smooth scroll with animation
+    window.scrollTo({
+        top: targetScroll,
+        behavior: 'smooth'
+    });
+  }
+
+  // Enhanced version with progress callback
+  function scrollToElementWithProgress(element, offset = 0, onProgress) {
+    const start = window.scrollY;
+    const elementPosition = getAbsolutePosition(element);
+    const target = elementPosition.top - offset;
+    const distance = target - start;
+    const duration = 1000; // ms
+    const startTime = performance.now();
+    
+    function animate(currentTime) {
+        const elapsed = currentTime - startTime;
+        const progress = Math.min(elapsed / duration, 1);
+        
+        // Easing function for smooth animation
+        const easeProgress = 1 - Math.pow(1 - progress, 3);
+        
+        const currentPosition = start + (distance * easeProgress);
+        window.scrollTo(0, currentPosition);
+        
+        if (onProgress) {
+            onProgress(progress);
+        }
+        
+        if (progress < 1) {
+            requestAnimationFrame(animate);
+        }
+    }
+    
+    requestAnimationFrame(animate);
+  }
+
+  function scrollToElement(elementSelector) {
+    const element = document.querySelector(elementSelector);
+    if (element) {
+      const methode=1;
+      switch (methode) {
+        case 1 :
+          element.scrollIntoView();
+          break;
+        case 2 :
+          smoothScrollToElement(element);
+          break;
+        case 3 :
+          scrollToElementWithProgress(element, 0, (progress) => {
+            logMsg('htmlElement',`Scroll progress: ${Math.round(progress * 100)}%`);
+          });
+          break;
+      }
+    }
+    logMsg('htmlElement','scrollTo '+elementSelector);
+  }