From dfe3b4cb775c903e6120e48d8cd7626ef3588a34 Mon Sep 17 00:00:00 2001
From: Mario Carloni <mcarloni4@gmail.com>
Date: Wed, 15 May 2024 13:12:40 -0400
Subject: [PATCH] update navtree logic for other detail pages

---
 .../inventory/ajax_deployment_detail.html     | 26 +++++++++++++++++
 .../ajax_inventory_deployment_detail.html     | 23 ++++++++++++++-
 .../ajax_inventory_location_detail.html       | 23 +++++++++++++++
 .../ajax_inventory_snapshot_detail.html       | 23 +++++++++++++++
 .../inventory/deployment_detail.html          | 23 +++++++++++++++
 .../inventory_deployment_detail.html          | 26 +++++++++++++++++
 .../templates/inventory/inventory_detail.html | 28 ++++++++++++++++++-
 7 files changed, 170 insertions(+), 2 deletions(-)

diff --git a/roundabout/templates/inventory/ajax_deployment_detail.html b/roundabout/templates/inventory/ajax_deployment_detail.html
index 3247a8e41..e6eb9d5df 100644
--- a/roundabout/templates/inventory/ajax_deployment_detail.html
+++ b/roundabout/templates/inventory/ajax_deployment_detail.html
@@ -176,5 +176,31 @@ <h5>Percent Complete</h5>
 
 
 {% block javascript %}
+<script>
+    $(document).ready(function(){
+        $('#jstree-navtree').on('loaded.jstree', function() {
+            // Open the tree to the selected item
+            
+            setTimeout(function() { // Adding a slight delay to ensure the node is open and rendered
+                var selectedItem = $('#jstree-navtree').find('.jstree-clicked')
+                console.log(selectedItem)
+                if (selectedItem.length) {
+                    var container = $('#jstree-navtree').parent();
+                    var selectedItemOffsetFromTop = selectedItem.offset().top;
+                    var containerScrollTop = container.scrollTop();
+                    var containerHeight = container.height();
+                    var selectedItemHeight = selectedItem.outerHeight(true); // Include margin
+
+                    // Calculate the top scroll position to center the item
+                    var scrollTopToCenterItem = containerScrollTop + selectedItemOffsetFromTop - container.offset().top - (containerHeight / 2) + (selectedItemHeight / 2);
+                    
+                    container.animate({
+                        scrollTop: scrollTopToCenterItem
+                    }, 'slow');
+                }
+            }, 300); // Adjust delay as necessary
+        });
+    });
+</script>
 
 {% endblock javascript %}
diff --git a/roundabout/templates/inventory/ajax_inventory_deployment_detail.html b/roundabout/templates/inventory/ajax_inventory_deployment_detail.html
index 3e3780dd2..10f847d96 100644
--- a/roundabout/templates/inventory/ajax_inventory_deployment_detail.html
+++ b/roundabout/templates/inventory/ajax_inventory_deployment_detail.html
@@ -133,7 +133,28 @@ <h4>Percent Complete</h4>
 <script>
 
 $(document).ready(function() {
-
+    $('#jstree-navtree').on('loaded.jstree', function() {
+        // Open the tree to the selected item
+        
+        setTimeout(function() { // Adding a slight delay to ensure the node is open and rendered
+            var selectedItem = $('#jstree-navtree').find('.jstree-clicked')
+            console.log(selectedItem)
+            if (selectedItem.length) {
+                var container = $('#jstree-navtree').parent();
+                var selectedItemOffsetFromTop = selectedItem.offset().top;
+                var containerScrollTop = container.scrollTop();
+                var containerHeight = container.height();
+                var selectedItemHeight = selectedItem.outerHeight(true); // Include margin
+
+                // Calculate the top scroll position to center the item
+                var scrollTopToCenterItem = containerScrollTop + selectedItemOffsetFromTop - container.offset().top - (containerHeight / 2) + (selectedItemHeight / 2);
+                
+                container.animate({
+                    scrollTop: scrollTopToCenterItem
+                }, 'slow');
+            }
+        }, 300); // Adjust delay as necessary
+    });
 
 });
 </script>
