https://www.vcuhealth.org/media/vcuhealth/site-assets/js/cludo.js

1const head = document.querySelector('head')
2const body = document.querySelector('body')
3//const redirectUrl = cludoBody.dataset.redirect
4
5const cludoCss = document.createElement('link')
6cludoCss.rel = 'stylesheet'
7cludoCss.type = 'text/css'
8cludoCss.href = 'https://customer.cludo.com/templates/rich-inline/v1.0/dist/styles/cludo-search-results.css'
9
10head.appendChild(cludoCss)
11cludoCss.insertAdjacentHTML('beforebegin','<!-- Cludo -->')
12
13document.addEventListener('DOMContentLoaded',()=>{
14
15    const searchForm = document.querySelector('#cludo-search-input');                      
16    const searchInput = document.querySelector('.cludo-input-form input.cludo-input-form__input');
17    const cludoBody = document.querySelector('#cludo-main');
18    const cludoLoader = document.querySelector('#cludo-loading-screen'); 
19    const clearButton = document.querySelector('.cludo-search-clear');
20    const filtersContainer = document.querySelector('#cludo-filters-container');
21    let cludo
22
23    if (searchForm) {
24        searchForm.addEventListener('submit', (event) => {
25            // This stops the browser from EVER doing the ?searchrequest= reload.
26            // When Cludo is ready, it will still capture this event and run its own search.
27            if (!window.CludoSearchInstances || window.CludoSearchInstances.length === 0) {
28                event.preventDefault(); 
29            }
30        });
31    }
32
33    function isCludoReady(){
34        return window.Cludo && window.CludoSearchInstances && window.CludoSearchInstances.length > 0
35    }
36
37    function initMySearchLogic() {
38        console.log("Cludo is ready:");
39        console.log(cludo)
40        console.log(window.CludoSearchInstances)
41        cludo = window.Cludo.prototype
42
43        cludoBody.classList.remove("cludo-hidden")
44        cludoLoader.classList.add("cludo-hidden")
45
46        searchInput.addEventListener('input', (event) => {
47            if (event.target.value === "") {
48            clearResults()
49            }
50
51        },true);
52
53        // forwards false clear button event to clear search input
54        clearButton.addEventListener('click',()=>{
55            searchInput.value = ''
56            clearResults()
57        })
58
59    }
60
61    function clearResults(){
62
63        console.log('clearing results')
64
65        if(isCludoReady()){
66            window.CludoSearchInstances[0].params.query = ''
67            let newUrl = '/search/'
68
69            //check if this is dev or prod
70            if(document.querySelector('*[href*="terminalfour/preview"]')){
71                newUrl = '/terminalfour/preview/592/en/195653'
72            }
73
74            window.history.replaceState({}, document.title, newUrl);
75            window.CludoSearchInstances[0].clearAllFacetsAndFilters()
76            if(filtersContainer) filtersContainer.classList.remove('active')
77        }
78    }
79         
80    // Continously check if Cludo is ready
81      if (isCludoReady()) {
82          initMySearchLogic();
83      } else {
84          const cludoTimer = setInterval(() => {
85              if (isCludoReady()) {
86                  clearInterval(cludoTimer);
87                  initMySearchLogic();
88              }
89          }, 50); // Check every 50ms
90      }
91
92})
93
94