Update file home.html

wiki/pages/home.html

@@ -166,7 +166,7 @@
         height: 100%;
         object-fit: cover;
       }
-      
+
     #menu {
       position: fixed;
       top: 0;
@@ -461,5 +461,46 @@
     window.addEventListener('resize', updateColors);
     updateColors();
   </script>
+  <script>
+    document.addEventListener('DOMContentLoaded', function() {
+        var circle = document.querySelector('.progress-circle');
+        var radius = circle.r.baseVal.value;
+        var circumference = radius * 2 * Math.PI;
+        var backToTopButton = document.getElementById('backToTop');
+        
+        circle.style.strokeDasharray = `${circumference} ${circumference}`;
+        circle.style.strokeDashoffset = circumference;
+        
+        function setProgress(percent) {
+          const offset = circumference - (percent / 100) * circumference;
+          circle.style.strokeDashoffset = offset;
+          document.querySelector('.progress-text').textContent = Math.round(percent) + '%';
+        }
+        
+        function handleScroll() {
+          var winScroll = document.documentElement.scrollTop;
+          var height = document.documentElement.scrollHeight - document.documentElement.clientHeight;
+          var scrolled = (winScroll / height) * 100;
+          setProgress(scrolled);
+
+          // Show or hide the back to top button
+          if (winScroll > 300) {
+            backToTopButton.classList.add('show');
+          } else {
+            backToTopButton.classList.remove('show');
+          }
+        }
+        
+        window.addEventListener('scroll', handleScroll);
+
+        // Back to top functionality
+        backToTopButton.addEventListener('click', function() {
+          window.scrollTo({
+            top: 0,
+            behavior: 'smooth'
+          });
+        });
+      });
+  </script>
 </body>
 </html>
\ No newline at end of file