diff --git a/roundabout/templates/inventory/ajax_inventory_location_detail.html b/roundabout/templates/inventory/ajax_inventory_location_detail.html
index a34196d57..0c609e941 100644
--- a/roundabout/templates/inventory/ajax_inventory_location_detail.html
+++ b/roundabout/templates/inventory/ajax_inventory_location_detail.html
@@ -51,6 +51,29 @@ <h3>{{ location.name }}</h3>
         });
     });
 
+    $('#jstree-navtree').on('loaded.jstree', function() {
+        // Open the tree to the selected item
+        
+        setTimeout(function() { // Adding a slight delay to ensure the node is open and rendered
+            var selectedItem = $('#jstree-navtree').find('.jstree-clicked')
+            console.log(selectedItem)
+            if (selectedItem.length) {
+                var container = $('#jstree-navtree').parent();
+                var selectedItemOffsetFromTop = selectedItem.offset().top;
+                var containerScrollTop = container.scrollTop();
+                var containerHeight = container.height();
+                var selectedItemHeight = selectedItem.outerHeight(true); // Include margin
+
+                // Calculate the top scroll position to center the item
+                var scrollTopToCenterItem = containerScrollTop + selectedItemOffsetFromTop - container.offset().top - (containerHeight / 2) + (selectedItemHeight / 2);
+                
+                container.animate({
+                    scrollTop: scrollTopToCenterItem
+                }, 'slow');
+            }
+        }, 300); // Adjust delay as necessary
+    });
+
 
 });
 </script>
diff --git a/roundabout/templates/inventory/ajax_inventory_snapshot_detail.html b/roundabout/templates/inventory/ajax_inventory_snapshot_detail.html
index 114577550..6c82c620a 100644
--- a/roundabout/templates/inventory/ajax_inventory_snapshot_detail.html
+++ b/roundabout/templates/inventory/ajax_inventory_snapshot_detail.html
@@ -137,6 +137,29 @@
         $('.ajax-detail-link').show();
     }
 
+    $('#jstree-navtree').on('loaded.jstree', function() {
+        // Open the tree to the selected item
+        
+        setTimeout(function() { // Adding a slight delay to ensure the node is open and rendered
+            var selectedItem = $('#jstree-navtree').find('.jstree-clicked')
+            console.log(selectedItem)
+            if (selectedItem.length) {
+                var container = $('#jstree-navtree').parent();
+                var selectedItemOffsetFromTop = selectedItem.offset().top;
+                var containerScrollTop = container.scrollTop();
+                var containerHeight = container.height();
+                var selectedItemHeight = selectedItem.outerHeight(true); // Include margin
+
+                // Calculate the top scroll position to center the item
+                var scrollTopToCenterItem = containerScrollTop + selectedItemOffsetFromTop - container.offset().top - (containerHeight / 2) + (selectedItemHeight / 2);
+                
+                container.animate({
+                    scrollTop: scrollTopToCenterItem
+                }, 'slow');
+            }
+        }, 300); // Adjust delay as necessary
+    });
+
 </script>
 
 {% endblock javascript %}
diff --git a/roundabout/templates/inventory/deployment_detail.html b/roundabout/templates/inventory/deployment_detail.html
index 5c76fb27a..007a6126b 100644
--- a/roundabout/templates/inventory/deployment_detail.html
+++ b/roundabout/templates/inventory/deployment_detail.html
@@ -74,6 +74,29 @@ <h2>Deployments</h2>
 
     });
 
