Adapting Viewers to the new cornerstone structure

Packages/ohif-viewerbase/client/components/viewer/downloadDialog/downloadDialog.js

@@ -79,9 +79,10 @@ Template.imageDownloadDialog.onRendered(() => {
     };
 
     instance.updateViewportPreview = () => {
-        instance.$viewportElement.one('CornerstoneImageRendered', (event, enabledElement) => {
+        instance.$viewportElement.one('cornerstoneimagerendered', event => {
             // Wait for the tools to handle CornerstoneImageRendered event
             Tracker.afterFlush(() => {
+                const enabledElement = cornerstone.getEnabledElement(event.currentTarget);
                 const formData = instance.form.value();
                 const image = instance.viewportPreview;
                 const type = 'image/' + formData.type;

Packages/ohif-viewerbase/client/components/viewer/toolContextMenu/toolContextMenu.js

@@ -1,6 +1,6 @@
 import { Template } from 'meteor/templating';
-import { ReactiveVar } from 'meteor/reactive-var';
 import { OHIF } from 'meteor/ohif:core';
+import { cornerstone, cornerstoneTools } from 'meteor/ohif:cornerstone';
 import { toolManager } from '../../../lib/toolManager';
 
 const toolTypes = ['length', 'simpleAngle', 'probe', 'ellipticalRoi', 'rectangleRoi', 'arrowAnnotate'];
@@ -14,33 +14,31 @@ const TypeToLabelMap = {
 };
 let dropdownItems = [{
     actionType: 'Delete',
-    action: ({nearbyToolData, eventData}) => {
-        const element = eventData.element
+    action: ({ nearbyToolData, eventData }) => {
+        const element = eventData.element;
 
         cornerstoneTools.removeToolState(element, nearbyToolData.toolType, nearbyToolData.tool);
         cornerstone.updateImage(element);
     }
 }];
-let timer = 0;
 
 const getTypeText = function(toolData, actionType) {
     const toolType = toolData.toolType;
     let message = `${TypeToLabelMap[toolType]}`;
 
     if (toolType === 'arrowAnnotate') {
-        message = `${message} "${toolData.tool.text}"`
+        message = `${message} "${toolData.tool.text}"`;
     }
 
     return `${actionType} ${message}`;
 };
 
-const createDropdown = function (event, eventData, isTouchEvent = false) {
+const createDropdown = function(event, isTouchEvent = false) {
+    const eventData = event.detail;
     const nearbyToolData = toolManager.getNearbyToolData(eventData.element, eventData.currentPoints.canvas, toolTypes);
 
     // Annotate tools for touch events already have a press handle to edit it, has a better UX for deleting it
-    if (isTouchEvent && nearbyToolData.toolType === 'arrowAnnotate') {
-      return;
-    }
+    if (isTouchEvent && nearbyToolData.toolType === 'arrowAnnotate') return;
 
     if (nearbyToolData) {
         dropdownItems.forEach(function(item) {
@@ -59,13 +57,13 @@ const createDropdown = function (event, eventData, isTouchEvent = false) {
 };
 
 Template.viewerMain.events({
-    'CornerstoneToolsMouseClick .imageViewerViewport'(event, instance, eventData) {
+    'CornerstoneToolsMouseClick .imageViewerViewport'(event, instance) {
         if (event.which === 3) {
-            createDropdown(event, eventData);
+            createDropdown(event);
         }
     },
 
-    'CornerstoneToolsTouchPress .imageViewerViewport'(event, instance, eventData) {
-        createDropdown(event, eventData, true);
+    'CornerstoneToolsTouchPress .imageViewerViewport'(event, instance) {
+        createDropdown(event, true);
     }
-});
+});

Packages/ohif-viewerbase/client/lib/classes/StackImagePositionOffsetSynchronizer.js

@@ -130,9 +130,7 @@ export class StackImagePositionOffsetSynchronizer {
     }
 
     elementDisabledHandler(context) {
-        return (e, eventData) => {
-            context.removeViewportByElement(eventData.element);
-        };
+        return e => context.removeViewportByElement(e.detail.element);
     }
 
     getViewportByIndexes(viewportIndexes) {

Packages/ohif-viewerbase/client/lib/classes/StudyLoadingListener.js

@@ -1,6 +1,7 @@
 import { $ } from 'meteor/jquery';
 import { Session } from 'meteor/session';
 import { OHIF } from 'meteor/ohif:core';
+import { cornerstone, cornerstoneWADOImageLoader } from 'meteor/ohif:cornerstone';
 
 class BaseLoadingListener {
     constructor(stack, options) {
@@ -127,7 +128,8 @@ class DICOMFileLoadingListener extends BaseLoadingListener {
         $(cornerstone.events).off(imageLoadProgressEventName);
     }
 
-    _imageLoadProgressEventHandle(e, eventData) {
+    _imageLoadProgressEventHandle(e) {
+        const eventData = e.detail;
         const dataSetUrl = this._convertImageIdToDataSetUrl(eventData.imageId);
         const bytesDiff = eventData.loaded - this._lastLoaded;
 
@@ -204,9 +206,9 @@ class StackLoadingListener extends BaseLoadingListener {
     _createArray(length, defaultValue) {
         // `new Array(length)` is an anti-pattern in javascript because its
         // funny API. Otherwise I would go for `new Array(length).fill(false)`
-        const array = new Array();
+        const array = [];
 
-        for(let i = 0; i < length; i++) {
+        for (let i = 0; i < length; i++) {
             array[i] = defaultValue;
         }
 
@@ -214,7 +216,7 @@ class StackLoadingListener extends BaseLoadingListener {
     }
 
     _checkCachedData() {
-        const imageIds = this.stack.imageIds;
+        // const imageIds = this.stack.imageIds;
 
         // TODO: No way to check status of Promise.
         /*for(let i = 0; i < imageIds.length; i++) {
@@ -264,7 +266,7 @@ class StackLoadingListener extends BaseLoadingListener {
         }
 
         // Add one more frame to the stats
-        if(loaded) {
+        if (loaded) {
             this._addStatsData(1);
         }
 
@@ -274,14 +276,12 @@ class StackLoadingListener extends BaseLoadingListener {
         this._updateProgress();
     }
 
-    _imageLoadedEventHandle(e, eventData) {
-        const imageId = eventData.image.imageId;
-        this._updateFrameStatus(imageId, true);
+    _imageLoadedEventHandle(e) {
+        this._updateFrameStatus(e.detail.image.imageId, true);
     }
 
-    _imageCachePromiseRemovedEventHandle(e, eventData) {
-        const imageId = eventData.imageId;
-        this._updateFrameStatus(imageId, false);
+    _imageCachePromiseRemovedEventHandle(e) {
+        this._updateFrameStatus(e.detail.imageId, false);
     }
 
     _updateProgress() {
@@ -307,13 +307,13 @@ class StackLoadingListener extends BaseLoadingListener {
         const displaySetInstanceUid = this.stack.displaySetInstanceUid;
         let progressBar = '[';
 
-        for(let i = 0; i < totalFramesCount; i++) {
+        for (let i = 0; i < totalFramesCount; i++) {
             const ch = this.framesStatus[i] ? '|' : '.';
             progressBar += `${ch}`;
         }
 
         progressBar += ']';
-        console.log(`${displaySetInstanceUid}: ${progressBar}`);
+        OHIF.log.info(`${displaySetInstanceUid}: ${progressBar}`);
     }
 }
 
@@ -326,7 +326,7 @@ class StudyLoadingListener {
         const displaySetInstanceUid = stack.displaySetInstanceUid;
 
         if (!this.listeners[displaySetInstanceUid]) {
-            listener = this._createListener(stack, stackMetaData);
+            const listener = this._createListener(stack, stackMetaData);
             if (listener) {
                 this.listeners[displaySetInstanceUid] = listener;
             }
@@ -389,7 +389,7 @@ class StudyLoadingListener {
 
     // Singleton
     static getInstance() {
-        if(!StudyLoadingListener._instance) {
+        if (!StudyLoadingListener._instance) {
             StudyLoadingListener._instance = new StudyLoadingListener();
         }