LT-73 Move export tool and progress dialog component to OHIFViewer

Packages/viewerbase/client/components/basic/progressDialog/progressDialog.html

@@ -0,0 +1,14 @@
+<template name="progressDialog">
+    <div id="progressDialog" tabindex="0">
+        <div class="dialogHeader">
+            <h5>{{progressDialogTitle}}</h5>
+        </div>
+        <div class="dialogContent">
+            <div class="progress">
+                <div class="progress-bar progress-bar-striped active" role="progressbar" style="width:{{progressStatus}}">
+                    {{progressStatus}}
+                </div>
+            </div>
+        </div>
+    </div>
+</template>

Packages/viewerbase/client/components/basic/progressDialog/progressDialog.js

@@ -0,0 +1,44 @@
+progressDialog = {
+    'show': function(title, numberOfTotal) {
+        Session.set("progressDialogSettings", { title: title, numberOfCompleted: 0, numberOfTotal: numberOfTotal });
+
+        $('#progressDialog').css('display', 'block');
+    },
+    'update': function(numberOfCompleted) {
+        var progressDialogSettings = Session.get("progressDialogSettings");
+        progressDialogSettings.numberOfCompleted = numberOfCompleted;
+
+        Session.set("progressDialogSettings", progressDialogSettings);
+
+        if (progressDialogSettings.numberOfCompleted === progressDialogSettings.numberOfTotal) {
+            progressDialog.close();
+        }
+    },
+    'close': function() {
+        Session.set("progressDialogSettings", { title: "", numberOfCompleted: 0, numberOfTotal: 1 });
+        $('#progressDialog').css('display', 'none');
+    },
+};
+
+Template.progressDialog.helpers({
+    'progressDialogTitle': function () {
+        if (Session.get("progressDialogSettings") && Session.get("progressDialogSettings").title) {
+            return Session.get("progressDialogSettings").title;
+        }
+
+        return "";
+    },
+    'progressStatus': function() {
+        var numberOfCompleted = 0;
+        if (Session.get("progressDialogSettings") && Session.get("progressDialogSettings").numberOfCompleted) {
+            numberOfCompleted = Session.get("progressDialogSettings").numberOfCompleted;
+        }
+
+        var numberofTotal = 1;
+        if (Session.get("progressDialogSettings") && Session.get("progressDialogSettings").numberOfTotal) {
+            numberofTotal = Session.get("progressDialogSettings").numberOfTotal;
+        }
+
+        return parseInt((numberOfCompleted / numberofTotal) * 100) + "%";
+    }
+});

Packages/viewerbase/client/components/basic/progressDialog/progressDialog.styl

@@ -0,0 +1,18 @@
+#progressDialog
+  display: none
+  position: absolute
+  top: 0
+  bottom: 0
+  left: 0
+  right: 0
+  margin: auto
+  width: 20%
+  height: 15%
+  z-index: 100
+  border-radius: 5px
+  padding: 10px 20px 10px 20px
+  background-color: rgba(255,255,255,1)
+  outline: none
+
+  .dialogContent
+    margin-bottom: 20px

Packages/viewerbase/lib/exportStudies.js

