Creating a method to export cornerstone images with or without measurements

Packages/ohif-measurements/client/lib/exportPdf.js

@@ -1,6 +1,5 @@
 import { OHIF } from 'meteor/ohif:core';
 import { MeasurementReport } from 'meteor/ohif:measurements/client/reports/measurement';
-import { $ } from 'meteor/jquery';
 
 OHIF.measurements.exportPdf = (measurementApi, timepointApi) => {
     const currentTimepoint = timepointApi.current();
@@ -17,37 +16,11 @@ OHIF.measurements.exportPdf = (measurementApi, timepointApi) => {
         }
     });
 
-    const createEnabledElement = () => {
+    const printMeasurement = (measurement, callback) => {
-        const $element = $('<div></div>').css({
+        OHIF.measurements.getImageDataUrl({ measurement }).then(imageDataUrl => {
-            height: 512,
-            left: 0,
-            position: 'fixed',
-            top: 0,
-            visibility: 'hidden',
-            width: 512,
-            'z-index': -1
-        });
-
-        const element = $element[0];
-        $element.appendTo(document.body);
-        cornerstone.enable(element, { renderer: 'webgl' });
-
-        const enabledElement = cornerstone.getEnabledElement(element);
-        enabledElement.toolStateManager = cornerstoneTools.newImageIdSpecificToolStateManager();
-
-        return enabledElement;
-    };
-
-    const destroyEnabledElement = enabledElement => {
-        cornerstone.disable(enabledElement.element);
-        $(enabledElement.element).remove();
-    };
-
-    const printMeasurement = (measurement, image, callback) => {
-        const enabledElement = createEnabledElement();
-        const element = enabledElement.element;
             const series = cornerstoneTools.metaData.get('series', measurement.imageId);
             const instance = cornerstoneTools.metaData.get('instance', measurement.imageId);
+
             let info = measurement.response;
             if (!info) {
                 info = measurement.longestDiameter;
@@ -63,25 +36,14 @@ OHIF.measurements.exportPdf = (measurementApi, timepointApi) => {
             let type = measurementApi.toolsGroupsMap[measurement.toolType];
             type = type === 'targets' ? 'Target' : 'Non-target';
 
-        const state = Object.assign({}, measurement, { active: true });
-        cornerstone.displayImage(element, image);
-        cornerstoneTools.addToolState(element, measurement.toolType, state);
-        cornerstoneTools[measurement.toolType].enable(element);
-
-        $(element).one('CornerstoneImageRendered', () => {
             report.printMeasurement({
                 type,
                 number: measurement.measurementNumber,
                 location: OHIF.measurements.getLocationLabel(measurement.location) || '',
                 info,
-                image: enabledElement.canvas.toDataURL('image/jpeg', 0.85)
+                image: imageDataUrl
             });
 
-            cornerstoneTools[measurement.toolType].disable(element);
-            cornerstoneTools.clearToolState(element, measurement.toolType);
-
-            destroyEnabledElement(enabledElement);
-
             processMeasurements(callback);
         });
     };
@@ -94,8 +56,7 @@ OHIF.measurements.exportPdf = (measurementApi, timepointApi) => {
         }
 
         const measurement = current.value;
-        cornerstone.loadImage(measurement.imageId)
+        printMeasurement(measurement, callback);
-            .then(image => printMeasurement(measurement, image, callback));
     };
 
     const targets = measurementApi.fetch('targets', { timepointId });

Packages/ohif-measurements/client/lib/getImageDataUrl.js

@@ -0,0 +1,76 @@
+import { OHIF } from 'meteor/ohif:core';
+import { $ } from 'meteor/jquery';
+
+OHIF.measurements.getImageDataUrl = ({
+    imageType='image/jpeg',
+    quality=1,
+    width=512,
+    height=512,
+    cacheImage=true,
+    imageId,
+    measurement
+}) => {
+    imageId = imageId || measurement.imageId;
+
+    return new Promise((resolve, reject) => {
+        const loadMethod = cacheImage ? 'loadAndCacheImage' : 'loadImage';
+        cornerstone[loadMethod](imageId).then(image => {
+            // Create a cornerstone enabled element to handle the image
+            const enabledElement = createEnabledElement(width, height);
+            const element = enabledElement.element;
+
+            // Display the image on cornerstone's canvas
+            cornerstone.displayImage(element, image);
+
+            // Add the measurement state and enable the tool if a measurement was given
+            if (measurement) {
+                const state = Object.assign({}, measurement, { active: true });
+                cornerstoneTools.addToolState(element, measurement.toolType, state);
+                cornerstoneTools[measurement.toolType].enable(element);
+            }
+
+            // Wait for image rendering to get its data URL
+            $(element).one('CornerstoneImageRendered', () => {
+                const dataUrl = enabledElement.canvas.toDataURL(imageType, quality);
+
+                // Disable the tool and clear the measurement state if a measurement was given
+                if (measurement) {
+                    cornerstoneTools[measurement.toolType].disable(element);
+                    cornerstoneTools.clearToolState(element, measurement.toolType);
+                }
+
+                // Destroy the cornerstone enabled element, removing it from the DOM
+                destroyEnabledElement(enabledElement);
+
+                // Resolve the promise with the image's data URL
+                resolve(dataUrl);
+            });
+        });
+    });
+};
+
+const createEnabledElement = (width, height) => {
+    const $element = $('<div></div>').css({
+        height,
+        left: 0,
+        position: 'fixed',
+        top: 0,
+        visibility: 'hidden',
+        width,
+        'z-index': -1
+    });
+
+    const element = $element[0];
+    $element.appendTo(document.body);
+    cornerstone.enable(element, { renderer: 'webgl' });
+
+    const enabledElement = cornerstone.getEnabledElement(element);
+    enabledElement.toolStateManager = cornerstoneTools.newImageIdSpecificToolStateManager();
+
+    return enabledElement;
+};
+
+const destroyEnabledElement = enabledElement => {
+    cornerstone.disable(enabledElement.element);
+    $(enabledElement.element).remove();
+};

Packages/ohif-measurements/client/lib/index.js

@@ -2,6 +2,7 @@ import './jumpToRowItem';
 import './activateMeasurements';
 import './deactivateAllToolData';
 import './exportPdf';
+import './getImageDataUrl';
 import './getMeasurementsGroupedByNumber';
 import './getLocationLabel';
 import './getTimepointName';