diff --git a/dicomSummary.html b/dicomSummary.html new file mode 100644 index 0000000..1e20342 --- /dev/null +++ b/dicomSummary.html @@ -0,0 +1,286 @@ +
+

DICOM Summary

+ +
+
+

Patient Information

+
+
+
+
+ Patient Name: +
+
+ Patient ID: +
+
+
+
+ Patient Birth Date: +
+
+ Patient Sex: +
+
+
+
+ +
+
+

Study Information

+
+
+
+
+ Study Description: +
+
+ Protocol Name: +
+
+
+
+ Accession #: +
+
+ Study Id: +
+
+
+
+ Study Date: +
+
+ Study Time: +
+
+ +
+
+ +
+
+

Series Information

+
+
+
+
+ Series Description: +
+
+ Series #: +
+
+
+
+ Modality: +
+
+ Body Part: +
+
+
+
+ Series Date: +
+
+ Series Time: +
+
+ +
+
+ +
+
+

Instance Information

+
+
+
+
+ Instance #: +
+
+ Acquisition #: +
+
+
+
+ Acquisition Date: +
+
+ Acquisition Time: +
+
+
+
+ Content Date: +
+
+ Content Time: +
+
+ + + +
+
+ +
+
+

Image Information

+
+
+
+
+ Rows: +
+
+ Columns: +
+
+ +
+
+ Photometric Interpretation: +
+
+ Image Type: +
+ +
+ +
+
+ Bits Allocated: +
+
+ Bits Stored: +
+
+ +
+
+ HighBit: +
+
+ Pixel Representation (0=us): +
+
+ +
+
+ Rescale Slope: +
+
+ Rescale Intercept: +
+
+
+
+ Image Position Patient: +
+
+ Image Orientation Patient: +
+
+
+
+ Pixel Spacing: +
+
+ Samples Per Pixel: +
+
+ +
+
+ +
+
+

Equipment Information

+
+
+
+
+ Manufacturer: +
+
+ Model: +
+
+
+
+ Station Name: +
+
+ AE Title: +
+
+
+
+ Institution Name: +
+
+
+
+ Software Version: +
+
+
+
+ Implementation Version Name: +
+
+
+
+ +
+
+

UIDS

+
+
+
+
+ Study UID: +
+
+
+
+ Series UID: +
+
+
+
+ Instance UID: +
+
+
+
+ SOP Class UID: +
+
+
+
+ Transfer Syntax UID: +
+
+
+
+ Frame of Reference UID: +
+
+
+
+ WADO URL: +
+ http://localhost:3333/wado?requestType=WADO&studyUID=&seriesUID=&objectUID=&contentType=application%2Fdicom&transferSyntax=1.2.840.10008.1.2.1 +
+
+
+
+
+
\ No newline at end of file diff --git a/dicomViewer.css b/dicomViewer.css index 6e58506..b10e8d0 100644 --- a/dicomViewer.css +++ b/dicomViewer.css @@ -73,10 +73,17 @@ #dicom-fullscreen-button { position: absolute; - transform: translate(0, -20%); + transform: translate(50%, -20%); right: 50%; } +#dicom-collapse-button { + position: absolute; + transform: translate(0, -50%); + top: 50%; + right: 0; +} + #dicom-settings-panel { display: none; position: absolute; @@ -92,6 +99,21 @@ z-index: 999; } +#dicom-log-panel { + display: none; + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + padding-left: 30px; + padding-right: 30px; + padding-bottom: 20px; + background-color: rgba(0, 0, 0, 0.8); /* Black w/ opacity */ + width: 90%; + height: 90%; + z-index: 999; +} + #dicom-window-panel { position: absolute; top: 100%; @@ -100,4 +122,14 @@ } #dicom-window-panel:hover { opacity: 1; +} + +#dicom-summary { + position: relative; + z-index: 999; + max-width: 100%; + height: 100%; + color: red; + top: -100%; + overflow: scroll } \ No newline at end of file diff --git a/dicomViewer.js b/dicomViewer.js index 529aaae..c431c25 100644 --- a/dicomViewer.js +++ b/dicomViewer.js @@ -11,20 +11,28 @@ cornerstoneWADOImageLoader.external.cornerstone = cornerstone; cornerstoneTools.init(); +let tool_state = {}; export function loadCornerstone(main_element, db, images, annotations_to_load, load_as_stack = false) { // canvas-panel holds the enabled elements and all tools / menus main_element.append("
"); + main_element[0].dataset.collapsed = "none"; $(".canvas-panel").append($("
")); + //$(".canvas-panel").append($("
").load("dicomSummary.html")); let single_dicom_viewer = main_element.find(".single-dicom-viewer").get(0); console.log(single_dicom_viewer); + $(".canvas-panel").append($(`
+ close +
`)); + // Add generic settings menus to canvas-panel $(".canvas-panel").append( $(`
close + view log