@@ -0,0 +1,122 @@
+/**
+ * Exports requested studies
+ * @param studiesToExport Studies to export
+ */
+exportStudies = function(studiesToExport) {
+    if (studiesToExport.length < 1) {
+        return;
+    }
+
+    var studiesQueried = [];
+    var numberOfStudiesToQuery = studiesToExport.length;
+
+    progressDialog.show("Querying Studies...", numberOfStudiesToQuery);
+
+    studiesToExport.forEach(function(selectedStudy) {
+        getStudyMetadata(selectedStudy.studyInstanceUid, function(study) {
+            studiesQueried.push(study);
+
+            var numberOfStudiesQueried = studiesQueried.length;
+
+            progressDialog.update(numberOfStudiesQueried);
+
+            if (numberOfStudiesQueried === numberOfStudiesToQuery) {
+                exportQueriedStudies(studiesQueried);
+            }
+        });
+    });
+};
+
+function exportQueriedStudies(studiesToExport) {
+    var numberOfFilesToExport = getNumberOfFilesToExport(studiesToExport);
+
+    progressDialog.show("Exporting Studies...", numberOfFilesToExport);
+
+    try {
+        exportQueriedStudiesInternal(studiesToExport, numberOfFilesToExport);
+    } catch (err) {
+        progressDialog.close();
+        console.error("Failed to export studies: " + err.message);
+    }
+}
+
+function exportQueriedStudiesInternal(studiesToExport, numberOfFilesToExport) {
+    var zip = new JSZip();
+
+    var exportFailed = false;
+    var numberOfFilesExported = 0;
+
+    studiesToExport.forEach(function(study) {
+        sortStudy(study);
+
+        var studyFolder = zip.folder(study.studyInstanceUid);
+
+        study.seriesList.forEach(function(series) {
+            var seriesFolder = studyFolder.folder(series.seriesInstanceUid);
+
+            series.instances.forEach(function(instance) {
+                if (!instance.wadouri) {
+                    return;
+                }
+
+                //  If failed to download a dicom file, skip others
+                if (exportFailed) {
+                    return;
+                }
+
+                //  Download and Zip the dicom file
+                var xhr = new XMLHttpRequest();
+                xhr.open("GET", instance.wadouri, true);
+                xhr.responseType = "arraybuffer";
+
+                //  Downloaded the dicom file completely
+                xhr.onload = function() {
+                    //  If failed to download a dicom file, skip others
+                    if (exportFailed) {
+                        return;
+                    }
+
+                    var responseArrayBuffer = xhr.response;
+                    if (responseArrayBuffer) {
+                        seriesFolder.file(instance.sopInstanceUid + ".dcm", responseArrayBuffer, { binary: true });
+                    }
+
+                    numberOfFilesExported++;
+
+                    if (numberOfFilesExported === numberOfFilesToExport) {
+                        var zipContent = zip.generate({ type: "blob" });
+                        saveAs(zipContent, "studies.zip");
+                    }
+
+                    progressDialog.update(numberOfFilesExported);
+                };
+
+                //  Failed to download the dicom file
+                xhr.onerror = function() {
+                    exportFailed = true;
+
+                    progressDialog.close();
+                    console.error("Failed to export studies!");
+                };
+
+                xhr.send(null);
+            });
+        });
+    });
+}
+
+function getNumberOfFilesToExport(studiesToExport) {
+    var numberOFFilesToExport = 0;
+
+    studiesToExport.forEach(function(study) {
+        study.seriesList.forEach(function(series) {
+            series.instances.forEach(function(instance) {
+                if (instance.wadouri) {
+                    numberOFFilesToExport++;
+                }
+            });
+        });
+    });
+
+    return numberOFFilesToExport;
+}

Packages/viewerbase/package.js

@@ -110,6 +110,10 @@ Package.onUse(function(api) {
     api.addFiles('client/components/viewer/toolbar/toolbar.js', 'client');
     api.addFiles('client/components/viewer/toolbar/toolbar.styl', 'client');
 
+    api.addFiles('client/components/basic/progressDialog/progressDialog.html', 'client');
+    api.addFiles('client/components/basic/progressDialog/progressDialog.styl', 'client');
+    api.addFiles('client/components/basic/progressDialog/progressDialog.js', 'client');
+
     // Library functions
     api.addFiles('lib/accountsConfig.js', 'client');
     api.addFiles('lib/createStacks.js', 'client');
@@ -131,6 +135,7 @@ Package.onUse(function(api) {
     api.addFiles('lib/resizeViewportElements.js', 'client');
     api.addFiles('lib/setFocusToActiveViewport.js', 'client');
     api.addFiles('lib/updateAllViewports.js', 'client');
+    api.addFiles('lib/exportStudies.js', 'client');
     api.addFiles('lib/encodeQueryData.js', 'server');
 
     //api.export('accountsConfig', 'client');
@@ -149,6 +154,7 @@ Package.onUse(function(api) {
     api.export('updateOrientationMarkers', 'client');
     api.export('setFocusToActiveViewport', 'client');
     api.export('updateAllViewports', 'client');
+    api.export('exportStudies', 'client');
     api.export('encodeQueryData', 'server');
 
     // Viewer management objects
@@ -158,6 +164,7 @@ Package.onUse(function(api) {
     // Global objects
     api.export('OHIF', 'client');
     api.export('ClientId', 'client');
+    api.export('progressDialog', 'client');
 
     // Collections
     api.export('ViewerStudies', 'client');