997c21feccb62b291ca8db627b18578837dc902b
jnavarr5
  Fri Jun 14 14:02:10 2024 -0700
Moving commonly used functions outside of each step to clean up the code, refs #33732

diff --git src/hg/js/clinicalTutorial.js src/hg/js/clinicalTutorial.js
index 54d8059..de4a080 100644
--- src/hg/js/clinicalTutorial.js
+++ src/hg/js/clinicalTutorial.js
@@ -34,159 +34,158 @@
         },
         text: 'Next'
     },
     'end': {
         action() {
             // log when the tutorial is finished (commented out for now)
             //writeToApacheLog("clinical finish " + getHgsid());
             //localStorage.setItem("hgTracks_hideTutorial", "1");
             return this.complete();
         },
         classes: 'shepherd-button-secondary',
         text: 'Finish'
     }
 };
 
+// Function to keep the menu visible
+function keepMenuVisible() {
+    const toolsMenu = document.querySelector('#tools2 > ul');
+    toolsMenu.style.display = 'block';
+    toolsMenu.style.visibility = 'visible';
+}
 
+// Function to show the popup
+function showPopup() {
+    const recTrackSetsPopup = document.querySelector('#recTrackSetsPopup');
+    recTrackSetsPopup.style.display = 'block';
+}
 
-// wrap setup in a function to be called only after  document is ready
-function setupSteps()
-{
+// Function to hide the popup
+function hidePopup() {
+    const recTrackSetsPopup = document.querySelector('#recTrackSetsPopup');
+    recTrackSetsPopup.style.display = 'none';
+}
+
+// Function to close the popup by clicking the X button
+function closePopup() {
+    const closeButton = document.querySelector('#recTrackSetsPopup .ui-dialog-titlebar-close');
+    if (closeButton) closeButton.click();
+}
+
+// Function to add steps to the tour
+function setupSteps() {
     tour.addStep({
-        title: 'Recommneded Track Sets',
+        title: 'Recommended Track Sets',
         text: 'Some text about the recommended track sets',
         attachTo: {
             element: '#recTrackSetsMenuItem',
             on: 'bottom'
         },
         buttons: [
             {
                 text: 'Next',
                 action: function() {
                     const rtsMenuItem = document.querySelector('#tools2 #recTrackSetsMenuItem');
                     rtsMenuItem.click();
                     tour.next();
                 }
             },
             tutorialButtons.end
         ],
         id: 'navbar',
         classes: 'dark-background',
         when: {
             show: () => {
                 const toolsMenu = document.querySelector('#tools2 > ul');
                 toolsMenu.style.display = 'block';
                 toolsMenu.style.visibility = 'visible';
 
-
                 toolsMenu.addEventListener('mouseover', keepMenuVisible);
                 toolsMenu.addEventListener('mouseout', keepMenuVisible);
-
-                function keepMenuVisible() {
-                    toolsMenu.style.display = 'block';
-                    toolsMenu.style.visibility = 'visible';
-                }
             },
             hide: () => {
                 const toolsMenu = document.querySelector('#tools2 > ul');
                 toolsMenu.style.display = 'none';
                 toolsMenu.style.visibility = 'hidden';
 
                 toolsMenu.removeEventListener('mouseover', keepMenuVisible);
                 toolsMenu.removeEventListener('mouseout', keepMenuVisible);
-
-                function keepMenuVisible() {
-                    toolsMenu.style.display = 'block';
-                    toolsMenu.style.visibility = 'visible';
-                }
-
             }
         }
     });
 
     tour.addStep({
         title: 'Clinical SNVs',
         text: 'Assess potential disease contributions of single nucleotide variants in coding regions.',
         attachTo: {
             element: '#recTrackSetsPopup ul li:nth-child(1)',
             on: 'right'
         },
         buttons: [
             {
                 text: 'Back',
                 action: () => {
                     tour.back();
-                    // Hide the popup when going back
-                    const recTrackSetsPopup = document.querySelector('#recTrackSetsPopup');
-                    recTrackSetsPopup.style.display = 'none';
+                    closePopup();
                 }
             },
             tutorialButtons.next
         ],
         when: {
-            show: () => {
-                const recTrackSetsPopup = document.querySelector('#recTrackSetsPopup');
-                recTrackSetsPopup.style.display = 'block'; // Ensure the popup is visible
-            }
+            show: showPopup
         }
     });
 
     tour.addStep({
         title: 'Clinical CNVs',
         text: 'Assess potential disease contributions of structural variants in coding regions.',
         attachTo: {
             element: '#recTrackSetsPopup ul li:nth-child(2)',
             on: 'right'
         },
-        buttons: [tutorialButtons.back, tutorialButtons.next],
+        buttons: [
+            tutorialButtons.back,
+            tutorialButtons.next
+        ],
         when: {
-            show: () => {
-                const recTrackSetsPopup = document.querySelector('#recTrackSetsPopup');
-                recTrackSetsPopup.style.display = 'block'; // Ensure the popup is visible
-            }
+            show: showPopup
         }
     });
 
     tour.addStep({
         title: 'Non-coding SNVs',
         text: 'Investigate functional aspects of non-coding variants.',
         attachTo: {
             element: '#recTrackSetsPopup ul li:nth-child(3)',
             on: 'right'
         },
-        buttons: [tutorialButtons.back, tutorialButtons.next],
+        buttons: [
+            tutorialButtons.back,
+            tutorialButtons.next
+        ],
         when: {
-            show: () => {
-                const recTrackSetsPopup = document.querySelector('#recTrackSetsPopup');
-                recTrackSetsPopup.style.display = 'block'; // Ensure the popup is visible
-            }
+            show: showPopup
         }
     });
 
     tour.addStep({
         title: 'Problematic Regions',
         text: 'Evaluate if annotations are on potential low confidence regions due to high homology or other reported concerns.',
         attachTo: {
             element: '#recTrackSetsPopup ul li:nth-child(4)',
             on: 'right'
         },
         buttons: [
             tutorialButtons.back,
             {
                 text: 'Finish',
                 action: () => {
                     tour.complete();
-                    // Hide the popup when going back
-                    const recTrackSetsPopup = document.querySelector('#recTrackSetsPopup');
-                    recTrackSetsPopup.style.display = 'none';
+                    hidePopup();
                 }
             }
         ],
         when: {
-            show: () => {
-                const recTrackSetsPopup = document.querySelector('#recTrackSetsPopup');
-                recTrackSetsPopup.style.display = 'block'; // Ensure the popup is visible
-            }
+            show: showPopup
         }
     });
-
 }