From 521e042dfec6bd0c128e90faf3af5b84dc003183 Mon Sep 17 00:00:00 2001
From: Anton Khorev <tony29@yandex.ru>
Date: Tue, 24 Jun 2025 02:03:35 +0300
Subject: [PATCH] Scroll to active version in navigation list on load

---
 app/assets/javascripts/index/element.js   | 19 +++++++++++++++++++
 app/helpers/numbered_pagination_helper.rb | 15 ++++++++++-----
 2 files changed, 29 insertions(+), 5 deletions(-)

diff --git a/app/assets/javascripts/index/element.js b/app/assets/javascripts/index/element.js
index 413b512a0..b5c68ceb1 100644
--- a/app/assets/javascripts/index/element.js
+++ b/app/assets/javascripts/index/element.js
@@ -4,11 +4,13 @@
 
     page.pushstate = page.popstate = function (path, id, version) {
       OSM.loadSidebarContent(path, function () {
+        scrollToActiveVersion();
         page._addObject(type, id, version);
       });
     };
 
     page.load = function (path, id, version) {
+      scrollToActiveVersion();
       page._addObject(type, id, version, true);
     };
 
@@ -43,4 +45,21 @@
 
     return page;
   };
+
+  function scrollToActiveVersion() {
+    const [scrollableList] = $("#versions-navigation-list-middle");
+
+    if (!scrollableList) return;
+
+    const [activeStartItem] = $("#versions-navigation-list-start #versions-navigation-active-page-item");
+    const [activeScrollableItem] = $("#versions-navigation-list-middle #versions-navigation-active-page-item");
+
+    if (activeStartItem) {
+      scrollableList.scrollLeft = 0;
+    } else if (activeScrollableItem) {
+      scrollableList.scrollLeft = Math.round(activeScrollableItem.offsetLeft - (scrollableList.offsetWidth / 2) + (activeScrollableItem.offsetWidth / 2));
+    } else {
+      scrollableList.scrollLeft = scrollableList.scrollWidth - scrollableList.offsetWidth;
+    }
+  }
 }());
diff --git a/app/helpers/numbered_pagination_helper.rb b/app/helpers/numbered_pagination_helper.rb
index 27e911a53..af3c684e9 100644
--- a/app/helpers/numbered_pagination_helper.rb
+++ b/app/helpers/numbered_pagination_helper.rb
@@ -14,17 +14,20 @@ module NumberedPaginationHelper
       middle_list_versions = Range.new([active_version - window_half_size, start_list_versions.last + 1].max,
                                        [active_version + window_half_size, end_list_versions.first - 1].min)
 
-      lists << tag.ul(:class => "pagination pagination-sm mt-1") do
+      lists << tag.ul(:id => "versions-navigation-list-start",
+                      :class => "pagination pagination-sm mt-1") do
         start_list_versions.each do |v|
           concat element_versions_pagination_item(v, **yield(v), :active => v == active_version,
                                                                  :edge => [false, v == start_list_versions.last],
                                                                  :edge_border => true)
         end
       end
-      lists << tag.ul(:class => [
+      lists << tag.ul(:id => "versions-navigation-list-middle",
+                      :class => [
                         "pagination pagination-sm",
                         "overflow-x-scroll pb-3", # horizontal scrollbar with reserved space below
-                        "pt-1 px-1 mx-n1" # space reserved for focus outlines
+                        "pt-1 px-1 mx-n1", # space reserved for focus outlines
+                        "position-relative" # required for centering when clicking "Version #n"
                       ]) do
         concat element_versions_pagination_item("...", :edge => [true, false]) if middle_list_versions.first > start_list_versions.last + 1
         middle_list_versions.each do |v|
@@ -34,7 +37,8 @@ module NumberedPaginationHelper
         end
         concat element_versions_pagination_item("...", :edge => [false, true]) if middle_list_versions.last < end_list_versions.first - 1
       end
-      lists << tag.ul(:class => "pagination pagination-sm mt-1") do
+      lists << tag.ul(:id => "versions-navigation-list-end",
+                      :class => "pagination pagination-sm mt-1") do
         end_list_versions.each do |v|
           concat element_versions_pagination_item(v, **yield(v), :active => v == active_version,
                                                                  :edge => [v == end_list_versions.first, false],
@@ -58,6 +62,7 @@ module NumberedPaginationHelper
            else
              tag.span body, :class => link_class
            end
-    tag.li link, :class => ["page-item", { "disabled" => !href, "active" => active }]
+    tag.li link, :id => ("versions-navigation-active-page-item" if active),
+                 :class => ["page-item", { "disabled" => !href, "active" => active }]
   end
 end
-- 
2.39.5