https://www.portagemi.gov/static/js/loader.js?v=i215fmhn1ppNi3l5y5xz6tGyeuBsqLV8coS6Mfb4FrU

1var ajaxSpinnerVisible = false;
2
3function ajaxCallStart(textProcessing) {
4    if (!textProcessing || textProcessing == "")
5        textProcessing = 'Loading';
6    if (!ajaxSpinnerVisible) {
7        var panelAjaxProgress = document.getElementById("divAjaxProgress"),
8            divAjaxImgProgress = document.getElementById("divAjaxImgProgress"),
9            panelAjaxShade = document.getElementById("divAjaxShade");
10
11        if (!panelAjaxProgress) {
12            // create divs on the fly
13            panelAjaxProgress = document.createElement('div');
14            panelAjaxProgress.id = "divAjaxProgress";
15            panelAjaxProgress.style.display = "none";
16
17            panelAjaxShade = document.createElement('div');
18            panelAjaxShade.id = "divAjaxShade";
19
20            divAjaxImgProgress = document.createElement('div');
21            divAjaxImgProgress.id = "divAjaxImgProgress";
22            divAjaxImgProgress.className = "loading";
23            divAjaxImgProgress.style.position = "relative";
24            divAjaxImgProgress.innerHTML = '<img src="/static/images/ajax-loader.gif" /><p></p>';
25
26            panelAjaxProgress.appendChild(panelAjaxShade);
27            panelAjaxProgress.appendChild(divAjaxImgProgress);
28
29            // Prepend to body
30            document.body.insertBefore(panelAjaxProgress, document.body.firstChild);
31
32            // Set styles
33            Object.assign(panelAjaxProgress.style, {
34                position: 'fixed', top: '0px', left: '0px', bottom: '0px', right: '0px',
35                textAlign: 'center', border: '1px solid #666',
36                zIndex: '90000000'
37            });
38            Object.assign(panelAjaxShade.style, {
39                position: 'fixed', top: '0px', left: '0px', bottom: '0px', right: '0px',
40                background: '#fff', opacity: '0.5'
41            });
42        }
43
44        ajaxSpinnerVisible = true;
45        ajaxProcesingResizing();
46        ajaxUpdateText(textProcessing);
47
48        // Show elements
49        document.getElementById("divAjaxProgress").style.display = "";
50        document.getElementById("divAjaxImgProgress").style.display = "";
51
52        window.addEventListener('resize', ajaxProcesingResizing);
53    }
54}
55
56// Hide ajax process panel
57function ajaxCallEnd(noAnimation) {
58    if (ajaxSpinnerVisible) {
59        var panelAjaxProgress = document.getElementById("divAjaxProgress");
60        var divAjaxImgProgress = document.getElementById("divAjaxImgProgress");
61
62        if (panelAjaxProgress && divAjaxImgProgress) {
63            if (noAnimation) {
64                divAjaxImgProgress.style.display = "none";
65                panelAjaxProgress.style.display = "none";
66            } else {
67                // Simple fade out using opacity and setTimeout
68                divAjaxImgProgress.style.transition = "opacity 0.2s";
69                divAjaxImgProgress.style.opacity = 0;
70                setTimeout(function () {
71                    divAjaxImgProgress.style.display = "none";
72                    panelAjaxProgress.style.display = "none";
73                    divAjaxImgProgress.style.opacity = 1;
74                    divAjaxImgProgress.style.transition = "";
75                }, 200);
76            }
77        }
78
79        ajaxSpinnerVisible = false;
80        window.removeEventListener('resize', ajaxProcesingResizing);
81    }
82}
83
84// Update ajax panel feedback text while panel is being displayed
85function ajaxUpdateText(text) {
86    if (ajaxSpinnerVisible) {
87        var divAjaxImgProgress = document.getElementById("divAjaxImgProgress");
88        if (divAjaxImgProgress) {
89            var img = divAjaxImgProgress.querySelector('img');
90            var p = divAjaxImgProgress.querySelector('p');
91            if (img) {
92                img.alt = text;
93                img.title = text;
94            }
95            if (p) {
96                p.innerHTML = text;
97            }
98        }
99    }
100}
101
102// Resize ajax panel when on window resize
103function ajaxProcesingResizing() {
104    if (ajaxSpinnerVisible) {
105        var panelAjaxProgress = document.getElementById("divAjaxProgress");
106        var divAjaxImgProgress = document.getElementById("divAjaxImgProgress");
107        var panelAjaxShade = document.getElementById("divAjaxShade");
108
109        var winHeight = window.innerHeight;
110        var winWidth = window.innerWidth;
111
112        if (panelAjaxProgress) {
113            panelAjaxProgress.style.height = winHeight + "px";
114            panelAjaxProgress.style.width = winWidth + "px";
115        }
116        if (panelAjaxShade) {
117            panelAjaxShade.style.height = winHeight + "px";
118            panelAjaxShade.style.width = winWidth + "px";
119        }
120        if (divAjaxImgProgress) {
121            var imgHeight = divAjaxImgProgress.offsetHeight;
122            divAjaxImgProgress.style.top = (winHeight / 2 - imgHeight / 2) + "px";
123        }
124    }
125}
126
127document.addEventListener('DOMContentLoaded', function () {
128    document.body.addEventListener("htmx:beforeRequest", function () {
129        ajaxCallStart();
130    });
131
132    document.body.addEventListener("htmx:afterRequest", function () {
133        ajaxCallEnd(true);
134    });
135});
136
137document.body.addEventListener('htmx:afterSettle', function(e) {
138    const navEvent = new CustomEvent('spa:navigated', { detail: { path: window.location.pathname, query: window.location.search }});
139    document.body.dispatchEvent(navEvent);
140})