chore(release): publish [skip ci]

- @ohif/extension-cornerstone@2.3.1
 - @ohif/viewer@3.6.3

.circleci/config.yml

@@ -13,14 +13,7 @@ version: 2.1
 ##
 orbs:
   codecov: codecov/codecov@1.0.5
-  cypress: cypress-io/cypress@1.11.0
-executors:
-  # Custom executor to override Cypress config
-  deploy-to-prod-executor:
-    docker:
-      - image: 'cypress/browsers:node10.16.0-chrome77'
-        environment:
-          CYPRESS_BASE_URL: https://ohif-staging.netlify.com/
+  cypress: cypress-io/cypress@1.13.0
 
 defaults: &defaults
   docker:
@@ -335,12 +328,15 @@ workflows:
           working_directory: platform/viewer
           build: npx cross-env QUICK_BUILD=true yarn run build
           start: yarn run test:e2e:serve
+          spec: 'cypress/integration/common/**/*,cypress/integration/pwa/**/*'
           wait-on: 'http://localhost:3000'
           cache-key: 'yarn-packages-{{ checksum "yarn.lock" }}'
           no-workspace: true # Don't persist workspace
           post-steps:
             - store_artifacts:
                 path: platform/viewer/cypress/screenshots
+            - store_artifacts:
+                path: platform/viewer/cypress/videos
           requires:
             - UNIT_TESTS
       # E2E: script-tag
@@ -357,13 +353,15 @@ workflows:
           working_directory: platform/viewer
           build: npx cross-env QUICK_BUILD=true yarn run build:package
           start: yarn run test:e2e:serve
-          spec: 'cypress/integration/common/**/*'
+          spec: 'cypress/integration/common/**/*,cypress/integration/script-tag/**/*'
           wait-on: 'http://localhost:3000'
           cache-key: 'yarn-packages-{{ checksum "yarn.lock" }}'
           no-workspace: true # Don't persist workspace
           post-steps:
             - store_artifacts:
                 path: platform/viewer/cypress/screenshots
+            - store_artifacts:
+                path: platform/viewer/cypress/videos
           requires:
             - UNIT_TESTS
 
@@ -375,6 +373,7 @@ workflows:
       - cypress/run:
           name: 'Generate Percy Snapshots'
           executor: cypress/browsers-chrome76
+          browser: chrome
           pre-steps:
             - run: 'rm -rf ~/.yarn && npm i -g yarn && yarn -v && yarn global
                 add wait-on' # Use yarn latest
@@ -389,6 +388,8 @@ workflows:
           post-steps:
             - store_artifacts:
                 path: platform/viewer/cypress/screenshots
+            - store_artifacts:
+                path: platform/viewer/cypress/videos
           requires:
             - AWAIT_APPROVAL
 
@@ -445,9 +446,11 @@ workflows:
             branches:
               only: master
       # Update base branch snapshots
+      # and record a Cypress dashboard test run
       - cypress/run:
           name: 'Generate Percy Snapshots'
           executor: cypress/browsers-chrome76
+          browser: chrome
           pre-steps:
             - run: 'rm -rf ~/.yarn && npm i -g yarn && yarn -v && yarn global
                 add wait-on' # Use yarn latest
@@ -462,28 +465,13 @@ workflows:
           post-steps:
             - store_artifacts:
                 path: platform/viewer/cypress/screenshots
+            - store_artifacts:
+                path: platform/viewer/cypress/videos
+            - store_test_results:
+                path: platform/viewer/cypress/results
           filters:
             branches:
               only: master
       - DOCKER_MASTER_PUBLISH:
           requires:
             - NPM_PUBLISH
-#
-#
-# Potentially use to E2E test STAGING environment
-# before publishing to production
-# - cypress/run:
-#     name: 'E2E: PWA'
-#     executor: deploy-to-prod-executor
-#     browser: chrome
-#     working_directory: platform/viewer
-#     cache-key: 'yarn-packages-{{ checksum "yarn.lock" }}'
-#     yarn: true
-#     record: false
-#     no-workspace: true
-#     store_artifacts: true
-#     post-steps:
-#       - store_artifacts:
-#           path: platform/viewer/cypress/screenshots
-#       - store_test_results:
-#           path: cypress/results

.docker/Viewer-v2.x/entrypoint.sh

@@ -1,17 +1,31 @@
 #!/bin/bash
 
-# If CLIENT_ID is specified, use the google.js configuration with the modified ID
-if [ ! -z "$CLIENT_ID" ]
+if [ -n "$CLIENT_ID" ] || [ -n "$HEALTHCARE_API_ENDPOINT" ]
   then
-  	echo "Google Cloud Healthcare $CLIENT_ID has been provided: "
-  	echo $CLIENT_ID
-  	echo "Updating config..."
+    # If CLIENT_ID is specified, use the google.js configuration with the modified ID
+    if [ -n "$CLIENT_ID" ]
+      then
+  	    echo "Google Cloud Healthcare \$CLIENT_ID has been provided: "
+  	    echo "$CLIENT_ID"
+  	    echo "Updating config..."
 
-  	# - Use SED to replace the CLIENT_ID that is currently in google.js
-	sed -i -e "s/YOURCLIENTID.apps.googleusercontent.com/$CLIENT_ID/g" /usr/share/nginx/html/google.js
+  	    # - Use SED to replace the CLIENT_ID that is currently in google.js
+	      sed -i -e "s/YOURCLIENTID.apps.googleusercontent.com/$CLIENT_ID/g" /usr/share/nginx/html/google.js
+	  fi
 
-	# - Copy google.js to overwrite app-config.js
-	cp /usr/share/nginx/html/google.js /usr/share/nginx/html/app-config.js
+    # If HEALTHCARE_API_ENDPOINT is specified, use the google.js configuration with the modified endpoint
+    if [ -n "$HEALTHCARE_API_ENDPOINT" ]
+      then
+        echo "Google Cloud Healthcare \$HEALTHCARE_API_ENDPOINT has been provided: "
+        echo "$HEALTHCARE_API_ENDPOINT"
+        echo "Updating config..."
+
+        # - Use SED to replace the HEALTHCARE_API_ENDPOINT that is currently in google.js
+        sed -i -e "s+https://healthcare.googleapis.com/v1beta1+$HEALTHCARE_API_ENDPOINT+g" /usr/share/nginx/html/google.js
+    fi
+
+	  # - Copy google.js to overwrite app-config.js
+	  cp /usr/share/nginx/html/google.js /usr/share/nginx/html/app-config.js
 fi
 
 echo "Starting Nginx to serve the OHIF Viewer..."

.github/stale.yml

@@ -12,10 +12,11 @@ exemptLabels:
   - 'Task: CI/Tooling :robot:'
   - 'Task: Docs 📖'
   - 'Task: Docs :book:'
-  - 'Task: Refactor 🛠'
+  - 'Task: Refactor :hammer_and_wrench:'
   - 'Task: Tests :microscope:'
   - 'PR: Awaiting Review 👀'
   - 'Triage :white_flag:'
+  - 'Extension: Discussion'
   - 'Announcement 🎉'
 # Label to use when marking an issue as stale
 staleLabel: 'Stale :baguette_bread:'

.gitignore

@@ -30,6 +30,7 @@ docker/dcm4che/dcm4che-arc
 
 # Cypress test results
 videos/
+screenshots/
 
 # Locize settings
 .locize

.webpack/webpack.base.js

@@ -72,12 +72,17 @@ module.exports = (env, argv, { SRC_DIR, DIST_DIR }) => {
     },
     plugins: [
       new webpack.DefinePlugin({
+        /* Application */
         'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV),
         'process.env.DEBUG': JSON.stringify(process.env.DEBUG),
         'process.env.APP_CONFIG': JSON.stringify(process.env.APP_CONFIG || ''),
         'process.env.PUBLIC_URL': JSON.stringify(process.env.PUBLIC_URL || '/'),
         'process.env.VERSION_NUMBER': JSON.stringify(PACKAGE.version || ''),
         'process.env.BUILD_NUM': JSON.stringify(BUILD_NUM),
+        /* i18n */
+        'process.env.USE_LOCIZE': JSON.stringify(process.env.USE_LOCIZE || ''),
+        'process.env.LOCIZE_PROJECTID': JSON.stringify(process.env.LOCIZE_PROJECTID || ''),
+        'process.env.LOCIZE_API_KEY': JSON.stringify(process.env.LOCIZE_API_KEY || ''),
       }),
     ],
     // Fix: https://github.com/webpack-contrib/css-loader/issues/447#issuecomment-285598881

docs/latest/SUMMARY.md

@@ -1,7 +1,6 @@
 # OHIF Viewers
 
 - [Our Process](our-process.md)
-- [Quick Start](quick-start.md)
 - Development
   - [Getting Started](development/getting-started.md)
   - [Contributing](development/contributing.md)