Image viewer settings:

Primary @@ -87,7 +95,8 @@ export function loadCornerstone(main_element, db, images, annotations_to_load, l ) .append($("↻")) .append($("⛶")) - .append($("⚙")); + .append($("⚙")) + .append($("⇄")); $(single_dicom_viewer).append( $( @@ -137,6 +146,15 @@ export function loadCornerstone(main_element, db, images, annotations_to_load, l $("#dicom-settings-panel").hide(); e.preventDefault(); }); + $("#dicom-log-close").click(e => { + $("#dicom-log-panel").hide(); + e.preventDefault(); + }); + $(".view-log-button").click(e => { + $("#dicom-settings-panel").hide(); + $("#dicom-log-panel").show(); + e.preventDefault(); + }); $("#dicom-settings-button").click(e => { $("#dicom-settings-panel").toggle(); }); @@ -156,6 +174,20 @@ export function loadCornerstone(main_element, db, images, annotations_to_load, l loadCornerstone(main_element, db, images, annotations_to_load, stack) }); + $("#dicom-collapse-button").click(e => { + //$("#dicom-settings-panel").toggle(); + //let stack = !load_as_stack; + if (main_element[0].dataset.collapsed == "none") { + main_element[0].dataset.collapsed = main_element.width(); + main_element.width("50px"); + } else { + main_element.width(main_element[0].dataset.collapsed); + main_element[0].dataset.collapsed = "none" + } + resizeHandler(); + //loadCornerstone(main_element, db, images, annotations_to_load, stack) + }); + //let images = data["images"]; // Make sure we have an array @@ -180,15 +212,14 @@ export function loadCornerstone(main_element, db, images, annotations_to_load, l function loadAnnotation(imageId, annotation) { - console.log("loadAnnotations", imageId, annotations); + console.log("loadAnnotations", imageId, annotation); const toolStateManager = cornerstoneTools.globalImageIdSpecificToolStateManager; - if (annotation == undefined || annotation.length < 1) { return } + if (annotation == undefined || annotation.length < 1 || annotation == [undefined]) { return } - console.log(annotation); + console.log("1234", annotation); let tool_state_no_id = JSON.parse(annotation); - let tool_state = {}; tool_state[imageId] = tool_state_no_id; toolStateManager.restoreToolState(tool_state); @@ -255,14 +286,15 @@ export function loadCornerstone(main_element, db, images, annotations_to_load, l imageIds }; //cornerstone.loadAndCacheImage(imageIds[0]).then(function(image) { - console.log("load and cache", imageIds[0]) + //console.log("load and cache", imageIds[0]) cornerstone.loadAndCacheImage(imageIds[0]).then(function (image) { - console.log("LOAD and cache, then"); + //console.log("LOAD and cache, then", image); loadCornerstoneMainImage(single_dicom_viewer, image, stack, db, load_as_stack); }) .catch((err, err2) => { console.log(err); + $("#dicom-log-panel").append(err); }); } @@ -371,6 +403,7 @@ export function loadCornerstone(main_element, db, images, annotations_to_load, l } function loadCornerstoneMainImage(element, image, stack, db, load_as_stack) { + dumpDataSet(image.data) console.log("loadCornerstoneMainImage") console.log("load as stack:", load_as_stack) // It is probably silly to do this each time we load a question @@ -429,7 +462,7 @@ function loadCornerstoneMainImage(element, image, stack, db, load_as_stack) { }, }); - cornerstoneTools.setToolEnabled("ArrowAnnotate"); + cornerstoneTools.setToolEnabledForElement(element, "ArrowAnnotate"); let available_tools = [ @@ -465,9 +498,9 @@ function loadCornerstoneMainImage(element, image, stack, db, load_as_stack) { console.log(load_as_stack); if (load_as_stack) { - cornerstoneTools.setToolActive("StackScrollMouseWheel", { mouseButtonMask: 3 }); + cornerstoneTools.setToolActiveForElement(element, "StackScrollMouseWheel", { mouseButtonMask: 3 }); } else { - cornerstoneTools.setToolActive("ZoomMouseWheel", { mouseButtonMask: 3 }); + cornerstoneTools.setToolActiveForElement(element, "ZoomMouseWheel", { mouseButtonMask: 3 }); } //cornerstoneTools.setToolActive("Zoom", { mouseButtonMask: 4 }); //cornerstoneTools.setToolActive("Wwwc", { mouseButtonMask: 2 }); @@ -599,9 +632,10 @@ function selectThumbClick(evt) { export function registerPrimaryDicomInterface() { // Set mousetools based upon the selected options + let element = document.getElementsByClassName("single-dicom-viewer")[0]; let selections = $("#primary-mouse-binding select"); selections.each((i, option) => { - cornerstoneTools.setToolActive(option.value, { + cornerstoneTools.setToolActiveForElement(element, option.value, { mouseButtonMask: parseInt(option.dataset.button) }); }); @@ -611,9 +645,10 @@ export function registerAltDicomInterface(e) { // Called when control is pressed // Set mousetools based upon the selected options + let element = document.getElementsByClassName("single-dicom-viewer")[0]; let selections = $("#secondary-mouse-binding select"); selections.each((i, option) => { - cornerstoneTools.setToolActive(option.value, { + cornerstoneTools.setToolActiveForElement(element, option.value, { mouseButtonMask: parseInt(option.dataset.button) }); }); @@ -628,7 +663,8 @@ function changeMouseBinding(e, db) { // Directly activate primary tools (secondary will be activated when modifier // key is pressed if (mode == "0") { - cornerstoneTools.setToolActive(tool, { mouseButtonMask: parseInt(button) }); + let element = document.getElementsByClassName("single-dicom-viewer")[0]; + cornerstoneTools.setToolActiveForElement(element, tool, { mouseButtonMask: parseInt(button) }); } dicom_settings_db.mouse_bindings.put({ button: button, mode: mode, tool: tool }); @@ -663,4 +699,43 @@ function urltoFile(url, filename, mimeType) { .then(function (buf) { return new File([buf], filename, { type: mimeType }); }); -} \ No newline at end of file +} + +function dumpDataSet(dataSet) + { + $('span[data-dicom]').each(function(index, value) + { + var attr = $(value).attr('data-dicom'); + var element = dataSet.elements[attr]; + var text = ""; + if(element !== undefined) + { + var str = dataSet.string(attr); + if(str !== undefined) { + text = str; + } + } + $(value).text(text); + }); + + $('span[data-dicomUint]').each(function(index, value) + { + var attr = $(value).attr('data-dicomUint'); + var element = dataSet.elements[attr]; + var text = ""; + if(element !== undefined) + { + if(element.length === 2) + { + text += dataSet.uint16(attr); + } + else if(element.length === 4) + { + text += dataSet.uint32(attr); + } + } + + $(value).text(text); + }); + + } diff --git a/index.html b/index.html index a6d7721..60d01e7 100644 --- a/index.html +++ b/index.html @@ -24,7 +24,8 @@

A dicom viewer

-
+ +
diff --git a/loader.js b/loader.js index a298125..bffa02c 100644 --- a/loader.js +++ b/loader.js @@ -2,7 +2,6 @@ import * as dicomViewer from "./dicomViewer.js" $(document).ready(function () { - loadDicomViewer(); }); @@ -15,21 +14,24 @@ function loadDicomViewer(images_to_load, annotations_to_load) { if (images_to_load != undefined) { images = images_to_load; - } else if (images.indexOf(",") > 0) { + } else { images = JSON.parse(images); } console.log(images); let annotations = single_dicom.dataset.annotations; - if (annotations != undefined) { + if (annotations_to_load != undefined) { annotations = annotations_to_load; } else if (annotations && annotations.indexOf(",") > 0) { + console.log("annon2", annotations) annotations = JSON.parse(annotations); } else { annotations = undefined; } + console.log("annon1", annotations) + let load_as_stack; if (images.length > 5) { load_as_stack = true;