Enhance modal functionality: add URL parameter handling for displaysets and findings, and reopen modals based on URL params
This commit is contained in:
@@ -1203,6 +1203,7 @@
|
|||||||
document.querySelectorAll(".view-displayset-modal").forEach(button => {
|
document.querySelectorAll(".view-displayset-modal").forEach(button => {
|
||||||
button.addEventListener("click", function () {
|
button.addEventListener("click", function () {
|
||||||
const url = this.getAttribute("data-url");
|
const url = this.getAttribute("data-url");
|
||||||
|
const dsId = this.getAttribute('data-ds-id');
|
||||||
dsModalBody.innerHTML = "<p>Loading...</p>";
|
dsModalBody.innerHTML = "<p>Loading...</p>";
|
||||||
fetch(url)
|
fetch(url)
|
||||||
.then(response => response.text())
|
.then(response => response.text())
|
||||||
@@ -1211,8 +1212,13 @@
|
|||||||
// attach url to fullscreen button so it knows what to load
|
// attach url to fullscreen button so it knows what to load
|
||||||
try {
|
try {
|
||||||
const fsBtn = document.querySelector('.displayset-fullscreen-btn');
|
const fsBtn = document.querySelector('.displayset-fullscreen-btn');
|
||||||
if (fsBtn) fsBtn.dataset.url = url;
|
if (fsBtn) {
|
||||||
|
fsBtn.dataset.url = url;
|
||||||
|
if (dsId) fsBtn.dataset.dsId = dsId;
|
||||||
|
}
|
||||||
} catch (e) { console.warn(e); }
|
} catch (e) { console.warn(e); }
|
||||||
|
// add URL param so modal can be reopened after reload
|
||||||
|
try { setUrlParam('displayset', dsId); } catch (e) { /* ignore */ }
|
||||||
setTimeout(function () {
|
setTimeout(function () {
|
||||||
try { window.mountDicomViewers(); } catch (e) { console.warn('mountDicomViewers not available', e); }
|
try { window.mountDicomViewers(); } catch (e) { console.warn('mountDicomViewers not available', e); }
|
||||||
}, 500);
|
}, 500);
|
||||||
@@ -1225,14 +1231,22 @@
|
|||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// remove displayset param when modal closed
|
||||||
|
document.getElementById('displaysetModal').addEventListener('hidden.bs.modal', function () {
|
||||||
|
try { removeUrlParam('displayset'); removeUrlParam('displayset_full'); } catch (e) {}
|
||||||
|
});
|
||||||
|
|
||||||
// Fullscreen button handler: fetch the same displayset content but lay out viewer left, details right
|
// Fullscreen button handler: fetch the same displayset content but lay out viewer left, details right
|
||||||
document.querySelectorAll('.displayset-fullscreen-btn').forEach(btn => {
|
document.querySelectorAll('.displayset-fullscreen-btn').forEach(btn => {
|
||||||
btn.addEventListener('click', function () {
|
btn.addEventListener('click', function () {
|
||||||
const url = btn.dataset.url;
|
const url = btn.dataset.url;
|
||||||
if (!url) return;
|
if (!url) return;
|
||||||
|
const dsId = btn.dataset.dsId || (new URL(url, window.location.origin)).searchParams.get('displayset') || null;
|
||||||
// show loading state
|
// show loading state
|
||||||
document.getElementById('displaysetFullscreenLeft').innerHTML = '<p style="color:#fff; padding:1rem;">Loading viewer...</p>';
|
document.getElementById('displaysetFullscreenLeft').innerHTML = '<p style="color:#fff; padding:1rem;">Loading viewer...</p>';
|
||||||
document.getElementById('displaysetFullscreenRight').innerHTML = '<p>Loading details...</p>';
|
document.getElementById('displaysetFullscreenRight').innerHTML = '<p>Loading details...</p>';
|
||||||
|
// set URL params for fullscreen
|
||||||
|
try { if (dsId) { setUrlParam('displayset', dsId); setUrlParam('displayset_full', '1'); } } catch (e) {}
|
||||||
|
|
||||||
fetch(url)
|
fetch(url)
|
||||||
.then(response => response.text())
|
.then(response => response.text())
|
||||||
@@ -1278,6 +1292,71 @@
|
|||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// remove fullscreen param when fullscreen modal closed
|
||||||
|
document.getElementById('displaysetFullscreenModal').addEventListener('hidden.bs.modal', function () {
|
||||||
|
try { removeUrlParam('displayset_full'); } catch (e) {}
|
||||||
|
});
|
||||||
|
|
||||||
|
// FINDING modal: push/remove param so it can be reopened after reload
|
||||||
|
document.querySelectorAll(".view-finding-modal").forEach(button => {
|
||||||
|
button.addEventListener("click", function () {
|
||||||
|
const findingId = this.getAttribute("data-finding-id");
|
||||||
|
try { setUrlParam('finding', findingId); } catch (e) {}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
document.getElementById('findingModal').addEventListener('hidden.bs.modal', function () {
|
||||||
|
try { removeUrlParam('finding'); } catch (e) {}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Helper: set/remove URL search params without reloading
|
||||||
|
function setUrlParam(key, value) {
|
||||||
|
if (!key) return;
|
||||||
|
const url = new URL(window.location.href);
|
||||||
|
if (value === null || value === undefined) {
|
||||||
|
url.searchParams.delete(key);
|
||||||
|
} else {
|
||||||
|
url.searchParams.set(key, value);
|
||||||
|
}
|
||||||
|
window.history.replaceState({}, '', url.toString());
|
||||||
|
}
|
||||||
|
|
||||||
|
function removeUrlParam(key) {
|
||||||
|
const url = new URL(window.location.href);
|
||||||
|
url.searchParams.delete(key);
|
||||||
|
window.history.replaceState({}, '', url.toString());
|
||||||
|
}
|
||||||
|
|
||||||
|
// On load: reopen modals if URL params present
|
||||||
|
(function reopenModalsFromUrl() {
|
||||||
|
const params = new URL(window.location.href).searchParams;
|
||||||
|
const dsId = params.get('displayset');
|
||||||
|
const dsFull = params.get('displayset_full');
|
||||||
|
const findingId = params.get('finding');
|
||||||
|
if (dsId) {
|
||||||
|
// try to find a button for this displayset and click it
|
||||||
|
const btn = document.querySelector(`.view-displayset-modal[data-ds-id="${dsId}"]`);
|
||||||
|
if (btn) {
|
||||||
|
// open fullscreen if requested
|
||||||
|
if (dsFull) {
|
||||||
|
// ensure the modal content is loaded then trigger fullscreen
|
||||||
|
btn.click();
|
||||||
|
// wait for content then trigger fullscreen button
|
||||||
|
setTimeout(function () {
|
||||||
|
const fs = document.querySelector('.displayset-fullscreen-btn');
|
||||||
|
if (fs) fs.click();
|
||||||
|
}, 800);
|
||||||
|
} else {
|
||||||
|
btn.click();
|
||||||
|
}
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (findingId) {
|
||||||
|
const fbtn = document.querySelector(`.view-finding-modal[data-finding-id="${findingId}"]`);
|
||||||
|
if (fbtn) fbtn.click();
|
||||||
|
}
|
||||||
|
})();
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user