Refactor code structure for improved readability and maintainability

This commit is contained in:
Ross
2026-05-11 11:31:04 +01:00
parent d046b7a151
commit 84b032addb
3 changed files with 195 additions and 179 deletions
+6
View File
@@ -256,6 +256,12 @@ function clearableTextAreaSetup() {
}
function loadDicomViewer(images_to_load, annotations_to_load) {
// Skip loading old viewer if using new dv3d viewer (set on new_uploads page)
if (window.skipLoadDicomViewer) {
console.log("Skipping old loadDicomViewer - using dv3d instead");
return;
}
console.log("loadDicomViewer", images_to_load);
let single_dicom = document.getElementById("single-dicom-viewer");
if (single_dicom) {
+47 -37
View File
@@ -93,7 +93,7 @@
</div>
</div>
<div class="card-body" style="position: relative; min-height: 450px;">
<div id="single-dicom-viewer" class="dicom-viewer-root" style="position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%;"></div>
<div id="upload-dicom-viewer" class="dicom-viewer-root" style="position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%;"></div>
</div>
</div>
@@ -158,6 +158,12 @@
{% endblock %}
{% block js %}
<!-- Set skip flag EARLY before any other scripts load to prevent old Cornerstone viewer from running -->
<script>
window.skipLoadDicomViewer = true;
console.log('skipLoadDicomViewer flag set before module scripts load');
</script>
<script src="https://cdn.jsdelivr.net/npm/hash-wasm@4"></script>
<script src="{% static 'js/upload_form_helpers.js' %}"></script>
<script src="{% static 'dv3d/index.js' %}" type="module" defer="defer"></script>
@@ -665,18 +671,17 @@
async function showRecordsInViewer(records, label) {
if (!records.length) return;
console.log('showRecordsInViewer called with', records.length, 'records, label:', label);
console.log('First record:', records[0]);
// Try passing blob URLs directly (without wadouri: prefix) to dv3d
const images = records.map((record) => record.objectUrl);
console.log('Mapped images:', images);
// Pass the File objects directly to the viewer
const files = records.map((record) => record.file);
console.log('Files to load:', files);
window.uploadPreview.currentTagsRecord = records[0];
document.getElementById("viewer-context").textContent = label;
document.getElementById("viewer-tags-btn").disabled = false;
// Directly mount dv3d viewer without triggering old viewer via event
await loadDv3dViewer(images, undefined);
// Load files directly into the viewer
await loadDv3dViewer(files);
// Focus the viewer card
const viewerCard = document.querySelector(".card-header:has(#viewer-context)").closest(".card");
if (viewerCard) {
@@ -849,15 +854,16 @@
if (element) element.addEventListener(eventName, handler);
}
async function loadDv3dViewer(images, annotations) {
async function loadDv3dViewer(files) {
try {
console.log('loadDv3dViewer called with images:', images, 'length:', images ? images.length : 0);
// Wait for dv3d bundle to mount
if (!window.mountDicomViewers) {
console.log('loadDv3dViewer called with', files.length, 'files');
// Wait for dv3d viewer API to be available
if (!window.loadDicomStackFromFiles && !window.loadDicomStackFromWadouriList) {
console.log('Waiting for dv3d viewer API to load...');
await new Promise((resolve) => {
const checkInterval = setInterval(() => {
if (window.mountDicomViewers) {
if (window.loadDicomStackFromFiles || window.loadDicomStackFromWadouriList) {
clearInterval(checkInterval);
resolve();
}
@@ -866,22 +872,29 @@
});
}
const viewerElement = document.getElementById('single-dicom-viewer');
if (!viewerElement || !window.mountDicomViewers) {
console.warn('dv3d not ready or viewer element missing');
const viewerElement = document.getElementById('upload-dicom-viewer');
if (!viewerElement) {
console.warn('Viewer element not found');
return;
}
console.log('Clearing viewer element and mounting with', images.length, 'images');
// Clear any old viewer content before mounting dv3d
viewerElement.innerHTML = '';
//console.log('Clearing viewer element and loading files');
//// Clear any old viewer content before mounting dv3d
//viewerElement.innerHTML = '';
// Mount dv3d viewer with images
window.mountDicomViewers(viewerElement, {
imageIds: images,
annotations: annotations,
});
console.log('dv3d viewer mounted successfully');
// Try to load files using the dv3d viewer API
if (window.loadDicomStackFromFiles && typeof window.loadDicomStackFromFiles === 'function') {
console.log('Using loadDicomStackFromFiles API');
window.loadDicomStackFromFiles(files);
console.log('Files loaded into viewer');
} else if (window.loadDicomStackFromWadouriList && typeof window.loadDicomStackFromWadouriList === 'function') {
console.log('Using loadDicomStackFromWadouriList API');
const wadouriList = files.map(f => 'wadouri:' + URL.createObjectURL(f));
window.loadDicomStackFromWadouriList(wadouriList);
console.log('WADO URIs loaded into viewer');
} else {
console.warn('Neither loadDicomStackFromFiles nor loadDicomStackFromWadouriList available');
}
} catch (err) {
console.error('Failed to load dv3d viewer:', err);
}
@@ -931,7 +944,7 @@
return;
}
tbody.innerHTML = "";
if (Object.keys(tags).length === 0) {
const row = document.createElement("tr");
row.innerHTML = "<td colspan='2' class='text-muted'>No tags found</td>";
@@ -952,7 +965,7 @@
} else {
document.getElementById("tags-warning").style.display = "none";
}
const modal = new bootstrap.Modal(document.getElementById("dicomTagsModal"));
modal.show();
} catch (err) {
@@ -970,8 +983,8 @@
const td = row.querySelector("td")?.textContent || "";
row.style.display =
!q || th.toLowerCase().includes(q) || td.toLowerCase().includes(q)
? ""
: "none";
? ""
: "none";
});
}
});
@@ -985,8 +998,8 @@
const td = row.querySelector("td")?.textContent || "";
row.style.display =
!q || th.toLowerCase().includes(q) || td.toLowerCase().includes(q)
? ""
: "none";
? ""
: "none";
});
}
});
@@ -1060,9 +1073,6 @@
bindIfExists("uploadButton", "click", onUploadButtonClicked);
bindIfExists("viewer-tags-btn", "click", showDicomTags);
// Prevent old Cornerstone viewer from interfering with dv3d on this page
window.skipLoadDicomViewer = true;
window.addEventListener("beforeunload", async () => {
if (window.uploadPreview.ocrWorker) {
try { await window.uploadPreview.ocrWorker.terminate(); } catch (err) {}
+142 -142
View File
File diff suppressed because one or more lines are too long