Refactor display set modal loading functions for improved readability and error handling
This commit is contained in:
Ross
@@ -1200,34 +1200,88 @@
|
||||
const dsModalBody = document.getElementById("displaysetModalBody");
|
||||
const dsFullscreenModal = new bootstrap.Modal(document.getElementById("displaysetFullscreenModal"));
|
||||
|
||||
// Loader functions: can be called directly on reload
|
||||
async function loadDisplaysetModal(url, dsId) {
|
||||
if (!url && dsId) url = `/atlas/${dsId}/display_sets/modal`;
|
||||
if (!url) return;
|
||||
dsModalBody.innerHTML = "<p>Loading...</p>";
|
||||
try {
|
||||
const resp = await fetch(url);
|
||||
const html = await resp.text();
|
||||
dsModalBody.innerHTML = html;
|
||||
try {
|
||||
const fsBtn = document.querySelector('.displayset-fullscreen-btn');
|
||||
if (fsBtn) {
|
||||
fsBtn.dataset.url = url;
|
||||
if (dsId) fsBtn.dataset.dsId = dsId;
|
||||
}
|
||||
} catch (e) { console.warn(e); }
|
||||
try { setUrlParam('displayset', dsId); } catch (e) {}
|
||||
setTimeout(function () { try { window.mountDicomViewers(); } catch (e) { console.warn('mountDicomViewers not available', e); } }, 500);
|
||||
dsModal.show();
|
||||
} catch (error) {
|
||||
console.error('Error loading display set details:', error);
|
||||
dsModalBody.innerHTML = "<p>Failed to load display set.</p>";
|
||||
}
|
||||
}
|
||||
|
||||
async function loadDisplaysetFullscreen(url, dsId) {
|
||||
if (!url && dsId) url = `/atlas/${dsId}/display_sets/modal`;
|
||||
if (!url) return;
|
||||
document.getElementById('displaysetFullscreenLeft').innerHTML = '<p style="color:#fff; padding:1rem;">Loading viewer...</p>';
|
||||
document.getElementById('displaysetFullscreenRight').innerHTML = '<p>Loading details...</p>';
|
||||
try {
|
||||
const resp = await fetch(url);
|
||||
const html = await resp.text();
|
||||
const tmp = document.createElement('div');
|
||||
tmp.innerHTML = html;
|
||||
const viewer = tmp.querySelector('.dicom-viewer-root');
|
||||
if (viewer) {
|
||||
const left = document.getElementById('displaysetFullscreenLeft');
|
||||
left.innerHTML = '';
|
||||
left.appendChild(viewer);
|
||||
try { viewer.style.height='100%'; viewer.style.minHeight='100%'; viewer.style.width='100%'; viewer.style.display='block'; viewer.style.flex='1 1 auto'; } catch (e){}
|
||||
} else {
|
||||
document.getElementById('displaysetFullscreenLeft').innerHTML = '<p style="color:#fff; padding:1rem;">No viewer available</p>';
|
||||
}
|
||||
const viewerInTmp = tmp.querySelector('.dicom-viewer-root');
|
||||
if (viewerInTmp) viewerInTmp.remove();
|
||||
document.getElementById('displaysetFullscreenRight').innerHTML = tmp.innerHTML;
|
||||
try { if (dsId) { setUrlParam('displayset', dsId); setUrlParam('displayset_full', '1'); } } catch (e) {}
|
||||
dsFullscreenModal.show();
|
||||
setTimeout(function () { try { window.mountDicomViewers(); } catch (e) { console.warn('mountDicomViewers not available for fullscreen', e); } }, 500);
|
||||
} catch (error) {
|
||||
console.error('Error loading fullscreen display set:', error);
|
||||
document.getElementById('displaysetFullscreenLeft').innerHTML = '<p style="color:#fff; padding:1rem;">Failed to load viewer</p>';
|
||||
document.getElementById('displaysetFullscreenRight').innerHTML = '<p>Failed to load details.</p>';
|
||||
}
|
||||
}
|
||||
|
||||
async function loadFindingModal(findingId, url) {
|
||||
if (!url && findingId) url = `/atlas/series_finding/${findingId}/details/`;
|
||||
if (!url) return;
|
||||
const modalBody = document.getElementById('findingModalBody');
|
||||
modalBody.innerHTML = '<p>Loading...</p>';
|
||||
try {
|
||||
const resp = await fetch(url);
|
||||
const html = await resp.text();
|
||||
modalBody.innerHTML = html;
|
||||
setTimeout(function () { try { window.mountDicomViewers(); } catch (e) { console.warn('mountDicomViewers not available', e); } }, 200);
|
||||
try { setUrlParam('finding', findingId); } catch (e) {}
|
||||
const modal = new bootstrap.Modal(document.getElementById('findingModal'));
|
||||
modal.show();
|
||||
document.getElementById('reload-finding')?.addEventListener('click', function () { window.mountDicomViewers(); });
|
||||
} catch (e) {
|
||||
console.error('Error loading finding details:', e);
|
||||
modalBody.innerHTML = '<p>Failed to load finding details.</p>';
|
||||
}
|
||||
}
|
||||
|
||||
document.querySelectorAll(".view-displayset-modal").forEach(button => {
|
||||
button.addEventListener("click", function () {
|
||||
const url = this.getAttribute("data-url");
|
||||
const dsId = this.getAttribute('data-ds-id');
|
||||
dsModalBody.innerHTML = "<p>Loading...</p>";
|
||||
fetch(url)
|
||||
.then(response => response.text())
|
||||
.then(html => {
|
||||
dsModalBody.innerHTML = html;
|
||||
// attach url to fullscreen button so it knows what to load
|
||||
try {
|
||||
const fsBtn = document.querySelector('.displayset-fullscreen-btn');
|
||||
if (fsBtn) {
|
||||
fsBtn.dataset.url = url;
|
||||
if (dsId) fsBtn.dataset.dsId = dsId;
|
||||
}
|
||||
} catch (e) { console.warn(e); }
|
||||
// add URL param so modal can be reopened after reload
|
||||
try { setUrlParam('displayset', dsId); } catch (e) { /* ignore */ }
|
||||
setTimeout(function () {
|
||||
try { window.mountDicomViewers(); } catch (e) { console.warn('mountDicomViewers not available', e); }
|
||||
}, 500);
|
||||
})
|
||||
.catch(error => {
|
||||
console.error("Error loading display set details:", error);
|
||||
dsModalBody.innerHTML = "<p>Failed to load display set.</p>";
|
||||
});
|
||||
dsModal.show();
|
||||
loadDisplaysetModal(url, dsId);
|
||||
});
|
||||
});
|
||||
|
||||
@@ -1236,59 +1290,12 @@
|
||||
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: call loader function
|
||||
document.querySelectorAll('.displayset-fullscreen-btn').forEach(btn => {
|
||||
btn.addEventListener('click', function () {
|
||||
const url = btn.dataset.url;
|
||||
if (!url) return;
|
||||
const dsId = btn.dataset.dsId || (new URL(url, window.location.origin)).searchParams.get('displayset') || null;
|
||||
// show loading state
|
||||
document.getElementById('displaysetFullscreenLeft').innerHTML = '<p style="color:#fff; padding:1rem;">Loading viewer...</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)
|
||||
.then(response => response.text())
|
||||
.then(html => {
|
||||
const tmp = document.createElement('div');
|
||||
tmp.innerHTML = html;
|
||||
// find viewer element
|
||||
const viewer = tmp.querySelector('.dicom-viewer-root');
|
||||
if (viewer) {
|
||||
// move viewer into left pane
|
||||
const left = document.getElementById('displaysetFullscreenLeft');
|
||||
left.innerHTML = '';
|
||||
left.appendChild(viewer);
|
||||
// force the viewer to fill the available space
|
||||
try {
|
||||
viewer.style.height = '100%';
|
||||
viewer.style.minHeight = '100%';
|
||||
viewer.style.width = '100%';
|
||||
viewer.style.display = 'block';
|
||||
viewer.style.flex = '1 1 auto';
|
||||
} catch (e) { console.warn('failed to resize viewer element', e); }
|
||||
} else {
|
||||
document.getElementById('displaysetFullscreenLeft').innerHTML = '<p style="color:#fff; padding:1rem;">No viewer available</p>';
|
||||
}
|
||||
// remaining content (without viewer) goes to right pane
|
||||
// remove viewer from tmp to avoid duplication
|
||||
const viewerInTmp = tmp.querySelector('.dicom-viewer-root');
|
||||
if (viewerInTmp) viewerInTmp.remove();
|
||||
document.getElementById('displaysetFullscreenRight').innerHTML = tmp.innerHTML;
|
||||
|
||||
dsFullscreenModal.show();
|
||||
|
||||
// allow viewer to initialize
|
||||
setTimeout(function () {
|
||||
try { window.mountDicomViewers(); } catch (e) { console.warn('mountDicomViewers not available for fullscreen', e); }
|
||||
}, 500);
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Error loading fullscreen display set:', error);
|
||||
document.getElementById('displaysetFullscreenLeft').innerHTML = '<p style="color:#fff; padding:1rem;">Failed to load viewer</p>';
|
||||
document.getElementById('displaysetFullscreenRight').innerHTML = '<p>Failed to load details.</p>';
|
||||
});
|
||||
const dsId = btn.dataset.dsId || null;
|
||||
loadDisplaysetFullscreen(url, dsId);
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
Reference in New Issue
Block a user