diff options
Diffstat (limited to 'main.js')
-rw-r--r-- | main.js | 28 |
1 files changed, 23 insertions, 5 deletions
@@ -132,7 +132,15 @@ const map = new Map({ /* move the control container to the viewport */ const container = document.getElementById('map-control-container'); -map.getViewport().appendChild(container); +(function() { + const container0 = map.getViewport().getElementsByClassName('ol-overlaycontainer-stopevent')[0]; + container0.appendChild(container); + container0.appendChild(document.getElementById('modal-info')); + + const backdrop = document.createElement('div'); + container0.appendChild(backdrop); + backdrop.id = 'modal-info-backdrop'; +})(); /* zoom in/out */ (function() { @@ -323,20 +331,30 @@ const menu = document.getElementById('map-menu'); i.classList.add('bi', 'bi-info-lg'); const panel = document.getElementById('modal-info'); - const modal = new Modal(panel, {}); + const modal = new Modal(panel, { + backdrop: false, + }); + + const backdrop = document.getElementById('modal-info-backdrop'); + backdrop.onclick = function(event) { + modal.hide(); + }; + panel.addEventListener('show.bs.modal', function() { + backdrop.classList.add('modal-backdrop', 'show'); btn.setAttribute('aria-expanded', 'true'); btn.classList.add('btn-dark'); btn.classList.remove('btn-light'); }); panel.addEventListener('hidden.bs.modal', function() { - btn.setAttribute('aria-expanded', 'false'); btn.classList.add('btn-light'); btn.classList.remove('btn-dark'); + btn.setAttribute('aria-expanded', 'false'); + backdrop.classList.remove('modal-backdrop', 'show'); }); - btn.onclick = function() { - modal.toggle() + btn.onclick = function(event) { + modal.toggle(); }; })(); |