From be81668d6d4c513168122c2108e9fc38ce676462 Mon Sep 17 00:00:00 2001
From: Jokob-sk <jokob.sk@gmail.com>
Date: Tue, 5 Mar 2024 16:17:52 +1100
Subject: [PATCH] Smooth scrolling

---
 front/js/pialert_common.js     | 33 +++++++++++++++++++++++++++++++++
 front/php/templates/header.php |  3 ++-
 front/settings.php             | 20 +++++---------------
 3 files changed, 40 insertions(+), 16 deletions(-)

diff --git a/front/js/pialert_common.js b/front/js/pialert_common.js
index 2a6f2188..3181ef75 100755
--- a/front/js/pialert_common.js
+++ b/front/js/pialert_common.js
@@ -810,6 +810,39 @@ function updateApi()
   })
 }
 
+// ----------------------------------------------------------------------------- 
+  // handling smooth scrolling
+  // ----------------------------------------------------------------------------- 
+  function setupSmoothScrolling() {
+    // Function to scroll to the element
+    function scrollToElement(id) {
+        $('html, body').animate({
+            scrollTop: $("#" + id).offset().top - 50
+        }, 500);
+    }
+
+    // Scroll to the element when clicking on anchor links
+    $('a[href*="#"]').on('click', function(event) {
+        var href = $(this).attr('href');
+        if (href && href.includes('#')) {
+            var id = href.substring(href.indexOf("#") + 1); // Get the ID from the href attribute
+            if ($("#" + id).length > 0) {
+                event.preventDefault(); // Prevent default anchor behavior
+                scrollToElement(id); // Scroll to the element
+            }
+        }
+    });
+
+    // Check if there's an ID in the URL and scroll to it
+    var url = window.location.href;
+    if (url.includes("#")) {
+        var idFromURL = url.substring(url.indexOf("#") + 1);
+        if ($("#" + idFromURL).length > 0) {
+            scrollToElement(idFromURL);
+        }
+    }
+}
+
 
 // -----------------------------------------------------------------------------
 // initialize
diff --git a/front/php/templates/header.php b/front/php/templates/header.php
index a4e4ef56..d8aa7e96 100755
--- a/front/php/templates/header.php
+++ b/front/php/templates/header.php
@@ -257,7 +257,7 @@ if ($ENABLED_DARKMODE === True) {
           </a>
           <ul class="treeview-menu" style="display: <?php if (in_array (basename($_SERVER['SCRIPT_NAME']), array('settings.php') ) ){ echo 'block'; } else {echo 'none';} ?>;">
             <li>
-              <a href="settings.php">  <?= lang("settings_enabled");?> </a>
+              <a href="settings.php#pageTitle">  <?= lang("settings_enabled");?> </a>
             </li>
             <li>
               <a href="settings.php#core_content_header">  <?= lang("settings_core_label");?> </a>
@@ -317,6 +317,7 @@ function workInProgress() {
 
 //--------------------------------------------------------------
 
+
   //--------------------------------------------------------------
 
   function toggleFullscreen() {
diff --git a/front/settings.php b/front/settings.php
index e9cb6e9c..e699b88d 100755
--- a/front/settings.php
+++ b/front/settings.php
@@ -517,6 +517,9 @@ while ($row = $result -> fetchArray (SQLITE3_ASSOC)) {
 
     }
 
+
+    setupSmoothScrolling()
+
   }
 
 
@@ -757,21 +760,6 @@ while ($row = $result -> fetchArray (SQLITE3_ASSOC)) {
 
       document.getElementById('lastImportedTime').innerHTML = humanReadable; 
 
-      // Scroll down if ID in URL
-      // Get the ID from the URL
-      var url = window.location.href;
-      var id = url.substring(url.indexOf("#") + 1);
-
-      // Check if the ID exists in the document
-      if ($("#" + id).length > 0) {
-        setTimeout(function() {
-          // Scroll to the element
-          $('html, body').animate({
-              scrollTop: $("#" + id).offset().top - 50
-          }, 1000);
-        },200);
-      }
-  
 
      })
 
@@ -784,6 +772,8 @@ while ($row = $result -> fetchArray (SQLITE3_ASSOC)) {
 
 <script defer>
 
+  
+
   // ----------------------------------------------------------------------------- 
   // handling events on the backend initiated by the front end START
   // -----------------------------------------------------------------------------