+    $('#jstree-navtree').on('loaded.jstree', function() {
+        // Open the tree to the selected item
+        
+        setTimeout(function() { // Adding a slight delay to ensure the node is open and rendered
+            var selectedItem = $('#jstree-navtree').find('.jstree-clicked')
+            console.log(selectedItem)
+            if (selectedItem.length) {
+                var container = $('#jstree-navtree').parent();
+                var selectedItemOffsetFromTop = selectedItem.offset().top;
+                var containerScrollTop = container.scrollTop();
+                var containerHeight = container.height();
+                var selectedItemHeight = selectedItem.outerHeight(true); // Include margin
+
+                // Calculate the top scroll position to center the item
+                var scrollTopToCenterItem = containerScrollTop + selectedItemOffsetFromTop - container.offset().top - (containerHeight / 2) + (selectedItemHeight / 2);
+                
+                container.animate({
+                    scrollTop: scrollTopToCenterItem
+                }, 'slow');
+            }
+        }, 300); // Adjust delay as necessary
+    });
+
 
 });
 
diff --git a/roundabout/templates/inventory/inventory_deployment_detail.html b/roundabout/templates/inventory/inventory_deployment_detail.html
index 0b43441e4..fd91fb16a 100644
--- a/roundabout/templates/inventory/inventory_deployment_detail.html
+++ b/roundabout/templates/inventory/inventory_deployment_detail.html
@@ -164,6 +164,32 @@
 {% block javascript %}
 
 <script>
+    $(document).ready(function() {
+        $('#jstree-navtree').on('loaded.jstree', function() {
+            // Open the tree to the selected item
+            
+            setTimeout(function() { // Adding a slight delay to ensure the node is open and rendered
+                var selectedItem = $('#jstree-navtree').find('.jstree-clicked')
+                console.log(selectedItem)
+                if (selectedItem.length) {
+                    var container = $('#jstree-navtree').parent();
+                    var selectedItemOffsetFromTop = selectedItem.offset().top;
+                    var containerScrollTop = container.scrollTop();
+                    var containerHeight = container.height();
+                    var selectedItemHeight = selectedItem.outerHeight(true); // Include margin
+
+                    // Calculate the top scroll position to center the item
+                    var scrollTopToCenterItem = containerScrollTop + selectedItemOffsetFromTop - container.offset().top - (containerHeight / 2) + (selectedItemHeight / 2);
+                    
+                    container.animate({
+                        scrollTop: scrollTopToCenterItem
+                    }, 'slow');
+                }
+            }, 300); // Adjust delay as necessary
+        });
+
+    });
+
     var containerID = 'deployment-percent-' + {{ inventory_deployment.id }};
     var deploymentPecentage = {{ inventory_deployment.deployment_percentage_vs_build }};
     var timeInField = '{{ inventory_deployment.deployment_time_in_field|time_at_sea_display }}';
diff --git a/roundabout/templates/inventory/inventory_detail.html b/roundabout/templates/inventory/inventory_detail.html
index 1a9c05f32..ca968f1e1 100644
--- a/roundabout/templates/inventory/inventory_detail.html
+++ b/roundabout/templates/inventory/inventory_detail.html
@@ -68,7 +68,33 @@ <h2>Inventory</h2>
 {% endblock content %}
 
 {% block javascript %}
-
+<script>
+$(document).ready(function() {
+    $('#jstree-navtree').on('loaded.jstree', function() {
+        // Open the tree to the selected item
+        
+        setTimeout(function() { // Adding a slight delay to ensure the node is open and rendered
+            var selectedItem = $('#jstree-navtree').find('.jstree-clicked')
+            console.log(selectedItem)
+            if (selectedItem.length) {
+                var container = $('#jstree-navtree').parent();
+                var selectedItemOffsetFromTop = selectedItem.offset().top;
+                var containerScrollTop = container.scrollTop();
+                var containerHeight = container.height();
+                var selectedItemHeight = selectedItem.outerHeight(true); // Include margin
+
+                // Calculate the top scroll position to center the item
+                var scrollTopToCenterItem = containerScrollTop + selectedItemOffsetFromTop - container.offset().top - (containerHeight / 2) + (selectedItemHeight / 2);
+                
+                container.animate({
+                    scrollTop: scrollTopToCenterItem
+                }, 'slow');
+            }
+        }, 300); // Adjust delay as necessary
+    });
+
+});
+</script>
 
 
 {% endblock javascript %}