@@ -31,7 +30,6 @@
   - [OHIF Maintained](extensions/index.md#maintained-extensions)
 - [Services](services/index.md)
   - [Default](services/default/index.md)
-    - [Measurements](services/default/measurements.md)
   - [UI](services/ui/index.md)
     - [Dialog Service](services/ui/ui-dialog-service.md)
     - [Modal Service](services/ui/ui-modal-service.md)

docs/latest/extensions/index.md

@@ -193,7 +193,8 @@ today, create a GitHub issue!
 
 The `ExtensionManager` is a class made available to us via the `@ohif/core`
 project (platform/core). Our application instantiates a single instance of it,
-and provides a `ServicesManager` and `CommandsManager`.
+and provides a `ServicesManager` and `CommandsManager` along with the application's
+configuration through the appConfig key (optional).
 
 ```js
 const commandsManager = new CommandsManager();
@@ -201,6 +202,7 @@ const servicesManager = new ServicesManager();
 const extensionManager = new ExtensionManager({
   commandsManager,
   servicesManager,
+  appConfig
 });
 ```
 
@@ -210,8 +212,8 @@ The `ExtensionManager` only has a few public members:
 - `registerExtensions` - Registers an array of extensions
 - `modules` - An object containing registered extensions by `MODULE_TYPE`
 
-During registration, lifecycle hooks and modules have access to
-`ExtensionManager`'s `ServicesManager` and `CommandsManager`.
+During registration, lifecycle hooks and modules have access to the extension's config,
+the application's config and `ExtensionManager`'s `ServicesManager` and `CommandsManager` instances.
 
 Our `@ohif/viewer` uses the `modules` member to access registered extensions at
 appropriate places in our application.

docs/latest/faq/scope-of-project.md

@@ -13,7 +13,7 @@ like user preferences and previous query paramaters. Because of this, the Viewer
 has been built to be highly configurable to work with almost any web accessible
 data source.
 
-![scope-of-project diagram](./assets/img/scope-of-project.png)
+![scope-of-project diagram](./../assets/img/scope-of-project.png)
 
 To be more specific, the OHIF Viewer is a collection of HTML, JS, and CSS files.
 These can be delivered to your end users however you would like:

docs/latest/viewer/configuration.md

@@ -1,3 +1,67 @@
 # Viewer: Configuration
 
-...
+We maintain a number of common viewer application configurations at
+[`<root>/platform/viewer/public/configs`][config-dir]. How these values are
+passed to the viewer depend on how it's deployed, but the two most common paths
+are:
+
+- `index.html` looks for `https://your-website.com/app-config.js` OR
+- `index.html` passes the values to `OHIF.installViewer()`
+
+```js
+window.config = {
+  routerBasename: '/',
+  whiteLabelling: {},
+  extensions: [],
+  showStudyList: true,
+  filterQueryParam: false,
+  servers: {
+    dicomWeb: [
+      {
+        name: 'DCM4CHEE',
+        wadoUriRoot: 'https://server.dcmjs.org/dcm4chee-arc/aets/DCM4CHEE/wado',
+        qidoRoot: 'https://server.dcmjs.org/dcm4chee-arc/aets/DCM4CHEE/rs',
+        wadoRoot: 'https://server.dcmjs.org/dcm4chee-arc/aets/DCM4CHEE/rs',
+        qidoSupportsIncludeField: true,
+        imageRendering: 'wadors',
+        thumbnailRendering: 'wadors',
+        enableStudyLazyLoad: true,
+      },
+    ],
+  },
+  // Supported Keys: https://craig.is/killing/mice
+  hotkeys: [
+    { commandName: 'rotateViewportCW', label: 'Rotate Right', keys: ['r'] },
+    { commandName: 'rotateViewportCCW', label: 'Rotate Left', keys: ['l'] },
+    { commandName: 'invertViewport', label: 'Invert', keys: ['i'] },
+    {
+      commandName: 'flipViewportVertical',
+      label: 'Flip Horizontally',
+      keys: ['h'],
+    },
+    {
+      commandName: 'flipViewportHorizontal',
+      label: 'Flip Vertically',
+      keys: ['v'],
+    },
+  ],
+  /* Configuration passed to the bundled cornerstone extension
+   *
+   * The cornerstone extension is currently tightly coupled to the platform.
+   * Until we're able to decouple it, this key will serve as a workaround to
+   * pass it configuration.
+   */
+  cornerstoneExtensionConfig: {
+    /* Whether to show/hide annotation "handles" */
+    hideHandles: true,
+  },
+};
+```
+
+<!--
+  LINKS
+-->
+
+<!-- prettier-ignore-start -->
+[config-dir]: https://github.com/OHIF/Viewers/tree/master/platform/viewer/public/config
+<!-- prettier-ignore-end -->

docs/latest/viewer/environment-variables.md

@@ -0,0 +1,23 @@
+# Environment Variables
+
+There are a number of environment variables we use at build time to influence the output application's behavior.
+
+```bash
+# Application
+NODE_ENV=< production | development >
+DEBUG=< true | false >
+APP_CONFIG=< relative path to application configuration file >
+PUBLIC_URL=<>
+VERSION_NUMBER=<Set by CircleCI>
+BUILD_NUM=<Set by CircleCI>
+# i18n
+USE_LOCIZE=<false>
+LOCIZE_PROJECTID=<ProjectID to pull translations for>
+LOCIZE_API_KEY=<To enable Locize live editing of translations>
+```
+
+## Setting Environment Variables
+
+- `npx cross-env`
+- `.env` files
+- env variables on build machine, or for terminal session

extensions/_example/src/index.js

@@ -14,6 +14,7 @@ export default {
   preRegistration({
     servicesManager = {},
     commandsManager = {},
+    appConfig = {},
     configuration = {},
   }) {},
 

extensions/cornerstone/CHANGELOG.md

@@ -3,6 +3,69 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [2.3.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.3.0...@ohif/extension-cornerstone@2.3.1) (2020-02-14)
+
+
+### Bug Fixes
+
+* Creating 2 commands to activate zoom tool and also to move between displaySets ([#1446](https://github.com/OHIF/Viewers/issues/1446)) ([06a4af0](https://github.com/OHIF/Viewers/commit/06a4af06faaecf6fa06ccd90cdfa879ee8d53053))
+
+
+
+
+
+# [2.3.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.2.2...@ohif/extension-cornerstone@2.3.0) (2020-02-10)
+
+
+### Features
+
+* 🎸 MeasurementService ([#1314](https://github.com/OHIF/Viewers/issues/1314)) ([0c37a40](https://github.com/OHIF/Viewers/commit/0c37a406d963569af8c3be24c697dafd42712dfc))
+
+
+
+
+
+## [2.2.2](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.2.1...@ohif/extension-cornerstone@2.2.2) (2020-01-28)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [2.2.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.2.0...@ohif/extension-cornerstone@2.2.1) (2019-12-20)
+
+
+### Bug Fixes
+
+* 🐛 1241: Make Plugin switch part of ToolbarModule ([#1322](https://github.com/OHIF/Viewers/issues/1322)) ([6540e36](https://github.com/OHIF/Viewers/commit/6540e36818944ac2eccc696186366ae495b33a04)), closes [#1241](https://github.com/OHIF/Viewers/issues/1241)
+
+
+
+
+
+# [2.2.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.1.1...@ohif/extension-cornerstone@2.2.0) (2019-12-20)
+
+
+### Features
+
+* 🎸 Configuration so viewer tools can nix handles ([#1304](https://github.com/OHIF/Viewers/issues/1304)) ([63594d3](https://github.com/OHIF/Viewers/commit/63594d36b0bdba59f0901095aed70b75fb05172d)), closes [#1223](https://github.com/OHIF/Viewers/issues/1223)
+
+
+
+
+
+## [2.1.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.1.0...@ohif/extension-cornerstone@2.1.1) (2019-12-16)
+
+
+### Bug Fixes
+
+* 🐛 add WwwcRegionTool to cornerstone tools initialization ([#1302](https://github.com/OHIF/Viewers/issues/1302)) ([d5bf728](https://github.com/OHIF/Viewers/commit/d5bf72851a32dff9fd3fc09332ea5250bc7e6114))
+
+
+
+
+
 # [2.1.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.0.2...@ohif/extension-cornerstone@2.1.0) (2019-12-11)
 
 

extensions/cornerstone/README.md

@@ -85,6 +85,20 @@ Tools can be configured through extension configuration using the tools key:
   ...
 ```
 
+## Annotate Tools Configuration
+
+*We currently support one property for annotation tools.*
+
+### Hide handles
+This extension configuration allows you to toggle on/off handle rendering for all annotate tools:
+
+```js
+  ...
+  cornerstoneExtensionConfig: {
+    hideHandles: true,
+  },
+  ...
+
 ## Resources
 
 ### Repositories

extensions/cornerstone/babel.config.js

@@ -0,0 +1 @@
+module.exports = require("../../babel.config.js");

extensions/cornerstone/jest.config.js

@@ -0,0 +1,13 @@
+const base = require('../../jest.config.base.js');
+const pkg = require('./package');
+
+module.exports = {
+  ...base,
+  name: pkg.name,
+  displayName: pkg.name,
+  // rootDir: "../.."
+  // testMatch: [
+  //   //`<rootDir>/platform/${pack.name}/**/*.spec.js`
+  //   "<rootDir>/platform/viewer/**/*.test.js"
+  // ]
+};

extensions/cornerstone/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ohif/extension-cornerstone",
-  "version": "2.1.0",
+  "version": "2.3.1",
   "description": "OHIF extension for Cornerstone",
   "author": "OHIF",
   "license": "MIT",
@@ -25,14 +25,16 @@
     "build": "cross-env NODE_ENV=production webpack --config .webpack/webpack.prod.js",
     "build:package": "yarn run build",
     "prepublishOnly": "yarn run build",
-    "start": "yarn run dev"
+    "start": "yarn run dev",
+    "test:unit": "jest --watchAll",
+    "test:unit:ci": "jest --ci --runInBand --collectCoverage"
   },
   "peerDependencies": {
     "@ohif/core": "^0.50.0",
     "@ohif/ui": "^0.50.0",
     "cornerstone-core": "^2.2.8",
     "cornerstone-math": "^0.1.8",
-    "cornerstone-tools": "^4.8.0",
+    "cornerstone-tools": "^4.12.0",
     "cornerstone-wado-image-loader": "^3.0.0",
     "dcmjs": "^0.8.2",
     "dicom-parser": "^1.8.3",

extensions/cornerstone/src/commandsModule.js

@@ -2,6 +2,7 @@ import cornerstone from 'cornerstone-core';
 import cornerstoneTools from 'cornerstone-tools';
 import OHIF from '@ohif/core';
 
+import setCornerstoneLayout from './utils/setCornerstoneLayout.js';
 import { getEnabledElement } from './state';
 import CornerstoneViewportDownloadForm from './CornerstoneViewportDownloadForm';
 const scroll = cornerstoneTools.import('util/scroll');
@@ -73,10 +74,6 @@ const commandsModule = ({ servicesManager }) => {
       }
       cornerstoneTools.setToolActive(toolName, { mouseButtonMask: 1 });
     },
-    updateViewportDisplaySet: ({ direction }) => {
-      // TODO
-      console.warn('updateDisplaySet: ', direction);
-    },
     clearAnnotations: ({ viewports }) => {
       const element = getEnabledElement(viewports.activeViewportIndex);
       if (!element) {
@@ -242,6 +239,9 @@ const commandsModule = ({ servicesManager }) => {
       cornerstoneTools.removeToolState(element, toolType, tool);
       cornerstone.updateImage(element);
     },
+    setCornerstoneLayout: () => {
+      setCornerstoneLayout();
+    },
   };
 
   const definitions = {
@@ -330,24 +330,23 @@ const commandsModule = ({ servicesManager }) => {
       storeContexts: ['viewports'],
       options: {},
     },
-    // TODO: First/Last image
-    // Next/Previous series/DisplaySet
-    nextViewportDisplaySet: {
-      commandFn: actions.updateViewportDisplaySet,
-      storeContexts: [],
-      options: { direction: 1 },
-    },
-    previousViewportDisplaySet: {
-      commandFn: actions.updateViewportDisplaySet,
-      storeContexts: [],
-      options: { direction: -1 },
-    },
     // TOOLS
     setToolActive: {
       commandFn: actions.setToolActive,
       storeContexts: [],
       options: {},
     },
+    setZoomTool: {
+      commandFn: actions.setToolActive,
+      storeContexts: [],
+      options: { toolName: 'Zoom' },
+    },
+    setCornerstoneLayout: {
+      commandFn: actions.setCornerstoneLayout,
+      storeContexts: [],
+      options: {},
+      context: 'VIEWER',
+    },
   };
 
   return {

extensions/cornerstone/src/init.js

@@ -1,10 +1,11 @@
 import OHIF from '@ohif/core';
+import { SimpleDialog } from '@ohif/ui';
 import cornerstone from 'cornerstone-core';
 import csTools from 'cornerstone-tools';
-import initCornerstoneTools from './initCornerstoneTools.js';
-import queryString from 'query-string';
-import { SimpleDialog } from '@ohif/ui';
 import merge from 'lodash.merge';
+import queryString from 'query-string';
+import initCornerstoneTools from './initCornerstoneTools.js';
+import measurementServiceMappingsFactory from './utils/measurementServiceMappings/measurementServiceMappingsFactory';
 
 function fallbackMetaDataProvider(type, imageId) {
   if (!imageId.includes('wado?requestType=WADO')) {
@@ -17,7 +18,7 @@ function fallbackMetaDataProvider(type, imageId) {
   const wadoRoot = window.store.getState().servers.servers[0].wadoRoot;
   const wadoRsImageId = `wadors:${wadoRoot}/studies/${qs.studyUID}/series/${
     qs.seriesUID
-  }/instances/${qs.objectUID}/frames/${qs.frame || 1}`;
+    }/instances/${qs.objectUID}/frames/${qs.frame || 1}`;
 
   return cornerstone.metaData.get(type, wadoRsImageId);
 }
@@ -32,9 +33,9 @@ cornerstone.metaData.addProvider(fallbackMetaDataProvider, -1);
  * @param {Object|Array} configuration.csToolsConfig
  */
 export default function init({ servicesManager, configuration }) {
-  const callInputDialog = (data, event, callback) => {
-    const { UIDialogService } = servicesManager.services;
+  const { UIDialogService, MeasurementService } = servicesManager.services;
 
+  const callInputDialog = (data, event, callback) => {
     if (UIDialogService) {
       let dialogId = UIDialogService.create({
         centralize: true,
@@ -76,30 +77,39 @@ export default function init({ servicesManager, configuration }) {
 
   initCornerstoneTools(defaultCsToolsConfig);
 
-  // ~~ Toooools 🙌
-  const tools = [
-    csTools.PanTool,
-    csTools.ZoomTool,
-    csTools.WwwcTool,
-    csTools.MagnifyTool,
-    csTools.StackScrollTool,
-    csTools.StackScrollMouseWheelTool,
-    // Touch
-    csTools.PanMultiTouchTool,
-    csTools.ZoomTouchPinchTool,
-    // Annotations
-    csTools.ArrowAnnotateTool,
-    csTools.EraserTool,
-    csTools.BidirectionalTool,
-    csTools.LengthTool,
-    csTools.AngleTool,
-    csTools.FreehandRoiTool,
-    csTools.EllipticalRoiTool,
-    csTools.DragProbeTool,
-    csTools.RectangleRoiTool,
-    // Segmentation
-    csTools.BrushTool,
-  ];
+  const toolsGroupedByType = {
+    touch: [csTools.PanMultiTouchTool, csTools.ZoomTouchPinchTool],
+    annotations: [
+      csTools.ArrowAnnotateTool,
+      csTools.EraserTool,
+      csTools.BidirectionalTool,
+      csTools.LengthTool,
+      csTools.AngleTool,
+      csTools.FreehandRoiTool,
+      csTools.EllipticalRoiTool,
+      csTools.DragProbeTool,
+      csTools.RectangleRoiTool,
+    ],
+    segmentation: [csTools.BrushTool],
+    other: [
+      csTools.PanTool,
+      csTools.ZoomTool,
+      csTools.WwwcTool,
+      csTools.WwwcRegionTool,
+      csTools.MagnifyTool,
+      csTools.StackScrollTool,
+      csTools.StackScrollMouseWheelTool,
+      csTools.OverlayTool,
+    ],
+  };
+
+  let tools = [];
+  Object.keys(toolsGroupedByType).forEach(toolsGroup =>
+    tools.push(...toolsGroupedByType[toolsGroup])
+  );
+
+  /* Measurement Service */
+  _connectToolsToMeasurementService(MeasurementService);
 
   /* Add extension tools configuration here. */
   const internalToolsConfig = {
@@ -113,13 +123,48 @@ export default function init({ servicesManager, configuration }) {
     },
   };
 
+  /* Abstract tools configuration using extension configuration. */
+  const parseToolProps = (props, tool) => {
+    const { annotations } = toolsGroupedByType;
+    // An alternative approach would be to remove the `drawHandlesOnHover` config
+    // from the supported configuration properties in `cornerstone-tools`
+    const toolsWithHideableHandles = annotations.filter(
+      tool => !['RectangleRoiTool', 'EllipticalRoiTool'].includes(tool.name)
+    );
+
+    let parsedProps = { ...props };
+
+    /**
+     * drawHandles - Never/Always show handles
+     * drawHandlesOnHover - Only show handles on handle hover (pointNearHandle)
+     *
+     * Does not apply to tools where handles aren't placed in predictable
+     * locations.
+     */
+    if (
+      configuration.hideHandles !== false &&
+      toolsWithHideableHandles.includes(tool)
+    ) {
+      if (props.configuration) {
+        parsedProps.configuration.drawHandlesOnHover = true;
+      } else {
+        parsedProps.configuration = { drawHandlesOnHover: true };
+      }
+    }
+
+    return parsedProps;
+  };
+
   /* Add tools with its custom props through extension configuration. */
   tools.forEach(tool => {
     const toolName = tool.name.replace('Tool', '');
     const externalToolsConfig = configuration.tools || {};
     const externalToolProps = externalToolsConfig[toolName] || {};
     const internalToolProps = internalToolsConfig[toolName] || {};
-    const props = merge(internalToolProps, externalToolProps);
+    const props = merge(
+      internalToolProps,
+      parseToolProps(externalToolProps, tool)
+    );
     csTools.addTool(tool, props);
   });
 
@@ -132,11 +177,120 @@ export default function init({ servicesManager, configuration }) {
       csTools.setToolPassive(toolName); // there may be a better place to determine name; may not be on uninstantiated class
     }
   });
-  
+
   csTools.setToolActive('Pan', { mouseButtonMask: 4 });
   csTools.setToolActive('Zoom', { mouseButtonMask: 2 });
   csTools.setToolActive('Wwwc', { mouseButtonMask: 1 });
   csTools.setToolActive('StackScrollMouseWheel', {}); // TODO: Empty options should not be required
   csTools.setToolActive('PanMultiTouch', { pointers: 2 }); // TODO: Better error if no options
   csTools.setToolActive('ZoomTouchPinch', {});
+  csTools.setToolEnabled('Overlay', {});
 }
+
+const _initMeasurementService = measurementService => {
+  /* Initialization */
+  const { toAnnotation, toMeasurement } = measurementServiceMappingsFactory(measurementService);
+  const csToolsVer4MeasurementSource = measurementService.createSource(
+    'CornerstoneTools',
+    '4'
+  );
+
+  /* Matching Criterias */
+  const matchingCriteria = {
+    valueType: measurementService.VALUE_TYPES.POLYLINE,
+    points: 2,
+  };
+
+  /* Mappings */
+  measurementService.addMapping(
+    csToolsVer4MeasurementSource,
+    'Length',
+    matchingCriteria,
+    toAnnotation,
+    toMeasurement
+  );
+
+  return csToolsVer4MeasurementSource;
+};
+
+const _connectToolsToMeasurementService = measurementService => {
+  const csToolsVer4MeasurementSource = _initMeasurementService(measurementService);
+  const {
+    id: sourceId,
+    addOrUpdate,
+    getAnnotation,
+  } = csToolsVer4MeasurementSource;
+
+  /* Measurement Service Events */
+  cornerstone.events.addEventListener(
+    cornerstone.EVENTS.ELEMENT_ENABLED,
+    event => {
+      const {
+        MEASUREMENT_ADDED,
+        MEASUREMENT_UPDATED,
+      } = measurementService.EVENTS;
+
+      measurementService.subscribe(
+        MEASUREMENT_ADDED,
+        ({ source, measurement }) => {
+          if (![sourceId].includes(source.id)) {
+            const annotation = getAnnotation('Length', measurement.id);
+
+            console.log(
+              'Measurement Service [Cornerstone]: Measurement added',
+              measurement
+            );
+            console.log('Mapped annotation:', annotation);
+          }
+        });
+
+      measurementService.subscribe(
+        MEASUREMENT_UPDATED,
+        ({ source, measurement }) => {
+          if (![sourceId].includes(source.id)) {
+            const annotation = getAnnotation('Length', measurement.id);
+
+            console.log(
+              'Measurement Service [Cornerstone]: Measurement updated',
+              measurement
+            );
+            console.log('Mapped annotation:', annotation);
+          }
+        }
+      );
+
+      const addOrUpdateMeasurement = csToolsAnnotation => {
+        try {
+          const { toolName, toolType, measurementData } = csToolsAnnotation;
+          const csTool = toolName || measurementData.toolType || toolType;
+          csToolsAnnotation.id = measurementData._measurementServiceId;
+          const measurementServiceId = addOrUpdate(csTool, csToolsAnnotation);
+
+          if (!measurementData._measurementServiceId) {
+            addMeasurementServiceId(measurementServiceId, csToolsAnnotation);
+          }
+        } catch (error) {
+          console.warn('Failed to add or update measurement:', error);
+        }
+      };
+
+      const addMeasurementServiceId = (id, csToolsAnnotation) => {
+        const { measurementData } = csToolsAnnotation;
+        Object.assign(measurementData, { _measurementServiceId: id });
+      };
+
+      [
+        csTools.EVENTS.MEASUREMENT_ADDED,
+        csTools.EVENTS.MEASUREMENT_MODIFIED,
+      ].forEach(csToolsEvtName => {
+        event.detail.element.addEventListener(
+          csToolsEvtName,
+          ({ detail: csToolsAnnotation }) => {
+            console.log(`Cornerstone Element Event: ${csToolsEvtName}`);
+            addOrUpdateMeasurement(csToolsAnnotation);
+          }
+        );
+      });
+    }
+  );
+};

extensions/cornerstone/src/toolbarModule.js

@@ -237,6 +237,15 @@ const definitions = [
       },
     ],
   },
+  {
+    id: 'Exit2DMPR',
+    label: 'Exit 2D MPR',
+    icon: 'times',
+    //
+    type: TOOLBAR_BUTTON_TYPES.COMMAND,
+    commandName: 'setCornerstoneLayout',
+    context: 'ACTIVE_VIEWPORT::VTK',
+  }
 ];
 
 export default {

extensions/cornerstone/src/utils/measurementServiceMappings/measurementServiceMappingsFactory.js

@@ -0,0 +1,133 @@
+import cornerstone from 'cornerstone-core';
+
+const SUPPORTED_TOOLS = ['Length', 'EllipticalRoi', 'RectangleRoi', 'ArrowAnnotate'];
+
+const measurementServiceMappingsFactory = measurementService => {
+  /**
+   * Maps measurement service format object to cornerstone annotation object.
+   *
+   * @param {Measurement} measurement The measurement instance
+   * @param {string} definition The source definition
+   * @return {Object} Cornerstone annotation data
+   */
+  const toAnnotation = (measurement, definition) => {
+    const {
+      id,
+      label,
+      description,
+      points,
+      unit,
+      sopInstanceUID,
+      frameOfReferenceUID,
+      referenceSeriesUID,
+    } = measurement;
+
+    return {
+      toolName: definition,
+      measurementData: {
+        sopInstanceUid: sopInstanceUID,
+        frameOfReferenceUid: frameOfReferenceUID,
+        seriesInstanceUid: referenceSeriesUID,
+        unit,
+        text: label,
+        description,
+        handles: _getHandlesFromPoints(points),
+        _measurementServiceId: id,
+      },
+    };
+  };
+
+  /**
+   * Maps cornerstone annotation event data to measurement service format.
+   *
+   * @param {Object} cornerstone Cornerstone event data
+   * @return {Measurement} Measurement instance
+   */
+  const toMeasurement = csToolsAnnotation => {
+    const { element, measurementData } = csToolsAnnotation;
+    const tool =
+      csToolsAnnotation.toolType ||
+      csToolsAnnotation.toolName ||
+      measurementData.toolType;
+
+    const validToolType = toolName => SUPPORTED_TOOLS.includes(toolName);
+
+    if (!validToolType(tool)) {
+      throw new Error('Tool not supported');
+    }
+
+    const {
+      sopInstanceUid,
+      frameOfReferenceUid,
+      seriesInstanceUid,
+    } = _getAttributes(element);
+
+    const points = [];
+    points.push(measurementData.handles);
+
+    return {
+      id: measurementData._measurementServiceId,
+      sopInstanceUID: sopInstanceUid,
+      frameOfReferenceUID: frameOfReferenceUid,
+      referenceSeriesUID: seriesInstanceUid,
+      label: measurementData.text,
+      description: measurementData.description,
+      unit: measurementData.unit,
+      area: measurementData.cachedStats && measurementData.cachedStats.area, /* TODO: Add concept names instead (descriptor) */
+      type: _getValueTypeFromToolType(tool),
+      points: _getPointsFromHandles(measurementData.handles),
+    };
+  };
+
+  const _getAttributes = element => {
+    const enabledElement = cornerstone.getEnabledElement(element);
+    const imageId = enabledElement.image.imageId;
+    const sopInstance = cornerstone.metaData.get('instance', imageId);
+    const sopInstanceUid = sopInstance.sopInstanceUid;
+    const frameOfReferenceUid = sopInstance.frameOfReferenceUID;
+    const series = cornerstone.metaData.get('series', imageId);
+    const seriesInstanceUid = series.seriesInstanceUid;
+
+    return { sopInstanceUid, frameOfReferenceUid, seriesInstanceUid };
+  };
+
+  const _getValueTypeFromToolType = toolType => {
+    const { POLYLINE, ELLIPSE, POINT } = measurementService.VALUE_TYPES;
+
+    /* TODO: Relocate static value types */
+    const TOOL_TYPE_TO_VALUE_TYPE = {
+      Length: POLYLINE,
+      EllipticalRoi: ELLIPSE,
+      RectangleRoi: POLYLINE,
+      ArrowAnnotate: POINT,
+    };
+
+    return TOOL_TYPE_TO_VALUE_TYPE[toolType];
+  };
+
+  const _getPointsFromHandles = handles => {
+    let points = [];
+    Object.keys(handles).map(handle => {
+      if (['start', 'end'].includes(handle)) {
+        let point = {};
+        if (handles[handle].x) point.x = handles[handle].x;
+        if (handles[handle].y) point.y = handles[handle].y;
+        points.push(point);
+      }
+    });
+    return points;
+  };
+
+  const _getHandlesFromPoints = points => {
+    return points
+      .map((p, i) => (i % 10 === 0 ? { start: p } : { end: p }))
+      .reduce((obj, item) => Object.assign(obj, { ...item }), {});
+  };
+
+  return {
+    toAnnotation,
+    toMeasurement,
+  };
+};
+
+export default measurementServiceMappingsFactory;

extensions/cornerstone/src/utils/measurementServiceMappings/measurementServiceMappingsFactory.test.js

@@ -0,0 +1,80 @@
+import measurementServiceMappingsFactory from './measurementServiceMappingsFactory';
+
+jest.mock('cornerstone-core', () => ({
+  ...jest.requireActual('cornerstone-core'),
+  getEnabledElement: () => ({
+    image: { imageId: 123 },
+  }),
+  metaData: {
+    ...jest.requireActual('cornerstone-core').metaData,
+    get: () => ({
+      sopInstanceUid: "123",
+      frameOfReferenceUID: "123",
+      seriesInstanceUid: "123",
+    }),
+  },
+}));
+
+describe('measurementServiceMappings.js', () => {
+  let mappings;
+  let handles;
+  let points;
+  let csToolsAnnotation;
+  let measurement;
+  let measurementServiceMock;
+  let definition = 'Length';
+
+  beforeEach(() => {
+    measurementServiceMock = {
+      VALUE_TYPES: {
+        POLYLINE: 'value_type::polyline',
+        POINT: 'value_type::point',
+        ELLIPSE: 'value_type::ellipse',
+        MULTIPOINT: 'value_type::multipoint',
+        CIRCLE: 'value_type::circle',
+      },
+    };
+    mappings = measurementServiceMappingsFactory(measurementServiceMock);
+    handles = { start: { x: 1, y: 2 }, end: { x: 1, y: 2 } };
+    points = [{ x: 1, y: 2 }, { x: 1, y: 2 }];
+    csToolsAnnotation = {
+      toolName: definition,
+      measurementData: {
+        _measurementServiceId: 1,
+        sopInstanceUid: '123',
+        frameOfReferenceUid: '123',
+        seriesInstanceUid: '123',
+        handles,
+        text: 'Test',
+        description: 'Test',
+        unit: 'mm',
+      },
+    };
+    measurement = {
+      id: 1,
+      sopInstanceUID: '123',
+      frameOfReferenceUID: '123',
+      referenceSeriesUID: '123',
+      label: 'Test',
+      description: 'Test',
+      unit: 'mm',
+      type: measurementServiceMock.VALUE_TYPES.POLYLINE,
+      points: points,
+    };
+    jest.clearAllMocks();
+  });
+
+  describe('toAnnotation()', () => {
+    it('map measurement service format to annotation', async () => {
+      const mappedMeasurement = await mappings.toAnnotation(measurement, definition);
+      expect(mappedMeasurement).toEqual(csToolsAnnotation);
+    });
+  });
+
+  describe('toMeasurement()', () => {
+    it('map annotation to measurement service format', async () => {
+      const mappedAnnotation = await mappings.toMeasurement(csToolsAnnotation);
+      expect(mappedAnnotation).toEqual(measurement);
+    });
+  });
+});

extensions/cornerstone/src/utils/setCornerstoneLayout.js

@@ -0,0 +1,22 @@
+import { redux } from '@ohif/core';
+
+const { setLayout } = redux.actions;
+
+/**
+ * Update the current layout with a simple Cornerstone one
+ *
+ * @return void
+ */
+const setCornerstoneLayout = () => {
+  const layout = {
+    numRows: 1,
+    numColumns: 1,
+    viewports: [{ plugin: 'cornerstone' }],
+  };
+
+  const action = setLayout(layout);
+
+  window.store.dispatch(action);
+}
+
+export default setCornerstoneLayout;

extensions/dicom-pdf/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.0.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-pdf@1.0.0...@ohif/extension-dicom-pdf@1.0.1) (2019-12-16)
+
+
+### Bug Fixes
+
+* 🐛 Update ohif pdf extension to optionally use pdfjs ([#1162](https://github.com/OHIF/Viewers/issues/1162)) ([31e542d](https://github.com/OHIF/Viewers/commit/31e542dfd973c3e982ede6d02d79bfe65175e792)), closes [#1049](https://github.com/OHIF/Viewers/issues/1049)
+
+
+
+
+
 # [1.0.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-pdf@0.50.4...@ohif/extension-dicom-pdf@1.0.0) (2019-09-27)
 
 

extensions/dicom-pdf/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ohif/extension-dicom-pdf",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "description": "OHIF extension for Dicom PDF",
   "author": "OHIF",
   "license": "MIT",
@@ -37,7 +37,8 @@
   "dependencies": {
     "@babel/runtime": "^7.5.5",
     "classnames": "^2.2.6",
-    "lodash.isequal": "^4.5.0"
+    "lodash.isequal": "^4.5.0",
+    "pdfjs-dist": "^2.2.228"
   },
   "gitHead": "a5baa9228c0eda0df880136bde4420d78e6f8706"
 }

extensions/dicom-pdf/src/ConnectedOHIFDicomPDFViewer.js

@@ -0,0 +1,27 @@
+import OHIF from '@ohif/core';
+import { connect } from 'react-redux';
+import OHIFDicomPDFViewport from './OHIFDicomPDFViewport';
+
+const { setViewportActive } = OHIF.redux.actions;
+
+const mapStateToProps = (state, ownProps) => {
+  const { activeViewportIndex } = state.viewports;
+  return { activeViewportIndex };
+};
+
+const mapDispatchToProps = (dispatch, ownProps) => {
+  const { viewportIndex } = ownProps;
+
+  return {
+    setViewportActive: () => {
+      dispatch(setViewportActive(viewportIndex));
+    },
+  };
+};
+
+const ConnectedOHIFDicomPDFViewer = connect(
+  mapStateToProps,
+  mapDispatchToProps
+)(OHIFDicomPDFViewport);
+
+export default ConnectedOHIFDicomPDFViewer;

extensions/dicom-pdf/src/DicomPDFViewport.css

@@ -0,0 +1,62 @@
+.DicomPDFViewport {
+  --header-height: 50px;
+}
+
+.DicomPDFViewport #toolbar {
+  display: flex;
+  align-items: center;
+  color: #fff;
+  padding: 0.5em;
+  border-bottom: var(--ui-border-thickness) solid var(--ui-border-color);
+  height: var(--header-height);
+}
+
+.DicomPDFViewport #canvas {
+  height: calc(100% - var(--header-height));
+  overflow-y: scroll;
+}
+
+.DicomPDFViewport #text-layer {
+  height: 100%;
+  margin-top: var(--header-height);
+}
+
+.DicomPDFViewport #pdf-canvas-container {
+  position: relative;
+}
+
+.DicomPDFViewport canvas, #text-layer {
+  display: block;
+  margin: 0 auto;
+  overflow: hidden;
+}
+
+.DicomPDFViewport #toolbar button {
+  color: currentColor;
+  background-color: transparent;
+  font: inherit;
+  border: var(--ui-border-thickness) solid var(--ui-border-color);
+  border-radius: 3px;
+  padding: 0.25em 0.5em;
+  margin-right: 0.5em;
+  cursor: pointer;
+}
+
+.DicomPDFViewport #text-layer {
+  position: absolute;
+  left: 0;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  overflow: hidden;
+  opacity: 0.2;
+  line-height: 1;
+}
+
+.DicomPDFViewport #text-layer>span {
+  color: transparent;
+  position: absolute;
+  white-space: pre;
+  cursor: text;
+  transform-origin: 0% 0%;
+}

extensions/dicom-pdf/src/DicomPDFViewport.js

@@ -1,6 +1,14 @@
-import React, { Component } from 'react';
+import React, { Component, createRef } from 'react';
 import dicomParser from 'dicom-parser';
+import PDFJS from 'pdfjs-dist';
+import PropTypes from 'prop-types';
+
 import TypedArrayProp from './TypedArrayProp';
+import './DicomPDFViewport.css';
+
+import pdfjsBuild from 'pdfjs-dist/build/pdf';
+import pdfjsWorker from 'pdfjs-dist/build/pdf.worker.entry';
+pdfjsBuild.GlobalWorkerOptions.workerSrc = pdfjsWorker;
 
 // TODO: Should probably use dcmjs for this
 const SOP_CLASS_UIDS = {
@@ -8,16 +16,88 @@ const SOP_CLASS_UIDS = {
 };
 
 class DicomPDFViewport extends Component {
-  state = {
-    fileURL: null,
-    error: null,
-  };
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      fileURL: null,
+      error: null,
+      currentPageIndex: 1,
+      pdf: null,
+      scale: 1,
+    };
+
+    this.canvas = createRef();
+    this.textLayer = createRef();
+  }
 
   static propTypes = {
     byteArray: TypedArrayProp.uint8,
+    useNative: PropTypes.bool,
+    viewportData: PropTypes.object,
+    activeViewportIndex: PropTypes.number,
+    setViewportActive: PropTypes.func,
+    viewportIndex: PropTypes.number,
   };
 
-  renderPDF = (dataSet, byteArray) => {
+  static defaultProps = {
+    useNative: false,
+  };
+
+  async componentDidMount() {
+    const dataSet = this.parseByteArray(this.props.byteArray);
+    const fileURL = this.getPDFFileUrl(dataSet, this.props.byteArray);
+
+    this.setState(state => ({ ...state, fileURL }));
+
+    if (!this.props.useNative) {
+      const pdf = await PDFJS.getDocument(fileURL).promise;
+      this.setState(state => ({ ...state, pdf }), () => this.updatePDFCanvas());
+    }
+  }
+
+  updatePDFCanvas = async () => {
+    const { pdf, scale, currentPageIndex } = this.state;
+    const context = this.canvas.getContext('2d');
+
+    const page = await pdf.getPage(currentPageIndex);
+    let viewport = page.getViewport({ scale });
+
+    this.canvas.height = viewport.height;
+    this.canvas.width = viewport.width;
+
+    const renderContext = {
+      canvasContext: context,
+      viewport: viewport,
+    };
+
+    await page.render(renderContext);
+    const textContent = await page.getTextContent();
+
+    this.textLayer.innerHTML = '';
+    this.textLayer.style.height = viewport.height + 'px';
+    this.textLayer.style.width = viewport.width + 'px';
+
+    PDFJS.renderTextLayer({
+      textContent,
+      container: this.textLayer,
+      viewport,
+      textDivs: [],
+    });
+  };
+
+  componentDidUpdate(prevProps, prevState) {
+    const { currentPageIndex, scale } = this.state;
+    const newValidScale = prevState.scale !== scale && scale > 0;
+    const newValidPageNumber =
+      prevState.currentPageIndex !== currentPageIndex && currentPageIndex > 0;
+
+    if (newValidScale || newValidPageNumber) {
+      this.updatePDFCanvas();
+    }
+  }
+
+  getPDFFileUrl = (dataSet, byteArray) => {
     let pdfByteArray = byteArray;
 
     if (dataSet) {
@@ -36,50 +116,144 @@ class DicomPDFViewport extends Component {
     const PDF = new Blob([pdfByteArray], { type: 'application/pdf' });
     const fileURL = URL.createObjectURL(PDF);
 
-    this.setState({
-      fileURL,
-    });
+    return fileURL;
+  };
+
+  onPageChange = async event => {
+    const { currentPageIndex, pdf } = this.state;
+    let newPageIndex = currentPageIndex;
+
+    const action = event.target.getAttribute('data-pager');
+    if (action === 'prev') {
+      if (currentPageIndex === 1) {
+        return;
+      }
+      newPageIndex -= 1;
+      if (currentPageIndex < 0) {
+        newPageIndex = 0;
+      }
+    }
+
+    if (action === 'next') {
+      if (currentPageIndex === pdf.numPages - 1) {
+        return;
+      }
+      newPageIndex += 1;
+      if (currentPageIndex > pdf.numPages - 1) {
+        newPageIndex = pdf.numPages - 1;
+      }
+    }
+
+    this.setState(state => ({ ...state, currentPageIndex: newPageIndex }));
+  };
+
+  onZoomChange = () => {
+    let newZoomValue = this.state.scale;
+
+    const action = event.target.getAttribute('data-pager');
+
+    if (action === '+') {
+      newZoomValue += 0.25;
+    }
+
+    if (action === '-') {
+      newZoomValue -= 0.25;
+    }
+
+    this.setState(state => ({ ...state, scale: newZoomValue }));
   };
 
   parseByteArray = byteArray => {
-    const options = {
-      untilTag: '',
-    };
+    const options = { untilTag: '' };
 
     let dataSet;
-
     try {
       dataSet = dicomParser.parseDicom(byteArray, options);
     } catch (error) {
-      this.setState({
-        error,
-      });
+      this.setState(state => ({ ...state, error }));
     }
 
     return dataSet;
   };
 
-  componentDidMount() {
-    const dataSet = this.parseByteArray(this.props.byteArray);
+  setViewportActiveHandler = () => {
+    const {
+      setViewportActive,
+      viewportIndex,
+      activeViewportIndex,
+    } = this.props;
 
-    this.renderPDF(dataSet, this.props.byteArray);
-  }
+    if (viewportIndex !== activeViewportIndex) {
+      setViewportActive(viewportIndex);
+    }
+  };
+
+  downloadPDFCanvas = () => {
+    const { fileURL } = this.state;
+    const a = document.createElement('a');
+    a.href = fileURL;
+    a.download = fileURL.substr(fileURL.lastIndexOf('/') + 1);
+    document.body.appendChild(a);
+    a.click();
+    document.body.removeChild(a);
+  };
 
   render() {
+    const { fileURL, pdf, error } = this.state;
+
     return (
       <div
         className={'DicomPDFViewport'}
+        onClick={this.setViewportActiveHandler}
+        onScroll={this.setViewportActiveHandler}
         style={{ width: '100%', height: '100%' }}
       >
-        {this.state.fileURL && (
+        {!this.props.useNative ? (
+          <>
+            <div id="toolbar">
+              <div id="pager">
+                {pdf && pdf.numPages > 1 && (
+                  <>
+                    <button data-pager="prev" onClick={this.onPageChange}>
+                      {`<`}
+                    </button>
+                    <button data-pager="next" onClick={this.onPageChange}>
+                      {`>`}
+                    </button>
+                  </>
+                )}
+                <button data-pager="-" onClick={this.onZoomChange}>
+                  {`-`}
+                </button>
+                <button data-pager="+" onClick={this.onZoomChange}>
+                  {`+`}
+                </button>
+                <button onClick={this.downloadPDFCanvas}>Download</button>
+              </div>
+            </div>
+            <div id="canvas">
+              <div id="pdf-canvas-container">
+                <canvas
+                  id="pdf-canvas"
+                  ref={canvas => (this.canvas = canvas)}
+                />
+                <div
+                  id="text-layer"
+                  ref={textLayer => (this.textLayer = textLayer)}
+                ></div>
+              </div>
+            </div>
+          </>
+        ) : (
           <object
-            data={this.state.fileURL}
+            aria-label="PDF Viewer"
+            data={fileURL}
             type="application/pdf"
             width="100%"
             height="100%"
           />
         )}
-        {this.state.error && <h2>{JSON.stringify(this.state.error)}</h2>}
+        {error && <h2>{JSON.stringify(error)}</h2>}
       </div>
     );
   }

extensions/dicom-pdf/src/OHIFDicomPDFViewport.js

@@ -11,6 +11,9 @@ class OHIFDicomPDFViewport extends Component {
     studies: PropTypes.object,
     displaySet: PropTypes.object,
     viewportIndex: PropTypes.number,
+    viewportData: PropTypes.object,
+    activeViewportIndex: PropTypes.number,
+    setViewportActive: PropTypes.func,
   };
 
   state = {
@@ -30,42 +33,36 @@ class OHIFDicomPDFViewport extends Component {
 
   componentDidMount() {
     const { displaySet, studies } = this.props.viewportData;
-    const {
-      studyInstanceUid,
-      seriesInstanceUid,
-      sopInstanceUid,
-      wadoRoot,
-      wadoUri,
-      authorizationHeaders,
-    } = displaySet;
-
     DicomLoaderService.findDicomDataPromise(displaySet, studies).then(
-      data => {
-        const byteArray = new Uint8Array(data);
-        this.setState({
-          byteArray: byteArray,
-        });
-      },
+      data => this.setState({ byteArray: new Uint8Array(data) }),
       error => {
-        this.setState({
-          error,
-        });
-
+        this.setState({ error });
         throw new Error(error);
       }
     );
   }
 
   render() {
+    const {
+      setViewportActive,
+      viewportIndex,
+      activeViewportIndex,
+    } = this.props;
+    const { byteArray, error } = this.state;
     const { id, init, destroy } = OHIFDicomPDFViewport;
     const pluginProps = { id, init, destroy };
 
     return (
       <OHIFComponentPlugin {...pluginProps}>
-        {this.state.byteArray && (
-          <DicomPDFViewport byteArray={this.state.byteArray} />
+        {byteArray && (
+          <DicomPDFViewport
+            byteArray={byteArray}
+            setViewportActive={setViewportActive}
+            viewportIndex={viewportIndex}
+            activeViewportIndex={activeViewportIndex}
+          />
         )}
-        {this.state.error && <h2>{JSON.stringify(this.state.error)}</h2>}
+        {error && <h2>{JSON.stringify(error)}</h2>}
       </OHIFComponentPlugin>
     );
   }

extensions/dicom-pdf/src/asyncComponent.js

@@ -0,0 +1,37 @@
+/**
+ * We use this component to leverage "Code Splitting"
+ *
+ * Link: https://serverless-stack.com/chapters/code-splitting-in-create-react-app.html
+ */
+
+import React, { Component } from 'react';
+
+export default function asyncComponent(importComponent) {
+  class AsyncComponent extends Component {
+    constructor(props) {
+      super(props);
+
+      this.state = {
+        component: null,
+      };
+    }
+
+    async componentDidMount() {
+      // Add dynamically loaded component to state
+      const { default: component } = await importComponent();
+
+      this.setState({
+        component: component,
+      });
+    }
+
+    render() {
+      const C = this.state.component;
+
+      // Render the loaded component, or null
+      return C ? <C {...this.props} /> : null;
+    }
+  }
+
+  return AsyncComponent;
+}

extensions/dicom-pdf/src/index.js

@@ -1,16 +1,21 @@
+import asyncComponent from './asyncComponent.js';
 import OHIFDicomPDFSopClassHandler from './OHIFDicomPDFSopClassHandler.js';
-import OHIFDicomPDFViewport from './OHIFDicomPDFViewport.js';
+
+const ConnectedOHIFDicomPDFViewer = asyncComponent(() =>
+  import(
+    /* webpackChunkName: "ConnectedOHIFDicomPDFViewer" */ './ConnectedOHIFDicomPDFViewer'
+  )
+);
 
 export default {
   /**
    * Only required property. Should be a unique value across all extensions.
    */
   id: 'pdf',
-
   getViewportModule() {
-    return OHIFDicomPDFViewport;
+    return ConnectedOHIFDicomPDFViewer;
   },
   getSopClassHandlerModule() {
     return OHIFDicomPDFSopClassHandler;
-  }
+  },
 };

extensions/lesion-tracker/.webpack/webpack.dev.js

@@ -0,0 +1,8 @@
+const path = require('path');
+const webpackCommon = require('./../../../.webpack/webpack.commonjs.js');
+const SRC_DIR = path.join(__dirname, '../src');
+const DIST_DIR = path.join(__dirname, '../dist');
+
+module.exports = (env, argv) => {
+  return webpackCommon(env, argv, { SRC_DIR, DIST_DIR });
+};

extensions/lesion-tracker/.webpack/webpack.prod.js

@@ -0,0 +1,38 @@
+const merge = require('webpack-merge');
+const path = require('path');
+const webpackCommon = require('./../../../.webpack/webpack.commonjs.js');
+const pkg = require('./../package.json');
+
+const ROOT_DIR = path.join(__dirname, './..');
+const SRC_DIR = path.join(__dirname, '../src');
+const DIST_DIR = path.join(__dirname, '../dist');
+
+module.exports = (env, argv) => {
+  const commonConfig = webpackCommon(env, argv, { SRC_DIR, DIST_DIR });
+
+  return merge(commonConfig, {
+    devtool: 'source-map',
+    stats: {
+      colors: true,
+      hash: true,
+      timings: true,
+      assets: true,
+      chunks: false,
+      chunkModules: false,
+      modules: false,
+      children: false,
+      warnings: true,
+    },
+    optimization: {
+      minimize: true,
+      sideEffects: true,
+    },
+    output: {
+      path: ROOT_DIR,
+      library: 'OHIFExtLesionTracker',
+      libraryTarget: 'umd',
+      libraryExport: 'default',
+      filename: pkg.main,
+    },
+  });
+};

extensions/lesion-tracker/CHANGELOG.md

@@ -0,0 +1,22 @@
+# Change Log
+
+All notable changes to this project will be documented in this file.
+See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+
+# [0.2.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-lesion-tracker@0.1.0...@ohif/extension-lesion-tracker@0.2.0) (2020-02-10)
+
+
+### Features
+
+* Lesion tracker right panel ([#1428](https://github.com/OHIF/Viewers/issues/1428)) ([98a649b](https://github.com/OHIF/Viewers/commit/98a649b455ffc712938fc5035cdef40695e58440))
+
+
+
+
+
+# 0.1.0 (2020-02-06)
+
+
+### Features
+
+* lesion-tracker extension ([#1420](https://github.com/OHIF/Viewers/issues/1420)) ([73e4409](https://github.com/OHIF/Viewers/commit/73e440968ce4699d081a9c9f2d21dd68095b3056))

extensions/lesion-tracker/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2018 Open Health Imaging Foundation
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

extensions/lesion-tracker/README.md

@@ -0,0 +1,38 @@
+# @ohif/extension-lesion-tracker
+
+This project is an OHIF extension that can be used with the Core OHIF Platform,
+either at runtime, or as an ES6 dependency, to create a medical image viewing
+application similar to that of the [legacy Lesion
+Tracker][legacy-lesion-tracker] viewer.
+
+## About
+
+...
+
+## Scope
+
+...
+
+### Configuration
+
+...
+
+### Extensions
+
+...
+
+## Build & Deploy
+
+...
+
+## Funding/Support
+
+...
+
+<!--
+  LINKS
+  -->
+
+<!-- prettier-ignore-start -->
+[legacy-lesion-tracker]: http://lesiontracker.ohif.org/studylist
+<!-- prettier-ignore-end -->

extensions/lesion-tracker/package.json

@@ -0,0 +1,40 @@
+{
+  "name": "@ohif/extension-lesion-tracker",
+  "version": "0.2.0",
+  "description": "OHIF extension for Lesion Tracker",
+  "author": "OHIF",
+  "license": "MIT",
+  "repository": "OHIF/Viewers",
+  "main": "dist/index.umd.js",
+  "module": "src/index.js",
+  "publishConfig": {
+    "access": "public"
+  },
+  "engines": {
+    "node": ">=10",
+    "npm": ">=6",
+    "yarn": ">=1.16.0"
+  },
+  "files": [
+    "dist",
+    "README.md"
+  ],
+  "scripts": {
+    "dev": "cross-env NODE_ENV=development webpack --config .webpack/webpack.dev.js --watch --debug --output-pathinfo",
+    "dev:lesion-tracker": "yarn run dev",
+    "build": "cross-env NODE_ENV=production webpack --config .webpack/webpack.prod.js",
+    "build:package": "yarn run build",
+    "prepublishOnly": "yarn run build",
+    "start": "yarn run dev"
+  },
+  "peerDependencies": {
+    "@ohif/core": "^0.50.0",
+    "prop-types": "^15.6.2",
+    "react": "^16.8.6",
+    "react-dom": "^16.8.6"
+  },
+  "dependencies": {
+    "@babel/runtime": "^7.5.5",
+    "classnames": "^2.2.6"
+  }
+}

extensions/lesion-tracker/src/components/MeasurementComparisonTable.css

@@ -0,0 +1,60 @@
+.MeasurementComparisonTable {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+}
+
+.MeasurementComparisonTable .displayTexts {
+  display: flex;
+}
+
+.MeasurementComparisonTable .displayTexts .measurementDisplayText {
+  flex: 1;
+}
+
+.MeasurementComparisonTable .measurementTableHeader {
+  display: flex;
+  position: relative;
+  padding-left: 38px;
+}
+
+.MeasurementComparisonTable .measurementTableHeader .warning-status {
+  left: 0;
+  top: 3px;
+  cursor: pointer;
+  width: 40px;
+  height: 100%;
+  display: flex;
+  align-items: center;
+}
+
+.MeasurementComparisonTable .measurementTableHeader .warning-status .warning-border {
+  padding: 2px 3px;
+  width: 30px;
+  height: 30px;
+}
+
+.MeasurementComparisonTable .measurementTableHeader .warning-status svg {
+  width: 20px;
+  height: 18px;
+}
+
+.MeasurementComparisonTable .measurementTableHeader .measurementTableHeaderItem {
+  position: relative;
+  flex: 1;
+}
+
+.MeasurementComparisonTable .generate-report {
+  background-color: #151a1f;
+  margin-top: 2px;
+  padding: 10px 0;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.MeasurementComparisonTable .generate-report button {
+  font-size: 12px;
+  color: black;
+  background-color: var(--active-color);
+}

extensions/lesion-tracker/src/components/MeasurementComparisonTable.js

@@ -0,0 +1,151 @@
+import React from 'react';
+
+import { MeasurementTable } from '@ohif/ui';
+
+import './MeasurementComparisonTable.css';
+
+const overallWarnings = {
+  warningList: [
+    'All measurements should have a location',
+    'Nodal lesions must be >= 15mm short axis AND >= double the acquisition slice thickness by CT and MR',
+  ],
+};
+
+const measurements = [
+  {
+    measurementId: '125',
+    measurementNumber: '125',
+    itemNumber: 1,
+    label: '(No description)',
+    data: [{ displayText: '12.5 x 4.6' }],
+  },
+  {
+    measurementId: '124',
+    measurementNumber: '124',
+    itemNumber: 2,
+    label: '(No description)',
+    data: [{ displayText: '32.5 x 1.6' }],
+  },
+  {
+    measurementId: '123',
+    measurementNumber: '123',
+    itemNumber: 3,
+    hasWarnings: true,
+    warningList: [
+      'All measurements should have a location',
+      'Nodal lesions must be >= 15mm short axis AND >= double the acquisition slice thickness by CT and MR',
+    ],
+    label: '(No description)',
+    data: [{ displayText: '5.5 x 9.2' }],
+  },
+];
+
+const additionalFindings = [
+  {
+    measurementId: '122',
+    measurementNumber: '122',
+    itemNumber: 1,
+    hasWarnings: true,
+    warningList: [
+      'All measurements should have a location',
+      'Nodal lesions must be >= 15mm short axis AND >= double the acquisition slice thickness by CT and MR',
+    ],
+    label: '(No description)',
+    data: [{ displayText: '23.5 x 9.2' }],
+  },
+  {
+    measurementId: '121',
+    measurementNumber: '121',
+    itemNumber: 2,
+    hasWarnings: true,
+    warningList: [
+      'All measurements should have a location',
+      'Nodal lesions must be >= 15mm short axis AND >= double the acquisition slice thickness by CT and MR',
+    ],
+    label: '(No description)',
+    data: [{ displayText: '11.2 x 9.2' }],
+  },
+  {
+    measurementId: '120',
+    measurementNumber: '120',
+    itemNumber: 3,
+    label: '(No description)',
+    data: [{ displayText: '2.9 x 9.2' }],
+  },
+];
+
+const currentCollections = [
+  {
+    selectorAction: () => { },
+    maxMeasurements: 3,
+    groupName: 'Measurements',
+    measurements: measurements,
+  },
+  {
+    selectorAction: () => { },
+    groupName: 'Additional Findings',
+    measurements: additionalFindings,
+  },
+];
+
+const comparisonColletions = [
+  {
+    selectorAction: () => { },
+    maxMeasurements: 3,
+    groupName: 'Measurements',
+    measurements: measurements,
+  },
+  {
+    selectorAction: () => { },
+    groupName: 'Additional Findings',
+    measurements: additionalFindings,
+  },
+];
+
+const comparisonCollections = currentCollections.map((group, index) => {
+  return {
+    ...group,
+    measurements: group.measurements.map((measurement, measurementIndex) => {
+      const comparisonCollection = comparisonColletions[index].measurements;
+      if (measurementIndex < comparisonCollection.length) {
+        return {
+          ...measurement,
+          data: [
+            ...measurement.data,
+            ...comparisonCollection[measurementIndex].data,
+          ],
+        };
+      }
+    }),
+  };
+});
+
+const comparisonTimepoints = [
+  {
+    key: 'Current',
+    date: '10-Apr-18',
+  },
+  {
+    key: 'Comparison',
+    date: '15-Jun-18',
+  }
+];
+
+const MeasurementComparisonTable = () => {
+  return (
+    <div className="MeasurementComparisonTable">
+      <MeasurementTable
+        timepoints={comparisonTimepoints}
+        overallWarnings={overallWarnings}
+        measurementCollection={comparisonCollections}
+        onRelabelClick={() => { }}
+        onEditDescriptionClick={() => { }}
+      />
+      <div className="generate-report">
+        <button className="btn btn-primary">Generate Report</button>
+      </div>
+    </div>
+  );
+};
+
+export default MeasurementComparisonTable;

extensions/lesion-tracker/src/index.js

@@ -0,0 +1,52 @@
+import MeasurementComparisonTable from './components/MeasurementComparisonTable';
+
+export default {
+  /**
+   * Only required property. Should be a unique value across all extensions.
+   */
+  id: 'lesion-tracker',
+
+  /**
+   * @param {object} params
+   * @param {ServicesManager} params.servicesManager
+   * @param {CommandsManager} params.commandsManager
+   */
+  getPanelModule({ servicesManager, commandsManager }) {
+    return {
+      menuOptions: [
+        {
+          icon: 'th-list',
+          label: 'Measurements',
+          target: 'lesion-tracker-panel',
+        },
+      ],
+      components: [
+        {
+          id: 'lesion-tracker-panel',
+          component: MeasurementComparisonTable,
+        },
+      ],
+      defaultContext: ['VIEWER']
+    };
+  },
+
+  /**
+   * @param {object} params
+   * @param {ServicesManager} params.servicesManager
+   * @param {CommandsManager} params.commandsManager
+   * @returns Object
+   */
+  getToolbarModule() {
+    return null;
+  },
+
+  /**
+   * @param {object} params
+   * @param {ServicesManager} params.servicesManager
+   * @param {CommandsManager} params.commandsManager
+   * @returns Object
+   */
+  getCommandsModule() {
+    return null;
+  },
+};

extensions/vtk/CHANGELOG.md

@@ -3,6 +3,223 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.2.18](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.2.17...@ohif/extension-vtk@1.2.18) (2020-02-12)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.2.17](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.2.16...@ohif/extension-vtk@1.2.17) (2020-02-10)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.2.16](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.2.15...@ohif/extension-vtk@1.2.16) (2020-02-10)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.2.15](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.2.14...@ohif/extension-vtk@1.2.15) (2020-02-07)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.2.14](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.2.13...@ohif/extension-vtk@1.2.14) (2020-02-06)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.2.13](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.2.12...@ohif/extension-vtk@1.2.13) (2020-01-30)
+
+
+### Bug Fixes
+
+* Set VTK viewport as active by interaction  ([#1139](https://github.com/OHIF/Viewers/issues/1139)) ([686d12d](https://github.com/OHIF/Viewers/commit/686d12da5c9d3d435b1e326c2a5caee36e2ed27c))
+
+
+
+
+
+## [1.2.12](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.2.11...@ohif/extension-vtk@1.2.12) (2020-01-30)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.2.11](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.2.10...@ohif/extension-vtk@1.2.11) (2020-01-28)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.2.10](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.2.9...@ohif/extension-vtk@1.2.10) (2020-01-28)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.2.9](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.2.8...@ohif/extension-vtk@1.2.9) (2020-01-27)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.2.8](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.2.7...@ohif/extension-vtk@1.2.8) (2020-01-24)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.2.7](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.2.6...@ohif/extension-vtk@1.2.7) (2020-01-08)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.2.6](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.2.5...@ohif/extension-vtk@1.2.6) (2020-01-07)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.2.5](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.2.4...@ohif/extension-vtk@1.2.5) (2020-01-06)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.2.4](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.2.3...@ohif/extension-vtk@1.2.4) (2019-12-30)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.2.3](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.2.2...@ohif/extension-vtk@1.2.3) (2019-12-20)
+
+
+### Bug Fixes
+
+* 🐛 1241: Make Plugin switch part of ToolbarModule ([#1322](https://github.com/OHIF/Viewers/issues/1322)) ([6540e36](https://github.com/OHIF/Viewers/commit/6540e36818944ac2eccc696186366ae495b33a04)), closes [#1241](https://github.com/OHIF/Viewers/issues/1241)
+
+
+
+
+
+## [1.2.2](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.2.1...@ohif/extension-vtk@1.2.2) (2019-12-20)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.2.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.2.0...@ohif/extension-vtk@1.2.1) (2019-12-20)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+# [1.2.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.1.7...@ohif/extension-vtk@1.2.0) (2019-12-20)
+
+
+### Features
+
+* 🎸 Configuration so viewer tools can nix handles ([#1304](https://github.com/OHIF/Viewers/issues/1304)) ([63594d3](https://github.com/OHIF/Viewers/commit/63594d36b0bdba59f0901095aed70b75fb05172d)), closes [#1223](https://github.com/OHIF/Viewers/issues/1223)
+
+
+
+
+
+## [1.1.7](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.1.6...@ohif/extension-vtk@1.1.7) (2019-12-19)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.1.6](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.1.5...@ohif/extension-vtk@1.1.6) (2019-12-18)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.1.5](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.1.4...@ohif/extension-vtk@1.1.5) (2019-12-16)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.1.4](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.1.3...@ohif/extension-vtk@1.1.4) (2019-12-16)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.1.3](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.1.2...@ohif/extension-vtk@1.1.3) (2019-12-13)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.1.2](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.1.1...@ohif/extension-vtk@1.1.2) (2019-12-12)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.1.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.1.0...@ohif/extension-vtk@1.1.1) (2019-12-11)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
 # [1.1.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.0.2...@ohif/extension-vtk@1.1.0) (2019-12-11)
 
 

extensions/vtk/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ohif/extension-vtk",
-  "version": "1.1.0",
+  "version": "1.2.18",
   "description": "OHIF extension for VTK.js",
   "author": "OHIF",
   "license": "MIT",
@@ -49,12 +49,12 @@
   "dependencies": {
     "@babel/runtime": "^7.5.5",
     "lodash.throttle": "^4.1.1",
-    "react-vtkjs-viewport": "^0.3.9"
+    "react-vtkjs-viewport": "^0.8.3"
   },
   "devDependencies": {
-    "@ohif/core": "^2.1.0",
-    "@ohif/ui": "^1.1.0",
-    "cornerstone-tools": "^4.8.0",
+    "@ohif/core": "^2.4.1",
+    "@ohif/ui": "^1.2.1",
+    "cornerstone-tools": "^4.12.0",
     "cornerstone-wado-image-loader": "^3.0.0",
     "dicom-parser": "^1.8.3",
     "gh-pages": "^2.0.1",

extensions/vtk/src/ConnectedVTKViewport.js

@@ -1,6 +1,6 @@
 import OHIF from '@ohif/core';
-import { View2D } from 'react-vtkjs-viewport';
 import { connect } from 'react-redux';
+import VTKViewport from './VTKViewport';
 
 const { setViewportActive, setViewportSpecificData } = OHIF.redux.actions;
 
@@ -18,6 +18,7 @@ const mapStateToProps = (state, ownProps) => {
   const pluginDetails = viewportLayout.vtk || {};
 
   return {
+    activeViewportIndex: state.viewports.activeViewportIndex,
     layout: state.viewports.layout,
     isActive,
     ...pluginDetails,
@@ -75,6 +76,6 @@ const ConnectedVTKViewport = connect(
   mapStateToProps,
   mapDispatchToProps,
   mergeProps
-)(View2D);
+)(VTKViewport);
 
 export default ConnectedVTKViewport;

extensions/vtk/src/OHIFVTKViewport.js

@@ -77,6 +77,11 @@ class OHIFVTKViewport extends Component {
     }),
     viewportIndex: PropTypes.number,
     children: PropTypes.node,
+    onScroll: PropTypes.func,
+  };
+
+  static defaultProps = {
+    onScroll: () => {},
   };
 
   static id = 'OHIFVTKViewport';
@@ -386,6 +391,7 @@ class OHIFVTKViewport extends Component {
                 this.state.paintFilterBackgroundImageData
               }
               viewportIndex={this.props.viewportIndex}
+              onScroll={this.props.onScroll}
             />
           )}
         </div>

extensions/vtk/src/VTKViewport.css

@@ -0,0 +1,3 @@
+.vtk-viewport-handler svg {
+  pointer-events: none;
+}

extensions/vtk/src/VTKViewport.js

@@ -0,0 +1,58 @@
+import React, { useEffect, useCallback } from 'react';
+import { View2D } from 'react-vtkjs-viewport';
+import PropTypes from 'prop-types';
+
+import './VTKViewport.css';
+
+const VTKViewport = props => {
+  const style = { width: '100%', height: '100%', position: 'relative' };
+
+  const setViewportActiveHandler = useCallback(() => {
+    const { setViewportActive, viewportIndex, activeViewportIndex } = props;
+
+    if (viewportIndex !== activeViewportIndex) {
+      // set in Connected
+      setViewportActive();
+    }
+  });
+
+  useEffect(() => {
+    const handleScrollEvent = evt => {
+      const vtkViewportApiReference = props.onScroll(props.viewportIndex) || {};
+      const viewportUid = vtkViewportApiReference.uid;
+      const viewportWasScrolled = viewportUid === evt.detail.uid;
+
+      if (viewportWasScrolled) {
+        setViewportActiveHandler();
+      }
+    };
+
+    window.addEventListener('vtkscrollevent', handleScrollEvent);
+    return () =>
+      window.removeEventListener('vtkscrollevent', handleScrollEvent);
+  }, [props, props.onScroll, props.viewportIndex, setViewportActiveHandler]);
+
+  return (
+    <div
+      className="vtk-viewport-handler"
+      style={style}
+      onClick={setViewportActiveHandler}
+    >
+      <View2D {...props} />
+    </div>
+  );
+};
+
+VTKViewport.propTypes = {
+  setViewportActive: PropTypes.func.isRequired,
+  viewportIndex: PropTypes.number.isRequired,
+  activeViewportIndex: PropTypes.number.isRequired,
+  /* Receives viewportIndex */
+  onScroll: PropTypes.func,
+};
+
+VTKViewport.defaultProps = {
+  onScroll: () => {},
+};
+
+export default VTKViewport;

extensions/vtk/src/commandsModule.js

@@ -103,6 +103,9 @@ const commandsModule = ({ commandsManager }) => {
   }
 
   const actions = {
+    getVtkApis: ({ index }) => {
+      return apis[index];
+    },
     axial: async ({ viewports }) => {
       const api = await _getActiveViewportVTKApi(viewports);
 
@@ -234,7 +237,7 @@ const commandsModule = ({ commandsManager }) => {
           },
         },
         {
-          // Sagital
+          // Sagittal
           orientation: {
             sliceNormal: [1, 0, 0],
             viewUp: [0, 0, 1],
@@ -266,11 +269,12 @@ const commandsModule = ({ commandsManager }) => {
           'crosshairsWidget'
         );
 
+        const uid = api.uid;
         const istyle = vtkInteractorStyleMPRCrosshairs.newInstance();
 
         api.setInteractorStyle({
           istyle,
-          configuration: { apis, apiIndex },
+          configuration: { apis, apiIndex, uid },
         });
       });
     },
@@ -296,55 +300,45 @@ const commandsModule = ({ commandsManager }) => {
     },
     enableRotateTool: {
       commandFn: actions.enableRotateTool,
-      storeContexts: [],
       options: {},
     },
     enableCrosshairsTool: {
       commandFn: actions.enableCrosshairsTool,
-      storeContexts: [],
       options: {},
     },
     enableLevelTool: {
       commandFn: actions.enableLevelTool,
-      storeContexts: [],
       options: {},
     },
     setBlendModeToComposite: {
       commandFn: actions.setBlendModeToComposite,
-      storeContexts: [],
       options: { blendMode: BlendMode.COMPOSITE_BLEND },
     },
     setBlendModeToMaximumIntensity: {
       commandFn: actions.setBlendModeToMaximumIntensity,
-      storeContexts: [],
       options: { blendMode: BlendMode.MAXIMUM_INTENSITY_BLEND },
     },
     setBlendModeToMinimumIntensity: {
       commandFn: actions.setBlendMode,
-      storeContexts: [],
       options: { blendMode: BlendMode.MINIMUM_INTENSITY_BLEND },
     },
     setBlendModeToAverageIntensity: {
       commandFn: actions.setBlendMode,
-      storeContexts: [],
       options: { blendMode: BlendMode.AVERAGE_INTENSITY_BLEND },
     },
     setSlabThickness: {
       // TODO: How do we pass in a function argument?
       commandFn: actions.setSlabThickness,
-      storeContexts: [],
       options: {},
     },
     increaseSlabThickness: {
       commandFn: actions.changeSlabThickness,
-      storeContexts: [],
       options: {
         change: 3,
       },
     },
     decreaseSlabThickness: {
       commandFn: actions.changeSlabThickness,
-      storeContexts: [],
       options: {
         change: -3,
       },
@@ -355,6 +349,10 @@ const commandsModule = ({ commandsManager }) => {
       options: {},
       context: 'VIEWER',
     },
+    getVtkApiForViewportIndex: {
+      commandFn: actions.getVtkApis,
+      context: 'VIEWER',
+    },
   };
 
   return {

extensions/vtk/src/index.js

@@ -1,6 +1,7 @@
 import asyncComponent from './asyncComponent.js';
 import commandsModule from './commandsModule.js';
 import toolbarModule from './toolbarModule.js';
+import withCommandsManager from './withCommandsManager.js';
 // This feels weird
 // import loadLocales from './loadLocales';
 
@@ -14,8 +15,8 @@ const vtkExtension = {
    */
   id: 'vtk',
 
-  getViewportModule() {
-    return OHIFVTKViewport;
+  getViewportModule({ commandsManager }) {
+    return withCommandsManager(OHIFVTKViewport, commandsManager);
   },
   getToolbarModule() {
     return toolbarModule;

extensions/vtk/src/toolbarComponents/VTKMPRToolbarButton.js

@@ -0,0 +1,87 @@
+import React from 'react';
+import { useSelector } from 'react-redux';
+import PropTypes from 'prop-types';
+import { ToolbarButton } from '@ohif/ui';
+import { utils } from '@ohif/core';
+
+const { studyMetadataManager } = utils;
+
+let isVisible = true;
+
+const _isDisplaySetReconstructable = (viewportSpecificData = {}, activeViewportIndex) => {
+  if (!viewportSpecificData[activeViewportIndex]) {
+    return false;
+  };
+
+  const { displaySetInstanceUid, studyInstanceUid } = viewportSpecificData[
+    activeViewportIndex
+  ];
+
+  const studies = studyMetadataManager.all();
+
+  const study = studies.find(
+    study => study.studyInstanceUID === studyInstanceUid
+  );
+
+  if (!study) {
+    return false;
+  }
+
+  const displaySet = study._displaySets.find(set => set.displaySetInstanceUid === displaySetInstanceUid);
+
+  if (!displaySet) {
+    return false;
+  };
+
+  return displaySet.isReconstructable;
+};
+
+function VTKMPRToolbarButton({
+  parentContext,
+  toolbarClickCallback,
+  button,
+  activeButtons,
+  isActive,
+  className,
+}) {
+  const { id, label, icon } = button;
+  const { viewportSpecificData, activeViewportIndex } = useSelector(state => {
+    const { viewports = {} } = state;
+    const { viewportSpecificData, activeViewportIndex } = viewports;
+
+    return {
+      viewportSpecificData,
+      activeViewportIndex,
+    }
+  });
+
+  isVisible = _isDisplaySetReconstructable(
+    viewportSpecificData,
+    activeViewportIndex,
+  );
+
+  return (
+    <React.Fragment>
+      {isVisible && (
+        <ToolbarButton
+          key={id}
+          label={label}
+          icon={icon}
+          onClick={evt => toolbarClickCallback(button, evt)}
+          isActive={isActive}
+        />
+      )}
+    </React.Fragment>
+  );
+}
+
+VTKMPRToolbarButton.propTypes = {
+  parentContext: PropTypes.object.isRequired,
+  toolbarClickCallback: PropTypes.func.isRequired,
+  button: PropTypes.object.isRequired,
+  activeButtons: PropTypes.array.isRequired,
+  isActive: PropTypes.bool,
+  className: PropTypes.string,
+};
+
+export default VTKMPRToolbarButton;

extensions/vtk/src/toolbarModule.js

@@ -1,4 +1,5 @@
 import SlabThicknessToolbarComponent from './toolbarComponents/SlabThicknessToolbarComponent';
+import VTKMPRToolbarButton from './toolbarComponents/VTKMPRToolbarButton';
 
 const TOOLBAR_BUTTON_TYPES = {
   COMMAND: 'command',
@@ -115,9 +116,19 @@ const definitions = [
       },
     ],
   },
+  {
+    id: '2DMPR',
+    label: '2D MPR',
+    icon: 'cube',
+    //
+    CustomComponent: VTKMPRToolbarButton,
+    type: TOOLBAR_BUTTON_TYPES.COMMAND,
+    commandName: 'mpr2d',
+    context: 'ACTIVE_VIEWPORT::CORNERSTONE',
+  },
 ];
 
 export default {
   definitions,
   defaultContext: 'ACTIVE_VIEWPORT::VTK',
-};
+}

extensions/vtk/src/withCommandsManager.js

@@ -0,0 +1,18 @@
+import React from 'react';
+
+export default function withCommandsManager(Component, commandsManager = {}) {
+  return class WithCommandsManager extends React.Component {
+    render() {
+      return (
+        <Component
+          {...this.props}
+          onScroll={viewportIndex =>
+            commandsManager.runCommand('getVtkApiForViewportIndex', {
+              index: viewportIndex,
+            })
+          }
+        />
+      );
+    }
+  };
+}

jest.config.js

@@ -10,7 +10,8 @@ module.exports = {
   // https://jestjs.io/docs/en/configuration#projects-array-string-projectconfig
   projects: [
     // "<rootDir>/extensions/*/jest.config.js",
-    "<rootDir>/platform/*/jest.config.js"
+    "<rootDir>/platform/*/jest.config.js",
+    "<rootDir>/extensions/*/jest.config.js"
   ],
   coverageDirectory: "<rootDir>/coverage/"
 };

package.json

@@ -13,11 +13,13 @@
   "scripts": {
     "cm": "npx git-cz",
     "build": "lerna run build:viewer --stream",
+    "build:lt": "lerna run build:viewer:lesion-tracker --stream",
     "build:ci": "lerna run build:viewer:ci --stream",
     "build:demo": "lerna run build:viewer:demo --stream",
     "build:package": "lerna run build:viewer:package --stream",
     "build:package-all": "lerna run build:package --parallel --stream",
     "dev": "lerna run dev:viewer --stream",
+    "dev:lt": "lerna run dev:viewer:lesion-tracker --stream",
     "dev:project": ".scripts/dev.sh",
     "dev:orthanc": "lerna run dev:orthanc --stream",
     "orthanc:up": "docker-compose -f .docker/Nginx-Orthanc/docker-compose.yml up",
@@ -59,6 +61,7 @@
     "copy-webpack-plugin": "^5.0.3",
     "cross-env": "^5.2.0",
     "css-loader": "^3.2.0",
+    "cypress-file-upload": "^3.5.3",
     "dotenv": "^8.1.0",
     "eslint": "5.16.0",
     "eslint-config-prettier": "^6.4.0",
@@ -72,7 +75,6 @@
     "eslint-plugin-react": "7.x",
     "eslint-plugin-react-hooks": "1.5.0",
     "extract-css-chunks-webpack-plugin": "^4.5.4",
-    "favicons-webpack-plugin": "^1.0.2",
     "html-webpack-plugin": "^3.2.0",
     "husky": "^3.0.0",
     "jest": "^24.8.0",

platform/core/CHANGELOG.md

@@ -3,6 +3,147 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [2.4.1](https://github.com/OHIF/Viewers/compare/@ohif/core@2.4.0...@ohif/core@2.4.1) (2020-02-12)
+
+
+### Bug Fixes
+
+* Combined Hotkeys for special characters ([#1233](https://github.com/OHIF/Viewers/issues/1233)) ([2f30e7a](https://github.com/OHIF/Viewers/commit/2f30e7a821a238144c49c56f37d8e5565540b4bd))
+
+
+
+
+
+# [2.4.0](https://github.com/OHIF/Viewers/compare/@ohif/core@2.3.9...@ohif/core@2.4.0) (2020-02-10)
+
+
+### Features
+
+* 🎸 MeasurementService ([#1314](https://github.com/OHIF/Viewers/issues/1314)) ([0c37a40](https://github.com/OHIF/Viewers/commit/0c37a406d963569af8c3be24c697dafd42712dfc))
+
+
+
+
+
+## [2.3.9](https://github.com/OHIF/Viewers/compare/@ohif/core@2.3.8...@ohif/core@2.3.9) (2020-02-07)
+
+**Note:** Version bump only for package @ohif/core
+
+
+
+
+
+## [2.3.8](https://github.com/OHIF/Viewers/compare/@ohif/core@2.3.7...@ohif/core@2.3.8) (2020-02-06)
+
+
+### Bug Fixes
+
+* Remove trash data from redux storage after updates ([#1358](https://github.com/OHIF/Viewers/issues/1358)) ([7b2d44f](https://github.com/OHIF/Viewers/commit/7b2d44f2c18241ea521b8d3652aee32e36eaddb8))
+
+
+
+
+
+## [2.3.7](https://github.com/OHIF/Viewers/compare/@ohif/core@2.3.6...@ohif/core@2.3.7) (2020-01-30)
+
+
+### Bug Fixes
+
+* Set VTK viewport as active by interaction  ([#1139](https://github.com/OHIF/Viewers/issues/1139)) ([686d12d](https://github.com/OHIF/Viewers/commit/686d12da5c9d3d435b1e326c2a5caee36e2ed27c))
+
+
+
+
+
+## [2.3.6](https://github.com/OHIF/Viewers/compare/@ohif/core@2.3.5...@ohif/core@2.3.6) (2020-01-28)
+
+**Note:** Version bump only for package @ohif/core
+
+
+
+
+
+## [2.3.5](https://github.com/OHIF/Viewers/compare/@ohif/core@2.3.4...@ohif/core@2.3.5) (2020-01-28)
+
+**Note:** Version bump only for package @ohif/core
+
+
+
+
+
+## [2.3.4](https://github.com/OHIF/Viewers/compare/@ohif/core@2.3.3...@ohif/core@2.3.4) (2020-01-27)
+
+**Note:** Version bump only for package @ohif/core
+
+
+
+
+
+## [2.3.3](https://github.com/OHIF/Viewers/compare/@ohif/core@2.3.2...@ohif/core@2.3.3) (2020-01-24)
+
+**Note:** Version bump only for package @ohif/core
+
+
+
+
+
+## [2.3.2](https://github.com/OHIF/Viewers/compare/@ohif/core@2.3.1...@ohif/core@2.3.2) (2020-01-06)
+
+**Note:** Version bump only for package @ohif/core
+
+
+
+
+
+## [2.3.1](https://github.com/OHIF/Viewers/compare/@ohif/core@2.3.0...@ohif/core@2.3.1) (2019-12-30)
+
+
+### Bug Fixes
+
+* 🐛 1241: Make Plugin switch part of ToolbarModule ([#1322](https://github.com/OHIF/Viewers/issues/1322)) ([6540e36](https://github.com/OHIF/Viewers/commit/6540e36818944ac2eccc696186366ae495b33a04)), closes [#1241](https://github.com/OHIF/Viewers/issues/1241)
+
+
+
+
+
+# [2.3.0](https://github.com/OHIF/Viewers/compare/@ohif/core@2.2.1...@ohif/core@2.3.0) (2019-12-20)
+
+
+### Features
+
+* 🎸 Configuration so viewer tools can nix handles ([#1304](https://github.com/OHIF/Viewers/issues/1304)) ([63594d3](https://github.com/OHIF/Viewers/commit/63594d36b0bdba59f0901095aed70b75fb05172d)), closes [#1223](https://github.com/OHIF/Viewers/issues/1223)
+
+
+
+
+
+## [2.2.1](https://github.com/OHIF/Viewers/compare/@ohif/core@2.2.0...@ohif/core@2.2.1) (2019-12-18)
+
+**Note:** Version bump only for package @ohif/core
+
+
+
+
+
+# [2.2.0](https://github.com/OHIF/Viewers/compare/@ohif/core@2.1.1...@ohif/core@2.2.0) (2019-12-16)
+
+
+### Features
+
+* 🎸 Expose extension config to modules ([#1279](https://github.com/OHIF/Viewers/issues/1279)) ([4ea239a](https://github.com/OHIF/Viewers/commit/4ea239a9535ef297e23387c186e537ab273744ea)), closes [#1268](https://github.com/OHIF/Viewers/issues/1268)
+
+
+
+
+
+## [2.1.1](https://github.com/OHIF/Viewers/compare/@ohif/core@2.1.0...@ohif/core@2.1.1) (2019-12-16)
+
+**Note:** Version bump only for package @ohif/core
+
+
+
+
+
 # [2.1.0](https://github.com/OHIF/Viewers/compare/@ohif/core@2.0.2...@ohif/core@2.1.0) (2019-12-11)
 
 

platform/core/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ohif/core",
-  "version": "2.1.0",
+  "version": "2.4.1",
   "description": "Generic business logic for web-based medical imaging applications",
   "author": "OHIF Core Team",
   "license": "MIT",
@@ -32,13 +32,14 @@
   },
   "peerDependencies": {
     "cornerstone-core": "^2.2.8",
-    "cornerstone-tools": "^4.8.0",
+    "cornerstone-tools": "^4.12.0",
     "cornerstone-wado-image-loader": "^3.0.0",
     "dicom-parser": "^1.8.3"
   },
   "dependencies": {
     "@babel/runtime": "^7.5.5",
     "ajv": "^6.10.0",
+    "dcmjs": "^0.8.3",
     "dicomweb-client": "^0.5.2",
     "isomorphic-base64": "^1.0.2",
     "lodash.clonedeep": "^4.5.0",

platform/core/src/DICOMSR/dataExchange.js

@@ -1,5 +1,10 @@
-import { log, studies, utils } from '@ohif/core';
-import { retrieveMeasurementFromSR, stowSRFromMeasurements } from './handleStructuredReport';
+import log from '../log';
+import studies from '../studies';
+import utils from '../utils';
+import {
+  retrieveMeasurementFromSR,
+  stowSRFromMeasurements,
+} from './handleStructuredReport';
 import findMostRecentStructuredReport from './utils/findMostRecentStructuredReport';
 
 /**
@@ -65,7 +70,9 @@ const storeMeasurements = async (measurementData, filter, server) => {
       message: 'Measurements were saved with success',
     };
   } catch (error) {
-    log.error(`[DICOMSR] Error while saving the measurements: ${error.message}`);
+    log.error(
+      `[DICOMSR] Error while saving the measurements: ${error.message}`
+    );
     throw new Error('Error while saving the measurements.');
   }
 };

platform/core/src/DICOMSR/handleStructuredReport.js

@@ -1,11 +1,11 @@
 import * as dcmjs from 'dcmjs';
-import { DICOMWeb } from '@ohif/core';
+import { api } from 'dicomweb-client';
+
+import DICOMWeb from '../DICOMWeb';
 import parseDicomStructuredReport from './parseDicomStructuredReport';
 import parseMeasurementsData from './parseMeasurementsData';
 import getAllDisplaySets from './utils/getAllDisplaySets';
 
-import { api } from 'dicomweb-client';
-
 const VERSION_NAME = 'dcmjs-0.0';
 const TRANSFER_SYNTAX_UID = '1.2.840.10008.1.2.1';
 
@@ -34,7 +34,10 @@ const retrieveMeasurementFromSR = async (series, studies, serverUrl) => {
 
   const part10SRArrayBuffer = await dicomWeb.retrieveInstance(options);
   const displaySets = getAllDisplaySets(studies);
-  const measurementsData = parseDicomStructuredReport(part10SRArrayBuffer, displaySets);
+  const measurementsData = parseDicomStructuredReport(
+    part10SRArrayBuffer,
+    displaySets
+  );
 
   return measurementsData;
 };
@@ -47,13 +50,10 @@ const retrieveMeasurementFromSR = async (series, studies, serverUrl) => {
  * @returns {Promise}
  */
 const stowSRFromMeasurements = async (measurements, serverUrl) => {
-  const { dataset } = parseMeasurementsData(
-    measurements
-  );
+  const { dataset } = parseMeasurementsData(measurements);
   const { DicomMetaDictionary, DicomDict } = dcmjs.data;
   const meta = {
-    FileMetaInformationVersion:
-      dataset._meta.FileMetaInformationVersion.Value,
+    FileMetaInformationVersion: dataset._meta.FileMetaInformationVersion.Value,
     MediaStorageSOPClassUID: dataset.SOPClassUID,
     MediaStorageSOPInstanceUID: dataset.SOPInstanceUID,
     TransferSyntaxUID: TRANSFER_SYNTAX_UID,

platform/core/src/DICOMSR/parseDicomStructuredReport.js

@@ -1,4 +1,5 @@
 import * as dcmjs from 'dcmjs';
+
 import findInstanceMetadataBySopInstanceUid from './utils/findInstanceMetadataBySopInstanceUid';
 
 /**
@@ -37,7 +38,12 @@ const parseDicomStructuredReport = (part10SRArrayBuffer, displaySets) => {
       const { studyInstanceUid, patientId } = study;
       const { seriesInstanceUid } = series;
       const { sopInstanceUid, frameIndex } = measurement;
-      const imagePath = getImagePath(studyInstanceUid, seriesInstanceUid, sopInstanceUid, frameIndex);
+      const imagePath = getImagePath(
+        studyInstanceUid,
+        seriesInstanceUid,
+        sopInstanceUid,
+        frameIndex
+      );
 
       const imageId = instanceMetadata.getImageId();
       if (!imageId) {
@@ -75,8 +81,15 @@ const parseDicomStructuredReport = (part10SRArrayBuffer, displaySets) => {
  * @param {string} frameIndex
  * @returns
  */
-const getImagePath = (studyInstanceUid, seriesInstanceUid, sopInstanceUid, frameIndex) => {
-  return [studyInstanceUid, seriesInstanceUid, sopInstanceUid, frameIndex].join('_');
-}
+const getImagePath = (
+  studyInstanceUid,
+  seriesInstanceUid,
+  sopInstanceUid,
+  frameIndex
+) => {
+  return [studyInstanceUid, seriesInstanceUid, sopInstanceUid, frameIndex].join(
+    '_'
+  );
+};
 
 export default parseDicomStructuredReport;

platform/core/src/DICOMSR/parseMeasurementsData.js

@@ -1,6 +1,8 @@
 import * as dcmjs from 'dcmjs';
-import { log, measurements } from '@ohif/core';
 import cornerstone from 'cornerstone-core';
+
+import log from '../log';
+import measurements from '../measurements';
 import isToolSupported from './utils/isToolSupported';
 
 /**

platform/core/src/DICOMSR/utils/findInstanceMetadataBySopInstanceUid.js

@@ -11,7 +11,9 @@ const findInstanceMetadataBySopInstanceUid = (displaySets, sopInstanceUid) => {
   displaySets.find(displaySet => {
     if (!displaySet.images) return false;
 
-    instanceFound = displaySet.images.find(instanceMetadata => instanceMetadata._sopInstanceUID === sopInstanceUid);
+    instanceFound = displaySet.images.find(
+      instanceMetadata => instanceMetadata._sopInstanceUID === sopInstanceUid
+    );
 
     return !!instanceFound;
   });

platform/core/src/DICOMSR/utils/findMostRecentStructuredReport.js

@@ -4,15 +4,17 @@
  * @param {Array} studies
  * @returns {Object} Series
  */
-const findMostRecentStructuredReport = (studies) => {
+const findMostRecentStructuredReport = studies => {
   let mostRecentStructuredReport;
 
   studies.forEach(study => {
     const allSeries = study.getSeries ? study.getSeries() : [];
     allSeries.forEach(series => {
-
       if (isStructuredReportSeries(series)) {
-        if (!mostRecentStructuredReport || compareSeriesDate(series, mostRecentStructuredReport)) {
+        if (
+          !mostRecentStructuredReport ||
+          compareSeriesDate(series, mostRecentStructuredReport)
+        ) {
           mostRecentStructuredReport = series;
         }
       }
@@ -28,7 +30,7 @@ const findMostRecentStructuredReport = (studies) => {
  * @param {Object} series - Series metadata
  * @returns {boolean}
  */
-const isStructuredReportSeries = (series) => {
+const isStructuredReportSeries = series => {
   const supportedSopClassUIDs = [
     '1.2.840.10008.5.1.4.1.1.88.22',
     '1.2.840.10008.5.1.4.1.1.11.1',
@@ -38,7 +40,7 @@ const isStructuredReportSeries = (series) => {
   const sopClassUid = firstInstance._instance.sopClassUid;
 
   return supportedSopClassUIDs.includes(sopClassUid);
-}
+};
 
 /**
  *  Checkes if series1 is newer than series2
@@ -48,10 +50,11 @@ const isStructuredReportSeries = (series) => {
  * @returns {boolean} true/false if series1 is newer than series2
  */
 const compareSeriesDate = (series1, series2) => {
-  return series1._data.seriesDate > series2._data.seriesDate ||
+  return (
+    series1._data.seriesDate > series2._data.seriesDate ||
     (series1._data.seriesDate === series2._data.seriesDate &&
-      series1._data.seriesTime > series2._data.seriesTime);
-}
-
+      series1._data.seriesTime > series2._data.seriesTime)
+  );
+};
 
 export default findMostRecentStructuredReport;

platform/core/src/DICOMSR/utils/getAllDisplaySets.js

@@ -4,7 +4,7 @@
  * @param {Object} studies - List of studies loaded into the viewer
  * @returns {Object} List of DisplaySets
  */
-const getAllDisplaySets = (studies) => {
+const getAllDisplaySets = studies => {
   let allDisplaySets = [];
 
   studies.forEach(study => {

platform/core/src/__mocks__/log.js

@@ -1,4 +1,5 @@
 export default {
   warn: jest.fn(),
   error: jest.fn(),
+  info: jest.fn(),
 };

platform/core/src/classes/CommandsManager.js

@@ -161,7 +161,7 @@ export class CommandsManager {
       return;
     }
 
-    const { commandFn, storeContexts } = definition;
+    const { commandFn, storeContexts = [] } = definition;
     const definitionOptions = definition.options;
 
     let commandParams = {};

platform/core/src/classes/HotkeysManager.js

@@ -1,4 +1,4 @@
-import hotkeys from './hotkeys';
+import hotkeys from './../utils/hotkeys';
 import log from './../log.js';
 
 /**
@@ -11,7 +11,7 @@ import log from './../log.js';
  */
 
 export class HotkeysManager {
-  constructor(commandsManager) {
+  constructor(commandsManager, servicesManager) {
     this.hotkeyDefinitions = {};
     this.hotkeyDefaults = [];
     this.isEnabled = true;
@@ -22,9 +22,19 @@ export class HotkeysManager {
       );
     }
 
+    this._servicesManager = servicesManager;
     this._commandsManager = commandsManager;
   }
 
+  /**
+   * Exposes Mousetrap.js's `.record` method, added by the record plugin.
+   *
+   * @param {*} event
+   */
+  record(event) {
+    return hotkeys.record(event);
+  }
+
   /**
    * Disables all hotkeys. Hotkeys added while disabled will not listen for
    * input.
@@ -45,38 +55,57 @@ export class HotkeysManager {
   /**
    * Registers a list of hotkeydefinitions.
    *
-   * @param {HotkeyDefinition[] | Object} hotkeyDefinitions Contains hotkeys definitions
+   * @param {HotkeyDefinition[] | Object} [hotkeyDefinitions=[]] Contains hotkeys definitions
    */
-  setHotkeys(hotkeyDefinitions) {
-    const definitions = Array.isArray(hotkeyDefinitions)
-      ? [...hotkeyDefinitions]
-      : this._parseToArrayLike(hotkeyDefinitions);
+  setHotkeys(hotkeyDefinitions = []) {
+    try {
+      const definitions = this._getValidDefinitions(hotkeyDefinitions);
 
-    definitions.forEach(definition => this.registerHotkeys(definition));
+      definitions.forEach(definition => this.registerHotkeys(definition));
+    } catch (error) {
+      const { UINotificationService } = this._servicesManager.services;
+      UINotificationService.show({
+        title: 'Hotkeys Manager',
+        message: 'Erro while setting hotkeys',
+        type: 'error',
+      });
+    }
   }
 
   /**
    * Set default hotkey bindings. These
    * values are used in `this.restoreDefaultBindings`.
    *
-   * @param {HotkeyDefinition[] | Object} hotkeyDefinitions Contains hotkeys definitions
+   * @param {HotkeyDefinition[] | Object} [hotkeyDefinitions=[]] Contains hotkeys definitions
    */
-  setDefaultHotKeys(hotkeyDefinitions) {
+  setDefaultHotKeys(hotkeyDefinitions = []) {
+    const definitions = this._getValidDefinitions(hotkeyDefinitions);
+
+    this.hotkeyDefaults = definitions;
+  }
+
+  /**
+   * Take hotkey definitions that can be an array or object and make sure that it
+   * returns an array of hotkeys
+   *
+   * @param {HotkeyDefinition[] | Object} [hotkeyDefinitions=[]] Contains hotkeys definitions
+   */
+  _getValidDefinitions(hotkeyDefinitions) {
     const definitions = Array.isArray(hotkeyDefinitions)
       ? [...hotkeyDefinitions]
       : this._parseToArrayLike(hotkeyDefinitions);
 
-    this.hotkeyDefaults = definitions;
+    return definitions;
   }
 
   /**
    * It parses given object containing hotkeyDefinition to array like.
    * Each property of given object will be mapped to an object of an array. And its property name will be the value of a property named as commandName
    *
-   * @param {HotkeyDefinition[] | Object} hotkeyDefinitions Contains hotkeys definitions
+   * @param {HotkeyDefinition[] | Object} [hotkeyDefinitions={}] Contains hotkeys definitions
    * @returns {HotkeyDefinition[]}
    */
-  _parseToArrayLike(hotkeyDefinitionsObj) {
+  _parseToArrayLike(hotkeyDefinitionsObj = {}) {
     const copy = { ...hotkeyDefinitionsObj };
     return Object.entries(copy).map(entryValue =>
       this._parseToHotKeyObj(entryValue[0], entryValue[1])
@@ -127,11 +156,13 @@ export class HotkeysManager {
     if (previouslyRegisteredDefinition) {
       const previouslyRegisteredKeys = previouslyRegisteredDefinition.keys;
       this._unbindHotkeys(commandName, previouslyRegisteredKeys);
+      log.info(`Unbinding ${commandName} from ${previouslyRegisteredKeys}`);
     }
 
     // Set definition & bind
     this.hotkeyDefinitions[commandName] = { keys, label };
     this._bindHotkeys(commandName, keys);
+    log.info(`Binding ${commandName} to ${keys}`);
   }
 
   /**
@@ -167,12 +198,11 @@ export class HotkeysManager {
     }
 
     const isKeyArray = keys instanceof Array;
-    if (isKeyArray) {
-      keys.forEach(key => this._bindHotkeys(commandName, key));
-      return;
-    }
+    const combinedKeys = isKeyArray ? keys.join('+') : keys;
 
-    hotkeys.bind(keys, evt => {
+    hotkeys.bind(combinedKeys, evt => {
+      evt.preventDefault();
+      evt.stopPropagation();
       this._commandsManager.runCommand(commandName, { evt });
     });
   }
@@ -193,7 +223,8 @@ export class HotkeysManager {
 
     const isKeyArray = keys instanceof Array;
     if (isKeyArray) {
-      keys.forEach(key => this._unbindHotkeys(commandName, key));
+      const combinedKeys = keys.join('+');
+      this._unbindHotkeys(commandName, combinedKeys);
       return;
     }
 

platform/core/src/classes/HotkeysManager.test.js

@@ -1,10 +1,10 @@
 import CommandsManager from './CommandsManager.js';
 import HotkeysManager from './HotkeysManager.js';
-import hotkeys from './hotkeys';
+import hotkeys from './../utils/hotkeys';
 import log from './../log.js';
 
 jest.mock('./CommandsManager.js');
-jest.mock('./hotkeys');
+jest.mock('./../utils/hotkeys');
 jest.mock('./../log.js');
 
 describe('HotkeysManager', () => {
@@ -60,7 +60,10 @@ describe('HotkeysManager', () => {
   });
 
   describe('enable()', () => {
-    beforeEach(() => hotkeys.unpause.mockClear());
+    beforeEach(() => {
+      hotkeys.unpause = jest.fn();
+      hotkeys.unpause.mockClear();
+    });
 
     it('sets isEnabled property to true', () => {
       hotkeysManager.disable();
@@ -139,20 +142,18 @@ describe('HotkeysManager', () => {
         expectedHotkeyDefinition
       );
     });
-    it('calls hotkeys.bind for all keys in array', () => {
-      const definition = { commandName: 'dance', keys: ['h', 'e', 'l', 'o'] };
+    it('calls hotkeys.bind for the group of keys', () => {
+      const definition = { commandName: 'dance', keys: ['shift', 'e'] };
 
       hotkeysManager.registerHotkeys(definition);
 
-      expect(hotkeys.bind.mock.calls.length).toBe(definition.keys.length);
-      definition.keys.forEach((key, i) =>
-        expect(hotkeys.bind.mock.calls[i][0]).toBe(key)
-      );
+      expect(hotkeys.bind.mock.calls.length).toBe(1);
+      expect(hotkeys.bind.mock.calls[0][0]).toBe('shift+e');
     });
     it('calls hotkeys.unbind if commandName was previously registered, for each previously registered set of keys', () => {
       const firstDefinition = {
         commandName: 'dance',
-        keys: ['h', 'e', 'l', 'o'],
+        keys: ['alt', 'e'],
       };
       const secondDefinition = { commandName: 'dance', keys: 'a' };
 
@@ -161,12 +162,8 @@ describe('HotkeysManager', () => {
       // Second call
       hotkeysManager.registerHotkeys(secondDefinition);
 
-      expect(hotkeys.unbind.mock.calls.length).toBe(
-        firstDefinition.keys.length
-      );
-      firstDefinition.keys.forEach((key, i) =>
-        expect(hotkeys.unbind.mock.calls[i][0]).toBe(key)
-      );
+      expect(hotkeys.unbind.mock.calls.length).toBe(1);
+      expect(hotkeys.unbind.mock.calls[0][0]).toBe('alt+e');
     });
   });
 

platform/core/src/classes/hotkeys/index.js

@@ -1,17 +0,0 @@
-// Only imported in environment w/ `window`
-// So we need to mock these for tests
-import Mousetrap from 'mousetrap';
-import pausePlugin from 'mousetrap/plugins/pause/mousetrap-pause.js';
-import recordPlugin from 'mousetrap/plugins/record/mousetrap-record.js';
-
-// import pausePlugin from './pausePlugin.js';
-// import recordPlugin from './recordPlugin.js';
-
-// // // TODO: May need to bind these so Mousetrap = this in plugins;
-// pausePlugin(Mousetrap);
-// recordPlugin(Mousetrap);
-
-// console.log(Mousetrap);
-// console.log(Object.keys(Mousetrap));
-
-export default Mousetrap;

platform/core/src/extensions/ExtensionManager.js

@@ -2,13 +2,14 @@ import MODULE_TYPES from './MODULE_TYPES.js';
 import log from './../log.js';
 
 export default class ExtensionManager {
-  constructor({ commandsManager, servicesManager }) {
+  constructor({ commandsManager, servicesManager, appConfig = {} }) {
     this.modules = {};
     this.registeredExtensionIds = [];
     this.moduleTypeNames = Object.values(MODULE_TYPES);
     //
     this._commandsManager = commandsManager;
     this._servicesManager = servicesManager;
+    this._appConfig = appConfig;
 
     this.moduleTypeNames.forEach(moduleType => {
       this.modules[moduleType] = [];
@@ -70,6 +71,7 @@ export default class ExtensionManager {
       extension.preRegistration({
         servicesManager: this._servicesManager,
         commandsManager: this._commandsManager,
+        appConfig: this._appConfig,
         configuration,
       });
     }
@@ -79,7 +81,8 @@ export default class ExtensionManager {
       const extensionModule = this._getExtensionModule(
         moduleType,
         extension,
-        extensionId
+        extensionId,
+        configuration
       );
 
       if (extensionModule) {
@@ -102,7 +105,7 @@ export default class ExtensionManager {
    * @param {Object} extension
    * @param {string} extensionId - Used for logging warnings
    */
-  _getExtensionModule(moduleType, extension, extensionId) {
+  _getExtensionModule(moduleType, extension, extensionId, configuration) {
     const getModuleFnName = 'get' + _capitalizeFirstCharacter(moduleType);
     const getModuleFn = extension[getModuleFnName];
 
@@ -114,6 +117,8 @@ export default class ExtensionManager {
       const extensionModule = getModuleFn({
         servicesManager: this._servicesManager,
         commandsManager: this._commandsManager,
+        appConfig: this._appConfig,
+        configuration,
       });
 
       if (!extensionModule) {

platform/core/src/extensions/ExtensionManager.test.js

@@ -6,7 +6,7 @@ import log from './../log.js';
 jest.mock('./../log.js');
 
 describe('ExtensionManager.js', () => {
-  let extensionManager, commandsManager;
+  let extensionManager, commandsManager, servicesManager, appConfig;
 
   beforeEach(() => {
     commandsManager = {
@@ -14,7 +14,17 @@ describe('ExtensionManager.js', () => {
       getContext: jest.fn(),
       registerCommand: jest.fn(),
     };
-    extensionManager = new ExtensionManager({ commandsManager });
+    servicesManager = {
+      registerService: jest.fn(),
+    };
+    appConfig = {
+      testing: true,
+    };
+    extensionManager = new ExtensionManager({
+      servicesManager,
+      commandsManager,
+      appConfig,
+    });
     log.warn.mockClear();
     jest.clearAllMocks();
   });
@@ -51,7 +61,7 @@ describe('ExtensionManager.js', () => {
       extensionManager.registerExtensions(fakeExtensions);
 
       // Assert
-      expect(extensionManager.registerExtension.mock.calls[1]).toContain(
+      expect(extensionManager.registerExtension.mock.calls[1][1]).toEqual(
         fakeConfiguration
       );
     });
@@ -67,19 +77,19 @@ describe('ExtensionManager.js', () => {
       expect(fakeExtension.preRegistration.mock.calls.length).toBe(1);
     });
 
-    it('calls preRegistration() passing configuration along with servicesManager and commandsManager instances for extension', () => {
-      const configuration = { config: 'Some configuration' };
-      extensionManager._servicesManager = { services: { TestService: {} } };
+    it('calls preRegistration() passing dependencies and extension configuration to extension', () => {
+      const extensionConfiguration = { config: 'Some configuration' };
 
       // SUT
-      const fakeExtension = { one: '1', preRegistration: jest.fn() };
-      extensionManager.registerExtension(fakeExtension, configuration);
+      const extension = { one: '1', preRegistration: jest.fn() };
+      extensionManager.registerExtension(extension, extensionConfiguration);
 
       // Assert
-      expect(fakeExtension.preRegistration.mock.calls[0][0]).toEqual({
-        servicesManager: extensionManager._servicesManager,
-        commandsManager: extensionManager._commandsManager,
-        configuration,
+      expect(extension.preRegistration.mock.calls[0][0]).toEqual({
+        servicesManager,
+        commandsManager,
+        appConfig,
+        configuration: extensionConfiguration,
       });
     });
 
@@ -153,8 +163,8 @@ describe('ExtensionManager.js', () => {
       );
     });
 
-    it('successfully passes a servicesManager and commandsManager instances to each module', () => {
-      extensionManager._servicesManager = { services: { TestService: {} } };
+    it('successfully passes dependencies to each module along with extension configuration', () => {
+      const extensionConfiguration = { testing: true };
 
       const extension = {
         id: 'hello-world',
@@ -165,11 +175,17 @@ describe('ExtensionManager.js', () => {
         getCommandsModule: jest.fn(),
       };
 
-      extensionManager.registerExtension(extension);
+      extensionManager.registerExtension(extension, extensionConfiguration);
 
-      expect(extension.getViewportModule.mock.calls[0][0]).toEqual({
-        servicesManager: extensionManager._servicesManager,
-        commandsManager: extensionManager._commandsManager,
+      Object.keys(extension).forEach(module => {
+        if (typeof extension[module] === 'function') {
+          expect(extension[module].mock.calls[0][0]).toEqual({
+            servicesManager,
+            commandsManager,
+            appConfig,
+            configuration: extensionConfiguration,
+          });
+        }
       });
     });
 
@@ -210,7 +226,7 @@ describe('ExtensionManager.js', () => {
           return {
             definitions: {
               exampleDefinition: {
-                commandFn: () => {},
+                commandFn: () => { },
                 storeContexts: [],
                 options: {},
               },

platform/core/src/index.js

@@ -5,6 +5,7 @@ import { ServicesManager } from './services';
 import classes, { CommandsManager, HotkeysManager } from './classes/';
 
 import DICOMWeb from './DICOMWeb';
+import DICOMSR from './DICOMSR';
 import cornerstone from './cornerstone.js';
 import hangingProtocols from './hanging-protocols';
 import header from './header.js';
@@ -17,14 +18,13 @@ import string from './string.js';
 import studies from './studies/';
 import ui from './ui';
 import user from './user.js';
-import utils from './utils/';
+import utils, { hotkeys } from './utils/';
 
 import {
   UINotificationService,
   UIModalService,
   UIDialogService,
-  UIContextMenuService,
-  UILabellingFlowService,
+  MeasurementService,
 } from './services';
 
 const OHIF = {
@@ -36,6 +36,7 @@ const OHIF = {
   ServicesManager,
   //
   utils,
+  hotkeys,
   studies,
   redux,
   classes,
@@ -48,6 +49,7 @@ const OHIF = {
   object,
   log,
   DICOMWeb,
+  DICOMSR,
   viewer: {},
   measurements,
   hangingProtocols,
@@ -55,8 +57,7 @@ const OHIF = {
   UINotificationService,
   UIModalService,
   UIDialogService,
-  UIContextMenuService,
-  UILabellingFlowService,
+  MeasurementService,
 };
 
 export {
@@ -68,6 +69,7 @@ export {
   ServicesManager,
   //
   utils,
+  hotkeys,
   studies,
   redux,
   classes,
@@ -80,14 +82,14 @@ export {
   object,
   log,
   DICOMWeb,
+  DICOMSR,
   measurements,
   hangingProtocols,
   //
   UINotificationService,
   UIModalService,
   UIDialogService,
-  UIContextMenuService,
-  UILabellingFlowService,
+  MeasurementService,
 };
 
 export { OHIF };

platform/core/src/index.test.js

@@ -13,10 +13,10 @@ describe('Top level exports', () => {
       'UINotificationService',
       'UIModalService',
       'UIDialogService',
-      'UIContextMenuService',
-      'UILabellingFlowService',
+      'MeasurementService',
       //
       'utils',
+      'hotkeys',
       'studies',
       'redux',
       'classes',
@@ -30,6 +30,7 @@ describe('Top level exports', () => {
       'object',
       'log',
       'DICOMWeb',
+      'DICOMSR',
       'OHIF', //
       'measurements',
       'hangingProtocols',

platform/core/src/measurements/tools/angle.js

@@ -1,6 +1,6 @@
 const displayFunction = data => {
   let text = '';
-  if (data.rAngle) {
+  if (data.rAngle && !isNaN(data.rAngle)) {
     text = data.rAngle.toFixed(2) + String.fromCharCode(parseInt('00B0', 16));
   }
   return text;

platform/core/src/measurements/tools/circleRoi.js

@@ -1,7 +1,7 @@
 const displayFunction = data => {
   let meanValue = '';
   const { cachedStats } = data;
-  if (cachedStats && cachedStats.mean) {
+  if (cachedStats && cachedStats.mean && !isNaN(cachedStats.mean)) {
     meanValue = cachedStats.mean.toFixed(2) + ' HU';
   }
   return meanValue;

platform/core/src/measurements/tools/ellipticalRoi.js

@@ -1,7 +1,7 @@
 const displayFunction = data => {
   let meanValue = '';
   const { cachedStats } = data;
-  if (cachedStats && cachedStats.mean) {
+  if (cachedStats && cachedStats.mean && !isNaN(cachedStats.mean)) {
     meanValue = cachedStats.mean.toFixed(2) + ' HU';
   }
   return meanValue;

platform/core/src/measurements/tools/freehandMouse.js

@@ -1,6 +1,6 @@
 const displayFunction = data => {
   let meanValue = '';
-  if (data.meanStdDev && data.meanStdDev.mean) {
+  if (data.meanStdDev && data.meanStdDev.mean && !isNaN(data.meanStdDev.mean)) {
     meanValue = data.meanStdDev.mean.toFixed(2) + ' HU';
   }
   return meanValue;

platform/core/src/measurements/tools/length.js

@@ -1,6 +1,6 @@
 const displayFunction = data => {
   let lengthValue = '';
-  if (data.length) {
+  if (data.length && !isNaN(data.length)) {
     lengthValue = data.length.toFixed(2) + ' mm';
   }
   return lengthValue;

platform/core/src/measurements/tools/rectangleRoi.js

@@ -1,7 +1,7 @@
 const displayFunction = data => {
   let meanValue = '';
   const { cachedStats } = data;
-  if (cachedStats && cachedStats.mean) {
+  if (cachedStats && cachedStats.mean && !isNaN(cachedStats.mean)) {
     meanValue = cachedStats.mean.toFixed(2) + ' HU';
   }
   return meanValue;

platform/core/src/redux/reducers/preferences.js

@@ -1,12 +1,6 @@
 import cloneDeep from 'lodash.clonedeep';
 
 const defaultState = {
-  // First tab
-  hotkeyDefinitions: [
-    // commandName, label, keys
-    // [{ zoom: { label: 'Zoom', keys: ['z'] }}]
-  ],
-  // Second tab
   windowLevelData: {
     // order, description, window (int), level (int)
     // 0: { description: 'Soft tissue', window: '', level: '' },

platform/core/src/redux/reducers/servers.js

@@ -11,6 +11,16 @@ const servers = (state = defaultState, action) => {
       servers.forEach(s => (s.active = true));
       return { ...state, servers };
 
+    case 'ACTIVATE_SERVER': {
+      const newServer = { ...action.server, active: true };
+      const newServers = state.servers;
+      newServers.forEach(s => (s.active = false));
+      return {
+        ...state,
+        servers: uniqBy([...newServers, newServer], 'wadoRoot'),
+      };
+    }
+
     case 'SET_SERVERS':
       return { ...state, servers: action.servers };
 

platform/core/src/redux/reducers/viewports.js

@@ -11,20 +11,63 @@ import {
   SET_VIEWPORT_LAYOUT_AND_DATA,
 } from './../constants/ActionTypes.js';
 
-const DEFAULT_STATE = {
+export const DEFAULT_STATE = {
   numRows: 1,
   numColumns: 1,
   activeViewportIndex: 0,
   layout: {
-    viewports: [
-      {
-        // plugin: 'cornerstone',
-      },
-    ],
+    viewports: [{}],
   },
   viewportSpecificData: {},
 };
 
+/**
+ *  Take the new number of rows and columns, delete all not used viewport data and also set
+ *  active viewport as default in case current one is not available anymore.
+ *
+ * @param {Number} numRows
+ * @param {Number} numColumns
+ * @param {Object} currentViewportSpecificData
+ * @returns
+ */
+const findActiveViewportSpecificData = (
+  numRows,
+  numColumns,
+  currentViewportSpecificData = {}
+) => {
+  const numberOfViewports = numRows * numColumns;
+  const viewportSpecificData = cloneDeep(currentViewportSpecificData);
+
+  if (numberOfViewports < Object.keys(viewportSpecificData).length) {
+    Object.keys(viewportSpecificData).forEach(key => {
+      if (key > numberOfViewports - 1) {
+        delete viewportSpecificData[key];
+      }
+    });
+  }
+
+  return viewportSpecificData;
+};
+/**
+ *  Take new number of rows and columns and make sure the current active viewport index is still available, if not, return the default
+ *
+ * @param {Number} numRows
+ * @param {Number} numColumns
+ * @param {Number} currentActiveViewportIndex
+ * @returns
+ */
+const getActiveViewportIndex = (
+  numRows,
+  numColumns,
+  currentActiveViewportIndex
+) => {
+  const numberOfViewports = numRows * numColumns;
+
+  return currentActiveViewportIndex > numberOfViewports - 1
+    ? DEFAULT_STATE.activeViewportIndex
+    : currentActiveViewportIndex;
+};
+
 /**
  * The definition of a viewport action.
  *
@@ -50,7 +93,12 @@ const viewports = (state = DEFAULT_STATE, action) => {
      * @return {Object} New state.
      */
     case SET_VIEWPORT_ACTIVE: {
-      return { ...state, activeViewportIndex: action.viewportIndex };
+      const activeViewportIndex = getActiveViewportIndex(
+        state.numRows,
+        state.numColumns,
+        action.viewportIndex
+      );
+      return { ...state, activeViewportIndex };
     }
 
     /**
@@ -59,11 +107,25 @@ const viewports = (state = DEFAULT_STATE, action) => {
      * @return {Object} New state.
      */
     case SET_VIEWPORT_LAYOUT: {
+      const { numRows, numColumns } = action;
+      const viewportSpecificData = findActiveViewportSpecificData(
+        numRows,
+        numColumns,
+        state.viewportSpecificData
+      );
+      const activeViewportIndex = getActiveViewportIndex(
+        numRows,
+        numColumns,
+        state.activeViewportIndex
+      );
+
       return {
         ...state,
         numRows: action.numRows,
         numColumns: action.numColumns,
         layout: { viewports: [...action.viewports] },
+        viewportSpecificData,
+        activeViewportIndex,
       };
     }
 
@@ -73,12 +135,25 @@ const viewports = (state = DEFAULT_STATE, action) => {
      * @return {Object} New state.
      */
     case SET_VIEWPORT_LAYOUT_AND_DATA: {
+      const { numRows, numColumns } = action;
+      const viewportSpecificData = findActiveViewportSpecificData(
+        numRows,
+        numColumns,
+        action.viewportSpecificData
+      );
+      const activeViewportIndex = getActiveViewportIndex(
+        numRows,
+        numColumns,
+        state.activeViewportIndex
+      );
+
       return {
         ...state,
         numRows: action.numRows,
         numColumns: action.numColumns,
         layout: { viewports: [...action.viewports] },
-        viewportSpecificData: cloneDeep(action.viewportSpecificData),
+        viewportSpecificData,
+        activeViewportIndex,
       };
     }
 

platform/core/src/redux/reducers/viewports.test.js

@@ -1,35 +1,61 @@
-// https://medium.com/@netxm/testing-redux-reducers-with-jest-6653abbfe3e1
-import reducer from './viewports.js';
+import { Reducer } from 'redux-testkit';
+
+import reducer, { DEFAULT_STATE } from './viewports.js';
 import * as types from './../constants/ActionTypes.js';
 
 describe('viewports reducer', () => {
   it('should return the initial state', () => {
-    expect(reducer(undefined, {})).toEqual({
-      activeViewportIndex: 0,
-      numRows: 1,
-      numColumns: 1,
-      layout: {
-        viewports: [{}],
-      },
-      viewportSpecificData: {},
-    });
+    expect(reducer(undefined, {})).toEqual(DEFAULT_STATE);
   });
 
-  it('should handle SET_VIEWPORT_ACTIVE', () => {
-    const setViewportActiveAction = {
+  it('should handle SET_VIEWPORT_ACTIVE with inexistent viewport index', () => {
+    const initialState = {
+      numRows: 4,
+      numColumns: 4,
+      activeViewportIndex: 0,
+    };
+
+    const action = {
       type: types.SET_VIEWPORT_ACTIVE,
       viewportIndex: 100,
     };
 
-    const updatedState = reducer({}, setViewportActiveAction);
+    const expectedToChangeInState = {
+      activeViewportIndex: 0,
+    };
 
-    expect(updatedState.activeViewportIndex).toEqual(
-      setViewportActiveAction.viewportIndex
-    );
+    Reducer(reducer)
+      .withState(initialState)
+      .expect(action)
+      .toChangeInState(expectedToChangeInState);
+  });
+
+  it('should handle SET_VIEWPORT_ACTIVE with existent viewport index', () => {
+    const initialState = {
+      numRows: 4,
+      numColumns: 4,
+      activeViewportIndex: 0,
+    };
+
+    const action = {
+      type: types.SET_VIEWPORT_ACTIVE,
+      viewportIndex: 5,
+    };
+
+    const expectedToChangeInState = {
+      activeViewportIndex: 5,
+    };
+
+    Reducer(reducer)
+      .withState(initialState)
+      .expect(action)
+      .toChangeInState(expectedToChangeInState);
   });
 
   it('should handle SET_VIEWPORT_LAYOUT', () => {
-    const setViewportLayoutAction = {
+    const initialState = DEFAULT_STATE;
+
+    const action = {
       type: types.SET_VIEWPORT_LAYOUT,
       numRows: 1,
       numColumns: 2,
@@ -43,18 +69,193 @@ describe('viewports reducer', () => {
       ],
     };
 
-    const updatedState = reducer({}, setViewportLayoutAction);
+    const expectedToChangeInState = {
+      numRows: 1,
+      numColumns: 2,
+      layout: {
+        viewports: [
+          {
+            plugin: 'cornerstone',
+          },
+          {
+            plugin: 'vtk',
+          },
+        ],
+      },
+    };
 
-    expect(updatedState.numRows).toEqual(setViewportLayoutAction.numRows);
-    expect(updatedState.numColumns).toEqual(setViewportLayoutAction.numColumns);
-    expect(updatedState.layout.viewports).toEqual(
-      setViewportLayoutAction.viewports
-    );
+    Reducer(reducer)
+      .withState(initialState)
+      .expect(action)
+      .toChangeInState(expectedToChangeInState);
+  });
+
+  it('should handle SET_VIEWPORT_LAYOUT when we reduce the number of viewports', () => {
+    const initialState = {
+      numRows: 1,
+      numColumns: 2,
+      viewportSpecificData: {
+        0: { viewportData0: 'viewportData0' },
+        1: { viewportData1: 'viewportData1' },
+      },
+      layout: {
+        viewports: [],
+      },
+      activeViewportIndex: 0,
+    };
+
+    const action = {
+      type: types.SET_VIEWPORT_LAYOUT,
+      numRows: 1,
+      numColumns: 1,
+      viewports: [],
+    };
+
+    const expectedState = {
+      numRows: 1,
+      numColumns: 1,
+      viewportSpecificData: {
+        0: { viewportData0: 'viewportData0' },
+      },
+      layout: {
+        viewports: [],
+      },
+      activeViewportIndex: 0,
+    };
+
+    Reducer(reducer)
+      .withState(initialState)
+      .expect(action)
+      .toReturnState(expectedState);
+  });
+
+  it('should handle SET_VIEWPORT_LAYOUT_AND_DATA', () => {
+    const initialState = {
+      numRows: 1,
+      numColumns: 1,
+      viewportSpecificData: {
+        0: { viewportData0: 'data0' },
+      },
+      layout: {
+        viewports: [{ plugin: 'cornerstone' }],
+      },
+      activeViewportIndex: 0,
+    };
+
+    const action = {
+      type: types.SET_VIEWPORT_LAYOUT_AND_DATA,
+      numRows: 1,
+      numColumns: 2,
+      viewports: [{ plugin: 'cornerstone' }, { plugin: 'cornerstone' }],
+      viewportSpecificData: {
+        0: { viewportData0: 'NEWdata0' },
+        1: { viewportData1: 'NEWdata1' },
+      },
+    };
+
+    const expectedState = {
+      numRows: 1,
+      numColumns: 2,
+      viewportSpecificData: {
+        0: { viewportData0: 'NEWdata0' },
+        1: { viewportData1: 'NEWdata1' },
+      },
+      layout: {
+        viewports: [{ plugin: 'cornerstone' }, { plugin: 'cornerstone' }],
+      },
+      activeViewportIndex: 0,
+    };
+
+    Reducer(reducer)
+      .withState(initialState)
+      .expect(action)
+      .toReturnState(expectedState);
+  });
+
+  it('should handle SET_VIEWPORT_LAYOUT_AND_DATA when we reduce the number of viewports', () => {
+    const initialState = {
+      numRows: 1,
+      numColumns: 3,
+      viewportSpecificData: {
+        0: { viewportData0: 'vtkData0' },
+        1: { viewportData1: 'vtkData1' },
+        2: { viewportData2: 'vtkData2' },
+      },
+      layout: {
+        viewports: [{ plugin: 'vtk' }, { plugin: 'vtk' }, { plugin: 'vtk' }],
+      },
+      activeViewportIndex: 0,
+    };
+
+    const action = {
+      type: types.SET_VIEWPORT_LAYOUT_AND_DATA,
+      numRows: 1,
+      numColumns: 1,
+      viewports: [{ plugin: 'cornerstone' }],
+      viewportSpecificData: {
+        0: { viewportData0: 'cornerstoneData0' },
+      },
+    };
+
+    const expectedState = {
+      numRows: 1,
+      numColumns: 1,
+      viewportSpecificData: {
+        0: { viewportData0: 'cornerstoneData0' },
+      },
+      layout: {
+        viewports: [{ plugin: 'cornerstone' }],
+      },
+      activeViewportIndex: 0,
+    };
+
+    Reducer(reducer)
+      .withState(initialState)
+      .expect(action)
+      .toReturnState(expectedState);
+  });
+
+  it('should handle SET_VIEWPORT when we only set one viewport specific data', () => {
+    const initialState = {
+      numRows: 1,
+      numColumns: 2,
+      viewportSpecificData: {
+        0: { viewportData0: 'data0' },
+        1: { viewportData1: 'data1' },
+      },
+      layout: {
+        viewports: [{ plugin: 'cornerstone' }, { plugin: 'cornerstone' }],
+      },
+      activeViewportIndex: 0,
+    };
+
+    const action = {
+      type: types.SET_VIEWPORT,
+      viewportIndex: 1,
+      viewportSpecificData: {
+        viewportData1: 'NEWdata1',
+      },
+    };
+
+    const expectedState = {
+      numRows: 1,
+      numColumns: 2,
+      viewportSpecificData: {
+        0: { viewportData0: 'data0' },
+        1: { viewportData1: 'NEWdata1' },
+      },
+      layout: {
+        viewports: [{ plugin: 'cornerstone' }, { plugin: 'cornerstone' }],
+      },
+      activeViewportIndex: 0,
+    };
+
+    Reducer(reducer)
+      .withState(initialState)
+      .expect(action)
+      .toReturnState(expectedState);
   });
 
-  // If there were previous keys, this would have
-  // "merge" behavior, not a clear & set
-  // May be worth another test?
   it('should handle SET_VIEWPORT', () => {
     const viewportToSet = 0;
     const setViewportAction = {

platform/core/src/services/MeasurementService/MeasurementService.js

@@ -0,0 +1,481 @@
+import log from '../../log';
+import guid from '../../utils/guid';
+
+/**
+ * Measurement source schema
+ *
+ * @typedef {Object} MeasurementSource
+ * @property {number} id -
+ * @property {string} name -
+ * @property {string} version -
+ */
+
+/**
+ * Measurement schema
+ *
+ * @typedef {Object} Measurement
+ * @property {number} id -
+ * @property {string} sopInstanceUID -
+ * @property {string} frameOfReferenceUID -
+ * @property {string} referenceSeriesUID -
+ * @property {string} label -
+ * @property {string} description -
+ * @property {string} type -
+ * @property {string} unit -
+ * @property {number} area -
+ * @property {Array} points -
+ * @property {MeasurementSource} source -
+ */
+
+/* Measurement schema keys for object validation. */
+const MEASUREMENT_SCHEMA_KEYS = [
+  'id',
+  'sopInstanceUID',
+  'frameOfReferenceUID',
+  'referenceSeriesUID',
+  'label',
+  'description',
+  'type',
+  'unit',
+  'area', // TODO: Add concept names instead (descriptor)
+  'points',
+  'source',
+];
+
+const EVENTS = {
+  MEASUREMENT_UPDATED: 'event::measurement_updated',
+  MEASUREMENT_ADDED: 'event::measurement_added',
+};
+
+const VALUE_TYPES = {
+  POLYLINE: 'value_type::polyline',
+  POINT: 'value_type::point',
+  ELLIPSE: 'value_type::ellipse',
+  MULTIPOINT: 'value_type::multipoint',
+  CIRCLE: 'value_type::circle',
+};
+
+class MeasurementService {
+  constructor() {
+    this.sources = {};
+    this.mappings = {};
+    this.measurements = {};
+    this.listeners = {};
+    Object.defineProperty(this, 'EVENTS', {
+      value: EVENTS,
+      writable: false,
+      enumerable: true,
+      configurable: false,
+    });
+    Object.defineProperty(this, 'VALUE_TYPES', {
+      value: VALUE_TYPES,
+      writable: false,
+      enumerable: true,
+      configurable: false,
+    });
+  }
+
+  /**
+   * Get all measurements.
+   *
+   * @return {Measurement[]} Array of measurements
+   */
+  getMeasurements() {
+    const measurements = this._arrayOfObjects(this.measurements);
+    return (
+      measurements &&
+      measurements.map(m => this.measurements[Object.keys(m)[0]])
+    );
+  }
+
+  /**
+   * Get specific measurement by its id.
+   *
+   * @param {string} id If of the measurement
+   * @return {Measurement} Measurement instance
+   */
+  getMeasurement(id) {
+    let measurement = null;
+    const measurements = this.measurements[id];
+
+    if (measurements && Object.keys(measurements).length > 0) {
+      measurement = this.measurements[id];
+    }
+
+    return measurement;
+  }
+
+  /**
+   * Create a new source.
+   *
+   * @param {string} name Name of the source
+   * @param {string} version Source name
+   * @return {MeasurementSource} Measurement source instance
+   */
+  createSource(name, version) {
+    if (!name) {
+      log.warn('Source name not provided. Exiting early.');
+      return;
+    }
+
+    if (!version) {
+      log.warn('Source version not provided. Exiting early.');
+      return;
+    }
+
+    const id = guid();
+    const source = {
+      id,
+      name,
+      version,
+    };
+    source.addOrUpdate = (definition, measurement) => {
+      return this.addOrUpdate(source, definition, measurement);
+    };
+    source.getAnnotation = (definition, measurementId) => {
+      return this.getAnnotation(source, definition, measurementId);
+    };
+
+    log.info(`New '${name}@${version}' source added.`);
+    this.sources[id] = source;
+
+    return source;
+  }
+
+  /**
+   * Add a new measurement matching criteria along with mapping functions.
+   *
+   * @param {MeasurementSource} source Measurement source instance
+   * @param {string} definition Definition of the measurement (Annotation Type)
+   * @param {MatchingCriteria} matchingCriteria The matching criteria
+   * @param {Function} toSourceSchema Mapping function to source schema
+   * @param {Function} toMeasurementSchema Mapping function to measurement schema
+   * @return void
+   */
+  addMapping(
+    source,
+    definition,
+    matchingCriteria,
+    toSourceSchema,
+    toMeasurementSchema
+  ) {
+    if (!this._isValidSource(source)) {
+      log.warn('Invalid source. Exiting early.');
+      return;
+    }
+
+    if (!matchingCriteria) {
+      log.warn('Matching criteria not provided. Exiting early.');
+      return;
+    }
+
+    if (!definition) {
+      log.warn('Definition not provided. Exiting early.');
+      return;
+    }
+
+    if (!toSourceSchema) {
+      log.warn('Source mapping function not provided. Exiting early.');
+      return;
+    }
+
+    if (!toMeasurementSchema) {
+      log.warn('Measurement mapping function not provided. Exiting early.');
+      return;
+    }
+
+    const mapping = {
+      matchingCriteria,
+      definition,
+      toSourceSchema,
+      toMeasurementSchema,
+    };
+
+    if (Array.isArray(this.mappings[source.id])) {
+      this.mappings[source.id].push(mapping);
+    } else {
+      this.mappings[source.id] = [mapping];
+    }
+
+    log.info(`New measurement mapping added to source '${this._getSourceInfo(source)}'.`);
+  }
+
+  /**
+   * Get annotation for specific source.
+   *
+   * @param {MeasurementSource} source Measurement source instance
+   * @param {string} definition The source definition
+   * @param {string} measurementId The measurement service measurement id
+   * @return {Object} Source measurement schema
+   */
+  getAnnotation(source, definition, measurementId) {
+    if (!this._isValidSource(source)) {
+      log.warn('Invalid source. Exiting early.');
+      return;
+    }
+
+    if (!definition) {
+      log.warn('No source definition provided. Exiting early.');
+      return;
+    }
+
+    const mapping = this._getMappingByMeasurementSource(measurementId, definition);
+    if (mapping) return mapping.toSourceSchema(measurement, definition);
+
+    const measurement = this.getMeasurement(measurementId);
+    const matchingMapping = this._getMatchingMapping(source, definition, measurement);
+
+    if (matchingMapping) {
+      log.info('Matching mapping found:', matchingMapping);
+      const { toSourceSchema, definition } = matchingMapping;
+      return toSourceSchema(measurement, definition);
+    }
+  }
+
+  /**
+   * Adds or update persisted measurements.
+   *
+   * @param {MeasurementSource} source The measurement source instance
+   * @param {string} definition The source definition
+   * @param {Measurement} measurement The source measurement
+   * @return {string} A measurement id
+   */
+  addOrUpdate(source, definition, sourceMeasurement) {
+    if (!this._isValidSource(source)) {
+      log.warn('Invalid source. Exiting early.');
+      return;
+    }
+
+    const sourceInfo = this._getSourceInfo(source);
+
+    if (!definition) {
+      log.warn('No source definition provided. Exiting early.');
+      return;
+    }
+
+    if (!this._sourceHasMappings(source)) {
+      log.warn(`No measurement mappings found for '${sourceInfo}' source. Exiting early.`);
+      return;
+    }
+
+    let measurement = {};
+    try {
+      const sourceMappings = this.mappings[source.id];
+      const { toMeasurementSchema } = sourceMappings.find(
+        mapping => mapping.definition === definition
+      );
+
+      /* Convert measurement */
+      measurement = toMeasurementSchema(sourceMeasurement);
+
+      /* Assign measurement source instance */
+      measurement.source = source;
+    } catch (error) {
+      log.error(`Failed to map '${sourceInfo}' measurement for definition ${definition}:`, error.message);
+      return;
+    }
+
+    if (!this._isValidMeasurement(measurement)) {
+      log.warn(
+        `Attempting to add or update a invalid measurement provided by '${sourceInfo}'. Exiting early.`
+      );
+      return;
+    }
+
+    let internalId = sourceMeasurement.id;
+    if (!internalId) {
+      internalId = guid();
+      log.warn(`Measurement ID not found. Generating UID: ${internalId}`);
+    }
+
+    const newMeasurement = {
+      ...measurement,
+      modifiedTimestamp: Math.floor(Date.now() / 1000),
+      id: internalId,
+    };
+
+    if (this.measurements[internalId]) {
+      log.info(`Measurement already defined. Updating measurement.`, newMeasurement);
+      this.measurements[internalId] = newMeasurement;
+      this._broadcastChange(this.EVENTS.MEASUREMENT_UPDATED, source, newMeasurement);
+    } else {
+      log.info(`Measurement added.`, newMeasurement);
+      this.measurements[internalId] = newMeasurement;
+      this._broadcastChange(this.EVENTS.MEASUREMENT_ADDED, source, newMeasurement);
+    }
+
+    return newMeasurement.id;
+  }
+
+  /**
+   * Subscribe to measurement updates.
+   *
+   * @param {string} eventName The name of the event
+   * @param {Function} callback Events callback
+   * @return {Object} Observable object with actions
+   */
+  subscribe(eventName, callback) {
+    if (this._isValidEvent(eventName)) {
+      const listenerId = guid();
+      const subscription = { id: listenerId, callback };
+
+      console.info(`Subscribing to '${eventName}'.`);
+      if (Array.isArray(this.listeners[eventName])) {
+        this.listeners[eventName].push(subscription);
+      } else {
+        this.listeners[eventName] = [subscription];
+      }
+
+      return {
+        unsubscribe: () => this._unsubscribe(eventName, listenerId),
+      };
+    } else {
+      throw new Error(`Event ${eventName} not supported.`);
+    }
+  }
+
+  _getMappingByMeasurementSource(measurementId, definition) {
+    const measurement = this.getMeasurement(measurementId);
+    if (this._isValidSource(measurement.source)) {
+      return this.mappings[measurement.source.id].find(
+        m => m.definition === definition
+      );
+    }
+  }
+
+  /**
+   * Get measurement mapping function if matching criteria.
+   *
+   * @param {MeasurementSource} source Measurement source instance
+   * @param {string} definition The source definition
+   * @param {string} measurement The measurement serice measurement
+   * @return {Object} The mapping based on matched criteria
+   */
+  _getMatchingMapping(source, definition, measurement) {
+    const sourceMappings = this.mappings[source.id];
+
+    const sourceMappingsByDefinition = sourceMappings.filter(
+      mapping => mapping.definition === definition
+    );
+
+    /* Criteria Matching */
+    return sourceMappingsByDefinition.find(({ matchingCriteria }) => {
+      return (
+        measurement.points &&
+        measurement.points.length === matchingCriteria.points
+      );
+    });
+  }
+
+  /**
+   * Returns formatted string with source info.
+   *
+   * @param {MeasurementSource} source Measurement source
+   * @return {string} Source information
+   */
+  _getSourceInfo(source) {
+    return `${source.name}@${source.version}`;
+  }
+
+  /**
+   * Checks if given source is valid.
+   *
+   * @param {MeasurementSource} source Measurement source
+   * @return {boolean} Measurement source validation
+   */
+  _isValidSource(source) {
+    return source && this.sources[source.id];
+  }
+
+  /**
+   * Checks if a given source has mappings.
+   *
+   * @param {MeasurementSource} source The measurement source
+   * @return {boolean} Validation if source has mappings
+   */
+  _sourceHasMappings(source) {
+    return (
+      Array.isArray(this.mappings[source.id]) && this.mappings[source.id].length
+    );
+  }
+
+  /**
+   * Broadcasts measurement changes.
+   *
+   * @param {string} measurementId The measurement id
+   * @param {MeasurementSource} source The measurement source
+   * @param {string} eventName The event name
+   * @return void
+   */
+  _broadcastChange(eventName, source, measurement) {
+    const hasListeners = Object.keys(this.listeners).length > 0;
+    const hasCallbacks = Array.isArray(this.listeners[eventName]);
+
+    if (hasListeners && hasCallbacks) {
+      this.listeners[eventName].forEach(listener => {
+        listener.callback({ source, measurement });
+      });
+    }
+  }
+
+  /**
+   * Unsubscribe to measurement updates.
+   *
+   * @param {string} eventName The name of the event
+   * @param {string} listenerId The listeners id
+   * @return void
+   */
+  _unsubscribe(eventName, listenerId) {
+    if (!this.listeners[eventName]) {
+      return;
+    }
+
+    const listeners = this.listeners[eventName];
+    if (Array.isArray(listeners)) {
+      this.listeners[eventName] = listeners.filter(
+        ({ id }) => id !== listenerId
+      );
+    } else {
+      this.listeners[eventName] = undefined;
+    }
+  }
+
+  /**
+   * Check if a given measurement data is valid.
+   *
+   * @param {Measurement} measurementData Measurement data
+   * @return {boolean} Measurement validation
+   */
+  _isValidMeasurement(measurementData) {
+    Object.keys(measurementData).forEach(key => {
+      if (!MEASUREMENT_SCHEMA_KEYS.includes(key)) {
+        log.warn(`Invalid measurement key: ${key}`);
+        return false;
+      }
+    });
+
+    return true;
+  }
+
+  /**
+   * Check if a given measurement service event is valid.
+   *
+   * @param {string} eventName The name of the event
+   * @return {boolean} Event name validation
+   */
+  _isValidEvent(eventName) {
+    return Object.values(this.EVENTS).includes(eventName);
+  }
+
+  /**
+   * Converts object of objects to array.
+   *
+   * @return {Array} Array of objects
+   */
+  _arrayOfObjects = obj => {
+    return Object.entries(obj).map(e => ({ [e[0]]: e[1] }));
+  };
+}
+
+export default MeasurementService;
+export { EVENTS, VALUE_TYPES };

platform/core/src/services/MeasurementService/MeasurementService.test.js

@@ -0,0 +1,405 @@
+import MeasurementService from './MeasurementService.js';
+import log from '../../log';
+
+jest.mock('../../log.js', () => ({
+  info: jest.fn(),
+  warn: jest.fn(),
+  error: jest.fn(),
+}));
+
+describe('MeasurementService.js', () => {
+  let measurementService;
+  let measurement;
+  let source;
+  let definition;
+  let matchingCriteria;
+  let toAnnotation;
+  let toMeasurement;
+  let annotation;
+
+  beforeEach(() => {
+    measurementService = new MeasurementService();
+    source = measurementService.createSource('Test', '1');
+    definition = 'Length';
+    annotation = {
+      toolName: definition,
+      measurementData: {},
+    };
+    measurement = {
+      sopInstanceUID: '123',
+      frameOfReferenceUID: '1234',
+      referenceSeriesUID: '12345',
+      label: 'Label',
+      description: 'Description',
+      unit: 'mm',
+      area: 123,
+      type: measurementService.VALUE_TYPES.POLYLINE,
+      points: [{ x: 1, y: 2 }, { x: 1, y: 2 }],
+      source: source,
+    };
+    toAnnotation = () => annotation;
+    toMeasurement = () => measurement;
+    matchingCriteria = {
+      valueType: measurementService.VALUE_TYPES.POLYLINE,
+      points: 2,
+    };
+    log.warn.mockClear();
+    jest.clearAllMocks();
+  });
+
+  describe('createSource()', () => {
+    it('creates new source with name and version', () => {
+      measurementService.createSource('Testing', '1');
+    });
+
+    it('logs warning and return early if no name provided', () => {
+      measurementService.createSource(null, '1');
+
+      expect(log.warn.mock.calls.length).toBe(1);
+    });
+
+    it('logs warning and return early if no version provided', () => {
+      measurementService.createSource('Testing', null);
+
+      expect(log.warn.mock.calls.length).toBe(1);
+    });
+  });
+
+  describe('addMapping()', () => {
+    it('adds new mapping', () => {
+      measurementService.addMapping(
+        source,
+        definition,
+        matchingCriteria,
+        toAnnotation,
+        toMeasurement
+      );
+    });
+
+    it('logs warning and return early if no matching criteria provided', () => {
+      measurementService.addMapping(
+        source,
+        definition,
+        null,
+        toAnnotation,
+        toMeasurement
+      );
+
+      expect(log.warn.mock.calls.length).toBe(1);
+    });
+
+    it('logs warning and return early if invalid source provided', () => {
+      const invalidSoure = {};
+
+      measurementService.addMapping(
+        invalidSoure,
+        definition,
+        matchingCriteria,
+        toAnnotation,
+        toMeasurement
+      );
+
+      expect(log.warn.mock.calls.length).toBe(1);
+    });
+
+    it('logs warning and return early if no source provided', () => {
+      measurementService.addMapping(
+        null /* source */,
+        definition,
+        matchingCriteria,
+        toAnnotation,
+        toMeasurement
+      );
+
+      expect(log.warn.mock.calls.length).toBe(1);
+    });
+
+    it('logs warning and return early if no definition provided', () => {
+      measurementService.addMapping(
+        source,
+        null /* definition */,
+        matchingCriteria,
+        toAnnotation,
+        toMeasurement
+      );
+
+      expect(log.warn.mock.calls.length).toBe(1);
+    });
+
+    it('logs warning and return early if no measurement mapping function provided', () => {
+      measurementService.addMapping(
+        source,
+        definition,
+        matchingCriteria,
+        null /* toAnnotation */,
+        toMeasurement
+      );
+
+      expect(log.warn.mock.calls.length).toBe(1);
+    });
+
+    it('logs warning and return early if no annotation mapping function provided', () => {
+      measurementService.addMapping(
+        source,
+        definition,
+        matchingCriteria,
+        toAnnotation,
+        null /* toMeasurement */
+      );
+
+      expect(log.warn.mock.calls.length).toBe(1);
+    });
+  });
+
+  describe('getAnnotation()', () => {
+    it('get annotation based on matched criteria', () => {
+      measurementService.addMapping(
+        source,
+        definition,
+        matchingCriteria,
+        toAnnotation,
+        toMeasurement
+      );
+      const measurementId = source.addOrUpdate(definition, annotation);
+      const mappedAnnotation = source.getAnnotation(definition, measurementId);
+
+      expect(annotation).toBe(mappedAnnotation);
+    });
+
+    it('get annotation based on source and definition', () => {
+      measurementService.addMapping(
+        source,
+        definition,
+        {},
+        toAnnotation,
+        toMeasurement
+      );
+      const measurementId = source.addOrUpdate(definition, annotation);
+      const mappedAnnotation = source.getAnnotation(definition, measurementId);
+
+      expect(annotation).toBe(mappedAnnotation);
+    });
+  });
+
+  describe('getMeasurements()', () => {
+    it('return all measurement service measurements', () => {
+      const anotherMeasurement = {
+        ...measurement,
+        label: 'Label2',
+        unit: 'HU',
+      };
+
+      measurementService.addMapping(
+        source,
+        definition,
+        matchingCriteria,
+        toAnnotation,
+        toMeasurement
+      );
+
+      source.addOrUpdate(definition, measurement);
+      source.addOrUpdate(definition, anotherMeasurement);
+
+      const measurements = measurementService.getMeasurements();
+
+      expect(measurements.length).toEqual(2);
+      expect(measurements.length).toEqual(2);
+    });
+  });
+
+  describe('getMeasurement()', () => {
+    it('return measurement service measurement with given id', () => {
+      measurementService.addMapping(
+        source,
+        definition,
+        matchingCriteria,
+        toAnnotation,
+        toMeasurement
+      );
+
+      const id = source.addOrUpdate(definition, measurement);
+      const returnedMeasurement = measurementService.getMeasurement(id);
+
+      /* Clear dynamic data */
+      delete returnedMeasurement.modifiedTimestamp;
+
+      expect({ id, ...measurement }).toEqual(returnedMeasurement);
+    });
+  });
+
+  describe('addOrUpdate()', () => {
+    it('adds new measurements', () => {
+      measurementService.addMapping(
+        source,
+        definition,
+        matchingCriteria,
+        toAnnotation,
+        toMeasurement
+      );
+
+      source.addOrUpdate(definition, measurement);
+      source.addOrUpdate(definition, measurement);
+
+      const measurements = measurementService.getMeasurements();
+
+      expect(measurements.length).toBe(2);
+    });
+
+    it('fails to add new measurements when no mapping', () => {
+      source.addOrUpdate(definition, measurement);
+
+      expect(log.warn.mock.calls.length).toBe(1);
+    });
+
+    it('fails to add new measurements when invalid mapping function', () => {
+      measurementService.addMapping(
+        source,
+        definition,
+        matchingCriteria,
+        toAnnotation,
+        1 /* Invalid */
+      );
+
+      source.addOrUpdate(definition, measurement);
+
+      expect(log.error.mock.calls.length).toBe(1);
+    });
+
+    it('adds new measurement with custom id', () => {
+      const newMeasurement = { id: 1, ...measurement };
+
+      measurementService.addMapping(
+        source,
+        definition,
+        matchingCriteria,
+        toAnnotation,
+        toMeasurement
+      );
+
+      /* Add new measurement */
+      source.addOrUpdate(definition, newMeasurement);
+      const savedMeasurement = measurementService.getMeasurement(newMeasurement.id);
+
+      /* Clear dynamic data */
+      delete newMeasurement.modifiedTimestamp;
+      delete savedMeasurement.modifiedTimestamp;
+
+      expect(newMeasurement).toEqual(savedMeasurement);
+    });
+
+    it('logs warning and return if adding invalid measurement', () => {
+      measurement.invalidProperty = {};
+
+      measurementService.addMapping(
+        source,
+        definition,
+        matchingCriteria,
+        toAnnotation,
+        toMeasurement
+      );
+
+      source.addOrUpdate(definition, measurement);
+
+      expect(log.warn.mock.calls.length).toBe(2);
+    });
+
+    it('updates existent measurement', () => {
+      measurementService.addMapping(
+        source,
+        definition,
+        matchingCriteria,
+        toAnnotation,
+        toMeasurement
+      );
+
+      const id = source.addOrUpdate(definition, measurement);
+
+      measurement.unit = 'HU';
+
+      source.addOrUpdate(definition, { id, ...measurement });
+      const updatedMeasurement = measurementService.getMeasurement(id);
+
+      expect(updatedMeasurement.unit).toBe('HU');
+    });
+  });
+
+  describe('subscribe()', () => {
+    it('subscribers receive broadcasted add event', () => {
+      measurementService.addMapping(
+        source,
+        definition,
+        matchingCriteria,
+        toAnnotation,
+        toMeasurement
+      );
+
+      const { MEASUREMENT_ADDED } = measurementService.EVENTS;
+      let addCallbackWasCalled = false;
+
+      /* Subscribe to add event */
+      measurementService.subscribe(
+        MEASUREMENT_ADDED,
+        () => (addCallbackWasCalled = true)
+      );
+
+      /* Add new measurement */
+      source.addOrUpdate(definition, measurement);
+
+      expect(addCallbackWasCalled).toBe(true);
+    });
+
+    it('subscribers receive broadcasted update event', () => {
+      measurementService.addMapping(
+        source,
+        definition,
+        matchingCriteria,
+        toAnnotation,
+        toMeasurement
+      );
+
+      const { MEASUREMENT_UPDATED } = measurementService.EVENTS;
+      let updateCallbackWasCalled = false;
+
+      /* Subscribe to update event */
+      measurementService.subscribe(
+        MEASUREMENT_UPDATED,
+        () => (updateCallbackWasCalled = true)
+      );
+
+      /* Create measurement */
+      const id = source.addOrUpdate(definition, measurement);
+
+      /* Update measurement */
+      source.addOrUpdate(definition, { id, ...measurement });
+
+      expect(updateCallbackWasCalled).toBe(true);
+    });
+
+    it('unsubscribes a listener', () => {
+      measurementService.addMapping(
+        source,
+        definition,
+        matchingCriteria,
+        toAnnotation,
+        toMeasurement
+      );
+
+      let updateCallbackWasCalled = false;
+      const { MEASUREMENT_ADDED } = measurementService.EVENTS;
+
+      /* Subscribe to Add event */
+      const { unsubscribe } = measurementService.subscribe(
+        MEASUREMENT_ADDED,
+        () => (updateCallbackWasCalled = true)
+      );
+
+      /* Unsubscribe */
+      unsubscribe();
+
+      /* Create measurement */
+      source.addOrUpdate(definition, measurement);
+
+      expect(updateCallbackWasCalled).toBe(false);
+    });
+  });
+});

platform/core/src/services/MeasurementService/index.js

@@ -0,0 +1,8 @@
+import MeasurementService from './MeasurementService';
+
+export default {
+  name: 'MeasurementService',
+  create: ({ configuration = {} }) => {
+    return new MeasurementService();
+  },
+};

platform/core/src/services/ServicesManager.js

@@ -33,7 +33,9 @@ export default class ServicesManager {
     }
 
     if (service.create) {
-      this.services[service.name] = service.create({ configuration });
+      this.services[service.name] = service.create({
+        configuration,
+      });
     } else {
       log.warn(`Service create factory function not defined. Exiting early.`);
       return;

platform/core/src/services/ServicesManager.test.js

@@ -33,7 +33,7 @@ describe('ServicesManager.js', () => {
         [{ name: 'UIModalTestService', create: jest.fn() }, fakeConfiguration],
       ]);
 
-      expect(servicesManager.registerService.mock.calls[1]).toContain(
+      expect(servicesManager.registerService.mock.calls[1][1]).toEqual(
         fakeConfiguration
       );
     });
@@ -85,7 +85,7 @@ describe('ServicesManager.js', () => {
       expect(log.warn.mock.calls.length).toBe(1);
     });
 
-    it('pass configuration to service create factory function', () => {
+    it('pass dependencies and configuration to service create factory function', () => {
       const configuration = { config: 'Some configuration' };
 
       servicesManager.registerService(fakeService, configuration);

platform/core/src/services/UIContextMenuService/index.js

@@ -1,66 +0,0 @@
-/**
- * UI Context Menu
- *
- * @typedef {Object} ContextMenuProps
- * @property {Event} event The event with tool information.
- */
-
-const name = 'UIContextMenuService';
-
-const publicAPI = {
-  name,
-  hide: _hide,
-  show: _show,
-  setServiceImplementation,
-};
-
-const serviceImplementation = {
-  _show: () => console.warn('show() NOT IMPLEMENTED'),
-  _hide: () => console.warn('hide() NOT IMPLEMENTED'),
-};
-
-/**
- * Show a new UI ContextMenu dialog;
- *
- * @param {ContextMenuProps} props { event }
- */
-function _show({ event }) {
-  return serviceImplementation._show({
-    event,
-  });
-}
-
-/**
- * Hide a UI ContextMenu dialog;
- *
- */
-function _hide() {
-  return serviceImplementation._hide();
-}
-
-/**
- *
- *
- * @param {*} {
- *   show: showImplementation,
- *   hide: hideImplementation,
- * }
- */
-function setServiceImplementation({
-  show: showImplementation,
-  hide: hideImplementation,
-}) {
-  if (showImplementation) {
-    serviceImplementation._show = showImplementation;
-  }
-  if (hideImplementation) {
-    serviceImplementation._hide = hideImplementation;
-  }
-}
-
-export default {
-  name,
-  create: ({ configuration = {} }) => {
-    return publicAPI;
-  },
-};

platform/core/src/services/UILabellingFlowService/index.js

@@ -1,71 +0,0 @@
-/**
- * UI Labelling Flow
- *
- * @typedef {Object} LabellingFlowProps
- * @property {Object} defaultPosition The position of the labelling dialog.
- * @property {boolean} centralize conditional to center the labelling dialog.
- * @property {Object} props The labelling props.
- *
- */
-
-const name = 'UILabellingFlowService';
-
-const publicAPI = {
-  name,
-  show: _show,
-  hide: _hide,
-  setServiceImplementation,
-};
-
-const serviceImplementation = {
-  _show: () => console.warn('show() NOT IMPLEMENTED'),
-  _hide: () => console.warn('hide() NOT IMPLEMENTED'),
-};
-
-/**
- * Hide a UI LabellingFlow dialog;
- *
- */
-function _hide() {
-  return serviceImplementation._hide();
-}
-
-/**
- * Show a new UI LabellingFlow dialog;
- *
- * @param {LabellingFlowProps} props { defaultPosition, centralize, props }
- */
-function _show({ defaultPosition, centralize, props }) {
-  return serviceImplementation._show({
-    defaultPosition,
-    centralize,
-    props,
-  });
-}
-
-/**
- *
- *
- * @param {*} {
- *   show: showImplementation,
- *   hide: hideImplementation,
- * }
- */
-function setServiceImplementation({
-  show: showImplementation,
-  hide: hideImplementation,
-}) {
-  if (showImplementation) {
-    serviceImplementation._show = showImplementation;
-  }
-  if (hideImplementation) {
-    serviceImplementation._hide = hideImplementation;
-  }
-}
-
-export default {
-  name,
-  create: ({ configuration = {} }) => {
-    return publicAPI;
-  },
-};

platform/core/src/services/UINotificationService/index.js

@@ -12,6 +12,8 @@
 
 const name = 'UINotificationService';
 
+const serviceShowRequestQueue = [];
+
 const publicAPI = {
   name,
   hide: _hide,
@@ -21,7 +23,11 @@ const publicAPI = {
 
 const serviceImplementation = {
   _hide: () => console.warn('hide() NOT IMPLEMENTED'),
-  _show: () => console.warn('show() NOT IMPLEMENTED'),
+  _show: showArguments => {
+    serviceShowRequestQueue.push(showArguments);
+
+    console.warn('show() NOT IMPLEMENTED');
+  },
 };
 
 /**
@@ -76,6 +82,11 @@ function setServiceImplementation({
   }
   if (showImplementation) {
     serviceImplementation._show = showImplementation;
+
+    while (serviceShowRequestQueue.length > 0) {
+      const showArguments = serviceShowRequestQueue.pop();
+      serviceImplementation._show(showArguments);
+    }
   }
 }
 

platform/core/src/services/index.js

@@ -2,14 +2,12 @@ import ServicesManager from './ServicesManager.js';
 import UINotificationService from './UINotificationService';
 import UIModalService from './UIModalService';
 import UIDialogService from './UIDialogService';
-import UIContextMenuService from './UIContextMenuService';
-import UILabellingFlowService from './UILabellingFlowService';
+import MeasurementService from './MeasurementService';
 
 export {
   UINotificationService,
   UIModalService,
   UIDialogService,
-  UIContextMenuService,
-  UILabellingFlowService,
   ServicesManager,
+  MeasurementService,
 };

platform/core/src/studies/services/wado/retrieveMetadataLoader.js

@@ -40,19 +40,21 @@ export default class RetrieveMetadataLoader {
         if (result && result.length) {
           break; // closes iterator in case data is retrieved successfully
         }
-      } catch (e) { }
+      } catch (e) {
+        throw e;
+      }
     }
 
     if (loaders.next().done && !result) {
-      throw 'cant find data';
+      throw new Error('RetrieveMetadataLoader failed');
     }
 
     return result;
   }
 
   // Methods to be overwrite
-  async configLoad() { }
-  async preLoad() { }
-  async load(preLoadData) { }
-  async posLoad(loadData) { }
+  async configLoad() {}
+  async preLoad() {}
+  async load(preLoadData) {}
+  async posLoad(loadData) {}
 }

platform/core/src/studies/services/wado/studyInstanceHelpers.js

@@ -1,3 +1,4 @@
+import { api } from 'dicomweb-client';
 import DICOMWeb from '../../../DICOMWeb';
 
 const WADOProxy = {
@@ -21,6 +22,43 @@ function parseFloatArray(obj) {
   return result;
 }
 
+/**
+ * Simple cache schema for retrieved color palettes.
+ */
+const paletteColorCache = {
+  count: 0,
+  maxAge: 24 * 60 * 60 * 1000, // 24h cache?
+  entries: {},
+  isValidUID: function(paletteUID) {
+    return typeof paletteUID === 'string' && paletteUID.length > 0;
+  },
+  get: function(paletteUID) {
+    let entry = null;
+    if (this.entries.hasOwnProperty(paletteUID)) {
+      entry = this.entries[paletteUID];
+      // check how the entry is...
+      if (Date.now() - entry.time > this.maxAge) {
+        // entry is too old... remove entry.
+        delete this.entries[paletteUID];
+        this.count--;
+        entry = null;
+      }
+    }
+    return entry;
+  },
+  add: function(entry) {
+    if (this.isValidUID(entry.uid)) {
+      let paletteUID = entry.uid;
+      if (this.entries.hasOwnProperty(paletteUID) !== true) {
+        this.count++; // increment cache entry count...
+      }
+      entry.time = Date.now();
+      this.entries[paletteUID] = entry;
+      // @TODO: Add logic to get rid of old entries and reduce memory usage...
+    }
+  },
+};
+
 /**
  * Create a plain JS object that describes a study (a study descriptor object)
  * @param {Object} server Object with server configuration parameters
@@ -299,40 +337,41 @@ async function makeSOPInstance(server, study, instance) {
   return sopInstance;
 }
 
+/**
+ * Convert String to ArrayBuffer
+ *
+ * @param {String} str Input String
+ * @return {ArrayBuffer} Output converted ArrayBuffer
+ */
+function str2ab(str) {
+  const strLen = str.length;
+  const bytes = new Uint8Array(strLen);
+
+  for (let i = 0; i < strLen; i++) {
+    bytes[i] = str.charCodeAt(i);
+  }
+
+  return bytes.buffer;
+}
+
 function getPaletteColor(server, instance, tag, lutDescriptor) {
   const numLutEntries = lutDescriptor[0];
   const bits = lutDescriptor[2];
 
-  let uri = WADOProxy.convertURL(instance[tag].BulkDataURI, server);
-
-  // TODO: Workaround for dcm4chee behind SSL-terminating proxy returning
-  // incorrect bulk data URIs
-  if (server.wadoRoot.indexOf('https') === 0 && !uri.includes('https')) {
-    uri = uri.replace('http', 'https');
-  }
-
-  const config = {
-    url: server.wadoRoot, //BulkDataURI is absolute, so this isn't used
-    headers: DICOMWeb.getAuthorizationHeader(server),
-  };
-  const dicomWeb = new api.DICOMwebClient(config);
-  const options = {
-    BulkDataURI: uri,
-  };
-
   const readUInt16 = (byteArray, position) => {
     return byteArray[position] + byteArray[position + 1] * 256;
   };
 
-  const arrayBufferToPaletteColorLUT = result => {
-    const arraybuffer = result[0];
+  const arrayBufferToPaletteColorLUT = arraybuffer => {
     const byteArray = new Uint8Array(arraybuffer);
     const lut = [];
 
-    for (let i = 0; i < numLutEntries; i++) {
-      if (bits === 16) {
+    if (bits === 16) {
+      for (let i = 0; i < numLutEntries; i++) {
         lut[i] = readUInt16(byteArray, i * 2);
-      } else {
+      }
+    } else {
+      for (let i = 0; i < numLutEntries; i++) {
         lut[i] = byteArray[i];
       }
     }
@@ -340,7 +379,38 @@ function getPaletteColor(server, instance, tag, lutDescriptor) {
     return lut;
   };
 
-  return dicomWeb.retrieveBulkData(options).then(arrayBufferToPaletteColorLUT);
+  if (instance[tag].BulkDataURI) {
+    let uri = WADOProxy.convertURL(instance[tag].BulkDataURI, server);
+
+    // TODO: Workaround for dcm4chee behind SSL-terminating proxy returning
+    // incorrect bulk data URIs
+    if (server.wadoRoot.indexOf('https') === 0 && !uri.includes('https')) {
+      uri = uri.replace('http', 'https');
+    }
+
+    const config = {
+      url: server.wadoRoot, //BulkDataURI is absolute, so this isn't used
+      headers: DICOMWeb.getAuthorizationHeader(server),
+    };
+    const dicomWeb = new api.DICOMwebClient(config);
+    const options = {
+      BulkDataURI: uri,
+    };
+
+    return dicomWeb
+      .retrieveBulkData(options)
+      .then(result => result[0])
+      .then(arrayBufferToPaletteColorLUT);
+  } else if (instance[tag].InlineBinary) {
+    const inlineBinaryData = atob(instance[tag].InlineBinary);
+    const arraybuf = str2ab(inlineBinaryData);
+
+    return arrayBufferToPaletteColorLUT(arraybuf);
+  }
+
+  throw new Error(
+    'Palette Color LUT was not provided as InlineBinary or BulkDataURI'
+  );
 }
 
 /**

platform/core/src/studies/studyUtils.js

@@ -1,413 +0,0 @@
-import DICOMWeb from '../DICOMWeb/';
-
-const WADOProxy = {
-  convertURL: (url, server) => {
-    // TODO: Remove all WADOProxy stuff from this file
-    return url;
-  },
-};
-function parseFloatArray(obj) {
-  const result = [];
-
-  if (!obj) {
-    return result;
-  }
-
-  const objs = obj.split('\\');
-  for (let i = 0; i < objs.length; i++) {
-    result.push(parseFloat(objs[i]));
-  }
-
-  return result;
-}
-
-/**
- * Create a plain JS object that describes a study (a study descriptor object)
- * @param {Object} server Object with server configuration parameters
- * @param {Object} aSopInstance a SOP Instance from which study information will be added
- */
-function createStudy(server, aSopInstance) {
-  // TODO: Pass a reference ID to the server instead of including the URLs here
-  return {
-    seriesList: [],
-    seriesMap: Object.create(null),
-    seriesLoader: null,
-    wadoUriRoot: server.wadoUriRoot,
-    wadoRoot: server.wadoRoot,
-    qidoRoot: server.qidoRoot,
-    patientName: DICOMWeb.getName(aSopInstance['00100010']),
-    patientId: DICOMWeb.getString(aSopInstance['00100020']),
-    patientAge: DICOMWeb.getNumber(aSopInstance['00101010']),
-    patientSize: DICOMWeb.getNumber(aSopInstance['00101020']),
-    patientWeight: DICOMWeb.getNumber(aSopInstance['00101030']),
-    accessionNumber: DICOMWeb.getString(aSopInstance['00080050']),
-    studyDate: DICOMWeb.getString(aSopInstance['00080020']),
-    modalities: DICOMWeb.getString(aSopInstance['00080061']),
-    studyDescription: DICOMWeb.getString(aSopInstance['00081030']),
-    imageCount: DICOMWeb.getString(aSopInstance['00201208']),
-    studyInstanceUid: DICOMWeb.getString(aSopInstance['0020000D']),
-    institutionName: DICOMWeb.getString(aSopInstance['00080080']),
-  };
-}
-
-/** Returns a WADO url for an instance
- *
- * @param studyInstanceUid
- * @param seriesInstanceUid
- * @param sopInstanceUid
- * @returns  {string}
- */
-function buildInstanceWadoUrl(
-  server,
-  studyInstanceUid,
-  seriesInstanceUid,
-  sopInstanceUid
-) {
-  // TODO: This can be removed, since DICOMWebClient has the same function. Not urgent, though
-  const params = [];
-
-  params.push('requestType=WADO');
-  params.push(`studyUID=${studyInstanceUid}`);
-  params.push(`seriesUID=${seriesInstanceUid}`);
-  params.push(`objectUID=${sopInstanceUid}`);
-  params.push('contentType=application/dicom');
-  params.push('transferSyntax=*');
-
-  const paramString = params.join('&');
-
-  return `${server.wadoUriRoot}?${paramString}`;
-}
-
-function buildInstanceWadoRsUri(
-  server,
-  studyInstanceUid,
-  seriesInstanceUid,
-  sopInstanceUid
-) {
-  return `${server.wadoRoot}/studies/${studyInstanceUid}/series/${seriesInstanceUid}/instances/${sopInstanceUid}`;
-}
-
-function buildInstanceFrameWadoRsUri(
-  server,
-  studyInstanceUid,
-  seriesInstanceUid,
-  sopInstanceUid,
-  frame
-) {
-  const baseWadoRsUri = buildInstanceWadoRsUri(
-    server,
-    studyInstanceUid,
-    seriesInstanceUid,
-    sopInstanceUid
-  );
-  frame = frame != null || 1;
-
-  return `${baseWadoRsUri}/frames/${frame}`;
-}
-
-function getFrameIncrementPointer(element) {
-  const frameIncrementPointerNames = {
-    '00181065': 'frameTimeVector',
-    '00181063': 'frameTime',
-  };
-
-  if (!element || !element.Value || !element.Value.length) {
-    return;
-  }
-
-  const value = element.Value[0];
-  return frameIncrementPointerNames[value];
-}
-
-function getRadiopharmaceuticalInfo(instance) {
-  const modality = DICOMWeb.getString(instance['00080060']);
-
-  if (modality !== 'PT') {
-    return;
-  }
-
-  const radiopharmaceuticalInfo = instance['00540016'];
-  if (
-    radiopharmaceuticalInfo === undefined ||
-    !radiopharmaceuticalInfo.Value ||
-    !radiopharmaceuticalInfo.Value.length
-  ) {
-    return;
-  }
-
-  const firstPetRadiopharmaceuticalInfo = radiopharmaceuticalInfo.Value[0];
-  return {
-    radiopharmaceuticalStartTime: DICOMWeb.getString(
-      firstPetRadiopharmaceuticalInfo['00181072']
-    ),
-    radionuclideTotalDose: DICOMWeb.getNumber(
-      firstPetRadiopharmaceuticalInfo['00181074']
-    ),
-    radionuclideHalfLife: DICOMWeb.getNumber(
-      firstPetRadiopharmaceuticalInfo['00181075']
-    ),
-  };
-}
-
-/**
- * Parses the SourceImageSequence, if it exists, in order
- * to return a ReferenceSOPInstanceUID. The ReferenceSOPInstanceUID
- * is used to refer to this image in any accompanying DICOM-SR documents.
- *
- * @param instance
- * @returns {String} The ReferenceSOPInstanceUID
- */
-function getSourceImageInstanceUid(instance) {
-  // TODO= Parse the whole Source Image Sequence
-  // This is a really poor workaround for now.
-  // Later we should probably parse the whole sequence.
-  var SourceImageSequence = instance['00082112'];
-  if (
-    SourceImageSequence &&
-    SourceImageSequence.Value &&
-    SourceImageSequence.Value.length &&
-    SourceImageSequence.Value[0]['00081155'].Value
-  ) {
-    return SourceImageSequence.Value[0]['00081155'].Value[0];
-  }
-}
-
-async function makeSOPInstance(server, study, instance) {
-  const { studyInstanceUid } = study;
-  const seriesInstanceUid = DICOMWeb.getString(instance['0020000E']);
-  let series = study.seriesMap[seriesInstanceUid];
-
-  if (!series) {
-    series = {
-      seriesInstanceUid,
-      seriesDescription: DICOMWeb.getString(instance['0008103E']),
-      modality: DICOMWeb.getString(instance['00080060']),
-      seriesNumber: DICOMWeb.getNumber(instance['00200011']),
-      seriesDate: DICOMWeb.getString(instance['00080021']),
-      seriesTime: DICOMWeb.getString(instance['00080031']),
-      instances: [],
-    };
-    study.seriesMap[seriesInstanceUid] = series;
-    study.seriesList.push(series);
-  }
-
-  const sopInstanceUid = DICOMWeb.getString(instance['00080018']);
-  const wadouri = buildInstanceWadoUrl(
-    server,
-    studyInstanceUid,
-    seriesInstanceUid,
-    sopInstanceUid
-  );
-  const baseWadoRsUri = buildInstanceWadoRsUri(
-    server,
-    studyInstanceUid,
-    seriesInstanceUid,
-    sopInstanceUid
-  );
-  const wadorsuri = buildInstanceFrameWadoRsUri(
-    server,
-    studyInstanceUid,
-    seriesInstanceUid,
-    sopInstanceUid
-  );
-
-  const sopInstance = {
-    imageType: DICOMWeb.getString(instance['00080008']),
-    sopClassUid: DICOMWeb.getString(instance['00080016']),
-    modality: DICOMWeb.getString(instance['00080060']),
-    sopInstanceUid,
-    instanceNumber: DICOMWeb.getNumber(instance['00200013']),
-    imagePositionPatient: DICOMWeb.getString(instance['00200032']),
-    imageOrientationPatient: DICOMWeb.getString(instance['00200037']),
-    frameOfReferenceUID: DICOMWeb.getString(instance['00200052']),
-    sliceLocation: DICOMWeb.getNumber(instance['00201041']),
-    samplesPerPixel: DICOMWeb.getNumber(instance['00280002']),
-    photometricInterpretation: DICOMWeb.getString(instance['00280004']),
-    planarConfiguration: DICOMWeb.getNumber(instance['00280006']),
-    rows: DICOMWeb.getNumber(instance['00280010']),
-    columns: DICOMWeb.getNumber(instance['00280011']),
-    pixelSpacing: DICOMWeb.getString(instance['00280030']),
-    pixelAspectRatio: DICOMWeb.getString(instance['00280034']),
-    bitsAllocated: DICOMWeb.getNumber(instance['00280100']),
-    bitsStored: DICOMWeb.getNumber(instance['00280101']),
-    highBit: DICOMWeb.getNumber(instance['00280102']),
-    pixelRepresentation: DICOMWeb.getNumber(instance['00280103']),
-    smallestPixelValue: DICOMWeb.getNumber(instance['00280106']),
-    largestPixelValue: DICOMWeb.getNumber(instance['00280107']),
-    windowCenter: DICOMWeb.getString(instance['00281050']),
-    windowWidth: DICOMWeb.getString(instance['00281051']),
-    rescaleIntercept: DICOMWeb.getNumber(instance['00281052']),
-    rescaleSlope: DICOMWeb.getNumber(instance['00281053']),
-    rescaleType: DICOMWeb.getNumber(instance['00281054']),
-    sourceImageInstanceUid: getSourceImageInstanceUid(instance),
-    laterality: DICOMWeb.getString(instance['00200062']),
-    viewPosition: DICOMWeb.getString(instance['00185101']),
-    acquisitionDateTime: DICOMWeb.getString(instance['0008002A']),
-    numberOfFrames: DICOMWeb.getNumber(instance['00280008']),
-    frameIncrementPointer: getFrameIncrementPointer(instance['00280009']),
-    frameTime: DICOMWeb.getNumber(instance['00181063']),
-    frameTimeVector: parseFloatArray(DICOMWeb.getString(instance['00181065'])),
-    sliceThickness: DICOMWeb.getNumber(instance['00180050']),
-    spacingBetweenSlices: DICOMWeb.getString(instance['00180088']),
-    lossyImageCompression: DICOMWeb.getString(instance['00282110']),
-    derivationDescription: DICOMWeb.getString(instance['00282111']),
-    lossyImageCompressionRatio: DICOMWeb.getString(instance['00282112']),
-    lossyImageCompressionMethod: DICOMWeb.getString(instance['00282114']),
-    echoNumber: DICOMWeb.getString(instance['00180086']),
-    contrastBolusAgent: DICOMWeb.getString(instance['00180010']),
-    radiopharmaceuticalInfo: getRadiopharmaceuticalInfo(instance),
-    baseWadoRsUri: baseWadoRsUri,
-    wadouri: WADOProxy.convertURL(wadouri, server),
-    wadorsuri: WADOProxy.convertURL(wadorsuri, server),
-    wadoRoot: server.wadoRoot,
-    imageRendering: server.imageRendering,
-    thumbnailRendering: server.thumbnailRendering,
-  };
-
-  // Get additional information if the instance uses "PALETTE COLOR" photometric interpretation
-  if (sopInstance.photometricInterpretation === 'PALETTE COLOR') {
-    const redPaletteColorLookupTableDescriptor = parseFloatArray(
-      DICOMWeb.getString(instance['00281101'])
-    );
-    const greenPaletteColorLookupTableDescriptor = parseFloatArray(
-      DICOMWeb.getString(instance['00281102'])
-    );
-    const bluePaletteColorLookupTableDescriptor = parseFloatArray(
-      DICOMWeb.getString(instance['00281103'])
-    );
-    const palettes = await getPaletteColors(
-      server,
-      instance,
-      redPaletteColorLookupTableDescriptor
-    );
-
-    if (palettes) {
-      if (palettes.uid) {
-        sopInstance.paletteColorLookupTableUID = palettes.uid;
-      }
-
-      sopInstance.redPaletteColorLookupTableData = palettes.red;
-      sopInstance.greenPaletteColorLookupTableData = palettes.green;
-      sopInstance.bluePaletteColorLookupTableData = palettes.blue;
-      sopInstance.redPaletteColorLookupTableDescriptor = redPaletteColorLookupTableDescriptor;
-      sopInstance.greenPaletteColorLookupTableDescriptor = greenPaletteColorLookupTableDescriptor;
-      sopInstance.bluePaletteColorLookupTableDescriptor = bluePaletteColorLookupTableDescriptor;
-    }
-  }
-
-  series.instances.push(sopInstance);
-  return sopInstance;
-}
-
-function getPaletteColor(server, instance, tag, lutDescriptor) {
-  const numLutEntries = lutDescriptor[0];
-  const bits = lutDescriptor[2];
-
-  let uri = WADOProxy.convertURL(instance[tag].BulkDataURI, server);
-
-  // TODO: Workaround for dcm4chee behind SSL-terminating proxy returning
-  // incorrect bulk data URIs
-  if (server.wadoRoot.indexOf('https') === 0 && !uri.includes('https')) {
-    uri = uri.replace('http', 'https');
-  }
-
-  const config = {
-    url: server.wadoRoot, //BulkDataURI is absolute, so this isn't used
-    headers: DICOMWeb.getAuthorizationHeader(server),
-  };
-  const dicomWeb = new api.DICOMwebClient(config);
-  const options = {
-    BulkDataURI: uri,
-  };
-
-  const readUInt16 = (byteArray, position) => {
-    return byteArray[position] + byteArray[position + 1] * 256;
-  };
-
-  const arrayBufferToPaletteColorLUT = result => {
-    const arraybuffer = result[0];
-    const byteArray = new Uint8Array(arraybuffer);
-    const lut = [];
-
-    for (let i = 0; i < numLutEntries; i++) {
-      if (bits === 16) {
-        lut[i] = readUInt16(byteArray, i * 2);
-      } else {
-        lut[i] = byteArray[i];
-      }
-    }
-
-    return lut;
-  };
-
-  return dicomWeb.retrieveBulkData(options).then(arrayBufferToPaletteColorLUT);
-}
-
-/**
- * Fetch palette colors for instances with "PALETTE COLOR" photometricInterpretation.
- *
- * @param server {Object} Current server;
- * @param instance {Object} The retrieved instance metadata;
- * @returns {String} The ReferenceSOPInstanceUID
- */
-async function getPaletteColors(server, instance, lutDescriptor) {
-  let paletteUID = DICOMWeb.getString(instance['00281199']);
-
-  return new Promise((resolve, reject) => {
-    let entry;
-    if (paletteColorCache.isValidUID(paletteUID)) {
-      entry = paletteColorCache.get(paletteUID);
-
-      if (entry) {
-        return resolve(entry);
-      }
-    }
-
-    // no entry in cache... Fetch remote data.
-    const r = getPaletteColor(server, instance, '00281201', lutDescriptor);
-    const g = getPaletteColor(server, instance, '00281202', lutDescriptor);
-    const b = getPaletteColor(server, instance, '00281203', lutDescriptor);
-
-    const promises = [r, g, b];
-
-    Promise.all(promises).then(args => {
-      entry = {
-        red: args[0],
-        green: args[1],
-        blue: args[2],
-      };
-
-      // when paletteUID is present, the entry can be cached...
-      entry.uid = paletteUID;
-      paletteColorCache.add(entry);
-
-      resolve(entry);
-    });
-  });
-}
-
-/**
- * Add a list of SOP Instances to a given study object descriptor
- * @param {Object} server Object with server configuration parameters
- * @param {Object} study The study descriptor to which the given SOP instances will be added
- * @param {Array} sopInstanceList A list of SOP instance objects
- */
-async function addInstancesToStudy(server, study, sopInstanceList) {
-  return Promise.all(
-    sopInstanceList.map(function(sopInstance) {
-      return makeSOPInstance(server, study, sopInstance);
-    })
-  );
-}
-
-const createStudyFromSOPInstanceList = async (server, sopInstanceList) => {
-  if (Array.isArray(sopInstanceList) && sopInstanceList.length > 0) {
-    const firstSopInstance = sopInstanceList[0];
-    const study = createStudy(server, firstSopInstance);
-    await addInstancesToStudy(server, study, sopInstanceList);
-    return study;
-  }
-  throw new Error('Failed to create study out of provided SOP instance list');
-};
-
-export { createStudyFromSOPInstanceList, addInstancesToStudy };

platform/core/src/utils/hotkeys/index.js

@@ -0,0 +1,8 @@
+import Mousetrap from 'mousetrap';
+import pausePlugin from './pausePlugin';
+import recordPlugin from './recordPlugin';
+
+recordPlugin(Mousetrap);
+pausePlugin(Mousetrap);
+
+export default Mousetrap;

platform/core/src/utils/hotkeys/recordPlugin.js

@@ -66,7 +66,7 @@ export default function(Mousetrap) {
         _recordCurrentCombo();
       }
 
-      for (i = 0; i < modifiers.length; ++i) {
+      for (let i = 0; i < modifiers.length; ++i) {
         _recordKey(modifiers[i]);
       }
       _recordKey(character);
@@ -85,10 +85,8 @@ export default function(Mousetrap) {
    * @returns void
    */
   function _recordKey(key) {
-    var i;
-
     // one-off implementation of Array.indexOf, since IE6-9 don't support it
-    for (i = 0; i < _currentRecordedKeys.length; ++i) {
+    for (let i = 0; i < _currentRecordedKeys.length; ++i) {
       if (_currentRecordedKeys[i] === key) {
         return;
       }
@@ -111,7 +109,7 @@ export default function(Mousetrap) {
     _recordedSequence.push(_currentRecordedKeys);
     _currentRecordedKeys = [];
     _recordedCharacterKey = false;
-    _restartRecordTimer();
+    _finishRecording();
   }
 
   /**
@@ -124,9 +122,7 @@ export default function(Mousetrap) {
    * @returns void
    */
   function _normalizeSequence(sequence) {
-    var i;
-
-    for (i = 0; i < sequence.length; ++i) {
+    for (let i = 0; i < sequence.length; ++i) {
       sequence[i].sort(function(x, y) {
         // modifier keys always come first, in alphabetical order
         if (x.length > 1 && y.length === 1) {
@@ -191,6 +187,28 @@ export default function(Mousetrap) {
     };
   };
 
+  /**
+   * stop recording
+   *
+   * @param {Function} callback
+   * @returns void
+   */
+  Mousetrap.prototype.stopRecord = function() {
+    var self = this;
+    self.recording = false;
+  };
+
+  /**
+   * start recording
+   *
+   * @param {Function} callback
+   * @returns void
+   */
+  Mousetrap.prototype.startRecording = function() {
+    var self = this;
+    self.recording = true;
+  };
+
   Mousetrap.prototype.handleKey = function() {
     var self = this;
     _handleKey.apply(self, arguments);

platform/core/src/utils/index.js

@@ -12,6 +12,7 @@ import DicomLoaderService from './dicomLoaderService.js';
 import b64toBlob from './b64toBlob.js';
 import * as urlUtil from './urlUtil';
 import makeCancelable from './makeCancelable';
+import hotkeys from './hotkeys';
 
 const utils = {
   guid,
@@ -29,6 +30,7 @@ const utils = {
   DicomLoaderService,
   urlUtil,
   makeCancelable,
+  hotkeys,
 };
 
 export {
@@ -47,6 +49,7 @@ export {
   DicomLoaderService,
   urlUtil,
   makeCancelable,
+  hotkeys,
 };
 
 export default utils;

platform/core/src/utils/index.test.js

@@ -18,6 +18,7 @@ describe('Top level exports', () => {
       'DicomLoaderService',
       'urlUtil',
       'makeCancelable',
+      'hotkeys',
     ].sort();
 
     const exports = Object.keys(utils.default).sort();

platform/core/src/utils/isDisplaySetReconstructable.js

@@ -67,6 +67,12 @@ function processSingleframe(instances) {
   if (instances.length > 2) {
     const firstIpp = _getImagePositionPatient(firstImage);
     const lastIpp = _getImagePositionPatient(instances[instances.length - 1]);
+
+    // We can't reconstruct if we are missing imagePositionPatient values
+    if (!firstIpp || !lastIpp) {
+      return { value: false };
+    }
+
     const averageSpacingBetweenFrames =
       _getPerpendicularDistance(firstIpp, lastIpp) / (instances.length - 1);
 
@@ -136,8 +142,13 @@ function _getSpacingIssue(spacing, averageSpacing) {
 }
 
 function _getImagePositionPatient(instance) {
-  return instance
-    .getTagValue('x00200032')
+  const tagValue = instance
+    .getTagValue('x00200032');
+  if (!tagValue) {
+    return;
+  }
+
+  return tagValue
     .split('\\')
     .map(element => Number(element));
 }