chore(release): publish [skip ci]

- @ohif/extension-vtk@1.12.39
 - @ohif/core@2.16.33
 - @ohif/viewer@4.12.45

.circleci/config.yml

@@ -13,11 +13,21 @@ version: 2.1
 ##
 orbs:
   codecov: codecov/codecov@1.0.5
-  cypress: cypress-io/cypress@1.13.0
-
+  cypress: cypress-io/cypress@1.26.0
+executors:
+  # Custom executor to override Cypress config
+  deploy-to-prod-executor:
+    docker:
+      - image: 'cypress/browsers:node14.15.0-chrome86-ff82'
+        environment:
+          CYPRESS_BASE_URL: https://ohif-staging.netlify.com/
+  chrome-and-pacs:
+    docker:
+      # Primary container image where all steps run.
+      - image: 'cypress/browsers:node14.15.0-chrome86-ff82'
 defaults: &defaults
   docker:
-    - image: circleci/node:12.9.1
+    - image: cimg/node:14.19
       environment:
         TERM: xterm # Enable colors in term
         QUICK_BUILD: true
@@ -36,12 +46,12 @@ jobs:
       - checkout:
           post:
             - git fetch --all
-      - restore_cache:
-          name: Restore Yarn and Cypress Package Cache
-          keys:
-            # when lock file changes, use increasingly general patterns to restore cache
-            - yarn-packages-{{ checksum "yarn.lock" }}
-            - yarn-packages-
+      # - restore_cache:
+      #     name: Restore Yarn and Cypress Package Cache
+      #     keys:
+      #       # when lock file changes, use increasingly general patterns to restore cache
+      #       - yarn-packages-{{ checksum "yarn.lock" }}
+      #       - yarn-packages-
       - run:
           name: Install Dependencies
           command: yarn install --frozen-lockfile
@@ -95,18 +105,19 @@ jobs:
           post:
             - git fetch --all
 
-      - restore_cache:
-          name: Restore Yarn and Cypress Package Cache
-          keys:
-            # when lock file changes, use increasingly general patterns to restore cache
-            - yarn-packages-{{ checksum "yarn.lock" }}
-            - yarn-packages-
+      # - restore_cache:
+      #     name: Restore Yarn and Cypress Package Cache
+      #     keys:
+      #       # when lock file changes, use increasingly general patterns to restore cache
+      #       - yarn-packages-{{ checksum "yarn.lock" }}
+      #       - yarn-packages-
 
       - run:
           name: Install Dependencies
           command: yarn install --frozen-lockfile
 
       - setup_remote_docker:
+          version: 19.03.13
           docker_layer_caching: false
 
       - run:
@@ -131,12 +142,12 @@ jobs:
       - checkout:
           post:
             - git fetch --all
-      - restore_cache:
-          name: Restore Yarn and Cypress Package Cache
-          keys:
-            # when lock file changes, use increasingly general patterns to restore cache
-            - yarn-packages-{{ checksum "yarn.lock" }}
-            - yarn-packages-
+      # - restore_cache:
+      #     name: Restore Yarn and Cypress Package Cache
+      #     keys:
+      #       # when lock file changes, use increasingly general patterns to restore cache
+      #       - yarn-packages-{{ checksum "yarn.lock" }}
+      #       - yarn-packages-
       - run:
           name: Install Dependencies
           command: yarn install --frozen-lockfile
@@ -170,7 +181,7 @@ jobs:
 
   DEPLOY_TO_DEV:
     docker:
-      - image: circleci/node:12.9.1
+      - image: circleci/node:14.15.0
         environment:
           TERM: xterm
           NETLIFY_SITE_ID: 32708787-c9b0-4634-b50f-7ca41952da77
@@ -185,7 +196,7 @@ jobs:
 
   DEPLOY_TO_STAGING:
     docker:
-      - image: circleci/node:12.9.1
+      - image: circleci/node:14.15.0
         environment:
           TERM: xterm
           NETLIFY_SITE_ID: c7502ae3-b150-493c-8422-05701e44a969
@@ -200,7 +211,7 @@ jobs:
 
   DEPLOY_TO_PRODUCTION:
     docker:
-      - image: circleci/node:12.9.1
+      - image: circleci/node:14.15.0
         environment:
           TERM: xterm
           NETLIFY_SITE_ID: 79c4a5da-5c95-4dc9-84f7-45fd9dfe21b0
@@ -225,11 +236,11 @@ jobs:
           post:
             - git fetch --all
       # Use increasingly general patterns to restore cache
-      - restore_cache:
-          name: Restore Yarn and Cypress Package Cache
-          keys:
-            - yarn-packages-{{ checksum "yarn.lock" }}
-            - yarn-packages-
+      # - restore_cache:
+      #     name: Restore Yarn and Cypress Package Cache
+      #     keys:
+      #       - yarn-packages-{{ checksum "yarn.lock" }}
+      #       - yarn-packages-
       - run:
           name: Install Dependencies
           command: yarn install --frozen-lockfile
@@ -257,7 +268,12 @@ jobs:
           paths: .
 
   DOCS_PUBLISH:
-    <<: *defaults
+    docker:
+      # Gitbook fails due to graceful-fs updates above this node version :-(
+      - image: circleci/node:12.9.1
+        environment:
+          TERM: xterm # Enable colors in term
+    working_directory: ~/repo
     steps:
       - checkout
       - run:
@@ -278,6 +294,7 @@ jobs:
       - attach_workspace:
           at: ~/repo
       - setup_remote_docker:
+          version: 19.03.13
           docker_layer_caching: false
       - run:
           name: Build and push Docker image
@@ -317,16 +334,21 @@ workflows:
       # E2E: PWA
       - cypress/run:
           name: 'E2E: PWA'
-          executor: cypress/browsers-chrome76
+          executor: chrome-and-pacs
           browser: chrome
           pre-steps:
-            - run: 'rm -rf ~/.yarn && npm i -g yarn && yarn -v && yarn global
-                add wait-on' # Use yarn latest
+            - run: |
+                # Clear yarn cache; update to latest
+                rm -rf ~/.yarn
+                npm i -g yarn
+                yarn -v
           yarn: true
-          record: false
-          store_artifacts: false
+          record: true
+          store_artifacts: true
           working_directory: platform/viewer
-          build: npx cross-env QUICK_BUILD=true yarn run build
+          build:
+            git submodule update --init && npx cross-env QUICK_BUILD=true
+            APP_CONFIG=config/e2e.js yarn run build
           start: yarn run test:e2e:serve
           spec: 'cypress/integration/common/**/*,cypress/integration/pwa/**/*'
           wait-on: 'http://localhost:3000'
@@ -337,21 +359,24 @@ workflows:
                 path: platform/viewer/cypress/screenshots
             - store_artifacts:
                 path: platform/viewer/cypress/videos
+            - store_test_results:
+                path: platform/viewer/cypress/results
           requires:
             - UNIT_TESTS
       # E2E: script-tag
       - cypress/run:
           name: 'E2E: Script Tag'
-          executor: cypress/browsers-chrome76
+          executor: chrome-and-pacs
           browser: chrome
           pre-steps:
-            - run: 'rm -rf ~/.yarn && npm i -g yarn && yarn -v && yarn global
-                add wait-on' # Use yarn latest
+            - run: 'rm -rf ~/.yarn && npm i -g yarn && yarn -v' # Use yarn latest
           yarn: true
-          record: false
-          store_artifacts: false
+          record: true
+          store_artifacts: true
           working_directory: platform/viewer
-          build: npx cross-env QUICK_BUILD=true yarn run build:package
+          build:
+            git submodule update --init && npx cross-env QUICK_BUILD=true
+            APP_CONFIG=config/e2e.js yarn run build:package
           start: yarn run test:e2e:serve
           spec: 'cypress/integration/common/**/*,cypress/integration/script-tag/**/*'
           wait-on: 'http://localhost:3000'
@@ -362,6 +387,8 @@ workflows:
                 path: platform/viewer/cypress/screenshots
             - store_artifacts:
                 path: platform/viewer/cypress/videos
+            - store_test_results:
+                path: platform/viewer/cypress/results
           requires:
             - UNIT_TESTS
 
@@ -372,7 +399,7 @@ workflows:
       # Update hub.docker.org
       - cypress/run:
           name: 'Generate Percy Snapshots'
-          executor: cypress/browsers-chrome76
+          executor: chrome-and-pacs
           browser: chrome
           pre-steps:
             - run: 'rm -rf ~/.yarn && npm i -g yarn && yarn -v && yarn global
@@ -380,7 +407,9 @@ workflows:
           yarn: true
           store_artifacts: false
           working_directory: platform/viewer
-          build: npx cross-env QUICK_BUILD=true yarn run build
+          build:
+            git submodule update --init && npx cross-env QUICK_BUILD=true
+            APP_CONFIG=config/e2e.js yarn run build
           # start server --> verify running --> percy + chrome + cypress
           command: yarn run test:e2e:dist
           cache-key: 'yarn-packages-{{ checksum "yarn.lock" }}'
@@ -449,7 +478,7 @@ workflows:
       # and record a Cypress dashboard test run
       - cypress/run:
           name: 'Generate Percy Snapshots'
-          executor: cypress/browsers-chrome76
+          executor: chrome-and-pacs
           browser: chrome
           pre-steps:
             - run: 'rm -rf ~/.yarn && npm i -g yarn && yarn -v && yarn global
@@ -457,7 +486,9 @@ workflows:
           yarn: true
           store_artifacts: false
           working_directory: platform/viewer
-          build: npx cross-env QUICK_BUILD=true yarn run build
+          build:
+            git submodule update --init && npx cross-env QUICK_BUILD=true
+            APP_CONFIG=config/e2e.js yarn run build
           # start server --> verify running --> percy + chrome + cypress
           command: yarn run test:e2e:dist
           cache-key: 'yarn-packages-{{ checksum "yarn.lock" }}'

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

@@ -28,6 +28,12 @@ if [ -n "$CLIENT_ID" ] || [ -n "$HEALTHCARE_API_ENDPOINT" ]
 	  cp /usr/share/nginx/html/google.js /usr/share/nginx/html/app-config.js
 fi
 
+if [ -n "${PORT}" ]
+  then
+    echo "Changing port to ${PORT}..."
+    sed -i -e "s/listen 80/listen ${PORT}/g" /etc/nginx/conf.d/default.conf
+fi
+
 echo "Starting Nginx to serve the OHIF Viewer..."
 
 exec "$@"

.github/FUNDING.yml

@@ -0,0 +1 @@
+custom: https://giving.massgeneral.org/ohif

.github/ISSUE_TEMPLATE/---support-question.md

@@ -1,18 +0,0 @@
----
-name: "\U0001F917 Support Question"
-about: "I have a question \U0001F4AC"
-title: ''
-labels: 'Community: Question :question:, Triage :white_flag:'
-assignees: ''
----
-
-> :hand: We are a small team with limited resources. Your question is much more
-> likely to be answered if it is
-> [a good question](https://stackoverflow.com/help/how-to-ask)
-
-**Description**
-
-Questions can often be answered by our documentation. Unable to find an answer
-in our docs? We'll try to help. In the meantime, if you answer your own
-question, please respond with the answer here so that others may benefit as
-well. Better yet, open a PR to expand our docs ^\_^

.github/ISSUE_TEMPLATE/config.yml

@@ -0,0 +1,5 @@
+blank_issues_enabled: false
+contact_links:
+  - name: 🤗 Support Question
+    url: https://community.ohif.org/
+    about: Please use our forum if you have questions or need help.

.github/stale.yml

@@ -2,9 +2,9 @@
 # https://github.com/apps/stale
 #
 # Number of days of inactivity before an issue becomes stale
-daysUntilStale: 21
+daysUntilStale: 180
 # Number of days of inactivity before a stale issue is closed
-daysUntilClose: 7
+daysUntilClose: 9000
 # Issues with these labels will never be considered stale
 exemptLabels:
   - 'Story :raised_hands:'
@@ -18,6 +18,9 @@ exemptLabels:
   - 'Triage :white_flag:'
   - 'Extension: Discussion'
   - 'Announcement 🎉'
+  - 'IDC:priority'
+  - 'IDC:candidate'
+  - 'IDC:collaboration'
 # Label to use when marking an issue as stale
 staleLabel: 'Stale :baguette_bread:'
 # Comment to post when marking an issue as stale. Set to `false` to disable

.gitignore

@@ -8,7 +8,10 @@ docs/_book
 src/version.js
 junit.xml
 coverage/
-.docz/
+*.js.map
+.yarn
+platform/docs/.docusaurus
+platform/ui/storybook-static
 
 # YALC (for Erik)
 .yalc

.gitmodules

@@ -0,0 +1,3 @@
+[submodule "testdata"]
+	path = testdata
+	url = https://github.com/OHIF/viewer-testdata-dicomweb.git

.netlify/build-deploy-preview.sh

@@ -11,6 +11,7 @@ node -v
 
 # Install build deps and all monorepo package dependencies. Yarn Workspaces
 # should also symlink all projects appropriately
+yarn run lerna:restore
 yarn install --no-ignore-optional --pure-lockfile
 
 # Build && Move PWA Output
@@ -21,6 +22,9 @@ mv platform/viewer/dist/* .netlify/www/pwa -v
 # Build && Move script output
 # yarn run build:package
 
+# Cache all of the node_module dependencies in
+# extensions, modules, and platform packages
+yarn run lerna:cache
 echo 'Nothing left to see here. Go home, folks.'
 
 # Build using react-scripts

.node-version

@@ -0,0 +1 @@
+14.18.0

.vscode/launch.json

@@ -0,0 +1,15 @@
+{
+  // Use IntelliSense to learn about possible attributes.
+  // Hover to view descriptions of existing attributes.
+  // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
+  "version": "0.2.0",
+  "configurations": [
+    {
+      "type": "pwa-chrome",
+      "request": "launch",
+      "name": "Launch Chrome against localhost",
+      "url": "http://localhost:3000",
+      "webRoot": "${workspaceFolder}"
+    }
+  ]
+}

.webpack/webpack.base.js

@@ -3,7 +3,6 @@ const dotenv = require('dotenv');
 //
 const path = require('path');
 const webpack = require('webpack');
-const PACKAGE = require('../platform/viewer/package.json');
 // ~~ RULES
 const loadShadersRule = require('./rules/loadShaders.js');
 const loadWebWorkersRule = require('./rules/loadWebWorkers.js');
@@ -29,7 +28,7 @@ module.exports = (env, argv, { SRC_DIR, DIST_DIR }) => {
 
   const config = {
     mode: isProdBuild ? 'production' : 'development',
-    devtool: isProdBuild ? 'source-map' : 'cheap-module-eval-source-map',
+    devtool: isProdBuild ? 'source-map' : 'eval-cheap-module-source-map',
     entry: {
       app: `${SRC_DIR}/index.js`,
     },
@@ -77,7 +76,10 @@ module.exports = (env, argv, { SRC_DIR, DIST_DIR }) => {
         '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.VERSION_NUMBER': webpack.DefinePlugin.runtimeValue(() => {
+          const package = require('../platform/viewer/package.json');
+          return JSON.stringify(package.version || '');
+        }, ['../platform/viewer/package.json']),
         'process.env.BUILD_NUM': JSON.stringify(BUILD_NUM),
         /* i18n */
         'process.env.USE_LOCIZE': JSON.stringify(process.env.USE_LOCIZE || ''),

CITATION.cff

@@ -0,0 +1,24 @@
+cff-version: 1.2.0
+message: "If you use this software, please cite it as below."
+authors:
+- family-names: "Ziegler"
+  given-names: "Erik"
+  orcid: "https://orcid.org/0000-0003-1857-8129"
+- family-names: "Urban"
+  given-names: "Trinity"
+- family-names: "Brown"
+  given-names: "Danny"
+- family-names: "Petts"
+  given-names: "James"
+- family-names: "Pieper"
+  given-names: "Steve D"
+- family-names: "Lewis"
+  given-names: "Rob"
+- family-names: "Hafey"
+  given-names: "Chris"
+- family-names: "Harris"
+  given-names: "Gordon J"
+title: "Open Health Imaging Foundation Viewer: An Extensible Open-Source Framework for Building Web-Based Imaging Applications to Support Cancer Research"
+doi: 10.1200/CCI.19.00131
+version: 1.0.0
+url: "https://github.com/OHIF/Viewers"

Dockerfile

@@ -21,7 +21,7 @@
 
 # Stage 1: Build the application
 # docker build -t ohif/viewer:latest .
-FROM node:10.16.3-slim as builder
+FROM node:14-slim as builder
 
 RUN mkdir /usr/src/app
 WORKDIR /usr/src/app
@@ -39,9 +39,10 @@ COPY package.json /usr/src/app/package.json
 COPY postcss.config.js /usr/src/app/postcss.config.js
 COPY yarn.lock /usr/src/app/yarn.lock
 
+RUN apt-get update && apt-get install -y python make g++
 # Run the install before copying the rest of the files
 RUN yarn config set workspaces-experimental true
-RUN yarn install
+RUN yarn install --verbose
 
 ENV PATH /usr/src/app/node_modules/.bin:$PATH
 ENV QUICK_BUILD true
@@ -52,7 +53,7 @@ RUN yarn run build
 
 # Stage 2: Bundle the built application into a Docker container
 # which runs Nginx using Alpine Linux
-FROM nginx:1.15.5-alpine
+FROM nginx:1.21.1-alpine
 RUN apk add --no-cache bash
 RUN rm -rf /etc/nginx/conf.d
 COPY .docker/Viewer-v2.x /etc/nginx/conf.d

README.md

@@ -121,8 +121,7 @@ window.config = {
 };
 ```
 
-- Install the viewer:
-  `window.OHIFStandaloneViewer.installViewer(window.config);`
+- Install the viewer: `window.OHIFViewer.installViewer(window.config);`
 
 This exact setup is demonstrated in this
 [CodeSandbox](https://codesandbox.io/s/viewer-script-tag-tprch) and in our
@@ -259,6 +258,33 @@ Cancer Institute, Informatics Technology for Cancer Research (ITCR) program,
 under a
 [grant to Dr. Gordon Harris at Massachusetts General Hospital (U24 CA199460)](https://projectreporter.nih.gov/project_info_description.cfm?aid=8971104).
 
+## Projects that contributed to OHIF Viewer
+
+The following is a (partial) list of projects that contributed resources towards
+development of OHIF Viewer:
+
+- [NCI Imaging Data Commons (IDC) project](https://imaging.datacommons.cancer.gov/)
+  supported development of new features and bug fixes marked with
+  ["IDC:priority"](https://github.com/OHIF/Viewers/issues?q=is%3Aissue+is%3Aopen+label%3AIDC%3Apriority),
+  ["IDC:candidate"](https://github.com/OHIF/Viewers/issues?q=is%3Aissue+is%3Aopen+label%3AIDC%3Acandidate)
+  or
+  ["IDC:collaboration"](https://github.com/OHIF/Viewers/issues?q=is%3Aissue+is%3Aopen+label%3AIDC%3Acollaboration).
+  NCI Imaging Data Commons is supported by the contract number 19X037Q from
+  Leidos Biomedical Research under Task Order HHSN26100071 from NCI.
+  [IDC Viewer](https://learn.canceridc.dev/portal/visualization) is a customized
+  version of the OHIF Viewer.
+  
+### Research notice
+Please note that this repository is participating in a study into sustainability
+ of open source projects. Data will be gathered about this repository for
+ approximately the next 12 months, starting from June 2021.
+
+Data collected will include number of contributors, number of PRs, time taken to
+ close/merge these PRs, and issues closed.
+
+For more information, please visit
+[our informational page](https://sustainable-open-science-and-software.github.io/) or download our [participant information sheet](https://sustainable-open-science-and-software.github.io/assets/PIS_sustainable_software.pdf).
+
 ## License
 
 MIT © [OHIF](https://github.com/OHIF)

docs/latest/README.md

@@ -48,7 +48,7 @@ Check out these helpful links:
   -->
 
 <!-- prettier-ignore-start -->
-[ohif-org]: https://www.ohif.org
+[ohif-org]: http://www.ohif.org
 [dicom-web]: https://en.wikipedia.org/wiki/DICOMweb
 [gh-issues]: https://github.com/OHIF/Viewers/issues
 <!-- prettier-ignore-end -->

docs/latest/SUMMARY.md

@@ -5,6 +5,7 @@
   - [Getting Started](development/getting-started.md)
   - [Contributing](development/contributing.md)
   - [Continuous Integration](development/continous-integration.md)
+  - [Testing](development/testing.md)
 - [Configuring](configuring/index.md)
   - [Data Source](configuring/data-source.md)
 

docs/latest/architecture/index.md

@@ -13,7 +13,6 @@ architected, and the role each of it's dependent libraries plays.
 - [Overview](#overview)
 - [Business Logic](#business-logic)
 - [Component Library](#react-component-library)
-- [Internationalization](#internationalization-i18n)
 - [Extensions & Configuration](#extensions--configuration)
 - [Common Questions](#common-questions)
 
@@ -74,10 +73,10 @@ This diagram is a conceptual illustration of how the Viewer is architected.
 The [`@ohif/core`][core-github] project offers pre-packaged solutions for
 features common to Web-based medical imaging viewers. For example:
 
-- [Hotkeys](#)
+- Hotkeys
 - DICOM Web requests
 - Hanging Protocols
-- [Managing a study's measurements](../services/default/measurements.md)
+- Managing a study's measurements
 - Managing a study's DICOM metadata
 - [A flexible pattern for extensions](../extensions/index.md)
 - And many others
@@ -99,10 +98,6 @@ application.
 
 [Check out our component library!](https://react.ohif.org/)
 
-## Internationalization (i18n)
-
-...
-
 ## Extensions & Configuration
 
 While OHIF maintains several high value and commonly requested features in its
@@ -120,7 +115,7 @@ the viewer. Some common use cases include:
 We expose common integration points via [extensions](../extensions/index.md) to
 make this possible. The viewer and many of our own extensions also offer
 [configuration][configuration]. For a list of extensions maintained by OHIF,
-[check out this helpful table](../extensions/index.mdl#maintained-extensions).
+[check out this helpful table](../extensions/index.md#maintained-extensions).
 
 If you find yourself thinking "I wish the Viewer could do X", and you can't
 accomplish it with an extension today, create a GitHub issue! We're actively
@@ -147,12 +142,12 @@ you would need to recreate.
   -->
 
 <!-- prettier-ignore-start -->
-[monorepo]: #
+[monorepo]: https://github.com/OHIF/Viewers/issues/768
 [viewers-project]: https://github.com/OHIF/Viewers
 [viewer-npm]: https://www.npmjs.com/package/@ohif/viewer
 [pwa]: https://developers.google.com/web/progressive-web-apps/
 [configuration]: ../configuring/index.md
 [extensions]: ../extensions/index.md
 [core-github]: https://github.com/OHIF/viewers/platform/core
-[ui-github]: https://github.com/OHIF/Viewers/platform/ui
+[ui-github]: https://github.com/OHIF/Viewers/tree/master/platform/ui
 <!-- prettier-ignore-end -->

docs/latest/book.json

@@ -8,7 +8,6 @@
     "-fontsettings",
     "github",
     "ga",
-    "sitemap",
     "anchors",
     "versions"
   ],
@@ -24,7 +23,8 @@
       "token": "UA-110573590-2"
     },
     "sitemap": {
-      "hostname": "https://docs.ohif.org"
+      "hostname": "https://docs.ohif.org",
+      "todo": "sitemap plugin removed; causing build errors"
     },
     "versions": {
       "gitbookConfigURL": "https://raw.githubusercontent.com/OHIF/Viewers/master/docs/book.json",

docs/latest/deployment/index.md

@@ -123,14 +123,111 @@ There are two important steps to making sure this setup works:
 Most image archives do not provide either of these features "out of the box".
 It's common to use IIS, Nginx, or Apache to route incoming requests and append
 appropriate headers. You can find an example of this setup in our
-[Nginx + Image Archive Deployment Recipe](deployment/recipes/nginx--image-archive.md).
+[Nginx + Image Archive Deployment Recipe](./recipes/nginx--image-archive.md).
 
 #### What if my archive doesn't support DicomWeb?
 
-> This is possible to do with the OHIF Viewer, but not as straightforward. Look
-> out for documentation on this subject in the near future.
+It's possible to supply all Study data via JSON format, in the event you do not have a DicomWeb endpoint.
+You can host all of the relevant files on any web accessible server (Amazon S3, Azure Blob Storage, Local file server etc.)
+
+This JSON is supplied via the '?url=' query parameter.
+It should reference an endpoint that returns **application/json** formatted text.
+
+If you do not have an API, you can simply return a text file containing the JSON from any web server.
+
+
+You tell the OHIF viewer to use JSON by appending the `'?url='` query to the `/Viewer` route:
+
+eg. `https://my-test-ohif-server/viewer?url=https://my-json-server/study-uid.json`
+
+The returned JSON object must contain a single root object with a 'studies' array.
+
+
+*Sample JSON format:*
+```JSON
+{
+    "studies": [
+      {
+        "StudyInstanceUID": "1.2.840.113619.2.5.1762583153.215519.978957063.78",
+        "StudyDescription": "BRAIN SELLA",
+        "StudyDate": "20010108",
+        "StudyTime": "120022",
+        "PatientName": "MISTER^MR",
+        "PatientId": "832040",
+        "series": [
+          {
+            "SeriesDescription": "SAG T-1",
+            "SeriesInstanceUID": "1.2.840.113619.2.5.1762583153.215519.978957063.121",
+            "SeriesNumber": 2,
+            "SeriesDate": "20010108",
+            "SeriesTime": "120318",
+            "Modality": "MR",
+            "instances": [
+              {
+                "metadata": {
+                    "Columns": 512,
+                    "Rows": 512,
+                    "InstanceNumber": 3,
+                    "AcquisitionNumber": 0,
+                    "PhotometricInterpretation": "MONOCHROME2",
+                    "BitsAllocated": 16,
+                    "BitsStored": 16,
+                    "PixelRepresentation": 1,
+                    "SamplesPerPixel": 1,
+                    "PixelSpacing": [0.390625, 0.390625],
+                    "HighBit": 15,
+                    "ImageOrientationPatient": [0,1,0,0,0,-1],
+                    "ImagePositionPatient": [11.600000,-92.500000, 98.099998],
+                    "FrameOfReferenceUID": "1.2.840.113619.2.5.1762583153.223134.978956938.470",
+                    "ImageType": ["ORIGINAL","PRIMARY","OTHER"],
+                    "Modality": "MR",
+                    "SOPInstanceUID": "1.2.840.113619.2.5.1762583153.215519.978957063.124",
+                    "SeriesInstanceUID": "1.2.840.113619.2.5.1762583153.215519.978957063.121",
+                    "StudyInstanceUID": "1.2.840.113619.2.5.1762583153.215519.978957063.78"
+                },
+                "url": "dicomweb://s3.amazonaws.com/lury/MRStudy/1.2.840.113619.2.5.1762583153.215519.978957063.124.dcm"
+             }
+           ]
+         }
+       ]
+     }
+   ]
+}
+```
+More info on this JSON format can be found here [Issue #1500](https://github.com/OHIF/Viewers/issues/1500)
+
+
+**Implementation Notes:**
+
+1. When hosting the viewer, you will also need to host a /viewer route on the server - or the browser may not be able to find the route.
+2. For each instance url (dicom object) in the returned JSON, you must prefix the `url` with `dicomweb:` in order for the cornerstone image loader to retrieve it correctly.
+ eg. `https://image-server/my-image.dcm` ---> `dicomweb:https://image-server/my-image.dcm`
+3. The JSON format above is compatible with >= v3.7.8 of the application. Older versions of the viewer used a different JSON format. As of 20/04/20 the public [https://viewer.ohif.org/] is a pre 3.0 version that does not support this format yet.
+4. The JSON format is case-sensitive. Please ensure you have matched casing with the naturalised Dicom format referenced in [Issue #1500](https://github.com/OHIF/Viewers/issues/1500).
+
+*CORS Issues (Cross-Origin Resource Sharing)*
+
+If you host a JSON API or Images on a different domain from the the app itself, you will likely have CORS issues. This will also happen when testing from Localhost and reaching out to remote servers.
+Even if the domain is the same, different ports, subdomains or protocols (https vs http) will also cause CORS errors.
+You will to need add a configuration on each server hosting these assets to allow your App server origin.
+
+For example:
+
+Lets assume your application is hosted on `https://my-ohif-server.com`.
+
+Your JSON API is hosted on `https://my-json-api.aws.com`
+
+And your images are stored on Amazon S3 at `https://my-s3-bucket.aws.com`
+
+When you first start your application, browsing to `https://my-ohif-server.com/viewer?url=https://my-json-api.aws.com/api/my-json-study-info.json`, you will likely get a CORS error in the browser console as it tries to connect to `https://my-json-api.aws.com`.
+
+Adding a setting on the JSON server to allow the CORS origin = `https://my-ohif-server.com` should solve this.
+
+Next, you will likely get a similar CORS error, as the browser tries to go to `https://my-s3-bucket.aws.com`.
+You will need to go to the S3 bucket configuration, and add a CORS setting to allow origin = `https://my-ohif-server.com`.
+
+Essentially, whenever the application connects to a remote resource, you will need to add the applications url to the allowed CORS Origins on that resource. Adding an origin similar to https://localhost:3000 will also allow for local testing.
 
-...
 
 ### Securing Your Data
 
@@ -166,7 +263,7 @@ window.config = {
 ```
 
 You can find an example of this setup in our
-[User Account Control Deployment Recipe](deployment/recipes/user-account-control.md).
+[User Account Control Deployment Recipe](./recipes/user-account-control.md).
 
 #### Choosing a Flow for the Viewer
 
@@ -183,12 +280,12 @@ many possible configurations, so please don't feel limited to these setups.
 Please feel free to suggest or contribute your own recipes.
 
 - Script Include
-  - [Embedding the Viewer](deployment/recipes/embedded-viewer.md)
+  - [Embedding the Viewer](./recipes/embedded-viewer.md)
 - Stand-Alone
-  - [Build for Production](deployment/recipes/build-for-production.md)
-  - [Static](deployment/recipes/static-assets.md)
-  - [Nginx + Image Archive](deployment/recipes/nginx--image-archive.md)
-  - [User Account Control](deployment/recipes/user-account-control.md)
+  - [Build for Production](./recipes/build-for-production.md)
+  - [Static](./recipes/static-assets.md)
+  - [Nginx + Image Archive](./recipes/nginx--image-archive.md)
+  - [User Account Control](./recipes/user-account-control.md)
 
 <!--
   Links

docs/latest/deployment/recipes/embedded-viewer.md

@@ -50,7 +50,7 @@ window.config = {
 ```
 
 To learn more about how you can configure the OHIF Viewer, check out our
-[Configuration Guide](./index.md).
+[Configuration Guide](../../configuring/index.md).
 
 <ol start="3"><li>
   Render the viewer in the web page's target <code>div</code>
@@ -126,12 +126,39 @@ globally defined styles/scripts.
 > We're trying to embed the OHIF Viewer into an existing React App, but seeing
 > react-dom and react conflicts. What can we do?
 
+If you are installing OHIF viewer inside another react app, you may use `installViewer` as follows:
+```
+import { installViewer } from '@ohif/viewer'
+
+const ohifViewerConfig = window.config // or set it here
+const containerId = 'ohif'
+const componentRenderedOrUpdatedCallback = function() {
+    console.log('OHIF Viewer rendered/updated');
+};
+
+componentDidMount() {
+   installViewer(
+      ohifViewerConfig,
+      containerId,
+      componentRenderedOrUpdatedCallback
+    );
+}
+
+render () {
+   ...
+   //you can render in any element you wish
+   <AnyTag id={containerId}/>
+}
+
+```
+
 `installViewer` is a convenience method that pulls in some dependencies that may
 not be compatible with existing `react` apps. `@ohif/viewer` also exports `App`
 which is a react component that takes the `configuration` outlined above as
 props. You can use it as a reusable component, and to avoid `react` version
 conflict issues.
 
+
 <!--
   LINKS
   -->

docs/latest/deployment/recipes/nginx--image-archive.md

@@ -8,7 +8,9 @@ OHIF Viewer and its medical imaging data. This post covers one of many potential
 setups that accomplish that. Please note, noticably absent is user account
 control.
 
-Do not use this recipe to host sensitive medical data on the open web. Depending
+> **Do not use this recipe to host sensitive medical data on the open web!** 
+
+Depending
 on your company's policies, this may be an appropriate setup on an internal
 network when protected with a server's basic authentication. For a more robust
 setup, check out our [user account control recipe](./user-account-control.md)
@@ -23,13 +25,13 @@ Our two biggest hurdles when hosting our image archive and web client are:
 
 ### Handling Web Requests
 
-We mittigate our first issue by allowing [Nginx][nginx] to handle incoming web
+We mitigate our first issue by allowing [Nginx][nginx] to handle incoming web
 requests. Nginx is open source software for web serving, reverse proxying,
 caching, and more. It's designed for maximum performance and stability --
 allowing us to more reliably serve content than Orthanc's built-in server can.
 
 More specifically, we accomplish this by using a
-[`reverse proxy`](https://en.wikipedia.org/wiki/Reverse_proxy) to retrieve
+[`reverse proxy`](https://en.wikipedia.org/wiki/Reverse_proxy) to retrieve 
 resources from our image archive (Orthanc), and when accessing its web admin.
 
 > A reverse proxy is a type of proxy server that retrieves resources on behalf
@@ -38,7 +40,7 @@ resources from our image archive (Orthanc), and when accessing its web admin.
 
 ### CORS Issues
 
-Cross-Origin Resource Sharing (CORS) is a mechanism that uses HTTP headers to
+[Cross-Origin Resource Sharing][understanding-cors] (CORS) is a mechanism that uses HTTP headers to
 tell a browser which web applications have permission to access selected
 resources from a server at a different origin (domain, protocol, port). IE. By
 default, a Web App located at `http://my-website.com` can't access resources
@@ -49,12 +51,7 @@ We can solve this one of two ways:
 1. Have our Image Archive located at the same domain as our Web App
 2. Add appropriate `Access-Control-Allow-*` HTTP headers
 
-This solution uses the first approach, but you can see an example of the second
-in the `docker-compose` bundled with this project for local development:
-[HERE](https://github.com/OHIF/Viewers/blob/master/platform/viewer/.recipes/Nginx-Orthanc/docker-compose.yml)
-
-You can read more about CORS in this Medium article: [Understanding
-CORS][understanding-cors]
+**This solution uses the first approach.**
 
 ### Diagram
 
@@ -75,6 +72,8 @@ This setup allows us to create a setup similar to the one pictured below:
 - Docker
   - [Docker for Mac](https://docs.docker.com/docker-for-mac/)
   - [Docker for Windows](https://docs.docker.com/docker-for-windows/)
+- Node 16.x with optional Python and Visual Studio Build Tools ([webpack 4 has an issue](https://github.com/webpack/webpack/issues/14532) with Node 17.x)
+  - [Node.js](https://nodejs.org/en/download/)
 
 _Not sure if you have `docker` installed already? Try running `docker --version`
 in command prompt or terminal_
@@ -83,7 +82,7 @@ in command prompt or terminal_
 
 _Spin Things Up_
 
-- Navigate to `<project-root>/docker/OpenResty-Orthanc` in your shell
+- Navigate to `./platform/viewer/.recipes/OpenResty-Orthanc` in your shell
 - Run `docker-compose up`
 
 _Upload Your First Study_
@@ -96,16 +95,16 @@ _Upload Your First Study_
 
 ### Troubleshooting
 
-_Exit code 137_
+#### Exit code 137
 
 This means Docker ran out of memory. Open Docker Desktop, go to the `advanced`
 tab, and increase the amount of Memory available.
 
-_Cannot create container for service X_
+#### Cannot create container for service X
 
 Use this one with caution: `docker system prune`
 
-_X is already running_
+#### X is already running
 
 Stop running all containers:
 
@@ -121,13 +120,13 @@ likely want to update:
 
 #### OHIF Viewer
 
-The OHIF Viewer's configuration is imported from a static `.js` file. The configuration we use is set to a specific file when we build the viewer, and determined by the env variable: `APP_CONFIG`. You can see where we set its value in the `dockerfile` for this solution:
+The OHIF Viewer's configuration is imported from a static `.js` file. The
+configuration we use is set to [a specific file][config-ohif] when we build the viewer, and
+determined by the env variable: `APP_CONFIG`. You can see where we set its value
+in the `dockerfile` for this solution:
 
 `ENV APP_CONFIG=config/docker_openresty-orthanc.js`
 
-You can find the configuration we're using here:
-`/public/config/docker_openresty-orthanc.js`
-
 To rebuild the `webapp` image created by our `dockerfile` after updating the
 Viewer's configuration, you can run:
 
@@ -136,13 +135,13 @@ Viewer's configuration, you can run:
 
 #### Other
 
-All other files are found in: `/docker/OpenResty-Orthanc/`
+All other files in this directory include
 
-| Service           | Configuration                                  | Docs                                        |
-| ----------------- | ---------------------------------------------- | ------------------------------------------- |
-| OHIF Viewer       | [dockerfile][dockerfile] / [config.js][config] | You're reading them now!                    |
-| OpenResty (Nginx) | [`/nginx.conf`][config-nginx]                  | [lua-resty-openidc][lua-resty-openidc-docs] |
-| Orthanc           | [`/orthanc.json`][config-orthanc]              | [Here][orthanc-docs]                        |
+| Service           | Configuration                     | Docs                                        |
+| ----------------- | --------------------------------- | ------------------------------------------- |
+| OHIF Viewer       | [dockerfile][dockerfile]          | You're reading them now!                    |
+| OpenResty (Nginx) | [`/nginx.conf`][config-nginx]     | [lua-resty-openidc][lua-resty-openidc-docs] |
+| Orthanc           | [`/orthanc.json`][config-orthanc] | [Here][orthanc-docs]                        |
 
 ## Next Steps
 
@@ -218,10 +217,11 @@ following resources helpful:
 - [OpenResty Guide](http://www.staticshin.com/programming/definitely-an-open-resty-guide/)
 - [Lua Ngx API](https://openresty-reference.readthedocs.io/en/latest/Lua_Nginx_API/)
 
-For a different take on this setup, check out the repository one of our
-community members put together:
+For a different take on this setup, check out the repositories our community
+members put together:
 
 - [mjstealey/ohif-orthanc-dimse-docker](https://github.com/mjstealey/ohif-orthanc-dimse-docker)
+- [trypag/ohif-orthanc-postgres-docker](https://github.com/trypag/ohif-orthanc-postgres-docker)
 
 <!--
   Links
@@ -234,8 +234,9 @@ community members put together:
 [orthanc-docs]: http://book.orthanc-server.com/users/configuration.html#configuration
 [lua-resty-openidc-docs]: https://github.com/zmartzone/lua-resty-openidc
 <!-- SRC -->
-[config]: #
-[dockerfile]: #
-[config-nginx]: #
-[config-orthanc]: #
+
+[config-ohif]: https://github.com/OHIF/Viewers/blob/master/platform/viewer/public/config/docker_openresty-orthanc.js
+[dockerfile]: https://github.com/OHIF/Viewers/blob/master/platform/viewer/.recipes/OpenResty-Orthanc/dockerfile
+[config-nginx]: https://github.com/OHIF/Viewers/blob/master/platform/viewer/.recipes/OpenResty-Orthanc/config/nginx.conf
+[config-orthanc]: https://github.com/OHIF/Viewers/blob/master/platform/viewer/.recipes/OpenResty-Orthanc/config/orthanc.json
 <!-- prettier-ignore-end -->

docs/latest/deployment/recipes/user-account-control.md

@@ -122,7 +122,10 @@ likely want to update:
 
 #### OHIF Viewer
 
-The OHIF Viewer's configuration is imported from a static `.js` file. The configuration we use is set to a specific file when we build the viewer, and determined by the env variable: `APP_CONFIG`. You can see where we set its value in the `dockerfile` for this solution:
+The OHIF Viewer's configuration is imported from a static `.js` file. The
+configuration we use is set to a specific file when we build the viewer, and
+determined by the env variable: `APP_CONFIG`. You can see where we set its value
+in the `dockerfile` for this solution:
 
 `ENV APP_CONFIG=config/docker_openresty-orthanc-keycloak.js`
 
@@ -146,8 +149,8 @@ All other files are found in: `/docker/OpenResty-Orthanc-Keycloak/`
 | Orthanc           | [`/orthanc.json`][config-orthanc]                | [Here][orthanc-docs]                        |
 | Keycloak          | [`/ohif-keycloak-realm.json`][config-keycloak]\* |                                             |
 
-- \* These are the seed values for Keycloak. They can be manually updated at
-  `http://127.0.0.1/auth/admin`
+\* These are the seed values for Keycloak. They can be manually updated at
+`http://127.0.0.1/auth/admin`
 
 #### Keycloak Themeing
 
@@ -261,12 +264,12 @@ for OAuth:
 
 - [Diagrams of OpenID Connect Flows](https://medium.com/@darutk/diagrams-of-all-the-openid-connect-flows-6968e3990660)
 - [KeyCloak: OpenID Connect Flows](https://www.keycloak.org/docs/latest/securing_apps/index.html#authorization-code)
-  - [Good description on SSO Protocols](https://www.keycloak.org/docs/2.5/server_admin/topics/sso-protocols/oidc.html)
 
-For a different take on this setup, check out the repository one of our
-community members put together:
+For a different take on this setup, check out the repositories our community
+members put together:
 
 - [mjstealey/ohif-orthanc-dimse-docker](https://github.com/mjstealey/ohif-orthanc-dimse-docker)
+- [trypag/ohif-orthanc-postgres-docker](https://github.com/trypag/ohif-orthanc-postgres-docker)
 
 <!--
   Links
@@ -278,8 +281,8 @@ community members put together:
 [lua-resty-openidc-docs]: https://github.com/zmartzone/lua-resty-openidc
 <!-- SRC -->
 [config]: https://github.com/OHIF/Viewers/blob/master/platform/viewer/src/config.js
-[dockerfile]: https://github.com/OHIF/Viewers/tree/master/platform/viewer/.recipes
-[config-nginx]: https://github.com/OHIF/Viewers/tree/master/platform/viewer/.recipes
-[config-orthanc]: https://github.com/OHIF/Viewers/tree/master/platform/viewer/.recipes
-[config-keycloak]: https://github.com/OHIF/Viewers/tree/master/platform/viewer/.recipes
+[dockerfile]: https://github.com/OHIF/Viewers/blob/master/platform/viewer/.recipes/OpenResty-Orthanc-Keycloak/dockerfile
+[config-nginx]: https://github.com/OHIF/Viewers/blob/master/platform/viewer/.recipes/OpenResty-Orthanc-Keycloak/config/nginx.conf
+[config-orthanc]: https://github.com/OHIF/Viewers/blob/master/platform/viewer/.recipes/OpenResty-Orthanc-Keycloak/config/orthanc.json
+[config-keycloak]: https://github.com/OHIF/Viewers/blob/master/platform/viewer/.recipes/OpenResty-Orthanc-Keycloak/config/ohif-keycloak-realm.json
 <!-- prettier-ignore-end -->

docs/latest/development/contributing.md

@@ -114,8 +114,8 @@ the tips above will help ensure your changes are reviewed.
 
 ## Testing contribution pull requests
 
-OHIF uses [netlify](netlify.com) so that pull requests are autogenerated and
-available for testing.
+OHIF uses [netlify](https://www.netlify.com/) so that pull requests are
+autogenerated and available for testing.
 
 For example, [this url][example-url] allows you to test [pull request 237, the
 request that created this FAQ entry,][pr-237] using data pulled from Amazon S3.

docs/latest/development/testing.md

@@ -132,7 +132,7 @@ feature `X` or scenario `Y`? Open an issue and let's discuss.
 [flow-org]: https://flow.org/
 <!-- Talks -->
 [assert-js-talks]: https://www.youtube.com/playlist?list=PLZ66c9_z3umNSrKSb5cmpxdXZcIPNvKGw
-[kent-talk]: https://www.youtube.com/watch?list=PLV5CVI1eNcJgNqzNwcs4UKrlJdhfDjshf
+[kent-talk]: https://www.youtube.com/watch?v=Fha2bVoC8SE
 [gleb-talk]: https://www.youtube.com/watch?v=5FnalKRjpZk
 [kent-blog]: https://kentcdodds.com/blog/unit-vs-integration-vs-e2e-tests
 <!-- Images -->

docs/latest/extensions/_maintained-extensions-table.md

@@ -31,6 +31,7 @@
             </td>
             <td>Viewport, Toolbar</td>
         </tr>
+        <!-- dicom-html -->
         <tr>
             <td>
                 <a href="https://www.npmjs.com/package/@ohif/extension-dicom-html">DICOM HTML</a>
@@ -40,6 +41,7 @@
             </td>
             <td>Viewport, SopClassHandler</td>
         </tr>
+        <!-- dicom-pdf -->
         <tr>
             <td>
                 <a href="https://www.npmjs.com/package/@ohif/extension-dicom-pdf">DICOM PDF</a>
@@ -49,6 +51,7 @@
             </td>
             <td>Viewport, SopClassHandler</td>
         </tr>
+        <!-- dicom-microscopy -->
         <tr>
             <td>
                 <a href="https://www.npmjs.com/package/@ohif/extension-dicom-microscopy">DICOM Microscopy</a>
@@ -58,5 +61,15 @@
             </td>
             <td>Viewport, SopClassHandler</td>
         </tr>
+        <!-- dicom-segmentation -->
+        <tr>
+            <td>
+                <a href="https://www.npmjs.com/package/@ohif/extension-dicom-segmentation">DICOM Segmentation</a>
+            </td>
+            <td>
+                Renders segmentation images for a <a href="https://github.com/OHIF/Viewers/blob/master/extensions/dicom-segmentation/src/OHIFDicomSegSopClassHandler.js#L5-L7">specific SopClassUID</a>.
+            </td>
+            <td>Panel, Toolbar</td>
+        </tr>
     </tbody>
 </table>

docs/latest/extensions/index.md

@@ -74,7 +74,8 @@ export default {
 ### Registering an Extension
 
 There are two different ways to register and configure extensions: At
-[runtime](#runtime-extensions) and at [build time](#bundled-extensions).
+[runtime](#registering-at-runtime) and at
+[build time](#registering-at-build-time).
 
 You can leverage one or both strategies. Which one(s) you choose depend on your
 application's requirements. Each [module](#modules) defined by the extension
@@ -82,9 +83,9 @@ becomes available to the core application via the `ExtensionManager`.
 
 #### Registering at Runtime
 
-The `@ohif/viewer` uses a [configuration file](#) at startup. The schema for
-that file includes an `Extensions` key that supports an array of extensions to
-register.
+The `@ohif/viewer` uses a [configuration file](../viewer/configuration.md) at
+startup. The schema for that file includes an `Extensions` key that supports an
+array of extensions to register.
 
 ```js
 // prettier-ignore
@@ -193,8 +194,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` along with the application's
-configuration through the appConfig key (optional).
+and provides a `ServicesManager` and `CommandsManager` along with the
+application's configuration through the appConfig key (optional).
 
 ```js
 const commandsManager = new CommandsManager();
@@ -202,7 +203,7 @@ const servicesManager = new ServicesManager();
 const extensionManager = new ExtensionManager({
   commandsManager,
   servicesManager,
-  appConfig
+  appConfig,
 });
 ```
 
@@ -212,8 +213,9 @@ 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 the extension's config,
-the application's config and `ExtensionManager`'s `ServicesManager` and `CommandsManager` instances.
+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/extensions/modules/sop-class-handler.md

@@ -1,9 +1,9 @@
 # Module: SOP Class Handler
 
-An extension can register a SOP Class Handler Module by defining a
-`getSopClassHandlerModule` method. The SOP Class Handler is a bit different from
-the other modules, as it doesn't provide a `1:1` schema for UI or provide it's
-own components. It instead defines:
+An extension can register a [SOP Class][sop-class-link] Handler Module by
+defining a `getSopClassHandlerModule` method. The [SOP Class][sop-class-link]
+Handler is a bit different from the other modules, as it doesn't provide a `1:1`
+schema for UI or provide it's own components. It instead defines:
 
 - `sopClassUIDs`: an array of string SOP Class UIDs that the
   `getDisplaySetFromSeries` method should be applied to.
@@ -76,6 +76,13 @@ getSopClassHandlerModule({ servicesManager, commandsManager }) {
 };
 ```
 
+### More examples :
+
+- [Dicom-HTML SOP][dicom-html-sop]
+- [Dicom-PDF SOP][dicom-pdf-sop]
+- [Dicom-Microscopy SOP][dicom-micro-sop]
+- [Dicom-Segmentation SOP][dicom-seg-sop]
+
 ## `@ohif/viewer` usage
 
 We use the `sopClassHandlerModule`s in three different places:
@@ -88,3 +95,11 @@ Each time, it is used to map study and series data to `displaySets`. It does
 this by working alongside the `StudyMetadataManager` in `@ohif/core`. That
 manager has the method `createDisplaySets` that takes an array of
 `sopClassHandlerModules`.
+
+<!-- prettier-ignore-start -->
+[sop-class-link]: http://dicom.nema.org/dicom/2013/output/chtml/part04/sect_B.5.html
+[dicom-html-sop]: https://github.com/OHIF/Viewers/blob/master/extensions/dicom-html/src/OHIFDicomHtmlSopClassHandler.js#L4-L12
+[dicom-pdf-sop]: https://github.com/OHIF/Viewers/blob/master/extensions/dicom-pdf/src/OHIFDicomPDFSopClassHandler.js#L4-L6
+[dicom-micro-sop]: https://github.com/OHIF/Viewers/blob/master/extensions/dicom-microscopy/src/DicomMicroscopySopClassHandler.js#L5-L7
+[dicom-seg-sop]: https://github.com/OHIF/Viewers/blob/master/extensions/dicom-segmentation/src/OHIFDicomSegSopClassHandler.js#L5-L7
+<!-- prettier-ignore-end -->

docs/latest/our-process.md

@@ -75,7 +75,7 @@ items to our ["Active Development" GitHub Project Board][gh-board]. Items on
 this project board are either in active development by Core Team members, or
 queued up for development as in-progress items are completed.
 
-> :pencil: Want to contribute but not sure where to start? Check out [Up for
+> 🖋 Want to contribute but not sure where to start? Check out [Up for
 > grabs][label-grabs] issues and our [Contributing
 > documentation][contributing-docs]
 
@@ -156,5 +156,5 @@ addressed and a Stable version is released.
 [ohif-prod]: https://viewer.ohif.org
 [gh-board]: https://github.com/OHIF/Viewers/projects/4
 [label-grabs]: https://github.com/OHIF/Viewers/issues?q=is%3Aissue+is%3Aopen+label%3A%22Up+For+Grabs+%3Araising_hand_woman%3A%22
-[contributing-docs]: https://docs.ohif.org/contributing/
+[contributing-docs]: ./development/contributing.md
 <!-- prettier-ignore-end -->

docs/latest/services/index.md

@@ -62,7 +62,7 @@ able to fail or be removed. Related patterns that may reduce coupling include:
   -->
 
 <!-- prettier-ignore-start -->
-[commands]: #/
+[commands]: ../extensions/modules/commands.md
 [core-services]: https://github.com/OHIF/Viewers/tree/master/platform/core/src/services
 [services-manager]: https://github.com/OHIF/Viewers/blob/master/platform/core/src/services/ServicesManager.js
 [cross-cutting-concerns]: https://en.wikipedia.org/wiki/Cross-cutting_concern

docs/latest/services/ui/index.md

@@ -2,8 +2,8 @@
 
 - [Overview](#overview)
 - [Example](#example)
-- [Tips & Tricks](#/)
-- [Maintained Services](#/)
+- [Tips & Tricks](#tips--tricks)
+- [Maintained Services](#maintained-services)
 
 ## Overview
 

docs/latest/viewer/configuration.md

@@ -11,10 +11,89 @@ are:
 ```js
 window.config = {
   routerBasename: '/',
-  whiteLabelling: {},
+  /**
+   * "White Labeling" is used to change the branding, look, and feel of the OHIF
+   * Viewer. These settings, and the color variables that are used by our components,
+   * are the easiest way to rebrand the application.
+   *
+   * More extensive changes are made possible through swapping out the UI library,
+   * Viewer project, or extensions.
+   */
+  whiteLabeling: {
+    /* Optional: Should return a React component to be rendered in the "Logo" section of the application's Top Navigation bar */
+    createLogoComponentFn: function(React) {
+      return React.createElement('a', {
+        target: '_self',
+        rel: 'noopener noreferrer',
+        className: 'header-brand',
+        href: '/',
+        style: {
+          display: 'block',
+          textIndent: '-9999px',
+          background: 'url(/svg-file-hosted-at-domain-root.svg)',
+          backgroundSize: 'contain',
+          backgroundRepeat: 'no-repeat',
+          width: '200px',
+        },
+      });
+    },
+  },
+  /**
+   * Internally, the OHIF Viewer fetches data primarily with the
+   * `cornerstoneWADOImageLoader` and the `DICOMWebClient`. If either of these
+   * receive a non-200 response, this method allows you to handle that error.
+   *
+   * Common use cases include:
+   * - Showing a notification with the UINotificationService
+   * - Redirecting the user
+   * - Refreshing an auth token
+   *
+   * @param {Object} error - JS new Error()
+   * @param {XMLHttpRequest} error.request - The XHR request that's onreadystate change triggered this callback
+   * @param {string} error.response - The XHR's response property
+   * @param {number} error.status - The XHR's status property
+   */
+  httpErrorHandler: error => {
+    const { request: xhr, response, status } = err;
+    const { responseType, statusText } = xhr;
+
+    // In local files, status is 0 upon success in Firefox
+    if (xhr.readyState === XMLHttpRequest.DONE) {
+      console.log(statusText, response, responseType);
+    } else {
+      console.warn('Likely CORS error');
+    }
+  },
   extensions: [],
   showStudyList: true,
   filterQueryParam: false,
+  /**
+   * Disable caching of servers configuration.
+   *
+   * There will be no effect if you update the servers property of this config
+   * while your application is running because this property is cached in local storage.
+   */
+  disableServersCache: false,
+  /**
+   * OHIF's study prefetcher configuration.
+   *
+   * @param {boolean} enabled Whether to enable/disable OHIF's study prefetcher
+   * @param {('all'|'closest'|'downward'|'upward'|'topdown')} order Fetching order: all display sets, the closest ones, downward or top down fashion based on the currently selected display set
+   * @param {number} displaySetCount How much display sets should be prefetched at once (note: this attribute is ignored if order was set to 'all')
+   * @param {boolean} preventCache Prevent images to be cached in Cornerstone Tools's request pool manager
+   * @param {number} prefetchDisplaySetsTimeout Prefetch timeout
+   * @param {boolean} displayProgress Whether to display or not the progress bar in the display set
+   * @param {boolean} includeActiveDisplaySet Include or not the active display set while prefetching
+   */
+  studyPrefetcher: {
+    enabled: true,
+    order: 'all',
+    displaySetCount: 1,
+    preventCache: false,
+    prefetchDisplaySetsTimeout: 300,
+    displayProgress: false,
+    includeActiveDisplaySet: true,
+  },
   servers: {
     dicomWeb: [
       {
@@ -29,7 +108,14 @@ window.config = {
       },
     ],
   },
-  // Supported Keys: https://craig.is/killing/mice
+  /**
+   * Hotkey definitions.
+   * Supported Keys: https://craig.is/killing/mice
+   *
+   * @param {string} commandName
+   * @param {string} label
+   * @param {array} keys
+   */
   hotkeys: [
     { commandName: 'rotateViewportCW', label: 'Rotate Right', keys: ['r'] },
     { commandName: 'rotateViewportCCW', label: 'Rotate Left', keys: ['l'] },
@@ -45,14 +131,16 @@ window.config = {
       keys: ['v'],
     },
   ],
-  /* Configuration passed to the bundled cornerstone extension
+  /**
+   * 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.
+   *
+   * @param {boolean} hideHandles Whether to show/hide annotation "handles"
    */
   cornerstoneExtensionConfig: {
-    /* Whether to show/hide annotation "handles" */
     hideHandles: true,
   },
 };

docs/latest/viewer/internationalization.md

@@ -135,7 +135,7 @@ console.log(T('$t(Common:Play) my translated text'));
 
 # Main Concepts While Translating
 
-## - Namespaces
+## Namespaces
 
 Namespaces are being used to organize translations in smaller portions, combined
 semantically or by use. Each `.json` file inside `@ohif/i18n` npm package
@@ -157,7 +157,7 @@ NameSpace, like this following example getting data from `Common` NameSpace:
 $t(Common:Reset)
 ```
 
-## - Extending Languages in @ohif/i18n
+## Extending Languages in @ohif/i18n
 
 Sometimes, even using the same language, some nouns or jargons can change
 according to the country, states or even from Hospital to Hospital.
@@ -212,7 +212,7 @@ object like this:
 Please check the `index.js` files inside locales folder for an example of this
 exporting structure.
 
-### - Extending languages dynamically
+### Extending languages dynamically
 
 You have access to the i18next instance, so you can use the
 [addResourceBundle](https://www.i18next.com/how-to/add-or-load-translations#add-after-init)
@@ -314,4 +314,4 @@ REACT_APP_I18N_DEBUG=true yarn run dev
 ### Contributing with new languages
 
 Contributions of any kind are welcome! Please check the
-[instructions](https://docs.ohif.org/contributing.html).
+[instructions](../development/contributing.md).

docs/latest/viewer/studyPrefetcher.md

@@ -0,0 +1,37 @@
+# Viewer: Study Prefetcher & Stack Prefetch
+
+Prefetching the stack of images of the active viewport is enabled by default for
+cornerstone viewports via cornerstone tools's stack prefetch functionality.
+
+In order to have a more customizable alternative for prefetching, OHIF provides
+a built-in study prefetcher functionality which allows the user to set the order
+in which the display sets are prefetched, the granularity, the timeout and
+whether or not display a progress bar in the display set (close to the thumbnail
+image) in the study browser.
+
+You can customize these options via the viewer's configuration:
+
+```js
+window.config = {
+  /**
+   * OHIF's study prefetcher configuration.
+   *
+   * @param {boolean} enabled Whether to enable/disable OHIF's study prefetcher
+   * @param {('all'|'closest'|'downward'|'upward'|'topdown')} order Fetching order: all display sets, the closest ones, downward or top down fashion based on the currently selected display set
+   * @param {number} displaySetCount How much display sets should be prefetched at once (note: this attribute is ignored if order was set to 'all')
+   * @param {boolean} preventCache Prevent images to be cached in Cornerstone Tools's request pool manager
+   * @param {number} prefetchDisplaySetsTimeout Prefetch timeout
+   * @param {boolean} displayProgress Whether to display or not the progress bar in the display set
+   * @param {boolean} includeActiveDisplaySet Include or not the active display set while prefetching
+   */
+  studyPrefetcher: {
+    enabled: true,
+    order: 'all',
+    displaySetCount: 1,
+    preventCache: false,
+    prefetchDisplaySetsTimeout: 300,
+    displayProgress: false,
+    includeActiveDisplaySet: true,
+  },
+};
+```

docs/latest/viewer/themeing.md

@@ -66,11 +66,11 @@ open to pull requests and discussion issues.
 
 Current white-labeling options are limited. We expose the ability to replace the
 "Logo" section of the application with a custom "Logo" component. You can do
-this by adding a `whiteLabelling` key to your
+this by adding a `whiteLabeling` key to your
 [configuration file](./configuration.md).
 
 ```js
-function RadicalImagingLogo() {
+function RadicalImagingLogo(React) {
   return React.createElement(
     'a',
     {
@@ -83,8 +83,8 @@ function RadicalImagingLogo() {
   );
 }
 
-props.whiteLabelling = {
-  logoComponent: RadicalImagingLogo(),
+props.whiteLabeling = {
+  createLogoComponentFn: RadicalImagingLogo,
 };
 ```
 

docs/latest/yarn.lock

@@ -20,10 +20,10 @@ abbrev@~1.0.9:
   resolved "https://registry.yarnpkg.com/abbrev/-/abbrev-1.0.9.tgz#91b4792588a7738c25f35dd6f63752a2f8776135"
   integrity sha1-kbR5JYinc4wl813W9jdSovh3YTU=
 
-agent-base@4, agent-base@^4.1.0:
-  version "4.2.1"
-  resolved "https://registry.yarnpkg.com/agent-base/-/agent-base-4.2.1.tgz#d89e5999f797875674c07d87f260fc41e83e8ca9"
-  integrity sha512-JVwXMr9nHYTUXsBFKUqhJwvlcYU/blreOEUkhNR2eXZIvwd+c+o5V4MgDPKWnMS/56awN3TRzIP+KoPn+roQtg==
+agent-base@4, agent-base@^4.1.0, agent-base@^4.3.0:
+  version "4.3.0"
+  resolved "https://registry.yarnpkg.com/agent-base/-/agent-base-4.3.0.tgz#8165f01c436009bccad0b1d122f05ed770efc6ee"
+  integrity sha512-salcGninV0nPrwpGNn4VTXBb1SOuXQBiqbrNXoeizJsHrsL6ERFM2Ne3JUSBWRE6aeNJI2ROP/WEEIDUiDe3cg==
   dependencies:
     es6-promisify "^5.0.0"
 
@@ -773,9 +773,9 @@ err-code@^1.0.0:
     prr "~1.0.1"
 
 es6-promise@^4.0.3:
-  version "4.2.6"
-  resolved "https://registry.yarnpkg.com/es6-promise/-/es6-promise-4.2.6.tgz#b685edd8258886365ea62b57d30de28fadcd974f"
-  integrity sha512-aRVgGdnmW2OiySVPUC9e6m+plolMAJKjZnQlCwNSuK5yQ0JN61DZSO1X1Ufd1foqWRAlig0rhduTCHe7sVtK5Q==
+  version "4.2.8"
+  resolved "https://registry.yarnpkg.com/es6-promise/-/es6-promise-4.2.8.tgz#4eb21594c972bc40553d276e510539143db53e0a"
+  integrity sha512-HJDGx5daxeIvxdBxvG2cb9g4tEvwIk3i8+nhX0yGrYmZUzbkdg8QbDevheDB8gd0//uPj4c1EQua8Q+MViT0/w==
 
 es6-promisify@^5.0.0:
   version "5.0.0"
@@ -1289,11 +1289,11 @@ http-signature@~1.2.0:
     sshpk "^1.7.0"
 
 https-proxy-agent@^2.1.0:
-  version "2.2.1"
-  resolved "https://registry.yarnpkg.com/https-proxy-agent/-/https-proxy-agent-2.2.1.tgz#51552970fa04d723e04c56d04178c3f92592bbc0"
-  integrity sha512-HPCTS1LW51bcyMYbxUIOO4HEOlQ1/1qRaFWcyxvwaqUS9TY88aoEuHUY33kuAh1YhVVaDQhLZsnPd+XNARWZlQ==
+  version "2.2.4"
+  resolved "https://registry.yarnpkg.com/https-proxy-agent/-/https-proxy-agent-2.2.4.tgz#4ee7a737abd92678a293d9b34a1af4d0d08c787b"
+  integrity sha512-OmvfoQ53WLjtA9HeYP9RNrWMJzzAz1JGaSFr1nijg0PVR1JaD/xbJq1mdEIIlxGpXp9eSe/O2LgU9DJmTPd0Eg==
   dependencies:
-    agent-base "^4.1.0"
+    agent-base "^4.3.0"
     debug "^3.1.0"
 
 humanize-ms@^1.2.1:
@@ -1807,11 +1807,16 @@ ms@2.0.0:
   resolved "https://registry.yarnpkg.com/ms/-/ms-2.0.0.tgz#5608aeadfc00be6c2901df5f9861788de0d597c8"
   integrity sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=
 
-ms@^2.0.0, ms@^2.1.1:
+ms@^2.0.0:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/ms/-/ms-2.1.1.tgz#30a5864eb3ebb0a66f2ebe6d727af06a09d86e0a"
   integrity sha512-tgp+dl5cGk28utYktBsrFqA7HKgrhgPsg6Z/EfhWI4gl1Hwq8B/GmY/0oXZ6nF8hDVesS/FpnYaD/kOWhYQvyg==
 
+ms@^2.1.1:
+  version "2.1.2"
+  resolved "https://registry.yarnpkg.com/ms/-/ms-2.1.2.tgz#d09d1f357b443f493382a8eb3ccd183872ae6009"
+  integrity sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==
+
 mute-stream@~0.0.4:
   version "0.0.8"
   resolved "https://registry.yarnpkg.com/mute-stream/-/mute-stream-0.0.8.tgz#1630c42b2251ff81e2a283de96a5497ea92e5e0d"

docs/v1/book.json

@@ -8,7 +8,6 @@
     "-fontsettings",
     "github",
     "ga",
-    "sitemap",
     "anchors",
     "versions"
   ],
@@ -24,7 +23,8 @@
       "token": "UA-110573590-2"
     },
     "sitemap": {
-      "hostname": "https://docs.ohif.org"
+      "hostname": "https://docs.ohif.org",
+      "todo": "sitemap plugin removed; causing build errors"
     },
     "versions": {
       "gitbookConfigURL": "https://raw.githubusercontent.com/OHIF/Viewers/master/docs/book.json",

extensions/cornerstone/CHANGELOG.md

@@ -3,6 +3,460 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [2.12.15](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.12.14...@ohif/extension-cornerstone@2.12.15) (2022-09-20)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [2.12.14](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.12.13...@ohif/extension-cornerstone@2.12.14) (2022-09-01)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [2.12.13](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.12.12...@ohif/extension-cornerstone@2.12.13) (2022-06-30)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [2.12.12](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.12.11...@ohif/extension-cornerstone@2.12.12) (2022-06-29)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [2.12.11](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.12.10...@ohif/extension-cornerstone@2.12.11) (2022-06-14)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [2.12.10](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.12.9...@ohif/extension-cornerstone@2.12.10) (2022-04-05)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [2.12.9](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.12.8...@ohif/extension-cornerstone@2.12.9) (2022-03-25)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [2.12.8](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.12.7...@ohif/extension-cornerstone@2.12.8) (2022-03-14)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [2.12.7](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.12.6...@ohif/extension-cornerstone@2.12.7) (2022-02-03)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [2.12.6](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.12.5...@ohif/extension-cornerstone@2.12.6) (2022-02-03)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [2.12.5](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.12.4...@ohif/extension-cornerstone@2.12.5) (2022-02-02)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [2.12.4](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.12.3...@ohif/extension-cornerstone@2.12.4) (2022-01-20)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [2.12.3](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.12.2...@ohif/extension-cornerstone@2.12.3) (2021-12-02)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [2.12.2](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.12.1...@ohif/extension-cornerstone@2.12.2) (2021-10-26)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [2.12.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.12.0...@ohif/extension-cornerstone@2.12.1) (2021-09-28)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+# [2.12.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.11.0...@ohif/extension-cornerstone@2.12.0) (2021-09-23)
+
+
+### Features
+
+* Update to WADO Image Loader 4.0.3 to add dynamically imported WebAssembly codec support 🚀 ([#2537](https://github.com/OHIF/Viewers/issues/2537)) ([489d4b0](https://github.com/OHIF/Viewers/commit/489d4b0584f4657ceda1c5b9b68d5e9733827e47))
+
+
+
+
+
+# [2.11.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.10.10...@ohif/extension-cornerstone@2.11.0) (2021-09-09)
+
+
+### Features
+
+* OHIF-1000: Study prefetcher ([#2466](https://github.com/OHIF/Viewers/issues/2466)) ([8f26045](https://github.com/OHIF/Viewers/commit/8f2604509d24092b721f1333289d838820d68cac))
+
+
+
+
+
+## [2.10.10](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.10.9...@ohif/extension-cornerstone@2.10.10) (2021-07-26)
+
+
+### Bug Fixes
+
+* changed new image handler conditional for 0 edge case ([#2338](https://github.com/OHIF/Viewers/issues/2338)) ([b8ae92c](https://github.com/OHIF/Viewers/commit/b8ae92c2d4f733b3ca89826118029685650b396a))
+
+
+
+
+
+## [2.10.9](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.10.8...@ohif/extension-cornerstone@2.10.9) (2021-06-02)
+
+
+### Bug Fixes
+
+* **dicom-html:** Add parsed dicom meta info section ([#2419](https://github.com/OHIF/Viewers/issues/2419)) ([403688b](https://github.com/OHIF/Viewers/commit/403688b18c52468fc1101166ec0c1734fb710039))
+
+
+
+
+
+## [2.10.8](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.10.7...@ohif/extension-cornerstone@2.10.8) (2021-05-17)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [2.10.7](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.10.6...@ohif/extension-cornerstone@2.10.7) (2021-04-15)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [2.10.6](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.10.5...@ohif/extension-cornerstone@2.10.6) (2021-03-26)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [2.10.5](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.10.4...@ohif/extension-cornerstone@2.10.5) (2021-03-15)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [2.10.4](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.10.3...@ohif/extension-cornerstone@2.10.4) (2021-03-09)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [2.10.3](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.10.2...@ohif/extension-cornerstone@2.10.3) (2021-03-03)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [2.10.2](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.10.1...@ohif/extension-cornerstone@2.10.2) (2021-02-25)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [2.10.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.10.0...@ohif/extension-cornerstone@2.10.1) (2021-02-05)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+# [2.10.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.9.6...@ohif/extension-cornerstone@2.10.0) (2020-12-10)
+
+
+### Features
+
+* visualize overlapping segments in cornerstone ([#2185](https://github.com/OHIF/Viewers/issues/2185)) ([29fceac](https://github.com/OHIF/Viewers/commit/29fceacee97d51f1952a0f6b574c66596d32c201))
+
+
+
+
+
+## [2.9.6](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.9.5...@ohif/extension-cornerstone@2.9.6) (2020-10-07)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [2.9.5](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.9.4...@ohif/extension-cornerstone@2.9.5) (2020-09-29)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [2.9.4](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.9.3...@ohif/extension-cornerstone@2.9.4) (2020-09-03)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [2.9.3](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.9.2...@ohif/extension-cornerstone@2.9.3) (2020-09-02)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [2.9.2](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.9.1...@ohif/extension-cornerstone@2.9.2) (2020-08-20)
+
+
+### Bug Fixes
+
+* Updated react-cornerstone-viewport to version 4.0.2 ([#2001](https://github.com/OHIF/Viewers/issues/2001)) ([59ab68b](https://github.com/OHIF/Viewers/commit/59ab68b4edbfec010170c4429c300a53f688bf94))
+
+
+
+
+
+## [2.9.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.9.0...@ohif/extension-cornerstone@2.9.1) (2020-08-20)
+
+
+### Performance Improvements
+
+* **stackPrefetch:** Added stackPrefetch config with 20 max concurrent requests ([#2000](https://github.com/OHIF/Viewers/issues/2000)) ([3b02a06](https://github.com/OHIF/Viewers/commit/3b02a06f5e250660edde4862ce44147db3dc3ab9))
+
+
+
+
+
+# [2.9.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.8.5...@ohif/extension-cornerstone@2.9.0) (2020-08-18)
+
+
+### Features
+
+* 🎸 Update react-vtkjs-viewport usage to use requestPool ([#1984](https://github.com/OHIF/Viewers/issues/1984)) ([bb5f30c](https://github.com/OHIF/Viewers/commit/bb5f30ce2a0192d2e021beaaadfff22fd38e17b9))
+
+
+
+
+
+## [2.8.5](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.8.4...@ohif/extension-cornerstone@2.8.5) (2020-08-05)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [2.8.4](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.8.3...@ohif/extension-cornerstone@2.8.4) (2020-07-13)
+
+
+### Bug Fixes
+
+* 🐛 - Put guards in all places that a cornerstone re-render ([#1899](https://github.com/OHIF/Viewers/issues/1899)) ([451f7ea](https://github.com/OHIF/Viewers/commit/451f7eab9258e7a193eb362e0926b13aedc4b3c9))
+
+
+
+
+
+## [2.8.3](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.8.2...@ohif/extension-cornerstone@2.8.3) (2020-07-13)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [2.8.2](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.8.1...@ohif/extension-cornerstone@2.8.2) (2020-06-15)
+
+
+### Bug Fixes
+
+* 🐛 Disable seg panel when data for seg unavailable ([#1732](https://github.com/OHIF/Viewers/issues/1732)) ([698e900](https://github.com/OHIF/Viewers/commit/698e900b85121d3c2a46747c443ef69fb7a8c95b)), closes [#1728](https://github.com/OHIF/Viewers/issues/1728)
+
+
+
+
+
+## [2.8.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.8.0...@ohif/extension-cornerstone@2.8.1) (2020-06-04)
+
+
+### Bug Fixes
+
+* 🐛 Infinite frame index change when quickly jumping between ([#1734](https://github.com/OHIF/Viewers/issues/1734)) ([a830577](https://github.com/OHIF/Viewers/commit/a8305772d0fbec506549ad7ea08504a8bc3a4f39)), closes [#1733](https://github.com/OHIF/Viewers/issues/1733)
+
+
+
+
+
+# [2.8.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.7.3...@ohif/extension-cornerstone@2.8.0) (2020-06-04)
+
+
+### Features
+
+* 🎸 1729 - error boundary wrapper ([#1764](https://github.com/OHIF/Viewers/issues/1764)) ([c02b232](https://github.com/OHIF/Viewers/commit/c02b232b0cc24f38af5d5e3831d987d048e60ada))
+
+
+
+
+
+## [2.7.3](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.7.2...@ohif/extension-cornerstone@2.7.3) (2020-05-12)
+
+
+### Bug Fixes
+
+* 🐛 Fix seg color load ([#1724](https://github.com/OHIF/Viewers/issues/1724)) ([c4f84b1](https://github.com/OHIF/Viewers/commit/c4f84b1174d04ba84d37ed89b6d7ab541be28181))
+
+
+
+
+
+## [2.7.2](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.7.1...@ohif/extension-cornerstone@2.7.2) (2020-05-04)
+
+
+### Bug Fixes
+
+* 🐛 Proper error handling for derived display sets ([#1708](https://github.com/OHIF/Viewers/issues/1708)) ([5b20d8f](https://github.com/OHIF/Viewers/commit/5b20d8f323e4b3ef9988f2f2ab672d697b6da409))
+
+
+
+
+
+## [2.7.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.7.0...@ohif/extension-cornerstone@2.7.1) (2020-05-04)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+# [2.7.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.6.1...@ohif/extension-cornerstone@2.7.0) (2020-04-24)
+
+
+### Features
+
+* 🎸 Seg jump to slice + show/hide ([835f64d](https://github.com/OHIF/Viewers/commit/835f64d47a9994f6a25aaf3941a4974e215e7e7f))
+
+
+
+
+
+## [2.6.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.6.0...@ohif/extension-cornerstone@2.6.1) (2020-04-23)
+
+
+### Bug Fixes
+
+* 🐛 Multiframe fix ([#1661](https://github.com/OHIF/Viewers/issues/1661)) ([7120561](https://github.com/OHIF/Viewers/commit/71205618ecb8b592247c5acb32284bfe7e18fce5))
+
+
+
+
+
+# [2.6.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.5.2...@ohif/extension-cornerstone@2.6.0) (2020-04-23)
+
+
+### Features
+
+* configuration to hook into XHR Error handling ([e96205d](https://github.com/OHIF/Viewers/commit/e96205de35e5bec14dc8a9a8509db3dd4e6ecdb6))
+
+
+
+
+
+## [2.5.2](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.5.1...@ohif/extension-cornerstone@2.5.2) (2020-04-09)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [2.5.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.5.0...@ohif/extension-cornerstone@2.5.1) (2020-04-02)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+# [2.5.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.4.3...@ohif/extension-cornerstone@2.5.0) (2020-03-13)
+
+
+### Features
+
+* Segmentations Settings UI - Phase 1 [#1391](https://github.com/OHIF/Viewers/issues/1391) ([#1392](https://github.com/OHIF/Viewers/issues/1392)) ([e8842cf](https://github.com/OHIF/Viewers/commit/e8842cf8aebde98db7fc123e4867c8288552331f)), closes [#1423](https://github.com/OHIF/Viewers/issues/1423)
+
+
+
+
+
 ## [2.4.3](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.4.2...@ohif/extension-cornerstone@2.4.3) (2020-03-09)
 
 **Note:** Version bump only for package @ohif/extension-cornerstone

extensions/cornerstone/README.md

@@ -85,12 +85,32 @@ Tools can be configured through extension configuration using the tools key:
   ...
 ```
 
+## Stack prefetch configuration
+
+Stack prefetch can be configured through extension configuration using the
+stackPrefetch key:
+
+```js
+  ...
+  cornerstoneExtensionConfig: {
+    stackPrefetch: {
+      enabled: true,
+      maxImagesToPrefetch: Infinity,
+      preserveExistingPool: false,
+      maxSimultaneousRequests: 20,
+    },
+  },
+  ...
+```
+
 ## Annotate Tools Configuration
 
-*We currently support one property for annotation tools.*
+_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:
+
+This extension configuration allows you to toggle on/off handle rendering for
+all annotate tools:
 
 ```js
   ...
@@ -119,3 +139,4 @@ This extension configuration allows you to toggle on/off handle rendering for al
 [cornerstone-tools]: https://github.com/cornerstonejs/cornerstoneTools
 [cornerstone]: https://github.com/cornerstonejs/cornerstone
 <!-- prettier-ignore-end -->
+```

extensions/cornerstone/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ohif/extension-cornerstone",
-  "version": "2.4.3",
+  "version": "2.12.15",
   "description": "OHIF extension for Cornerstone",
   "author": "OHIF",
   "license": "MIT",
@@ -32,25 +32,26 @@
   "peerDependencies": {
     "@ohif/core": "^0.50.0",
     "@ohif/ui": "^0.50.0",
-    "cornerstone-core": "^2.2.8",
-    "cornerstone-math": "^0.1.8",
-    "cornerstone-tools": "4.12.0",
-    "cornerstone-wado-image-loader": "^3.0.0",
-    "dcmjs": "^0.10.1",
-    "dicom-parser": "^1.8.3",
+    "cornerstone-core": "^2.6.1",
+    "cornerstone-math": "^0.1.9",
+    "cornerstone-tools": "^6.0.6",
+    "cornerstone-wado-image-loader": "^4.2.1",
+    "dcmjs": "0.24.10",
+    "dicom-parser": "^1.8.11",
     "hammerjs": "^2.0.8",
     "prop-types": "^15.6.2",
     "react": "^16.8.6",
     "react-dom": "^16.8.6",
     "react-redux": "^6.0.0",
     "react-resize-detector": "^3.4.0",
-    "redux": "^4.0.1"
+    "redux": "^4.0.1",
+    "styled-components": "^5.3.5"
   },
   "dependencies": {
     "@babel/runtime": "^7.5.5",
     "classnames": "^2.2.6",
     "lodash.merge": "^4.6.2",
     "lodash.throttle": "^4.1.1",
-    "react-cornerstone-viewport": "^2.3.6"
+    "react-cornerstone-viewport": "4.1.1"
   }
 }

extensions/cornerstone/src/ConnectedCornerstoneViewport.js

@@ -3,6 +3,7 @@ import OHIF from '@ohif/core';
 import { connect } from 'react-redux';
 import throttle from 'lodash.throttle';
 import { setEnabledElement } from './state';
+import initSRTools from './tools/initSRTools';
 
 const { setViewportActive, setViewportSpecificData } = OHIF.redux.actions;
 const {
@@ -53,7 +54,11 @@ const mapStateToProps = (state, ownProps) => {
     // Currently justing using escape hatch + commands
     // activeTool: activeButton && activeButton.command,
     ...dataFromStore,
-    isStackPrefetchEnabled: isActive,
+    isStackPrefetchEnabled: ownProps.hasOwnProperty('isStackPrefetchEnabled')
+      ? ownProps.isStackPrefetchEnabled
+      : ownProps.stackPrefetch
+      ? ownProps.stackPrefetch.enabled
+      : isActive,
     isPlaying,
     frameRate,
     //stack: viewportSpecificData.stack,
@@ -88,6 +93,7 @@ const mapDispatchToProps = (dispatch, ownProps) => {
           plugin: 'cornerstone',
         })
       );
+      initSRTools(enabledElement);
     },
 
     onMeasurementsChanged: (event, action) => {

extensions/cornerstone/src/OHIFCornerstoneViewport.js

@@ -1,22 +1,14 @@
 import React, { Component } from 'react';
 
+import OHIFCornerstoneViewportOverlay from './components/OHIFCornerstoneViewportOverlay';
 import ConnectedCornerstoneViewport from './ConnectedCornerstoneViewport';
 import OHIF from '@ohif/core';
 import PropTypes from 'prop-types';
 import cornerstone from 'cornerstone-core';
-import handleSegmentationStorage from './handleSegmentationStorage.js';
+import checkForSRAnnotations from './tools/checkForSRAnnotations';
 
 const { StackManager } = OHIF.utils;
 
-const SOP_CLASSES = {
-  SEGMENTATION_STORAGE: '1.2.840.10008.5.1.4.1.1.66.4',
-};
-
-const specialCaseHandlers = {};
-specialCaseHandlers[
-  SOP_CLASSES.SEGMENTATION_STORAGE
-] = handleSegmentationStorage;
-
 class OHIFCornerstoneViewport extends Component {
   state = {
     viewportData: null,
@@ -24,6 +16,7 @@ class OHIFCornerstoneViewport extends Component {
 
   static defaultProps = {
     customProps: {},
+    isStackPrefetchEnabled: true,
   };
 
   static propTypes = {
@@ -32,6 +25,8 @@ class OHIFCornerstoneViewport extends Component {
     viewportIndex: PropTypes.number,
     children: PropTypes.node,
     customProps: PropTypes.object,
+    stackPrefetch: PropTypes.object,
+    isStackPrefetchEnabled: PropTypes.bool,
   };
 
   static id = 'OHIFCornerstoneViewport';
@@ -124,42 +119,24 @@ class OHIFCornerstoneViewport extends Component {
     studies,
     StudyInstanceUID,
     displaySetInstanceUID,
-    SOPClassUID,
     SOPInstanceUID,
     frameIndex
   ) => {
     let viewportData;
 
-    switch (SOPClassUID) {
-      case SOP_CLASSES.SEGMENTATION_STORAGE:
-        const specialCaseHandler =
-          specialCaseHandlers[SOP_CLASSES.SEGMENTATION_STORAGE];
+    const stack = OHIFCornerstoneViewport.getCornerstoneStack(
+      studies,
+      StudyInstanceUID,
+      displaySetInstanceUID,
+      SOPInstanceUID,
+      frameIndex
+    );
 
-        viewportData = await specialCaseHandler(
-          studies,
-          StudyInstanceUID,
-          displaySetInstanceUID,
-          SOPInstanceUID,
-          frameIndex
-        );
-        break;
-      default:
-        const stack = OHIFCornerstoneViewport.getCornerstoneStack(
-          studies,
-          StudyInstanceUID,
-          displaySetInstanceUID,
-          SOPInstanceUID,
-          frameIndex
-        );
-
-        viewportData = {
-          StudyInstanceUID,
-          displaySetInstanceUID,
-          stack,
-        };
-
-        break;
-    }
+    viewportData = {
+      StudyInstanceUID,
+      displaySetInstanceUID,
+      stack,
+    };
 
     return viewportData;
   };
@@ -184,13 +161,10 @@ class OHIFCornerstoneViewport extends Component {
       );
     }
 
-    const SOPClassUID = sopClassUIDs && sopClassUIDs[0];
-
     this.getViewportData(
       studies,
       StudyInstanceUID,
       displaySetInstanceUID,
-      SOPClassUID,
       SOPInstanceUID,
       frameIndex
     ).then(viewportData => {
@@ -205,7 +179,7 @@ class OHIFCornerstoneViewport extends Component {
   }
 
   componentDidUpdate(prevProps) {
-    const { studies, displaySet } = this.props.viewportData;
+    const { displaySet } = this.props.viewportData;
     const prevDisplaySet = prevProps.viewportData.displaySet;
 
     if (
@@ -214,6 +188,8 @@ class OHIFCornerstoneViewport extends Component {
       displaySet.SOPInstanceUID !== prevDisplaySet.SOPInstanceUID ||
       displaySet.frameIndex !== prevDisplaySet.frameIndex
     ) {
+      const { viewportIndex } = this.props;
+      checkForSRAnnotations({ displaySet, viewportIndex });
       this.setStateFromProps();
     }
   }
@@ -225,6 +201,7 @@ class OHIFCornerstoneViewport extends Component {
       return null;
     }
     const { viewportIndex } = this.props;
+    const { inconsistencyWarnings } = this.props.viewportData.displaySet;
     const {
       imageIds,
       currentImageIdIndex,
@@ -246,16 +223,53 @@ class OHIFCornerstoneViewport extends Component {
       });
     }
 
+    const newImageHandler = ({ currentImageIdIndex, sopInstanceUid }) => {
+      const { displaySet } = this.props.viewportData;
+      const { StudyInstanceUID } = displaySet;
+
+      if (currentImageIdIndex >= 0) {
+        this.props.onNewImage({
+          StudyInstanceUID,
+          SOPInstanceUID: sopInstanceUid,
+          frameIndex: currentImageIdIndex,
+          activeViewportIndex: viewportIndex,
+        });
+      }
+    };
+
+    const overlay = props => {
+      const displaySet = this.props.viewportData.displaySet;
+      let filteredSRLabels;
+      if (displaySet.SRLabels && displaySet.SRLabels.length !== 0) {
+        filteredSRLabels = displaySet.SRLabels.filter(
+          SRLabel =>
+            SRLabel.ReferencedSOPInstanceUID === displaySet.SOPInstanceUID
+        );
+      }
+
+      return (
+        <OHIFCornerstoneViewportOverlay
+          {...props}
+          inconsistencyWarnings={inconsistencyWarnings}
+          SRLabels={filteredSRLabels}
+        />
+      );
+    };
+
     return (
       <>
         <ConnectedCornerstoneViewport
           viewportIndex={viewportIndex}
           imageIds={imageIds}
           imageIdIndex={currentImageIdIndex}
+          onNewImageDebounced={newImageHandler}
+          onNewImageDebounceTime={300}
+          viewportOverlayComponent={overlay}
+          stackPrefetch={this.props.stackPrefetch}
+          isStackPrefetchEnabled={this.props.isStackPrefetchEnabled}
           // ~~ Connected (From REDUX)
           // frameRate={frameRate}
           // isPlaying={false}
-          // isStackPrefetchEnabled={true}
           // onElementEnabled={() => {}}
           // setViewportActive{() => {}}
           {...this.props.customProps}

extensions/cornerstone/src/asyncComponent.js

@@ -1,37 +0,0 @@
-/**
- * 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/cornerstone/src/commandsModule.js

@@ -7,6 +7,17 @@ import { getEnabledElement } from './state';
 import CornerstoneViewportDownloadForm from './CornerstoneViewportDownloadForm';
 const scroll = cornerstoneTools.import('util/scroll');
 
+const { studyMetadataManager } = OHIF.utils;
+const { setViewportSpecificData } = OHIF.redux.actions;
+
+const refreshCornerstoneViewports = () => {
+  cornerstone.getEnabledElements().forEach(enabledElement => {
+    if (enabledElement.image) {
+      cornerstone.updateImage(enabledElement.element);
+    }
+  });
+};
+
 const commandsModule = ({ servicesManager }) => {
   const actions = {
     rotateViewport: ({ viewports, rotation }) => {
@@ -177,10 +188,7 @@ const commandsModule = ({ servicesManager }) => {
 
       measurementApi.syncMeasurementsAndToolData();
 
-      // Update images in all active viewports
-      cornerstone.getEnabledElements().forEach(enabledElement => {
-        cornerstone.updateImage(enabledElement.element);
-      });
+      refreshCornerstoneViewports();
     },
     getNearbyToolData({ element, canvasCoordinates, availableToolTypes }) {
       const nearbyTool = {};
@@ -255,9 +263,45 @@ const commandsModule = ({ servicesManager }) => {
         cornerstone.setViewport(enabledElement, viewport);
       }
     },
+    jumpToImage: ({
+      StudyInstanceUID,
+      SOPInstanceUID,
+      frameIndex,
+      activeViewportIndex,
+      refreshViewports = true,
+    }) => {
+      const study = studyMetadataManager.get(StudyInstanceUID);
+
+      const displaySet = study.findDisplaySet(ds => {
+        return (
+          ds.images &&
+          ds.images.find(i => i.getSOPInstanceUID() === SOPInstanceUID)
+        );
+      });
+
+      if (!displaySet) {
+        return;
+      }
+
+      displaySet.SOPInstanceUID = SOPInstanceUID;
+      displaySet.frameIndex = frameIndex;
+
+      window.store.dispatch(
+        setViewportSpecificData(activeViewportIndex, displaySet)
+      );
+
+      if (refreshViewports) {
+        refreshCornerstoneViewports();
+      }
+    },
   };
 
   const definitions = {
+    jumpToImage: {
+      commandFn: actions.jumpToImage,
+      storeContexts: [],
+      options: {},
+    },
     getNearbyToolData: {
       commandFn: actions.getNearbyToolData,
       storeContexts: [],

extensions/cornerstone/src/components/OHIFCornerstoneViewportOverlay.css

@@ -0,0 +1,73 @@
+.imageViewerViewport.empty ~ .OHIFCornerstoneViewportOverlay {
+  display: none;
+}
+.OHIFCornerstoneViewportOverlay {
+  color: #9ccef9;
+}
+.OHIFCornerstoneViewportOverlay .overlay-element {
+  position: absolute;
+  font-weight: 400;
+  text-shadow: 1px 1px #000;
+  pointer-events: none;
+}
+.OHIFCornerstoneViewportOverlay .top-left {
+  top: 20px;
+  left: 20px;
+}
+.OHIFCornerstoneViewportOverlay .top-center {
+  top: 20px;
+  padding-top: 20px;
+  width: 100%;
+  text-align: center;
+}
+.OHIFCornerstoneViewportOverlay .top-right {
+  top: 20px;
+  right: 20px;
+  text-align: right;
+}
+.OHIFCornerstoneViewportOverlay .bottom-left {
+  bottom: 20px;
+  left: 20px;
+}
+.OHIFCornerstoneViewportOverlay .bottom-left2 {
+  bottom: 140px;
+  left: 20px;
+}
+.OHIFCornerstoneViewportOverlay .bottom-left3 {
+  bottom: 110px;
+  left: -20px;
+}
+.OHIFCornerstoneViewportOverlay .bottom-right {
+  bottom: 20px;
+  right: 20px;
+  text-align: right;
+}
+.OHIFCornerstoneViewportOverlay.controlsVisible .topright,
+.OHIFCornerstoneViewportOverlay.controlsVisible .bottomright {
+  right: calc(20px + 19px);
+}
+.OHIFCornerstoneViewportOverlay .warning {
+  position: absolute;
+  font-weight: 400;
+  text-shadow: 1px 1px #000;
+  pointer-events: inherit;
+}
+
+.OHIFCornerstoneViewportOverlay .warning svg {
+  opacity: 1;
+  color: #e29e4a;
+  fill: #e29e4a;
+  stroke: #e29e4a;
+  width: 32px;
+  height: 28px;
+}
+
+.OHIFCornerstoneViewportOverlay svg {
+  color: #9ccef9;
+  fill: #9ccef9;
+  stroke: #9ccef9;
+  background-color: transparent;
+  margin: 2px;
+  width: 18px;
+  height: 18px;
+}

extensions/cornerstone/src/components/OHIFCornerstoneViewportOverlay.js

@@ -0,0 +1,267 @@
+import { PureComponent } from 'react';
+import React from 'react';
+import styled from 'styled-components';
+import PropTypes from 'prop-types';
+import cornerstone from 'cornerstone-core';
+import './OHIFCornerstoneViewportOverlay.css';
+import {
+  isValidNumber,
+  formatNumberPrecision,
+  formatDICOMDate,
+  formatDICOMTime,
+  formatPN,
+  getCompression,
+} from '../utils/formatStudy';
+import classNames from 'classnames';
+import { Icon } from '@ohif/ui/src/elements/Icon';
+import { Tooltip } from '@ohif/ui/src/components/tooltip';
+import { OverlayTrigger } from '@ohif/ui/src/components/overlayTrigger';
+
+const Button = styled.button`
+  color: white;
+  padding: 2px 7px;
+  border-radius: 10px;
+  outline: 0;
+  text-transform: none;
+  margin: 2px 2px;
+  cursor: pointer;
+  &:disabled {
+    cursor: default;
+    opacity: 0.9;
+  }
+`;
+
+class OHIFCornerstoneViewportOverlay extends PureComponent {
+  static propTypes = {
+    scale: PropTypes.number.isRequired,
+    windowWidth: PropTypes.oneOfType([
+      PropTypes.number.isRequired,
+      PropTypes.string.isRequired,
+    ]),
+    windowCenter: PropTypes.oneOfType([
+      PropTypes.number.isRequired,
+      PropTypes.string.isRequired,
+    ]),
+    imageId: PropTypes.string.isRequired,
+    imageIndex: PropTypes.number.isRequired,
+    stackSize: PropTypes.number.isRequired,
+    inconsistencyWarnings: PropTypes.array,
+    SRLabels: PropTypes.array,
+  };
+
+  render() {
+    const {
+      imageId,
+      scale,
+      windowWidth,
+      windowCenter,
+      inconsistencyWarnings,
+      SRLabels,
+    } = this.props;
+
+    if (!imageId) {
+      return null;
+    }
+
+    const zoomPercentage = formatNumberPrecision(scale * 100, 0);
+    const seriesMetadata =
+      cornerstone.metaData.get('generalSeriesModule', imageId) || {};
+    const imagePlaneModule =
+      cornerstone.metaData.get('imagePlaneModule', imageId) || {};
+    const { rows, columns, sliceThickness, sliceLocation } = imagePlaneModule;
+    const { seriesNumber, seriesDescription } = seriesMetadata;
+
+    const generalStudyModule =
+      cornerstone.metaData.get('generalStudyModule', imageId) || {};
+    const { studyDate, studyTime, studyDescription } = generalStudyModule;
+
+    const patientModule =
+      cornerstone.metaData.get('patientModule', imageId) || {};
+    const { patientId, patientName } = patientModule;
+
+    const generalImageModule =
+      cornerstone.metaData.get('generalImageModule', imageId) || {};
+    const { instanceNumber } = generalImageModule;
+
+    const cineModule = cornerstone.metaData.get('cineModule', imageId) || {};
+    const { frameTime } = cineModule;
+
+    const frameRate = formatNumberPrecision(1000 / frameTime, 1);
+    const compression = getCompression(imageId);
+    const wwwc = `W: ${
+      windowWidth.toFixed ? windowWidth.toFixed(0) : windowWidth
+    } L: ${windowWidth.toFixed ? windowCenter.toFixed(0) : windowCenter}`;
+    const imageDimensions = `${columns} x ${rows}`;
+
+    const { imageIndex, stackSize } = this.props;
+
+    const inconsistencyWarningsOn =
+      inconsistencyWarnings && inconsistencyWarnings.length !== 0
+        ? true
+        : false;
+    const getWarningContent = warningList => {
+      if (Array.isArray(warningList)) {
+        const listedWarnings = warningList.map((warn, index) => {
+          return <li key={index}>{warn}</li>;
+        });
+
+        return <ol>{listedWarnings}</ol>;
+      } else {
+        return <React.Fragment>{warningList}</React.Fragment>;
+      }
+    };
+
+    const getWarningInfo = (seriesNumber, inconsistencyWarnings) => {
+      return (
+        <React.Fragment>
+          {inconsistencyWarnings.length != 0 ? (
+            <OverlayTrigger
+              key={seriesNumber}
+              placement="left"
+              overlay={
+                <Tooltip
+                  placement="left"
+                  className="in tooltip-warning"
+                  id="tooltip-left"
+                >
+                  <div className="warningTitle">Series Inconsistencies</div>
+                  <div className="warningContent">
+                    {getWarningContent(inconsistencyWarnings)}
+                  </div>
+                </Tooltip>
+              }
+            >
+              <div className={classNames('warning')}>
+                <span className="warning-icon">
+                  <Icon name="exclamation-triangle" />
+                </span>
+              </div>
+            </OverlayTrigger>
+          ) : (
+            <React.Fragment></React.Fragment>
+          )}
+        </React.Fragment>
+      );
+    };
+
+    const SRLabelsOn = SRLabels && SRLabels.length !== 0 ? true : false;
+
+    /**/
+
+    const getSRLabelsContent = SRLabels => {
+      if (Array.isArray(SRLabels)) {
+        const listedSRLabels = SRLabels.map((SRLabel, index) => {
+          const color = SRLabel.labels.color;
+          return (
+            SRLabel.labels.visible && (
+              <OverlayTrigger
+                key={index}
+                placement="top"
+                overlay={
+                  <Tooltip
+                    placement="top"
+                    className="in tooltip-warning"
+                    id="tooltip-top"
+                  >
+                    <div className="warningTitle">
+                      {' '}
+                      Coding scheme designators{' '}
+                    </div>
+                    <div className="warningContent">
+                      {SRLabel.labels.labelCodingSchemeDesignator +
+                        ' : ' +
+                        SRLabel.labels.valueCodingSchemeDesignator}
+                    </div>
+                  </Tooltip>
+                }
+              >
+                <div style={{ display: 'inline-block' }}>
+                  <Button
+                    style={{
+                      backgroundColor: color,
+                    }}
+                    disabled={true}
+                    key={index}
+                  >
+                    {SRLabel.labels.label + ' : ' + SRLabel.labels.value}
+                  </Button>
+                </div>
+              </OverlayTrigger>
+            )
+          );
+        });
+
+        return <ol>{listedSRLabels}</ol>;
+      } else {
+        return <React.Fragment></React.Fragment>;
+      }
+    };
+
+    const getSRLabelsInfo = SRLabels => {
+      return (
+        <React.Fragment>
+          {SRLabels.length != 0 ? (
+            getSRLabelsContent(SRLabels)
+          ) : (
+            <React.Fragment></React.Fragment>
+          )}
+        </React.Fragment>
+      );
+    };
+
+    const normal = (
+      <React.Fragment>
+        <div className="top-left overlay-element">
+          <div>{formatPN(patientName)}</div>
+          <div>{patientId}</div>
+        </div>
+        <div className="top-right overlay-element">
+          <div>{studyDescription}</div>
+          <div>
+            {formatDICOMDate(studyDate)} {formatDICOMTime(studyTime)}
+          </div>
+        </div>
+        <div className="bottom-right overlay-element">
+          <div>Zoom: {zoomPercentage}%</div>
+          <div>{wwwc}</div>
+          <div className="compressionIndicator">{compression}</div>
+        </div>
+        <div className="bottom-left2 warning">
+          <div>
+            {inconsistencyWarningsOn
+              ? getWarningInfo(seriesNumber, inconsistencyWarnings)
+              : ''}
+          </div>
+        </div>
+        <div className="bottom-left3 warning">
+          <div>{SRLabelsOn ? getSRLabelsInfo(SRLabels) : ''}</div>
+        </div>
+        <div className="bottom-left overlay-element">
+          <div>{seriesNumber >= 0 ? `Ser: ${seriesNumber}` : ''}</div>
+          <div>
+            {stackSize > 1
+              ? `Img: ${instanceNumber} ${imageIndex}/${stackSize}`
+              : ''}
+          </div>
+          <div>
+            {frameRate >= 0 ? `${formatNumberPrecision(frameRate, 2)} FPS` : ''}
+            <div>{imageDimensions}</div>
+            <div>
+              {isValidNumber(sliceLocation)
+                ? `Loc: ${formatNumberPrecision(sliceLocation, 2)} mm `
+                : ''}
+              {sliceThickness
+                ? `Thick: ${formatNumberPrecision(sliceThickness, 2)} mm`
+                : ''}
+            </div>
+            <div>{seriesDescription}</div>
+          </div>
+        </div>
+      </React.Fragment>
+    );
+
+    return <div className="OHIFCornerstoneViewportOverlay">{normal}</div>;
+  }
+}
+
+export default OHIFCornerstoneViewportOverlay;

extensions/cornerstone/src/handleSegmentationStorage.js

@@ -1,128 +0,0 @@
-import * as dcmjs from 'dcmjs';
-
-import OHIF from '@ohif/core';
-import cornerstone from 'cornerstone-core';
-import cornerstoneTools from 'cornerstone-tools';
-
-const { StackManager, DicomLoaderService } = OHIF.utils;
-
-function getDisplaySet(studies, StudyInstanceUID, displaySetInstanceUID) {
-  const study = studies.find(
-    study => study.StudyInstanceUID === StudyInstanceUID
-  );
-
-  const displaySet = study.displaySets.find(set => {
-    return set.displaySetInstanceUID === displaySetInstanceUID;
-  });
-
-  return displaySet;
-}
-
-function getDisplaySetsBySeries(studies, StudyInstanceUID, SeriesInstanceUID) {
-  const study = studies.find(
-    study => study.StudyInstanceUID === StudyInstanceUID
-  );
-
-  return study.displaySets.filter(set => {
-    return set.SeriesInstanceUID === SeriesInstanceUID;
-  });
-}
-
-function parseSeg(arrayBuffer, imageIds) {
-  return dcmjs.adapters.Cornerstone.Segmentation.generateToolState(
-    imageIds,
-    arrayBuffer,
-    cornerstone.metaData
-  );
-}
-
-function addSegMetadataToCornerstoneToolState(
-  segMetadata,
-  toolState,
-  displaySetInstanceUID
-) {
-  cornerstoneTools.globalImageIdSpecificToolStateManager.restoreToolState(
-    toolState
-  );
-
-  const brushModule = cornerstoneTools.store.modules.brush;
-
-  for (let i = 0; i < segMetadata.length; i++) {
-    brushModule.setters.metadata(displaySetInstanceUID, i, segMetadata[i]);
-  }
-}
-
-async function handleSegmentationStorage(
-  studies,
-  StudyInstanceUID,
-  displaySetInstanceUID
-) {
-  const study = studies.find(
-    study => study.StudyInstanceUID === StudyInstanceUID
-  );
-  const displaySet = getDisplaySet(
-    studies,
-    StudyInstanceUID,
-    displaySetInstanceUID
-  );
-
-  const arrayBuffer = await DicomLoaderService.findDicomDataPromise(
-    displaySet,
-    studies
-  );
-  const dicomData = dcmjs.data.DicomMessage.readFile(arrayBuffer);
-  const dataset = dcmjs.data.DicomMetaDictionary.naturalizeDataset(
-    dicomData.dict
-  );
-
-  dataset._meta = dcmjs.data.DicomMetaDictionary.namifyDataset(dicomData.meta);
-
-  const SeriesInstanceUID = dataset.ReferencedSeriesSequence.SeriesInstanceUID;
-  const displaySets = getDisplaySetsBySeries(
-    studies,
-    StudyInstanceUID,
-    SeriesInstanceUID
-  );
-
-  if (displaySets.length > 1) {
-    console.warn(
-      'More than one display set with the same SeriesInstanceUID. This is not supported yet...'
-    );
-  }
-
-  const referenceDisplaySet = displaySets[0];
-  const imageIds = referenceDisplaySet.images.map(image => image.getImageId());
-  const results = parseSeg(arrayBuffer, imageIds);
-
-  if (!results) {
-    throw new Error('Fractional segmentations are not supported');
-  }
-
-  const { labelmapBuffer, segMetadata, segmentsOnFrame } = results;
-  const { setters } = cornerstoneTools.getModule('segmentation');
-
-  setters.labelmap3DByFirstImageId(
-    imageIds[0],
-    labelmapBuffer,
-    0, // TODO -> Can define a color LUT based on colors in the SEG later.
-    segMetadata,
-    imageIds.length,
-    segmentsOnFrame
-  );
-
-  const cachedStack = StackManager.findOrCreateStack(
-    study,
-    referenceDisplaySet
-  );
-  const stack = Object.assign({}, cachedStack);
-
-  stack.currentImageIdIndex = 0;
-
-  return {
-    StudyInstanceUID,
-    displaySetInstanceUID,
-    stack,
-  };
-}
-
-export default handleSegmentationStorage;

extensions/cornerstone/src/index.js

@@ -1,14 +1,21 @@
+import React from 'react';
 import init from './init.js';
-import asyncComponent from './asyncComponent.js';
 import commandsModule from './commandsModule.js';
 import toolbarModule from './toolbarModule.js';
 import CornerstoneViewportDownloadForm from './CornerstoneViewportDownloadForm';
+import { version } from '../package.json';
 
-const OHIFCornerstoneViewport = asyncComponent(() =>
-  import(
-    /* webpackChunkName: "OHIFCornerstoneViewport" */ './OHIFCornerstoneViewport.js'
-  )
-);
+const Component = React.lazy(() => {
+  return import('./OHIFCornerstoneViewport');
+});
+
+const OHIFCornerstoneViewport = props => {
+  return (
+    <React.Suspense fallback={<div>Loading...</div>}>
+      <Component {...props} />
+    </React.Suspense>
+  );
+};
 
 /**
  *
@@ -18,6 +25,7 @@ export default {
    * Only required property. Should be a unique value across all extensions.
    */
   id: 'cornerstone',
+  version,
 
   /**
    *
@@ -28,8 +36,33 @@ export default {
   preRegistration({ servicesManager, configuration = {} }) {
     init({ servicesManager, configuration });
   },
-  getViewportModule() {
-    return OHIFCornerstoneViewport;
+  getViewportModule({ commandsManager, appConfig }) {
+    const ExtendedOHIFCornerstoneViewport = props => {
+      /**
+       * TODO: This appears to be used to set the redux parameters for
+       * the viewport when new images are loaded. It's very ugly
+       * and we should remove it.
+       */
+      const onNewImageHandler = jumpData => {
+        /** Do not trigger all viewports to render unnecessarily */
+        jumpData.refreshViewports = false;
+        commandsManager.runCommand('jumpToImage', jumpData);
+      };
+
+      const { studyPrefetcher } = appConfig;
+      const isStackPrefetchEnabled =
+        studyPrefetcher && !studyPrefetcher.enabled;
+
+      return (
+        <OHIFCornerstoneViewport
+          {...props}
+          onNewImage={onNewImageHandler}
+          isStackPrefetchEnabled={isStackPrefetchEnabled}
+        />
+      );
+    };
+
+    return ExtendedOHIFCornerstoneViewport;
   },
   getToolbarModule() {
     return toolbarModule;

extensions/cornerstone/src/init.js

@@ -5,6 +5,8 @@ import csTools from 'cornerstone-tools';
 import merge from 'lodash.merge';
 import initCornerstoneTools from './initCornerstoneTools.js';
 import measurementServiceMappingsFactory from './utils/measurementServiceMappings/measurementServiceMappingsFactory';
+import dicomSRModule from './tools/modules/dicomSRModule';
+import srModuleId from './tools/id';
 
 /**
  *
@@ -15,6 +17,8 @@ import measurementServiceMappingsFactory from './utils/measurementServiceMapping
 export default function init({ servicesManager, configuration }) {
   const { UIDialogService, MeasurementService } = servicesManager.services;
 
+  csTools.register('module', srModuleId, dicomSRModule);
+
   const callInputDialog = (data, event, callback) => {
     if (UIDialogService) {
       let dialogId = UIDialogService.create({
@@ -37,7 +41,14 @@ export default function init({ servicesManager, configuration }) {
     }
   };
 
-  const { csToolsConfig } = configuration;
+  const {
+    csToolsConfig,
+    stackPrefetch = {
+      maxImagesToPrefetch: Infinity,
+      preserveExistingPool: false,
+      maxSimultaneousRequests: 20,
+    },
+  } = configuration;
   const metadataProvider = OHIF.cornerstone.metadataProvider;
 
   cornerstone.metaData.addProvider(
@@ -52,7 +63,7 @@ export default function init({ servicesManager, configuration }) {
     autoResizeViewports: false,
   };
 
-  initCornerstoneTools(defaultCsToolsConfig);
+  initCornerstoneTools({ ...defaultCsToolsConfig, ...stackPrefetch });
 
   const toolsGroupedByType = {
     touch: [csTools.PanMultiTouchTool, csTools.ZoomTouchPinchTool],
@@ -66,7 +77,6 @@ export default function init({ servicesManager, configuration }) {
       csTools.DragProbeTool,
       csTools.RectangleRoiTool,
     ],
-    segmentation: [csTools.BrushTool],
     other: [
       csTools.PanTool,
       csTools.ZoomTool,

extensions/cornerstone/src/initCornerstoneTools.js

@@ -2,6 +2,9 @@ import Hammer from 'hammerjs';
 import cornerstone from 'cornerstone-core';
 import cornerstoneMath from 'cornerstone-math';
 import cornerstoneTools from 'cornerstone-tools';
+import OHIF from '@ohif/core';
+
+const { log } = OHIF;
 
 export default function(configuration = {}) {
   // For debugging
@@ -12,6 +15,13 @@ export default function(configuration = {}) {
   cornerstoneTools.external.cornerstoneMath = cornerstoneMath;
   cornerstoneTools.init(configuration);
 
+  cornerstoneTools.loadHandlerManager.setErrorLoadingHandler(
+    (element, imageId, error) => {
+      log.error(imageId);
+      throw error;
+    }
+  );
+
   // Set the tool font and font size
   // context.font = "[style] [variant] [weight] [size]/[line height] [font family]";
   const fontFamily =
@@ -24,4 +34,11 @@ export default function(configuration = {}) {
   cornerstoneTools.toolColors.setActiveColor('rgb(0, 255, 0)');
 
   cornerstoneTools.store.state.touchProximity = 40;
+
+  // Configure stack prefetch
+  cornerstoneTools.stackPrefetch.setConfiguration({
+    maxImagesToPrefetch: configuration.maxImagesToPrefetch,
+    preserveExistingPool: configuration.preserveExistingPool,
+    maxSimultaneousRequests: configuration.maxSimultaneousRequests,
+  });
 }

extensions/cornerstone/src/tools/DICOMSRDisplayTool.js

@@ -0,0 +1,419 @@
+import csTools, {
+  importInternal,
+  getToolState,
+  toolColors,
+} from 'cornerstone-tools';
+
+import cornerstone from 'cornerstone-core';
+
+/** Internal imports */
+import TOOL_NAMES from './constants/toolNames';
+import SCOORD_TYPES from './constants/scoordTypes';
+import id from './id';
+
+/** Cornerstone 3rd party dev kit imports */
+const draw = importInternal('drawing/draw');
+const drawJoinedLines = importInternal('drawing/drawJoinedLines');
+const drawCircle = importInternal('drawing/drawCircle');
+const drawEllipse = importInternal('drawing/drawEllipse');
+const drawHandles = importInternal('drawing/drawHandles');
+const drawArrow = importInternal('drawing/drawArrow');
+const getNewContext = importInternal('drawing/getNewContext');
+const BaseTool = importInternal('base/BaseTool');
+const drawLinkedTextBox = importInternal('drawing/drawLinkedTextBox');
+
+/**
+ * @class DICOMSRDisplayTool - Renders DICOMSR data in a read only manner (i.e. as an overlay).
+ *
+ * This is a generic render tool.
+ *
+ * A single tool that, given some schema, can render
+ * POINT, MULTIPOINT, POLYLINE, CIRCLE, and ELLIPSE
+ * value types for a given imageId.
+ *
+ *
+ * @extends cornerstoneTools.BaseTool
+ */
+export default class DICOMSRDisplayTool extends BaseTool {
+  constructor(props = {}) {
+    const defaultProps = {
+      mixins: ['enabledOrDisabledBinaryTool'],
+      name: TOOL_NAMES.DICOM_SR_DISPLAY_TOOL,
+    };
+
+    const initialProps = Object.assign(defaultProps, props);
+
+    super(initialProps);
+
+    this._module = csTools.getModule(id);
+  }
+
+  renderToolData(evt) {
+    const eventData = evt.detail;
+    const { element } = eventData;
+    const module = this._module;
+
+    const toolState = getToolState(element, this.name);
+
+    if (!toolState) {
+      return;
+    }
+
+    const trackingUniqueIdentifiersForElement = module.getters.trackingUniqueIdentifiersForElement(
+      element
+    );
+
+    const {
+      activeIndex,
+      trackingUniqueIdentifiers,
+    } = trackingUniqueIdentifiersForElement;
+
+    const activeTrackingUniqueIdentifier =
+      trackingUniqueIdentifiers[activeIndex];
+
+    // Filter toolData to only render the data for the active SR.
+    const filteredToolData = toolState.data.filter(td =>
+      trackingUniqueIdentifiers.includes(td.TrackingUniqueIdentifier)
+    );
+
+    let shouldRepositionTextBoxes = false;
+
+    for (let i = 0; i < filteredToolData.length; i++) {
+      const data = filteredToolData[i];
+      const { renderableData, labels } = data;
+
+      const color =
+        data.TrackingUniqueIdentifier === activeTrackingUniqueIdentifier
+          ? toolColors.getActiveColor()
+          : toolColors.getToolColor();
+      const lineWidth = 2;
+      const options = {
+        color,
+        lineWidth,
+        handleRadius: 6,
+      };
+
+      Object.keys(renderableData).forEach(GraphicType => {
+        const renderableDataForGraphicType = renderableData[GraphicType];
+
+        switch (GraphicType) {
+          case SCOORD_TYPES.TEXT:
+            break;
+          case SCOORD_TYPES.POINT:
+            this.renderPoint(renderableDataForGraphicType, eventData, options);
+            break;
+          case SCOORD_TYPES.MULTIPOINT:
+            this.renderMultipoint(
+              renderableDataForGraphicType,
+              eventData,
+              options
+            );
+            break;
+          case SCOORD_TYPES.POLYGON:
+          case SCOORD_TYPES.POLYLINE:
+            this.renderPolyLine(
+              renderableDataForGraphicType,
+              eventData,
+              options
+            );
+            break;
+          case SCOORD_TYPES.CIRCLE:
+            this.renderCircle(renderableDataForGraphicType, eventData, options);
+            break;
+          case SCOORD_TYPES.ELLIPSE:
+            this.renderEllipse(
+              renderableDataForGraphicType,
+              eventData,
+              options
+            );
+            break;
+        }
+      });
+
+      const { element } = eventData;
+      const context = getNewContext(eventData.canvasContext.canvas);
+
+      if (!data.handles || !data.handles.textBox) {
+        const textBox = {
+          active: false,
+          hasMoved: true,
+          movesIndependently: false,
+          drawnIndependently: true,
+          allowedOutsideImage: true,
+          hasBoundingBox: true,
+        };
+
+        const anchorPoints = _getTextBoxAnchorPointsForRenderableData(
+          renderableData,
+          eventData
+        );
+        textBox.anchorPoints = anchorPoints;
+
+        const bottomRight = {
+          x: Math.max(...anchorPoints.map(point => point.x)),
+          y: Math.max(...anchorPoints.map(point => point.y)),
+        };
+
+        textBox.x = bottomRight.x;
+        textBox.y = bottomRight.y;
+
+        data.handles = {};
+        data.handles.textBox = textBox;
+
+        shouldRepositionTextBoxes = true;
+      }
+
+      const text = _getTextBoxLinesFromLabels(labels);
+
+      function textBoxAnchorPoints() {
+        return data.handles.textBox.anchorPoints;
+      }
+
+      if (data.handles.textBox.anchorPoints.length !== 0) {
+        draw(context, context => {
+          drawLinkedTextBox(
+            context,
+            element,
+            data.handles.textBox,
+            text,
+            data.handles,
+            textBoxAnchorPoints,
+            color,
+            lineWidth,
+            0,
+            true
+          );
+        });
+      }
+    }
+
+    // TOOD -> text boxes may overlap with other annotations at the moment.
+    // To be fixed after we get requirements.
+    // if (shouldRepositionTextBoxes) {
+    //   this.repositionTextBox(filteredToolData, eventData);
+    // }
+  }
+
+  // repositionTextBox(toolData, eventData) {
+  //   const toolBoundingBoxes = [];
+
+  //   for (let i = 0; i < toolData.length; i++) {
+  //     const toolDataI = toolData[i];
+
+  //     const { textBox } = toolDataI.handles;
+  //     const { anchorPoints } = textBox;
+
+  //     const boundingBox = _getBoundingBoxFromAnchorPoints(anchorPoints);
+  //     // Get the textbox bounding locations.
+  //     // Get the tool extents.
+  //   }
+  // }
+
+  renderPolyLine(renderableData, eventData, options) {
+    const { element } = eventData;
+    const context = getNewContext(eventData.canvasContext.canvas);
+    renderableData.forEach(points => {
+      draw(context, context => {
+        drawJoinedLines(context, element, points[0], points, options);
+      });
+    });
+  }
+
+  renderMultipoint(renderableData, eventData, options) {
+    const context = getNewContext(eventData.canvasContext.canvas);
+
+    renderableData.forEach(points => {
+      draw(context, context => {
+        drawHandles(context, eventData, points, options);
+      });
+    });
+  }
+
+  renderPoint(renderableData, eventData, options) {
+    // Render single point as an arrow.
+    const { element, image } = eventData;
+    const { rows, columns } = image;
+    const context = getNewContext(eventData.canvasContext.canvas);
+    const { color, lineWidth } = options;
+
+    // Find a suitable length for the image size.
+
+    const xOffset = columns / 10;
+    const yOffset = rows / 10;
+
+    renderableData.forEach(points => {
+      const point = points[0]; // The SCOORD type is POINT so the array length is 1.
+      draw(context, context => {
+        // Draw the arrow
+        const handleStartCanvas = cornerstone.pixelToCanvas(element, point);
+        const handleEndCanvas = cornerstone.pixelToCanvas(element, {
+          x: point.x + xOffset,
+          y: point.y + yOffset,
+        });
+
+        drawArrow(
+          context,
+          handleEndCanvas,
+          handleStartCanvas,
+          color,
+          lineWidth,
+          false
+        );
+      });
+    });
+  }
+
+  renderCircle(renderableData, eventData, options) {
+    const { element } = eventData;
+
+    const context = getNewContext(eventData.canvasContext.canvas);
+
+    renderableData.forEach(circle => {
+      const { center, radius } = circle;
+
+      drawCircle(context, element, center, radius, options);
+    });
+  }
+
+  renderEllipse(renderableData, eventData, options) {
+    const { element } = eventData;
+
+    const context = getNewContext(eventData.canvasContext.canvas);
+
+    renderableData.forEach(ellipse => {
+      const { corner1, corner2 } = ellipse;
+
+      drawEllipse(
+        context,
+        element,
+        corner1,
+        corner2,
+        options,
+        'pixel',
+        0 // TODO -> Work our the initial rotation and add it here so we render appropriately rotated ellipses.
+      );
+    });
+  }
+}
+
+function _getTextBoxLinesFromLabels(labels) {
+  // TODO -> max 3 for now (label + shortAxis + longAxis), need a generic solution for this!
+
+  const labelLength = Math.min(labels.length, 3);
+  const lines = [];
+
+  for (let i = 0; i < labelLength; i++) {
+    const labelEntry = labels[i];
+    lines.push(`${_labelToShorthand(labelEntry.label)}${labelEntry.value}`);
+  }
+
+  return lines;
+}
+
+const SHORT_HAND_MAP = {
+  'Short Axis': 'W ',
+  'Long Axis': 'L ',
+  AREA: 'Area ',
+  Length: '',
+  CORNERSTONEFREETEXT: '',
+};
+
+function _labelToShorthand(label) {
+  const shortHand = SHORT_HAND_MAP[label];
+
+  if (shortHand !== undefined) {
+    return shortHand;
+  }
+
+  return label;
+}
+
+function _getTextBoxAnchorPointsForRenderableData(renderableData, eventData) {
+  let anchorPoints = [];
+
+  Object.keys(renderableData).forEach(GraphicType => {
+    const renderableDataForGraphicType = renderableData[GraphicType];
+
+    switch (GraphicType) {
+      case SCOORD_TYPES.TEXT:
+        break;
+      case SCOORD_TYPES.POINT:
+        renderableDataForGraphicType.forEach(points => {
+          anchorPoints = [...anchorPoints, ...points];
+
+          // Add other arrow point based on image size.
+          const { image } = eventData;
+          const { rows, columns } = image;
+
+          const xOffset = columns / 10;
+          const yOffset = rows / 10;
+          const point = points[0];
+
+          anchorPoints.push({ x: point.x + xOffset, y: point.y + yOffset });
+        });
+
+        break;
+      case SCOORD_TYPES.MULTIPOINT:
+      case SCOORD_TYPES.POLYLINE:
+      case SCOORD_TYPES.POLYGON:
+        renderableDataForGraphicType.forEach(points => {
+          anchorPoints = [...anchorPoints, ...points];
+        });
+        break;
+      case SCOORD_TYPES.CIRCLE:
+        renderableDataForGraphicType.forEach(circle => {
+          const { center, radius } = circle;
+
+          anchorPoints.push({ x: center.x + radius, y: center.y });
+          anchorPoints.push({ x: center.x - radius, y: center.y });
+          anchorPoints.push({ x: center.x, y: center.y + radius });
+          anchorPoints.push({ x: center.x, y: center.y - radius });
+        });
+
+        break;
+      case SCOORD_TYPES.ELLIPSE:
+        renderableDataForGraphicType.forEach(ellipse => {
+          const { corner1, corner2 } = ellipse;
+
+          const halfWidth = Math.abs(corner1.x - corner2.x) / 2;
+          const halfHeight = Math.abs(corner1.y - corner2.y) / 2;
+
+          const center = {
+            x: (corner1.x + corner2.x) / 2,
+            y: (corner1.y + corner2.y) / 2,
+          };
+
+          anchorPoints.push({ x: center.x + halfWidth, y: center.y });
+          anchorPoints.push({ x: center.x - halfWidth, y: center.y });
+          anchorPoints.push({ x: center.x, y: center.y + halfHeight });
+          anchorPoints.push({ x: center.x, y: center.y - halfHeight });
+        });
+        break;
+    }
+  });
+
+  return anchorPoints;
+}
+
+function _getBoundingBoxFromAnchorPoints(anchorPoints) {
+  let minX = Infinity;
+  let maxX = -Infinity;
+  let minY = Infinity;
+  let maxY = -Infinity;
+
+  anchorPoints.forEach(point => {
+    const { x, y } = point;
+
+    if (x > maxX) {
+      maxX = x;
+    } else if (x < minX) {
+      minX = x;
+    }
+
+    if (y > maxY) {
+      maxY = y;
+    } else if (y < minY) {
+      minY = y;
+    }
+  });
+}

extensions/cornerstone/src/tools/checkForSRAnnotations.js

@@ -0,0 +1,57 @@
+import csTools from 'cornerstone-tools';
+import cs from 'cornerstone-core';
+import OHIF from '@ohif/core';
+
+import { getEnabledElement } from '../state';
+import id from './id';
+
+const { studyMetadataManager } = OHIF.utils;
+
+const checkForSRAnnotations = ({ viewportIndex, displaySet }) => {
+  const srModule = csTools.getModule(id);
+
+  const element = getEnabledElement(viewportIndex);
+  if (!element) {
+    return;
+  }
+
+  const { StudyInstanceUID } = displaySet;
+  const studyMetadata = studyMetadataManager.get(StudyInstanceUID);
+  if (!studyMetadata) {
+    return;
+  }
+
+  const srDisplaySets = studyMetadata
+    .getDisplaySets()
+    .filter(ds => ds.Modality === 'SR');
+  if (srDisplaySets.length === 0) {
+    return;
+  }
+
+  const { measurements: _measurements } = srDisplaySets[0];
+  if (!_measurements || _measurements.length < 1) {
+    return;
+  }
+
+  const measurements = _measurements.filter(m => m.loaded === true);
+  const measurement = measurements[0];
+  if (!measurement) {
+    return;
+  }
+
+  srModule.setters.trackingUniqueIdentifiersForElement(
+    element,
+    measurements.map(measurement => measurement.TrackingUniqueIdentifier),
+    measurement
+  );
+
+  const { TrackingUniqueIdentifier } = measurement;
+  srModule.setters.activeTrackingUniqueIdentifierForElement(
+    element,
+    TrackingUniqueIdentifier
+  );
+
+  cs.updateImage(element);
+};
+
+export default checkForSRAnnotations;

extensions/cornerstone/src/tools/constants/scoordTypes.js

@@ -0,0 +1,9 @@
+export default {
+  TEXT: 'TEXT',
+  POINT: 'POINT',
+  MULTIPOINT: 'MULTIPOINT',
+  POLYLINE: 'POLYLINE',
+  CIRCLE: 'CIRCLE',
+  ELLIPSE: 'ELLIPSE',
+  POLYGON: 'POLYGON',
+};

extensions/cornerstone/src/tools/constants/toolNames.js

@@ -0,0 +1,5 @@
+const TOOL_NAMES = {
+  DICOM_SR_DISPLAY_TOOL: 'DICOMSRDisplayTool',
+};
+
+export default TOOL_NAMES;

extensions/cornerstone/src/tools/id.js

@@ -0,0 +1,7 @@
+const id = 'org.ohif.dicom-sr';
+
+export default id;
+
+const SOPClassHandlerName = 'dicom-sr';
+const SOPClassHandlerId = `${id}.sopClassHandlerModule.${SOPClassHandlerName}`;
+export { SOPClassHandlerName, SOPClassHandlerId };

extensions/cornerstone/src/tools/initSRTools.js

@@ -0,0 +1,108 @@
+import cornerstoneTools from 'cornerstone-tools';
+import DICOMSRDisplayTool from './DICOMSRDisplayTool';
+import TOOL_NAMES from './constants/toolNames';
+import getToolAlias from './utils/getToolAlias';
+
+/**
+ * Initialize SR cornerstone tools.
+ *
+ * @param {*} targetElement
+ */
+const initSRTools = targetElement => {
+  const primaryToolId = 'Wwwc';
+  const toolAlias = getToolAlias(primaryToolId); // These are 1:1 for built-in only
+
+  // ~~ MAGIC
+  cornerstoneTools.addToolForElement(targetElement, DICOMSRDisplayTool);
+  cornerstoneTools.setToolEnabledForElement(
+    targetElement,
+    TOOL_NAMES.DICOM_SR_DISPLAY_TOOL
+  );
+
+  // ~~ Variants
+  cornerstoneTools.addToolForElement(
+    targetElement,
+    cornerstoneTools.LengthTool,
+    {
+      name: 'SRLength',
+      configuration: {
+        renderDashed: true,
+      },
+    }
+  );
+  cornerstoneTools.addToolForElement(
+    targetElement,
+    cornerstoneTools.ArrowAnnotateTool,
+    {
+      name: 'SRArrowAnnotate',
+      configuration: {
+        renderDashed: true,
+      },
+    }
+  );
+  cornerstoneTools.addToolForElement(
+    targetElement,
+    cornerstoneTools.BidirectionalTool,
+    {
+      name: 'SRBidirectional',
+      configuration: {
+        renderDashed: true,
+      },
+    }
+  );
+  cornerstoneTools.addToolForElement(
+    targetElement,
+    cornerstoneTools.EllipticalRoiTool,
+    {
+      name: 'SREllipticalRoi',
+      configuration: {
+        renderDashed: true,
+      },
+    }
+  );
+  cornerstoneTools.addToolForElement(
+    targetElement,
+    cornerstoneTools.RectangleRoiTool,
+    {
+      name: 'SRRectangleRoi',
+      configuration: {
+        renderDashed: true,
+      },
+    }
+  );
+  cornerstoneTools.addToolForElement(
+    targetElement,
+    cornerstoneTools.FreehandRoiTool,
+    {
+      name: 'SRFreehandRoi',
+      configuration: {
+        renderDashed: true,
+      },
+    }
+  );
+
+  // ~~ Business as usual
+  cornerstoneTools.setToolActiveForElement(targetElement, 'PanMultiTouch', {
+    pointers: 2,
+  });
+  cornerstoneTools.setToolActiveForElement(targetElement, 'ZoomTouchPinch', {});
+
+  // TODO: Add always dashed tool alternative aliases
+  // TODO: or same name... alternative config?
+  cornerstoneTools.setToolActiveForElement(targetElement, toolAlias, {
+    mouseButtonMask: 1,
+  });
+  cornerstoneTools.setToolActiveForElement(targetElement, 'Pan', {
+    mouseButtonMask: 4,
+  });
+  cornerstoneTools.setToolActiveForElement(targetElement, 'Zoom', {
+    mouseButtonMask: 2,
+  });
+  cornerstoneTools.setToolActiveForElement(
+    targetElement,
+    'StackScrollMouseWheel',
+    {}
+  );
+};
+
+export default initSRTools;

extensions/cornerstone/src/tools/modules/dicomSRModule.js

@@ -0,0 +1,61 @@
+import cornerstone from 'cornerstone-core';
+
+const state = {
+  TrackingUniqueIdentifier: null,
+  trackingIdentifiersByEnabledElementUUID: {},
+};
+
+function setTrackingUniqueIdentifiersForElement(
+  element,
+  trackingUniqueIdentifiers,
+  activeIndex = 0
+) {
+  const enabledElement = cornerstone.getEnabledElement(element);
+  const { uuid } = enabledElement;
+
+  state.trackingIdentifiersByEnabledElementUUID[uuid] = {
+    trackingUniqueIdentifiers,
+    activeIndex,
+  };
+}
+
+function setActiveTrackingUniqueIdentifierForElement(
+  element,
+  TrackingUniqueIdentifier
+) {
+  const enabledElement = cornerstone.getEnabledElement(element);
+  const { uuid } = enabledElement;
+
+  const trackingIdentifiersForElement =
+    state.trackingIdentifiersByEnabledElementUUID[uuid];
+
+  if (trackingIdentifiersForElement) {
+    const activeIndex = trackingIdentifiersForElement.trackingUniqueIdentifiers.findIndex(
+      tuid => tuid === TrackingUniqueIdentifier
+    );
+
+    trackingIdentifiersForElement.activeIndex = activeIndex;
+  }
+}
+
+function getTrackingUniqueIdentifiersForElement(element) {
+  const enabledElement = cornerstone.getEnabledElement(element);
+  const { uuid } = enabledElement;
+
+  if (state.trackingIdentifiersByEnabledElementUUID[uuid]) {
+    return state.trackingIdentifiersByEnabledElementUUID[uuid];
+  }
+
+  return { trackingUniqueIdentifiers: [] };
+}
+
+export default {
+  state,
+  getters: {
+    trackingUniqueIdentifiersForElement: getTrackingUniqueIdentifiersForElement,
+  },
+  setters: {
+    trackingUniqueIdentifiersForElement: setTrackingUniqueIdentifiersForElement,
+    activeTrackingUniqueIdentifierForElement: setActiveTrackingUniqueIdentifierForElement,
+  },
+};

extensions/cornerstone/src/tools/utils/getToolAlias.js

@@ -0,0 +1,32 @@
+/**
+ * Get cornerstone tool alias.
+ *
+ * @param {string} toolName
+ * @returns tool alias
+ */
+export default function getToolAlias(toolName) {
+  let toolAlias = toolName;
+
+  switch (toolName) {
+    case 'Length':
+      toolAlias = 'SRLength';
+      break;
+    case 'Bidirectional':
+      toolAlias = 'SRBidirectional';
+      break;
+    case 'ArrowAnnotate':
+      toolAlias = 'SRArrowAnnotate';
+      break;
+    case 'EllipticalRoi':
+      toolAlias = 'SREllipticalRoi';
+      break;
+    case 'FreehandRoi':
+      toolAlias = 'SRFreehandRoi';
+      break;
+    case 'RectangleRoi':
+      toolAlias = 'SRRectangleRoi';
+      break;
+  }
+
+  return toolAlias;
+}

extensions/cornerstone/src/utils/formatStudy.js

@@ -0,0 +1,109 @@
+import moment from 'moment';
+
+/**
+ * Checks if value is valid.
+ *
+ * @param {number} value
+ * @returns {boolean} is valid.
+ */
+function isValidNumber(value) {
+  return typeof value === 'number' && !isNaN(value);
+}
+
+/**
+ * Formats number precision.
+ *
+ * @param {number} number
+ * @param {number} precision
+ * @returns {number} formatted number.
+ */
+function formatNumberPrecision(number, precision) {
+  if (number !== null) {
+    return parseFloat(number).toFixed(precision);
+  }
+}
+
+/**
+ * Formats DICOM date.
+ *
+ * @param {string} date
+ * @param {string} strFormat
+ * @returns {string} formatted date.
+ */
+function formatDICOMDate(date, strFormat = 'MMM D, YYYY') {
+  return moment(date, 'YYYYMMDD').format(strFormat);
+}
+
+/**
+ *    DICOM Time is stored as HHmmss.SSS, where:
+ *      HH 24 hour time:
+ *        m mm        0..59   Minutes
+ *        s ss        0..59   Seconds
+ *        S SS SSS    0..999  Fractional seconds
+ *
+ *        Goal: '24:12:12'
+ *
+ * @param {*} time
+ * @param {string} strFormat
+ * @returns {string} formatted name.
+ */
+function formatDICOMTime(time, strFormat = 'HH:mm:ss') {
+  return moment(time, 'HH:mm:ss').format(strFormat);
+}
+
+/**
+ * Formats a patient name for display purposes
+ *
+ * @param {string} name
+ * @returns {string} formatted name.
+ */
+function formatPN(name) {
+  if (!name) {
+    return;
+  }
+
+  // Convert the first ^ to a ', '. String.replace() only affects
+  // the first appearance of the character.
+  const commaBetweenFirstAndLast = name.replace('^', ', ');
+
+  // Replace any remaining '^' characters with spaces
+  const cleaned = commaBetweenFirstAndLast.replace(/\^/g, ' ');
+
+  // Trim any extraneous whitespace
+  return cleaned.trim();
+}
+
+/**
+ * Gets compression type
+ *
+ * @param {number} imageId
+ * @returns {string} comrpession type.
+ */
+function getCompression(imageId) {
+  const generalImageModule =
+    cornerstone.metaData.get('generalImageModule', imageId) || {};
+  const {
+    lossyImageCompression,
+    lossyImageCompressionRatio,
+    lossyImageCompressionMethod,
+  } = generalImageModule;
+
+  if (lossyImageCompression === '01' && lossyImageCompressionRatio !== '') {
+    const compressionMethod = lossyImageCompressionMethod || 'Lossy: ';
+    const compressionRatio = formatNumberPrecision(
+      lossyImageCompressionRatio,
+      2
+    );
+    return compressionMethod + compressionRatio + ' : 1';
+  }
+
+  return 'Lossless / Uncompressed';
+}
+
+export { isValidNumber,
+  formatNumberPrecision,
+  formatDICOMDate,
+  formatDICOMTime,
+  formatPN,
+  getCompression
+};

extensions/debugging/.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/debugging/.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: 'OHIFExtDicomP10Downloader',
+      libraryTarget: 'umd',
+      libraryExport: 'default',
+      filename: pkg.main,
+    },
+  });
+};

extensions/debugging/CHANGELOG.md

@@ -0,0 +1,138 @@
+# Change Log
+
+All notable changes to this project will be documented in this file.
+See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+
+## [0.3.3](https://github.com/OHIF/Viewers/compare/@ohif/extension-debugging@0.3.2...@ohif/extension-debugging@0.3.3) (2022-06-30)
+
+**Note:** Version bump only for package @ohif/extension-debugging
+
+
+
+
+
+## [0.3.2](https://github.com/OHIF/Viewers/compare/@ohif/extension-debugging@0.3.1...@ohif/extension-debugging@0.3.2) (2022-03-10)
+
+**Note:** Version bump only for package @ohif/extension-debugging
+
+
+
+
+
+## [0.3.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-debugging@0.3.0...@ohif/extension-debugging@0.3.1) (2021-12-02)
+
+**Note:** Version bump only for package @ohif/extension-debugging
+
+
+
+
+
+# [0.3.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-debugging@0.2.2...@ohif/extension-debugging@0.3.0) (2021-09-23)
+
+
+### Features
+
+* Update to WADO Image Loader 4.0.3 to add dynamically imported WebAssembly codec support 🚀 ([#2537](https://github.com/OHIF/Viewers/issues/2537)) ([489d4b0](https://github.com/OHIF/Viewers/commit/489d4b0584f4657ceda1c5b9b68d5e9733827e47))
+
+
+
+
+
+## [0.2.2](https://github.com/OHIF/Viewers/compare/@ohif/extension-debugging@0.2.1...@ohif/extension-debugging@0.2.2) (2021-06-03)
+
+**Note:** Version bump only for package @ohif/extension-debugging
+
+
+
+
+
+## [0.2.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-debugging@0.2.0...@ohif/extension-debugging@0.2.1) (2021-03-19)
+
+**Note:** Version bump only for package @ohif/extension-debugging
+
+
+
+
+
+# [0.2.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-debugging@0.1.6...@ohif/extension-debugging@0.2.0) (2021-03-04)
+
+
+### Features
+
+* **log:** add new log service ([14d6454](https://github.com/OHIF/Viewers/commit/14d6454eafaa2ccb50e133c2945c9558052ea27e))
+
+
+
+
+
+## [0.1.6](https://github.com/OHIF/Viewers/compare/@ohif/extension-debugging@0.1.5...@ohif/extension-debugging@0.1.6) (2020-10-06)
+
+**Note:** Version bump only for package @ohif/extension-debugging
+
+
+
+
+
+## [0.1.5](https://github.com/OHIF/Viewers/compare/@ohif/extension-debugging@0.1.4...@ohif/extension-debugging@0.1.5) (2020-09-17)
+
+**Note:** Version bump only for package @ohif/extension-debugging
+
+
+
+
+
+## [0.1.4](https://github.com/OHIF/Viewers/compare/@ohif/extension-debugging@0.1.3...@ohif/extension-debugging@0.1.4) (2020-09-10)
+
+**Note:** Version bump only for package @ohif/extension-debugging
+
+
+
+
+
+## 0.1.3 (2020-09-03)
+
+**Note:** Version bump only for package @ohif/extension-debugging
+
+
+
+
+
+## [0.1.2](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-p10-downloader@0.1.1...@ohif/extension-dicom-p10-downloader@0.1.2) (2020-06-18)
+
+**Note:** Version bump only for package @ohif/extension-dicom-p10-downloader
+
+
+
+
+
+## [0.1.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-p10-downloader@0.1.0...@ohif/extension-dicom-p10-downloader@0.1.1) (2020-06-04)
+
+**Note:** Version bump only for package @ohif/extension-dicom-p10-downloader
+
+
+
+
+
+# [0.1.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-p10-downloader@0.0.2...@ohif/extension-dicom-p10-downloader@0.1.0) (2020-04-23)
+
+
+### Features
+
+* configuration to hook into XHR Error handling ([e96205d](https://github.com/OHIF/Viewers/commit/e96205de35e5bec14dc8a9a8509db3dd4e6ecdb6))
+
+
+
+
+
+## 0.0.2 (2020-04-15)
+
+**Note:** Version bump only for package @ohif/extension-dicom-p10-downloader
+
+
+
+
+
+# Change Log
+
+All notable changes to this project will be documented in this file. See
+[Conventional Commits](https://conventionalcommits.org) for commit guidelines.

extensions/debugging/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/debugging/README.md

@@ -0,0 +1 @@
+# @ohif/extension-dicom-p10-downloader

extensions/debugging/package.json

@@ -0,0 +1,40 @@
+{
+  "name": "@ohif/extension-debugging",
+  "version": "0.3.3",
+  "description": "OHIF extension for debugging.",
+  "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",
+    "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": "^2.6.0",
+    "dicom-parser": "^1.8.11"
+  },
+  "dependencies": {
+    "@babel/runtime": "^7.5.5",
+    "detect-browser": "5.1.1",
+    "dicomweb-client": "^0.8.3",
+    "file-saver": "^2.0.2",
+    "jszip": "^3.2.2"
+  }
+}

extensions/debugging/src/DebugReportModal.css

@@ -0,0 +1,44 @@
+.debugReportModalHeader {
+  padding: 10px 0 10px;
+  color: var(--active-color);
+}
+
+.debug-report-modal-container {
+  display: flex;
+  flex-direction: column;
+}
+
+.debug-report-modal-buttons-container {
+  display: flex;
+  flex-direction: row;
+}
+
+.debug-report-modal-container .errors {
+  margin-top: 10px;
+}
+
+.debug-report-modal-container .errors-container {
+  border: 1px solid var(--active-color);
+  border-radius: 5px;
+  padding: 10px;
+  overflow: scroll;
+  max-height: 300px;
+}
+
+.debug-overflowText {
+  margin: 0 auto;
+  max-width: 300px;
+  overflow-wrap: break-word;
+  word-wrap: break-word;
+  hyphens: auto;
+}
+
+.debug-overflowText-border {
+  margin: 0 auto;
+  max-width: 300px;
+  border: solid 2px #ccc;
+  padding: 12px;
+  overflow-wrap: break-word;
+  word-wrap: break-word;
+  hyphens: auto;
+}

extensions/debugging/src/DebugReportModal.js

@@ -0,0 +1,439 @@
+import React from 'react';
+import { detect } from 'detect-browser';
+import './DebugReportModal.css';
+import { ToolbarButton } from '@ohif/ui';
+import { utils } from '@ohif/core';
+const { studyMetadataManager } = utils;
+
+const DubugReportModal = ({
+  viewports,
+  studies,
+  servers,
+  extensionManager,
+  mailTo,
+  debugModalMessage,
+  errors = [],
+}) => {
+  const copyDebugDataToClipboard = () => {
+    const body = getEmailBody();
+
+    const textArea = document.createElement('textarea');
+
+    textArea.value = body;
+    document.body.appendChild(textArea);
+    textArea.select();
+    document.execCommand('copy');
+    document.body.removeChild(textArea);
+  };
+
+  const getEmailBody = () => {
+    let body = `Enter the description of your problem here: \n\n\n`;
+
+    body += `============= SESSION INFO =============\n\n`;
+
+    // App version
+
+    body += '== App ==\n';
+    body += `version\t${window.version}\n\n`;
+
+    // Extensions Versions
+
+    body += '== Extensions Versions ==\n';
+
+    const { registeredExtensionVesions } = extensionManager;
+
+    Object.keys(registeredExtensionVesions).forEach(extensionId => {
+      const version = registeredExtensionVesions[extensionId];
+
+      body += `${extensionId}\t${version}\n`;
+    });
+
+    body += '\n';
+
+    // Browser Info
+
+    const browser = detect();
+
+    const { name, os, type, version } = browser;
+
+    body += '== Browser Info ==\n';
+    body += `name\t ${name}\n`;
+    body += `os\t ${os}\n`;
+    body += `type\t ${type}\n`;
+    body += `version\t ${version}\n\n`;
+
+    // Study URL
+    body += '== URL ==\n';
+    body += `URL\t ${window.location.href}\n\n`;
+
+    // Layout
+    const { numRows, numColumns, viewportSpecificData } = viewports;
+
+    body += '== Viewport Layout ==\n';
+    body += `Rows\t${numRows}\n`;
+    body += `Columns\t${numColumns}\n\n`;
+    body += '== SeriesInstanceUIDs ==\n';
+
+    Object.keys(viewportSpecificData).forEach(viewportIndex => {
+      const vsd = viewportSpecificData[viewportIndex];
+
+      const [row, column] = _viewportIndexToViewportPosition(
+        viewportIndex,
+        numColumns
+      );
+
+      body += `[${row},${column}]\t${vsd.SeriesInstanceUID}\n`;
+    });
+
+    body += '== ReferencedSEGSeriesInstanceUIDs ==\n';
+
+    Object.keys(viewportSpecificData).forEach(viewportIndex => {
+      const displaySet = viewportSpecificData[viewportIndex];
+      const [referencedDisplaySetsRef] = _getReferencedSeriesInstanceUIDsString(
+        displaySet,
+        'SEG'
+      );
+
+      const [row, column] = _viewportIndexToViewportPosition(
+        viewportIndex,
+        numColumns
+      );
+
+      body += `[${row},${column}]\t${referencedDisplaySetsRef}\n`;
+    });
+
+    body += '== ReferencedRTSTRUCTSeriesInstanceUIDs ==\n';
+
+    Object.keys(viewportSpecificData).forEach(viewportIndex => {
+      const displaySet = viewportSpecificData[viewportIndex];
+      const [referencedDisplaySetsRef] = _getReferencedSeriesInstanceUIDsString(
+        displaySet,
+        'RTSTRUCT'
+      );
+
+      const [row, column] = _viewportIndexToViewportPosition(
+        viewportIndex,
+        numColumns
+      );
+
+      body += `[${row},${column}]\t${referencedDisplaySetsRef}\n`;
+    });
+
+    body += '== ReferencedSRSeriesInstanceUIDs ==\n';
+
+    Object.keys(viewportSpecificData).forEach(viewportIndex => {
+      const displaySet = viewportSpecificData[viewportIndex];
+      const [referencedDisplaySetsRef] = _getReferencedSeriesInstanceUIDsString(
+        displaySet,
+        'SR'
+      );
+
+      const [row, column] = _viewportIndexToViewportPosition(
+        viewportIndex,
+        numColumns
+      );
+
+      body += `[${row},${column}]\t${referencedDisplaySetsRef}\n`;
+    });
+
+    return body;
+  };
+
+  const mailToFunction = () => {
+    const StudyInstanceUID = Object.keys(studies.studyData)[0];
+
+    const subject = encodeURI(`Issue with Study: ${StudyInstanceUID}`);
+
+    let body = getEmailBody();
+
+    // TODO Text dump of rest of stuff.
+
+    body = encodeURI(body);
+
+    window.location.href = `mailto:${mailTo}?subject=${subject}&body=${body}`;
+  };
+
+  return (
+    <div className="debug-report-modal-container">
+      {debugModalMessage ? <p>{debugModalMessage}</p> : null}
+      <div className="debug-report-modal-buttons-container">
+        {mailTo ? (
+          <div>
+            <ToolbarButton
+              label={'Send Bug Report'}
+              onClick={mailToFunction}
+              icon={'envelope-square'}
+              isActive={false}
+            />
+          </div>
+        ) : null}
+        <div>
+          <ToolbarButton
+            label={'Copy To Clipboard'}
+            onClick={copyDebugDataToClipboard}
+            icon={'clipboard'}
+            isActive={false}
+          />
+        </div>
+      </div>
+      <div>
+        <table>
+          {getAppVersion()}
+          {getExtensionVersions(extensionManager)}
+          {getBrowserInfo()}
+          {getCurrentStudyUrl()}
+          {getLayout(viewports)}
+        </table>
+      </div>
+      <div className="errors">
+        <h3>Errors ({errors.length})</h3>
+        <div className="errors-container">
+          {errors.map(error => {
+            return (
+              <div>
+                <pre>Message: {error.message}</pre>
+                {error.error && <pre>Stack: {error.error.stack}</pre>}
+              </div>
+            );
+          })}
+        </div>
+      </div>
+    </div>
+  );
+};
+
+const getAppVersion = () => {
+  return (
+    <React.Fragment>
+      <tr>
+        <th className="debugReportModalHeader">App</th>
+      </tr>
+      <tr>
+        <td>Version</td>
+        <td>{window.version}</td>
+      </tr>
+    </React.Fragment>
+  );
+};
+
+const getCurrentStudyUrl = () => {
+  return (
+    <React.Fragment>
+      <tr>
+        <th className="debugReportModalHeader">URL</th>
+      </tr>
+      <tr>
+        <td>URL</td>
+        <td className="debug-overflowText">{window.location.href}</td>
+      </tr>
+    </React.Fragment>
+  );
+};
+
+const getExtensionVersions = extensionManager => {
+  const { registeredExtensionVesions } = extensionManager;
+
+  const lineItems = Object.keys(registeredExtensionVesions).map(extensionId => {
+    const version = registeredExtensionVesions[extensionId];
+
+    return (
+      <tr>
+        <td>{extensionId}</td>
+        <td>{version}</td>
+      </tr>
+    );
+  });
+
+  return (
+    <React.Fragment>
+      <th className="debugReportModalHeader">Extensions</th>
+      {lineItems}
+    </React.Fragment>
+  );
+};
+
+const getLayout = viewports => {
+  const { numRows, numColumns } = viewports;
+
+  return (
+    <React.Fragment>
+      <tr>
+        <th className="debugReportModalHeader">Viewports</th>
+      </tr>
+      <tr>
+        <th>Layout</th>
+      </tr>
+      <tr>
+        <td>Rows</td>
+        <td>{numRows}</td>
+      </tr>
+      <tr>
+        <td>Columns</td>
+        <td>{numColumns}</td>
+      </tr>
+      <tr>
+        <th>SeriesInstanceUIDs</th>
+      </tr>
+      {getSeriesInstanceUIDsPerRow(viewports)}
+      <tr>
+        <th>ReferencedSEGSeriesInstanceUIDs</th>
+      </tr>
+      {getReferencedSeriesInstanceUIDsPerRow(viewports, 'SEG')}
+      <tr>
+        <th>ReferencedRTSTRUCTSeriesInstanceUIDs</th>
+      </tr>
+      {getReferencedSeriesInstanceUIDsPerRow(viewports, 'RTSTRUCT')}
+      <tr>
+        <th>ReferencedSRSeriesInstanceUIDs</th>
+      </tr>
+      {getReferencedSeriesInstanceUIDsPerRow(viewports, 'SR')}
+    </React.Fragment>
+  );
+};
+
+const getBrowserInfo = () => {
+  const browser = detect();
+
+  const { name, os, type, version } = browser;
+
+  return (
+    <React.Fragment>
+      <tr>
+        <th className="debugReportModalHeader">Platform</th>
+      </tr>
+      <tr>
+        <td>name</td>
+        <td>{name}</td>
+      </tr>
+      <tr>
+        <td>os</td>
+        <td>{os}</td>
+      </tr>
+      <tr>
+        <td>type</td>
+        <td>{type}</td>
+      </tr>
+      <tr>
+        <td>version</td>
+        <td>{version}</td>
+      </tr>
+    </React.Fragment>
+  );
+};
+
+/**
+ * Returns DisplaySets that reference the target series, sorted by dateTime
+ *
+ * @param {string} StudyInstanceUID
+ * @param {string} SeriesInstanceUID
+ * @returns Array
+ */
+const _getReferencedDisplaysets = (
+  StudyInstanceUID,
+  SeriesInstanceUID,
+  Modality
+) => {
+  /* Referenced DisplaySets */
+  const studyMetadata = studyMetadataManager.get(StudyInstanceUID);
+  const referencedDisplaysets = studyMetadata.getDerivedDatasets({
+    referencedSeriesInstanceUID: SeriesInstanceUID,
+    Modality,
+  });
+
+  /* Sort */
+  referencedDisplaysets.sort((a, b) => {
+    const aNumber = Number(`${a.SeriesDate}${a.SeriesTime}`);
+    const bNumber = Number(`${b.SeriesDate}${b.SeriesTime}`);
+    return bNumber - aNumber;
+  });
+
+  return referencedDisplaysets;
+};
+
+const _getReferencedSeriesInstanceUIDsString = (displaySet, Modality) => {
+  const referencedDisplaySets = _getReferencedDisplaysets(
+    displaySet.StudyInstanceUID,
+    displaySet.SeriesInstanceUID,
+    Modality
+  );
+
+  let referencedDisplaySetsRef = 'None';
+  const referencedDisplaySetsCount = referencedDisplaySets.length;
+  if (referencedDisplaySetsCount !== 0) {
+    referencedDisplaySetsRef = '';
+    for (let i = 0; i < referencedDisplaySetsCount - 1; i++) {
+      referencedDisplaySetsRef +=
+        referencedDisplaySets[i].SeriesInstanceUID + ', ';
+    }
+    referencedDisplaySetsRef +=
+      referencedDisplaySets[referencedDisplaySetsCount - 1].SeriesInstanceUID;
+  }
+
+  return [referencedDisplaySetsRef, referencedDisplaySetsCount];
+};
+
+const getReferencedSeriesInstanceUIDsPerRow = (viewports, Modality) => {
+  const { viewportSpecificData, numColumns } = viewports;
+
+  // NOTE viewportSpecificData is actually an object with numerical keys.
+  return Object.keys(viewportSpecificData).map(viewportIndex => {
+    const displaySet = viewportSpecificData[viewportIndex];
+    const [
+      referencedDisplaySetsRef,
+      referencedDisplaySetsCount,
+    ] = _getReferencedSeriesInstanceUIDsString(displaySet, Modality);
+
+    const [row, column] = _viewportIndexToViewportPosition(
+      viewportIndex,
+      numColumns
+    );
+
+    if (referencedDisplaySetsCount > 1) {
+      return (
+        <tr>
+          <td>{`[${row},${column}]`}</td>
+          <td className="debug-overflowText-border">
+            {referencedDisplaySetsRef}
+          </td>
+        </tr>
+      );
+    } else {
+      return (
+        <tr>
+          <td>{`[${row},${column}]`}</td>
+          <td className="debug-overflowText">{referencedDisplaySetsRef}</td>
+        </tr>
+      );
+    }
+  });
+};
+
+const getSeriesInstanceUIDsPerRow = viewports => {
+  const { viewportSpecificData, numColumns } = viewports;
+
+  // NOTE viewportSpecificData is actually an object with numerical keys.
+  return Object.keys(viewportSpecificData).map(viewportIndex => {
+    const vsd = viewportSpecificData[viewportIndex];
+
+    const [row, column] = _viewportIndexToViewportPosition(
+      viewportIndex,
+      numColumns
+    );
+
+    return (
+      <tr>
+        <td>{`[${row},${column}]`}</td>
+        <td>{vsd.SeriesInstanceUID}</td>
+      </tr>
+    );
+  });
+};
+
+const _viewportIndexToViewportPosition = (viewportIndex, numColumns) => {
+  const row = Math.floor(viewportIndex / numColumns);
+  const column = viewportIndex % numColumns;
+
+  return [row, column];
+};
+
+export default DubugReportModal;

extensions/debugging/src/commandsModule.js

@@ -0,0 +1,178 @@
+import OHIF from '@ohif/core';
+import { useLogger } from '@ohif/ui';
+
+import {
+  save,
+  upload,
+  getDicomWebClientFromContext,
+  getStudyInstanceUIDFromStudies,
+  getSOPInstanceReferenceFromActiveViewport,
+  getSOPInstanceReferencesFromViewports,
+} from './utils';
+import _downloadAndZip, { downloadInstances } from './downloadAndZip';
+import DebugReportModal from './DebugReportModal';
+import React from 'react';
+
+import state from './state';
+
+const {
+  utils: { Queue },
+} = OHIF;
+
+export function getCommands(context, servicesManager, extensionManager) {
+  const queue = new Queue(1);
+  const actions = {
+    /**
+     * @example Running this command using Commands Manager
+     * commandsManager.runCommand(
+     *   'downloadAndZip',
+     *   {
+     *     listOfUIDs: [...],
+     *     options: {
+     *       progress(status) {
+     *         console.info('Progress:', (status.progress * 100).toFixed(2) + '%');
+     *       }
+     *     }
+     *   },
+     *   'VIEWER'
+     * );
+     */
+    downloadAndZip({ servers, dicomWebClient, listOfUIDs, options }) {
+      return save(
+        _downloadAndZip(
+          dicomWebClient || getDicomWebClientFromContext(context, servers),
+          listOfUIDs,
+          options
+        ),
+        listOfUIDs
+      );
+    },
+    downloadAndZipStudy({ servers, studies, progress }) {
+      const dicomWebClient = getDicomWebClientFromContext(context, servers);
+      const listOfUIDs = getStudyInstanceUIDFromStudies(studies);
+      return save(
+        _downloadAndZip(dicomWebClient, listOfUIDs, { progress }),
+        listOfUIDs
+      );
+    },
+    downloadAndZipSeriesOnViewports({ servers, viewports, progress }) {
+      const dicomWebClient = getDicomWebClientFromContext(context, servers);
+      const listOfUIDs = getSOPInstanceReferencesFromViewports(viewports);
+      return save(
+        _downloadAndZip(dicomWebClient, listOfUIDs, { progress }),
+        listOfUIDs
+      );
+    },
+    downloadAndZipSeriesOnActiveViewport({ servers, viewports, progress }) {
+      const dicomWebClient = getDicomWebClientFromContext(context, servers);
+      const listOfUIDs = getSOPInstanceReferenceFromActiveViewport(viewports);
+      return save(
+        _downloadAndZip(dicomWebClient, listOfUIDs, { progress }),
+        listOfUIDs
+      );
+    },
+    downloadAndUploadStudy({ servers, studies, progress, serverConfig }) {
+      const dicomWebClient = getDicomWebClientFromContext(context, servers);
+      const listOfUIDs = getStudyInstanceUIDFromStudies(studies);
+      return upload(
+        downloadInstances(dicomWebClient, listOfUIDs, { progress }),
+        /**
+         * serverConfig is an object with the values used to create a new
+         * instance of DICOMwebClient.
+         *
+         * Basic Structure:
+         *
+         * const config = {
+         *    url,
+         *    headers,
+         *    errorInterceptor
+         * }
+         *
+         * const dicomWeb = new api.DICOMwebClient(config);
+         */
+        serverConfig
+      );
+    },
+    openDebugInfoModal({ viewports, studies, servers }) {
+      const { UIModalService } = servicesManager.services;
+
+      const WrappedDebugReportModal = function() {
+        const { state: loggerState } = useLogger();
+        return (
+          <DebugReportModal
+            viewports={viewports}
+            studies={studies}
+            servers={servers}
+            extensionManager={extensionManager}
+            mailTo={state.mailTo}
+            debugModalMessage={state.debugModalMessage}
+            errors={loggerState.errors}
+          />
+        );
+      };
+
+      UIModalService.show({
+        content: WrappedDebugReportModal,
+        title: `Debugging Information`,
+      });
+    },
+  };
+
+  const definitions = {
+    openDebugInfoModal: {
+      commandFn: actions.openDebugInfoModal,
+      storeContexts: ['viewports', 'servers', 'studies'],
+    },
+    downloadAndZip: {
+      commandFn: queue.bindSafe(actions.downloadAndZip, error),
+      storeContexts: ['servers'],
+    },
+    downloadAndZipStudy: {
+      commandFn: queue.bindSafe(actions.downloadAndZipStudy, error),
+      storeContexts: ['servers', 'studies'],
+      options: { progress },
+    },
+    downloadAndZipSeriesOnViewports: {
+      commandFn: queue.bindSafe(actions.downloadAndZipSeriesOnViewports, error),
+      storeContexts: ['servers', 'viewports'],
+      options: { progress },
+    },
+    downloadAndZipSeriesOnActiveViewport: {
+      commandFn: queue.bindSafe(
+        actions.downloadAndZipSeriesOnActiveViewport,
+        error
+      ),
+      storeContexts: ['servers', 'viewports'],
+      options: { progress },
+    },
+    downloadAndUploadStudy: {
+      commandFn: queue.bindSafe(actions.downloadAndUploadStudy, error),
+      storeContexts: ['servers', 'studies'],
+      options: { progress },
+    },
+  };
+
+  return {
+    actions,
+    definitions,
+  };
+}
+
+/**
+ * Utils
+ */
+
+function progress(status) {
+  OHIF.log.info(
+    'Download and Zip Progress:',
+    (status.progress * 100.0).toFixed(2) + '%'
+  );
+}
+
+function error(e) {
+  if (e.message === 'Queue limit reached') {
+    OHIF.log.warn('A download is already in progress, please wait.');
+  } else {
+    OHIF.log.error(e);
+  }
+}

extensions/debugging/src/downloadAndZip.js

@@ -0,0 +1,259 @@
+import OHIF from '@ohif/core';
+import { api } from 'dicomweb-client';
+import dicomParser from 'dicom-parser';
+import JSZip from 'jszip';
+
+/**
+ * Constants
+ */
+
+const {
+  utils: {
+    isDicomUid,
+    hierarchicalListUtils,
+    progressTrackingUtils: progressUtils,
+  },
+} = OHIF;
+
+/**
+ * Public Methods
+ */
+
+/**
+ * Download and Zip all DICOM P10 instances from specified DICOM Web Client
+ * based on an hierarchical list of UIDs;
+ *
+ * @param {DICOMwebClient} dicomWebClient A DICOMwebClient instance through
+ *  which the referenced instances will be retrieved;
+ * @param {Array} listOfUIDs The hierarchical list of UIDs from the instances
+ *  that should be retrieved:
+ *  A hierarchical list of UIDs is a regular JS Array where the type of the UID
+ *  (study, series, instance) is determined by its nasting lavel. For example:
+ *    @ The following list instructs the library to download all the instances
+ *      from both studies "A" and "B":
+ *
+ *    ['studyUIDFromA', 'studyUIDFromB']
+ *
+ *    @ In the previous example both UIDs are treated as STUDY UIDs because both
+ *      of them are listed in the same (top) level of the list. If, on the other
+ *      hand, only instances from series "I" and "J" from the study "B"
+ *      are to be downloaded, the expected hierarchical list would be:
+ *
+ *    ['studyUIDFromA', ['studyUIDFromB', ['seriesUIDFromI', 'seriesUIDFromJ']]]
+ *
+ *    @ Which, when prettified, reads like this:
+ *
+ *    [
+ *      'studyUIDFromA',
+ *      ['studyUIDFromB', [
+ *        'seriesUIDFromI',
+ *        'seriesUIDFromJ'
+ *      ]]
+ *    ]
+ *
+ *    @ Furthermore, if only instances "X", "Y" and "Z" from series "J" need to
+ *      be downloaded (instead of all the instances from that series), the list
+ *      could be changed to:
+ *
+ *    [
+ *      'studyUIDFromA',
+ *      ['studyUIDFromB', [
+ *        'seriesUIDFromI',
+ *        ['seriesUIDFromJ', [
+ *          'instanceUIDFromX',
+ *          'instanceUIDFromY',
+ *          'instanceUIDFromZ'
+ *        ]]
+ *      ]]
+ *    ]
+ *
+ * Please refer to hierarchicalListUtils.js for more information and utilities;
+ *
+ * @param {Object} options A plain object with options;
+ * @param {function} options.progress A callback to retrieve notifications
+ * @returns {Promise} A promise that resolves to an URL from which the ZIP file
+ *  can be downloaded;
+ */
+
+async function downloadAndZip(dicomWebClient, listOfUIDs, options) {
+  if (dicomWebClient instanceof api.DICOMwebClient) {
+    const settings = buildSettings(listOfUIDs, options);
+    const { compression } = settings.tasks;
+    const buffers = await downloadBuffers(settings, dicomWebClient);
+    compression.deferred.resolve(zipAll(buffers, settings));
+    const url = await compression.deferred.promise;
+    return url;
+  }
+  throw new Error('A valid DICOM Web Client instance is expected');
+}
+
+async function downloadInstances(dicomWebClient, listOfUIDs, options) {
+  if (dicomWebClient instanceof api.DICOMwebClient) {
+    const settings = buildSettings(listOfUIDs, options);
+    const buffers = await downloadBuffers(settings, dicomWebClient);
+    return buffers;
+  }
+  throw new Error('A valid DICOM Web Client instance is expected');
+}
+
+async function downloadBuffers(settings, dicomWebClient) {
+  const { compression } = settings.tasks;
+  // Register user-provided progress handler as a task list observer
+  progressUtils.addObserver(settings.taskList, settings.options.progress);
+  const buffers = await downloadAll(dicomWebClient, settings).catch(error => {
+    // Reject promise from compression task on download failure
+    compression.deferred.reject(error);
+    throw error;
+  });
+  return buffers;
+}
+
+/**
+ * Utils
+ */
+
+async function zipAll(buffers, settings) {
+  const zip = new JSZip();
+  OHIF.log.info('Adding DICOM P10 files to archive:', buffers.length);
+  buffers.forEach((buffer, i) => {
+    const path = buildPath(buffer) || `${i}.dcm`;
+    zip.file(path, buffer);
+  });
+  // Set compression task progress to 50%
+  progressUtils.update(settings.tasks.compression.task, 0.5);
+  const blob = await zip.generateAsync({ type: 'blob' });
+  return URL.createObjectURL(blob);
+}
+
+function buildSettings(listOfUIDs, options) {
+  const taskList = progressUtils.createList();
+  const compression = progressUtils.addDeferred(taskList);
+  const downloads = [];
+
+  // Build downloads list
+  hierarchicalListUtils.forEach(
+    listOfUIDs,
+    (StudyInstanceUID, SeriesInstanceUID, SOPInstanceUID) => {
+      if (isDicomUid(StudyInstanceUID)) {
+        downloads.push({
+          tracking: progressUtils.addDeferred(taskList),
+          parameters: [StudyInstanceUID, SeriesInstanceUID, SOPInstanceUID],
+        });
+      }
+    }
+  );
+
+  // Print tree of hierarchical references
+  OHIF.log.info('Downloading DICOM P10 files for references:');
+  OHIF.log.info(hierarchicalListUtils.print(listOfUIDs));
+
+  return {
+    options: Object(options),
+    taskList,
+    tasks: {
+      downloads,
+      compression,
+    },
+  };
+}
+
+function buildPath(buffer) {
+  let path;
+  try {
+    const byteArray = new Uint8Array(buffer);
+    const dataSet = dicomParser.parseDicom(byteArray, {
+      // Stop parsing after SeriesInstanceUID is found
+      untilTag: 'x0020000e',
+    });
+    const StudyInstanceUID = dataSet.string('x0020000d');
+    const SeriesInstanceUID = dataSet.string('x0020000e');
+    const SOPInstanceUID = dataSet.string('x00080018');
+    if (StudyInstanceUID && SeriesInstanceUID && SOPInstanceUID) {
+      path = `${StudyInstanceUID}/${SeriesInstanceUID}/${SOPInstanceUID}.dcm`;
+    }
+  } catch (e) {
+    OHIF.log.error('Error parsing downloaded DICOM P10 file...', e);
+  }
+  return path;
+}
+
+async function downloadAll(dicomWebClient, settings) {
+  const { downloads } = settings.tasks;
+
+  // Make sure at least one download was initiated
+  if (downloads.length < 1) {
+    throw new Error('No valid reference to be downloaded');
+  }
+
+  const promises = downloads.map(item => {
+    const {
+      parameters,
+      tracking: { deferred, task },
+    } = item;
+    deferred.resolve(download(task, dicomWebClient, ...parameters));
+    return deferred.promise;
+  });
+
+  // Wait on created download promises
+  return Promise.all(promises).then(results => {
+    const buffers = [];
+    // The "results" array may directly contain buffers (ArrayBuffer instances)
+    // or arrays of buffers, depending on the type of downloads initiated on the
+    // previous step (retrieveStudy, retrieveSeries or retrieveinstance). Ex:
+    // results = [buf1, [buf2, buf3], buf4, [buf5], ...];
+    results.forEach(
+      function select(nesting, result) {
+        if (result instanceof ArrayBuffer) {
+          buffers.push(result);
+        } else if (nesting && Array.isArray(result)) {
+          // "nesting" argument is important to make sure only two levels
+          // of arrays are visited. For example, "bufX" should not be visited:
+          // [buf1, [buf2, buf3, [bufX]], buf4, [buf5], ...];
+          result.forEach(select.bind(null, false));
+        }
+      }.bind(null, true)
+    );
+    return buffers;
+  });
+}
+
+async function download(
+  task,
+  dicomWebClient,
+  studyInstanceUID,
+  seriesInstanceUID,
+  sopInstanceUID
+) {
+  // Strict DICOM-formatted variable names COULDN'T be used here because the
+  // DICOM Web client interface expects them in this specific format.
+  // @TODO: Add support for download progress handler which will use the
+  // currently not use "task" param
+  if (!isDicomUid(studyInstanceUID)) {
+    throw new Error('Download requires at least a "StudyInstanceUID" property');
+  }
+  if (!isDicomUid(seriesInstanceUID)) {
+    // Download entire study
+    return dicomWebClient.retrieveStudy({
+      studyInstanceUID,
+    });
+  }
+  if (!isDicomUid(sopInstanceUID)) {
+    // Download entire series
+    return dicomWebClient.retrieveSeries({
+      studyInstanceUID,
+      seriesInstanceUID,
+    });
+  }
+  // Download specific instance
+  return dicomWebClient.retrieveInstance({
+    studyInstanceUID,
+    seriesInstanceUID,
+    sopInstanceUID,
+  });
+}
+
+/**
+ * Exports
+ */
+
+export { downloadAndZip as default, downloadAndZip, downloadInstances };

extensions/debugging/src/index.js

@@ -0,0 +1,61 @@
+import { getDicomWebClientFromConfig } from './utils';
+import { getCommands } from './commandsModule';
+import { version } from '../package.json';
+import toolbarModule from './toolbarModule';
+import state from './state';
+
+/**
+ * Constants
+ */
+
+/**
+ * Globals
+ */
+
+const sharedContext = {
+  dicomWebClient: null,
+};
+
+/**
+ * Extension
+ */
+export default {
+  /**
+   * Only required property. Should be a unique value across all extensions.
+   */
+  id: 'dicom-p10-downloader',
+  version,
+
+  /**
+   * LIFECYCLE HOOKS
+   */
+
+  preRegistration({ appConfig, configuration }) {
+    const dicomWebClient = getDicomWebClientFromConfig(appConfig);
+    if (dicomWebClient) {
+      sharedContext.dicomWebClient = dicomWebClient;
+    }
+
+    if (configuration) {
+      if (configuration.mailTo) {
+        state.mailTo = configuration.mailTo;
+      }
+
+      if (configuration.debugModalMessage) {
+        state.debugModalMessage = configuration.debugModalMessage;
+      }
+    }
+  },
+
+  /**
+   * MODULE GETTERS
+   */
+
+  getCommandsModule({ servicesManager, extensionManager }) {
+    return getCommands(sharedContext, servicesManager, extensionManager);
+  },
+
+  getToolbarModule() {
+    return toolbarModule;
+  },
+};

extensions/debugging/src/state.js

@@ -0,0 +1,3 @@
+const state = { mailTo: undefined, debugModalMessage: undefined };
+
+export default state;

extensions/debugging/src/toolbarModule.js

@@ -0,0 +1,20 @@
+const TOOLBAR_BUTTON_TYPES = {
+  COMMAND: 'command',
+};
+
+const definitions = [
+  {
+    id: 'Debug Info',
+    label: 'Debug Info',
+    icon: 'cog',
+    //
+    type: TOOLBAR_BUTTON_TYPES.COMMAND,
+    commandName: 'openDebugInfoModal',
+    context: 'VIEWER',
+  },
+];
+
+export default {
+  definitions,
+  defaultContext: 'VIEWER',
+};

extensions/debugging/src/utils.js

@@ -0,0 +1,158 @@
+import OHIF from '@ohif/core';
+import { api } from 'dicomweb-client';
+import { saveAs } from 'file-saver';
+
+const {
+  utils: { isDicomUid, resolveObjectPath, hierarchicalListUtils },
+  DICOMWeb,
+} = OHIF;
+
+function validDicomUid(subject) {
+  if (isDicomUid(subject)) {
+    return subject;
+  }
+}
+
+function getActiveServerFromServersStore(store) {
+  const servers = resolveObjectPath(store, 'servers');
+  if (Array.isArray(servers) && servers.length > 0) {
+    return servers.find(server => resolveObjectPath(server, 'active') === true);
+  }
+}
+
+function getDicomWebClientFromConfig(config) {
+  const servers = resolveObjectPath(config, 'servers.dicomWeb');
+  if (Array.isArray(servers) && servers.length > 0) {
+    const server = servers[0];
+    return new api.DICOMwebClient({
+      url: server.wadoRoot,
+      headers: DICOMWeb.getAuthorizationHeader(server),
+    });
+  }
+}
+
+function getDicomWebClientFromContext(context, store) {
+  const activeServer = getActiveServerFromServersStore(store);
+  if (activeServer) {
+    return new api.DICOMwebClient({
+      url: activeServer.wadoRoot,
+      headers: DICOMWeb.getAuthorizationHeader(activeServer),
+    });
+  } else if (context.dicomWebClient instanceof api.DICOMwebClient) {
+    return context.dicomWebClient;
+  }
+}
+
+function getSOPInstanceReference(viewports, index) {
+  if (index >= 0) {
+    const { StudyInstanceUID, SeriesInstanceUID, SOPInstanceUID } = Object(
+      resolveObjectPath(viewports, `viewportSpecificData.${index}`)
+    );
+    return Object.freeze(
+      hierarchicalListUtils.addToList(
+        [],
+        validDicomUid(StudyInstanceUID),
+        validDicomUid(SeriesInstanceUID),
+        validDicomUid(SOPInstanceUID)
+      )
+    );
+  }
+}
+
+function getSOPInstanceReferenceFromActiveViewport(viewports) {
+  return getSOPInstanceReference(
+    viewports,
+    resolveObjectPath(viewports, 'activeViewportIndex')
+  );
+}
+
+function getSOPInstanceReferencesFromViewports(viewports) {
+  const list = [];
+  const viewportSpecificData = resolveObjectPath(
+    viewports,
+    'viewportSpecificData'
+  );
+  Object.keys(viewportSpecificData).forEach(index => {
+    const { StudyInstanceUID, SeriesInstanceUID, SOPInstanceUID } = Object(
+      viewportSpecificData[index]
+    );
+    hierarchicalListUtils.addToList(
+      list,
+      validDicomUid(StudyInstanceUID),
+      validDicomUid(SeriesInstanceUID),
+      validDicomUid(SOPInstanceUID)
+    );
+  });
+  return list;
+}
+
+function save(promise, listOfUIDs) {
+  return Promise.resolve(promise)
+    .then(url => {
+      OHIF.log.info('Files successfully compressed:', url);
+      const StudyInstanceUID = hierarchicalListUtils.getItem(listOfUIDs, 0);
+      saveAs(url, `${StudyInstanceUID}.zip`);
+      return url;
+    })
+    .catch(error => {
+      OHIF.log.error('Failed to create Zip file...', error);
+      return null;
+    });
+}
+
+function upload(promise, serverConfig) {
+  return Promise.resolve(promise)
+    .then(async instances => {
+      const instancesAmount = instances.length;
+      OHIF.log.info(`Uploading study to ${serverConfig.url}`);
+      OHIF.log.info(
+        `${instancesAmount} instances are being uploaded. Don't close your browser.`
+      );
+
+      try {
+        const dicomWeb = new api.DICOMwebClient(serverConfig);
+        let progress = 0;
+
+        const getProgress = () => {
+          return ((progress * 100) / instancesAmount).toFixed();
+        };
+
+        for (const instance of instances) {
+          const options = {
+            datasets: [instance],
+          };
+
+          await dicomWeb.storeInstances(options);
+
+          progress++;
+
+          OHIF.log.info(`Progress: ${getProgress()}%`);
+        }
+
+        OHIF.log.info('Successfully uploaded!');
+      } catch (error) {
+        OHIF.log.error(`Failed to upload: ${error}`);
+      }
+
+      return instances;
+    })
+    .catch(error => {
+      OHIF.log.error(`Failed to upload: ${error}`);
+      return null;
+    });
+}
+
+function getStudyInstanceUIDFromStudies(studies) {
+  return Object.keys(Object(Object(studies).studyData)).slice(0, 1);
+}
+
+export {
+  save,
+  upload,
+  validDicomUid,
+  getDicomWebClientFromConfig,
+  getDicomWebClientFromContext,
+  getStudyInstanceUIDFromStudies,
+  getSOPInstanceReferenceFromActiveViewport,
+  getSOPInstanceReferencesFromViewports,
+};

extensions/dicom-html/CHANGELOG.md

@@ -3,6 +3,301 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.3.23](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.3.22...@ohif/extension-dicom-html@1.3.23) (2022-09-01)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+## [1.3.22](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.3.21...@ohif/extension-dicom-html@1.3.22) (2022-06-30)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+## [1.3.21](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.3.20...@ohif/extension-dicom-html@1.3.21) (2022-04-05)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+## [1.3.20](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.3.19...@ohif/extension-dicom-html@1.3.20) (2022-03-25)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+## [1.3.19](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.3.18...@ohif/extension-dicom-html@1.3.19) (2022-03-14)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+## [1.3.18](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.3.17...@ohif/extension-dicom-html@1.3.18) (2022-02-03)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+## [1.3.17](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.3.16...@ohif/extension-dicom-html@1.3.17) (2022-02-03)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+## [1.3.16](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.3.15...@ohif/extension-dicom-html@1.3.16) (2022-02-02)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+## [1.3.15](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.3.14...@ohif/extension-dicom-html@1.3.15) (2022-01-20)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+## [1.3.14](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.3.13...@ohif/extension-dicom-html@1.3.14) (2021-12-02)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+## [1.3.13](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.3.12...@ohif/extension-dicom-html@1.3.13) (2021-10-26)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+## [1.3.12](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.3.11...@ohif/extension-dicom-html@1.3.12) (2021-10-25)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+## [1.3.11](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.3.10...@ohif/extension-dicom-html@1.3.11) (2021-09-28)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+## [1.3.10](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.3.9...@ohif/extension-dicom-html@1.3.10) (2021-06-02)
+
+
+### Bug Fixes
+
+* **dicom-html:** Add parsed dicom meta info section ([#2419](https://github.com/OHIF/Viewers/issues/2419)) ([403688b](https://github.com/OHIF/Viewers/commit/403688b18c52468fc1101166ec0c1734fb710039))
+
+
+
+
+
+## [1.3.9](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.3.8...@ohif/extension-dicom-html@1.3.9) (2021-04-22)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+## [1.3.8](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.3.7...@ohif/extension-dicom-html@1.3.8) (2021-04-22)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+## [1.3.7](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.3.6...@ohif/extension-dicom-html@1.3.7) (2021-04-21)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+## [1.3.6](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.3.5...@ohif/extension-dicom-html@1.3.6) (2021-04-21)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+## [1.3.5](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.3.4...@ohif/extension-dicom-html@1.3.5) (2021-04-15)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+## [1.3.4](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.3.3...@ohif/extension-dicom-html@1.3.4) (2021-03-09)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+## [1.3.3](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.3.2...@ohif/extension-dicom-html@1.3.3) (2021-03-03)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+## [1.3.2](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.3.1...@ohif/extension-dicom-html@1.3.2) (2021-02-25)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+## [1.3.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.3.0...@ohif/extension-dicom-html@1.3.1) (2021-02-05)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+# [1.3.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.2.9...@ohif/extension-dicom-html@1.3.0) (2020-12-10)
+
+
+### Features
+
+* visualize overlapping segments in cornerstone ([#2185](https://github.com/OHIF/Viewers/issues/2185)) ([29fceac](https://github.com/OHIF/Viewers/commit/29fceacee97d51f1952a0f6b574c66596d32c201))
+
+
+
+
+
+## [1.2.9](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.2.8...@ohif/extension-dicom-html@1.2.9) (2020-10-07)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+## [1.2.8](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.2.7...@ohif/extension-dicom-html@1.2.8) (2020-09-10)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+## [1.2.7](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.2.6...@ohif/extension-dicom-html@1.2.7) (2020-09-03)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+## [1.2.6](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.2.5...@ohif/extension-dicom-html@1.2.6) (2020-09-02)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+## [1.2.5](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.2.4...@ohif/extension-dicom-html@1.2.5) (2020-08-28)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+## [1.2.4](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.2.3...@ohif/extension-dicom-html@1.2.4) (2020-07-13)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+## [1.2.3](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.2.2...@ohif/extension-dicom-html@1.2.3) (2020-06-15)
+
+
+### Bug Fixes
+
+* 🐛 Disable seg panel when data for seg unavailable ([#1732](https://github.com/OHIF/Viewers/issues/1732)) ([698e900](https://github.com/OHIF/Viewers/commit/698e900b85121d3c2a46747c443ef69fb7a8c95b)), closes [#1728](https://github.com/OHIF/Viewers/issues/1728)
+
+
+
+
+
+## [1.2.2](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.2.1...@ohif/extension-dicom-html@1.2.2) (2020-05-04)
+
+
+### Bug Fixes
+
+* 🐛 Proper error handling for derived display sets ([#1708](https://github.com/OHIF/Viewers/issues/1708)) ([5b20d8f](https://github.com/OHIF/Viewers/commit/5b20d8f323e4b3ef9988f2f2ab672d697b6da409))
+
+
+
+
+
+## [1.2.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.2.0...@ohif/extension-dicom-html@1.2.1) (2020-04-28)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+# [1.2.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.1.2...@ohif/extension-dicom-html@1.2.0) (2020-04-24)
+
+
+### Features
+
+* 🎸 Seg jump to slice + show/hide ([835f64d](https://github.com/OHIF/Viewers/commit/835f64d47a9994f6a25aaf3941a4974e215e7e7f))
+
+
+
+
+
+## [1.1.2](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.1.1...@ohif/extension-dicom-html@1.1.2) (2020-04-02)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
 ## [1.1.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.1.0...@ohif/extension-dicom-html@1.1.1) (2020-03-09)
 
 **Note:** Version bump only for package @ohif/extension-dicom-html

extensions/dicom-html/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ohif/extension-dicom-html",
-  "version": "1.1.1",
+  "version": "1.3.23",
   "description": "OHIF extension for rendering structured reports to HTML",
   "author": "OHIF",
   "license": "MIT",
@@ -29,7 +29,7 @@
   },
   "peerDependencies": {
     "@ohif/core": "^0.50.0",
-    "dcmjs": "^0.10.1",
+    "dcmjs": "0.24.10",
     "prop-types": "^15.6.2",
     "react": "^16.8.6",
     "react-dom": "^16.8.6"

extensions/dicom-html/src/DicomHtmlViewport.js

@@ -1,6 +1,6 @@
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
-import * as dcmjs from 'dcmjs';
+import dcmjs from 'dcmjs';
 import TypedArrayProp from './TypedArrayProp';
 
 import './DicomHtmlViewport.css';
@@ -160,7 +160,7 @@ const getContentSequence = (data, level = 1) => {
 
   const root = [];
   if (header) {
-    const HeaderDynamicLevel = `h${level}`;
+    const HeaderDynamicLevel = `h${Math.min(level, 6)}`;
 
     root.push(<HeaderDynamicLevel key={header}>{header}</HeaderDynamicLevel>);
   }
@@ -168,6 +168,16 @@ const getContentSequence = (data, level = 1) => {
   Object.keys(data).forEach(key => {
     const value = data[key];
 
+    if (key === '_meta') {
+      const HeaderDynamicLevel = `h3`;
+      root.push(<hr key={root.length} />);
+      root.push(
+        <HeaderDynamicLevel key="Metadata">
+          DICOM File Meta Information
+        </HeaderDynamicLevel>
+      );
+    }
+
     let content;
     if (value instanceof Object) {
       content = getContentSequence(value, level + 1);
@@ -207,7 +217,7 @@ class DicomHtmlViewport extends Component {
   };
 
   componentDidMount() {
-    const dataSet = this.setContentFromByteArray(this.props.byteArray);
+    this.setContentFromByteArray(this.props.byteArray);
   }
 
   setContentFromByteArray(byteArray) {
@@ -215,6 +225,7 @@ class DicomHtmlViewport extends Component {
     const dicomData = DicomMessage.readFile(arrayBuffer);
     const dataset = DicomMetaDictionary.naturalizeDataset(dicomData.dict);
     dataset._meta = DicomMetaDictionary.namifyDataset(dicomData.meta);
+    dataset._meta = DicomMetaDictionary.naturalizeDataset(dataset._meta);
 
     const mainData = getMainData(dataset);
     const contentSequence = getContentSequence(dataset);

extensions/dicom-html/src/OHIFDicomHtmlSopClassHandler.js

@@ -1,14 +1,16 @@
-import { MODULE_TYPES, utils } from '@ohif/core';
+import { MODULE_TYPES, utils, metadata } from '@ohif/core';
 
 // TODO: Should probably use dcmjs for this
 const SOP_CLASS_UIDS = {
   BASIC_TEXT_SR: '1.2.840.10008.5.1.4.1.1.88.11',
   ENHANCED_SR: '1.2.840.10008.5.1.4.1.1.88.22',
   COMPREHENSIVE_SR: '1.2.840.10008.5.1.4.1.1.88.33',
+  COMPREHENSIVE_3D_SR: '1.2.840.10008.5.1.4.1.1.88.34',
   PROCEDURE_LOG_STORAGE: '1.2.840.10008.5.1.4.1.1.88.40',
   MAMMOGRAPHY_CAD_SR: '1.2.840.10008.5.1.4.1.1.88.50',
   CHEST_CAD_SR: '1.2.840.10008.5.1.4.1.1.88.65',
   X_RAY_RADIATION_DOSE_SR: '1.2.840.10008.5.1.4.1.1.88.67',
+  ACQUISITION_CONTEXT_SR_STORAGE: '1.2.840.10008.5.1.4.1.1.88.71',
 };
 
 const sopClassUIDs = Object.values(SOP_CLASS_UIDS);
@@ -22,7 +24,15 @@ const OHIFDicomHtmlSopClassHandler = {
   getDisplaySetFromSeries(series, study, dicomWebClient, authorizationHeaders) {
     const instance = series.getFirstInstance();
 
-    return {
+    const metadata = instance.getData().metadata;
+    const {
+      SeriesDescription,
+      SeriesNumber,
+      SeriesDate,
+      SeriesTime,
+    } = metadata;
+
+    const srDisplaySet = {
       plugin: 'html',
       Modality: 'SR',
       displaySetInstanceUID: utils.guid(),
@@ -31,8 +41,23 @@ const OHIFDicomHtmlSopClassHandler = {
       SOPInstanceUID: instance.getSOPInstanceUID(),
       SeriesInstanceUID: series.getSeriesInstanceUID(),
       StudyInstanceUID: study.getStudyInstanceUID(),
+      SeriesDescription,
+      metadata,
+      SeriesDate,
+      SeriesTime,
+      SeriesNumber,
       authorizationHeaders,
+      sopClassUids: sopClassUIDs,
+      images: series._instances,
+      isDerived: true,
+      referencedDisplaySets: [],
     };
+
+    srDisplaySet.getSourceDisplaySet = function() {
+      return srDisplaySet.referencedDisplaySets;
+    };
+
+    return srDisplaySet;
   },
 };
 

extensions/dicom-html/src/asyncComponent.js

@@ -1,37 +0,0 @@
-/**
- * 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-html/src/index.js

@@ -1,17 +1,25 @@
-import asyncComponent from './asyncComponent.js';
+import React from 'react';
 import OHIFDicomHtmlSopClassHandler from './OHIFDicomHtmlSopClassHandler.js';
+import { version } from '../package.json';
 
-const OHIFDicomHtmlViewport = asyncComponent(() =>
-  import(
-    /* webpackChunkName: "OHIFDicomHtmlViewport" */ './OHIFDicomHtmlViewport.js'
-  )
-);
+const Component = React.lazy(() => {
+  return import('./OHIFDicomHtmlViewport');
+});
+
+const OHIFDicomHtmlViewport = props => {
+  return (
+    <React.Suspense fallback={<div>Loading...</div>}>
+      <Component {...props} />
+    </React.Suspense>
+  );
+};
 
 export default {
   /**
    * Only required property. Should be a unique value across all extensions.
    */
   id: 'html',
+  version,
 
   getViewportModule() {
     return OHIFDicomHtmlViewport;

extensions/dicom-microscopy/CHANGELOG.md

@@ -3,6 +3,76 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [0.52.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-microscopy@0.51.4...@ohif/extension-dicom-microscopy@0.52.0) (2021-03-04)
+
+
+### Features
+
+* **log:** add new log service ([14d6454](https://github.com/OHIF/Viewers/commit/14d6454eafaa2ccb50e133c2945c9558052ea27e))
+
+
+
+
+
+## [0.51.4](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-microscopy@0.51.3...@ohif/extension-dicom-microscopy@0.51.4) (2021-01-21)
+
+**Note:** Version bump only for package @ohif/extension-dicom-microscopy
+
+
+
+
+
+## [0.51.3](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-microscopy@0.51.2...@ohif/extension-dicom-microscopy@0.51.3) (2020-09-10)
+
+**Note:** Version bump only for package @ohif/extension-dicom-microscopy
+
+
+
+
+
+## [0.51.2](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-microscopy@0.51.1...@ohif/extension-dicom-microscopy@0.51.2) (2020-09-03)
+
+**Note:** Version bump only for package @ohif/extension-dicom-microscopy
+
+
+
+
+
+## [0.51.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-microscopy@0.51.0...@ohif/extension-dicom-microscopy@0.51.1) (2020-08-28)
+
+**Note:** Version bump only for package @ohif/extension-dicom-microscopy
+
+
+
+
+
+# [0.51.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-microscopy@0.50.9...@ohif/extension-dicom-microscopy@0.51.0) (2020-06-04)
+
+
+### Features
+
+* 🎸 1729 - error boundary wrapper ([#1764](https://github.com/OHIF/Viewers/issues/1764)) ([c02b232](https://github.com/OHIF/Viewers/commit/c02b232b0cc24f38af5d5e3831d987d048e60ada))
+
+
+
+
+
+## [0.50.9](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-microscopy@0.50.8...@ohif/extension-dicom-microscopy@0.50.9) (2020-04-02)
+
+**Note:** Version bump only for package @ohif/extension-dicom-microscopy
+
+
+
+
+
+## [0.50.8](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-microscopy@0.50.7...@ohif/extension-dicom-microscopy@0.50.8) (2020-03-31)
+
+**Note:** Version bump only for package @ohif/extension-dicom-microscopy
+
+
+
+
+
 ## [0.50.7](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-microscopy@0.50.6...@ohif/extension-dicom-microscopy@0.50.7) (2020-03-09)
 
 **Note:** Version bump only for package @ohif/extension-dicom-microscopy

extensions/dicom-microscopy/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ohif/extension-dicom-microscopy",
-  "version": "0.50.7",
+  "version": "0.52.0",
   "description": "OHIF extension for Dicom Microscopy",
   "author": "OHIF",
   "license": "MIT",

extensions/dicom-microscopy/src/DicomMicroscopySopClassHandler.js

@@ -12,6 +12,14 @@ const DicomMicroscopySopClassHandler = {
   getDisplaySetFromSeries(series, study, dicomWebClient) {
     const instance = series.getFirstInstance();
 
+    const metadata = instance.getData().metadata;
+    const {
+      SeriesDescription,
+      SeriesNumber,
+      ContentDate,
+      ContentTime,
+    } = metadata;
+
     // Note: We are passing the dicomweb client into each viewport!
 
     return {
@@ -22,6 +30,11 @@ const DicomMicroscopySopClassHandler = {
       SOPInstanceUID: instance.getSOPInstanceUID(),
       SeriesInstanceUID: series.getSeriesInstanceUID(),
       StudyInstanceUID: study.getStudyInstanceUID(),
+      SeriesDescription,
+      SeriesDate: ContentDate, // Map ContentDate/Time to SeriesTime for series list sorting.
+      SeriesTime: ContentTime,
+      SeriesNumber,
+      metadata,
     };
   },
 };

extensions/dicom-microscopy/src/DicomMicroscopyViewport.js

@@ -34,11 +34,12 @@ class DicomMicroscopyViewport extends Component {
       .then(instances => {
         const promises = [];
         for (let i = 0; i < instances.length; i++) {
-          const sopInstanceUid = instances[i]['00080018']['Value'][0];
+          const sopInstanceUID = instances[i]['00080018']['Value'][0];
+
           const retrieveInstanceOptions = {
             studyInstanceUID: displaySet.StudyInstanceUID,
             seriesInstanceUID: displaySet.SeriesInstanceUID,
-            sopInstanceUid,
+            sopInstanceUID,
           };
 
           const promise = dicomWebClient
@@ -61,11 +62,30 @@ class DicomMicroscopyViewport extends Component {
         );
         const microscopyViewer = api.VLWholeSlideMicroscopyImageViewer;
 
-        this.viewer = new microscopyViewer({
-          client: dicomWebClient,
-          metadata,
-          retrieveRendered: false,
-        });
+        try {
+          this.viewer = new microscopyViewer({
+            client: dicomWebClient,
+            metadata,
+            retrieveRendered: false,
+          });
+        } catch (error) {
+          console.error('[Microscopy Viewer] Failed to load:', error);
+          const {
+            UINotificationService,
+            LoggerService,
+          } = this.props.servicesManager.services;
+          if (UINotificationService) {
+            const message =
+              'Failed to load viewport. Please check that you have hardware acceleration enabled.';
+            LoggerService.error({ error, message });
+            UINotificationService.show({
+              autoClose: false,
+              title: 'Microscopy Viewport',
+              message,
+              type: 'error',
+            });
+          }
+        }
 
         this.viewer.render({ container });
       });

extensions/dicom-microscopy/src/asyncComponent.js

@@ -1,37 +0,0 @@
-/**
- * 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-microscopy/src/index.js

@@ -1,20 +1,26 @@
-import asyncComponent from './asyncComponent.js';
+import React from 'react';
 import DicomMicroscopySopClassHandler from './DicomMicroscopySopClassHandler.js';
+import { version } from '../package.json';
 
-const DicomMicroscopyViewport = asyncComponent(() =>
-  import(
-    /* webpackChunkName: "DicomMicroscopyViewport" */ './DicomMicroscopyViewport.js'
-  )
-);
+const Component = React.lazy(() => {
+  return import('./DicomMicroscopyViewport');
+});
 
 export default {
   /**
    * Only required property. Should be a unique value across all extensions.
    */
   id: 'microscopy',
+  version,
 
-  getViewportModule() {
-    return DicomMicroscopyViewport;
+  getViewportModule({ servicesManager }) {
+    return props => {
+      return (
+        <React.Suspense fallback={<div>Loading...</div>}>
+          <Component {...props} servicesManager={servicesManager} />
+        </React.Suspense>
+      );
+    };
   },
   getSopClassHandlerModule() {
     return DicomMicroscopySopClassHandler;

extensions/dicom-pdf/CHANGELOG.md

@@ -3,6 +3,65 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.1.2](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-pdf@1.1.1...@ohif/extension-dicom-pdf@1.1.2) (2022-01-29)
+
+**Note:** Version bump only for package @ohif/extension-dicom-pdf
+
+
+
+
+
+## [1.1.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-pdf@1.1.0...@ohif/extension-dicom-pdf@1.1.1) (2021-12-02)
+
+**Note:** Version bump only for package @ohif/extension-dicom-pdf
+
+
+
+
+
+# [1.1.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-pdf@1.0.6...@ohif/extension-dicom-pdf@1.1.0) (2021-09-23)
+
+
+### Features
+
+* Update to WADO Image Loader 4.0.3 to add dynamically imported WebAssembly codec support 🚀 ([#2537](https://github.com/OHIF/Viewers/issues/2537)) ([489d4b0](https://github.com/OHIF/Viewers/commit/489d4b0584f4657ceda1c5b9b68d5e9733827e47))
+
+
+
+
+
+## [1.0.6](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-pdf@1.0.5...@ohif/extension-dicom-pdf@1.0.6) (2020-09-10)
+
+**Note:** Version bump only for package @ohif/extension-dicom-pdf
+
+
+
+
+
+## [1.0.5](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-pdf@1.0.4...@ohif/extension-dicom-pdf@1.0.5) (2020-09-03)
+
+**Note:** Version bump only for package @ohif/extension-dicom-pdf
+
+
+
+
+
+## [1.0.4](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-pdf@1.0.3...@ohif/extension-dicom-pdf@1.0.4) (2020-08-28)
+
+**Note:** Version bump only for package @ohif/extension-dicom-pdf
+
+
+
+
+
+## [1.0.3](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-pdf@1.0.2...@ohif/extension-dicom-pdf@1.0.3) (2020-04-02)
+
+**Note:** Version bump only for package @ohif/extension-dicom-pdf
+
+
+
+
+
 ## [1.0.2](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-pdf@1.0.1...@ohif/extension-dicom-pdf@1.0.2) (2020-03-09)
 
 **Note:** Version bump only for package @ohif/extension-dicom-pdf

extensions/dicom-pdf/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ohif/extension-dicom-pdf",
-  "version": "1.0.2",
+  "version": "1.1.2",
   "description": "OHIF extension for Dicom PDF",
   "author": "OHIF",
   "license": "MIT",
@@ -29,7 +29,7 @@
   },
   "peerDependencies": {
     "@ohif/core": "^0.50.0",
-    "dicom-parser": "^1.8.3",
+    "dicom-parser": "^1.8.11",
     "prop-types": "^15.6.2",
     "react": "^16.8.6",
     "react-dom": "^16.8.6"

extensions/dicom-pdf/src/DicomPDFViewport.js

@@ -33,6 +33,7 @@ class DicomPDFViewport extends Component {
 
   static propTypes = {
     byteArray: TypedArrayProp.uint8,
+    rawPdf: PropTypes.bool,
     useNative: PropTypes.bool,
     viewportData: PropTypes.object,
     activeViewportIndex: PropTypes.number,
@@ -45,7 +46,8 @@ class DicomPDFViewport extends Component {
   };
 
   async componentDidMount() {
-    const dataSet = this.parseByteArray(this.props.byteArray);
+    const { rawPdf } = this.props
+    const dataSet = !rawPdf && this.parseByteArray(this.props.byteArray);
     const fileURL = this.getPDFFileUrl(dataSet, this.props.byteArray);
 
     this.setState(state => ({ ...state, fileURL }));

extensions/dicom-pdf/src/OHIFDicomPDFSopClassHandler.js

@@ -12,6 +12,14 @@ const OHIFDicomPDFSopClassHandler = {
   getDisplaySetFromSeries(series, study, dicomWebClient, authorizationHeaders) {
     const instance = series.getFirstInstance();
 
+    const metadata = instance.getData().metadata;
+    const {
+      ContentDate,
+      ContentTime,
+      SeriesDescription,
+      SeriesNumber,
+    } = metadata;
+
     return {
       plugin: 'pdf',
       Modality: 'DOC',
@@ -21,6 +29,11 @@ const OHIFDicomPDFSopClassHandler = {
       SOPInstanceUID: instance.getSOPInstanceUID(),
       SeriesInstanceUID: series.getSeriesInstanceUID(),
       StudyInstanceUID: study.getStudyInstanceUID(),
+      SeriesDescription,
+      SeriesDate: ContentDate, // Map ContentDate/Time to SeriesTime for series list sorting.
+      SeriesTime: ContentTime,
+      SeriesNumber,
+      metadata,
       authorizationHeaders: authorizationHeaders,
     };
   },

extensions/dicom-pdf/src/OHIFDicomPDFViewport.js

@@ -3,6 +3,7 @@ import PropTypes from 'prop-types';
 import OHIF from '@ohif/core';
 import OHIFComponentPlugin from './OHIFComponentPlugin.js';
 import DicomPDFViewport from './DicomPDFViewport';
+import { str2ab } from '@ohif/core';
 
 const { DicomLoaderService } = OHIF.utils;
 
@@ -18,6 +19,7 @@ class OHIFDicomPDFViewport extends Component {
 
   state = {
     byteArray: null,
+    rawPdf: false,
     error: null,
   };
 
@@ -34,6 +36,15 @@ class OHIFDicomPDFViewport extends Component {
   componentDidMount() {
     const { displaySet, studies } = this.props.viewportData;
 
+    if (displaySet.metadata && displaySet.metadata.EncapsulatedDocument) {
+      const { InlineBinary, BulkDataURI } = displaySet.metadata.EncapsulatedDocument;
+      if (InlineBinary) {
+        const inlineBinaryData = atob(InlineBinary);
+        const byteArray = str2ab(inlineBinaryData);
+        this.setState({ byteArray, rawPdf: true });
+        return;
+      }
+    }
     DicomLoaderService.findDicomDataPromise(displaySet, studies).then(
       data => this.setState({ byteArray: new Uint8Array(data) }),
       error => {
@@ -49,15 +60,16 @@ class OHIFDicomPDFViewport extends Component {
       viewportIndex,
       activeViewportIndex,
     } = this.props;
-    const { byteArray, error } = this.state;
+    const { byteArray, error, rawPdf } = this.state;
     const { id, init, destroy } = OHIFDicomPDFViewport;
     const pluginProps = { id, init, destroy };
 
     return (
       <OHIFComponentPlugin {...pluginProps}>
-        {byteArray && (
+        {(byteArray) && (
           <DicomPDFViewport
             byteArray={byteArray}
+            rawPdf={rawPdf}
             setViewportActive={setViewportActive}
             viewportIndex={viewportIndex}
             activeViewportIndex={activeViewportIndex}

extensions/dicom-pdf/src/asyncComponent.js

@@ -1,37 +0,0 @@
-/**
- * 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,17 +1,25 @@
-import asyncComponent from './asyncComponent.js';
+import React from 'react';
 import OHIFDicomPDFSopClassHandler from './OHIFDicomPDFSopClassHandler.js';
+import { version } from '../package.json';
 
-const ConnectedOHIFDicomPDFViewer = asyncComponent(() =>
-  import(
-    /* webpackChunkName: "ConnectedOHIFDicomPDFViewer" */ './ConnectedOHIFDicomPDFViewer'
-  )
-);
+const Component = React.lazy(() => {
+  return import('./ConnectedOHIFDicomPDFViewer');
+});
+
+const ConnectedOHIFDicomPDFViewer = props => {
+  return (
+    <React.Suspense fallback={<div>Loading...</div>}>
+      <Component {...props} />
+    </React.Suspense>
+  );
+};
 
 export default {
   /**
    * Only required property. Should be a unique value across all extensions.
    */
   id: 'pdf',
+  version,
   getViewportModule() {
     return ConnectedOHIFDicomPDFViewer;
   },

extensions/dicom-rt/.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/dicom-rt/.webpack/webpack.prod.js

@@ -0,0 +1,44 @@
+const webpack = require('webpack');
+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: 'OHIFExtDicomSeg',
+      libraryTarget: 'umd',
+      libraryExport: 'default',
+      filename: pkg.main,
+    },
+    plugins: [
+      new webpack.optimize.LimitChunkCountPlugin({
+        maxChunks: 1,
+      }),
+    ],
+  });
+};

extensions/dicom-rt/CHANGELOG.md

@@ -0,0 +1,485 @@
+# Change Log
+
+All notable changes to this project will be documented in this file.
+See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+
+## [0.7.13](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.7.12...@ohif/extension-dicom-rt@0.7.13) (2022-09-01)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.7.12](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.7.11...@ohif/extension-dicom-rt@0.7.12) (2022-08-31)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.7.11](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.7.10...@ohif/extension-dicom-rt@0.7.11) (2022-04-05)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.7.10](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.7.9...@ohif/extension-dicom-rt@0.7.10) (2022-03-25)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.7.9](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.7.8...@ohif/extension-dicom-rt@0.7.9) (2022-03-14)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.7.8](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.7.7...@ohif/extension-dicom-rt@0.7.8) (2022-02-03)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.7.7](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.7.6...@ohif/extension-dicom-rt@0.7.7) (2022-02-02)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.7.6](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.7.5...@ohif/extension-dicom-rt@0.7.6) (2022-01-20)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.7.5](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.7.4...@ohif/extension-dicom-rt@0.7.5) (2022-01-19)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.7.4](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.7.3...@ohif/extension-dicom-rt@0.7.4) (2021-12-02)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.7.3](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.7.2...@ohif/extension-dicom-rt@0.7.3) (2021-10-26)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.7.2](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.7.1...@ohif/extension-dicom-rt@0.7.2) (2021-10-06)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.7.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.7.0...@ohif/extension-dicom-rt@0.7.1) (2021-09-28)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+# [0.7.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.6.14...@ohif/extension-dicom-rt@0.7.0) (2021-09-23)
+
+
+### Features
+
+* Update to WADO Image Loader 4.0.3 to add dynamically imported WebAssembly codec support 🚀 ([#2537](https://github.com/OHIF/Viewers/issues/2537)) ([489d4b0](https://github.com/OHIF/Viewers/commit/489d4b0584f4657ceda1c5b9b68d5e9733827e47))
+
+
+
+
+
+## [0.6.14](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.6.13...@ohif/extension-dicom-rt@0.6.14) (2021-09-03)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.6.13](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.6.12...@ohif/extension-dicom-rt@0.6.13) (2021-06-02)
+
+
+### Bug Fixes
+
+* **dicom-html:** Add parsed dicom meta info section ([#2419](https://github.com/OHIF/Viewers/issues/2419)) ([403688b](https://github.com/OHIF/Viewers/commit/403688b18c52468fc1101166ec0c1734fb710039))
+
+
+
+
+
+## [0.6.12](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.6.11...@ohif/extension-dicom-rt@0.6.12) (2021-05-17)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.6.11](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.6.10...@ohif/extension-dicom-rt@0.6.11) (2021-04-22)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.6.10](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.6.9...@ohif/extension-dicom-rt@0.6.10) (2021-04-22)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.6.9](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.6.8...@ohif/extension-dicom-rt@0.6.9) (2021-04-21)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.6.8](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.6.7...@ohif/extension-dicom-rt@0.6.8) (2021-04-15)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.6.7](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.6.6...@ohif/extension-dicom-rt@0.6.7) (2021-03-09)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.6.6](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.6.5...@ohif/extension-dicom-rt@0.6.6) (2021-03-03)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.6.5](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.6.4...@ohif/extension-dicom-rt@0.6.5) (2021-02-25)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.6.4](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.6.3...@ohif/extension-dicom-rt@0.6.4) (2021-02-05)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.6.3](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.6.2...@ohif/extension-dicom-rt@0.6.3) (2021-01-21)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.6.2](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.6.1...@ohif/extension-dicom-rt@0.6.2) (2021-01-21)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.6.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.6.0...@ohif/extension-dicom-rt@0.6.1) (2020-12-10)
+
+
+### Bug Fixes
+
+* panel issues and mpr button (IDC2122-IDC2117) ([32022f5](https://github.com/OHIF/Viewers/commit/32022f51f2d24f53f4c98188980db038a6dfe76c))
+
+
+
+
+
+# [0.6.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.5.0...@ohif/extension-dicom-rt@0.6.0) (2020-12-10)
+
+
+### Features
+
+* visualize overlapping segments in cornerstone ([#2185](https://github.com/OHIF/Viewers/issues/2185)) ([29fceac](https://github.com/OHIF/Viewers/commit/29fceacee97d51f1952a0f6b574c66596d32c201))
+
+
+
+
+
+# [0.5.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.4.9...@ohif/extension-dicom-rt@0.5.0) (2020-12-03)
+
+
+### Features
+
+* Update approach to better handle rtdose instead of disabling panel ([f3cecf1](https://github.com/OHIF/Viewers/commit/f3cecf129b16f8d24d239aa44fdff7f46e6ba683))
+
+
+
+
+
+## [0.4.9](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.4.8...@ohif/extension-dicom-rt@0.4.9) (2020-10-12)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.4.8](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.4.7...@ohif/extension-dicom-rt@0.4.8) (2020-10-07)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.4.7](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.4.6...@ohif/extension-dicom-rt@0.4.7) (2020-10-06)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.4.6](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.4.5...@ohif/extension-dicom-rt@0.4.6) (2020-09-17)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.4.5](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.4.4...@ohif/extension-dicom-rt@0.4.5) (2020-09-10)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.4.4](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.4.3...@ohif/extension-dicom-rt@0.4.4) (2020-09-10)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.4.3](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.4.2...@ohif/extension-dicom-rt@0.4.3) (2020-09-03)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.4.2](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.4.1...@ohif/extension-dicom-rt@0.4.2) (2020-09-02)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.4.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.4.0...@ohif/extension-dicom-rt@0.4.1) (2020-08-28)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+# [0.4.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.3.0...@ohif/extension-dicom-rt@0.4.0) (2020-08-18)
+
+
+### Features
+
+* 🎸 Update react-vtkjs-viewport usage to use requestPool ([#1984](https://github.com/OHIF/Viewers/issues/1984)) ([bb5f30c](https://github.com/OHIF/Viewers/commit/bb5f30ce2a0192d2e021beaaadfff22fd38e17b9))
+
+
+
+
+
+# [0.3.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.2.7...@ohif/extension-dicom-rt@0.3.0) (2020-08-10)
+
+
+### Features
+
+* 🎸 Add support for POINT and OPEN_PLANAR for RT ([0e87ab3](https://github.com/OHIF/Viewers/commit/0e87ab37c29fcf9af74bbcefca854c6e6b8707bc))
+
+
+
+
+
+## [0.2.7](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.2.6...@ohif/extension-dicom-rt@0.2.7) (2020-08-10)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.2.6](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.2.5...@ohif/extension-dicom-rt@0.2.6) (2020-08-05)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.2.5](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.2.4...@ohif/extension-dicom-rt@0.2.5) (2020-07-13)
+
+
+### Bug Fixes
+
+* 🐛 - Put guards in all places that a cornerstone re-render ([#1899](https://github.com/OHIF/Viewers/issues/1899)) ([451f7ea](https://github.com/OHIF/Viewers/commit/451f7eab9258e7a193eb362e0926b13aedc4b3c9))
+
+
+
+
+
+## [0.2.4](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.2.3...@ohif/extension-dicom-rt@0.2.4) (2020-07-13)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.2.3](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.2.2...@ohif/extension-dicom-rt@0.2.3) (2020-07-13)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.2.2](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.2.1...@ohif/extension-dicom-rt@0.2.2) (2020-07-13)
+
+
+### Bug Fixes
+
+* 🐛 Fix RT Panel hide/show and Fix looping load errors ([#1877](https://github.com/OHIF/Viewers/issues/1877)) ([e7cc735](https://github.com/OHIF/Viewers/commit/e7cc735c03d02eeb0d3af4ba02c15ed4f81bbec2))
+
+
+
+
+
+## [0.2.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.2.0...@ohif/extension-dicom-rt@0.2.1) (2020-06-15)
+
+
+### Bug Fixes
+
+* 🐛 Disable seg panel when data for seg unavailable ([#1732](https://github.com/OHIF/Viewers/issues/1732)) ([698e900](https://github.com/OHIF/Viewers/commit/698e900b85121d3c2a46747c443ef69fb7a8c95b)), closes [#1728](https://github.com/OHIF/Viewers/issues/1728)
+
+
+
+
+
+# [0.2.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.1.4...@ohif/extension-dicom-rt@0.2.0) (2020-06-04)
+
+
+### Features
+
+* 🎸 1729 - error boundary wrapper ([#1764](https://github.com/OHIF/Viewers/issues/1764)) ([c02b232](https://github.com/OHIF/Viewers/commit/c02b232b0cc24f38af5d5e3831d987d048e60ada))
+
+
+
+
+
+## [0.1.4](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.1.3...@ohif/extension-dicom-rt@0.1.4) (2020-05-14)
+
+
+### Bug Fixes
+
+* 🐛 Load default display set when no time metadata ([#1684](https://github.com/OHIF/Viewers/issues/1684)) ([f7b8b6a](https://github.com/OHIF/Viewers/commit/f7b8b6a41c4626084ef56b0fdf7363e914b143c4)), closes [#1683](https://github.com/OHIF/Viewers/issues/1683)
+
+
+
+
+
+## [0.1.3](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.1.2...@ohif/extension-dicom-rt@0.1.3) (2020-05-12)
+
+
+### Bug Fixes
+
+* 🐛 Fix seg color load ([#1724](https://github.com/OHIF/Viewers/issues/1724)) ([c4f84b1](https://github.com/OHIF/Viewers/commit/c4f84b1174d04ba84d37ed89b6d7ab541be28181))
+
+
+
+
+
+## [0.1.2](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.1.1...@ohif/extension-dicom-rt@0.1.2) (2020-05-04)
+
+
+### Bug Fixes
+
+* 🐛 Proper error handling for derived display sets ([#1708](https://github.com/OHIF/Viewers/issues/1708)) ([5b20d8f](https://github.com/OHIF/Viewers/commit/5b20d8f323e4b3ef9988f2f2ab672d697b6da409))
+
+
+
+
+
+## [0.1.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.1.0...@ohif/extension-dicom-rt@0.1.1) (2020-04-28)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+# [0.1.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.0.2...@ohif/extension-dicom-rt@0.1.0) (2020-04-24)
+
+
+### Features
+
+* 🎸 Seg jump to slice + show/hide ([835f64d](https://github.com/OHIF/Viewers/commit/835f64d47a9994f6a25aaf3941a4974e215e7e7f))
+
+
+
+
+
+## 0.0.2 (2020-04-09)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt

extensions/dicom-rt/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/dicom-rt/README.md

@@ -0,0 +1 @@
+# @ohif/extension-dicom-rt

extensions/dicom-rt/package.json

@@ -0,0 +1,45 @@
+{
+  "name": "@ohif/extension-dicom-rt",
+  "version": "0.7.13",
+  "description": "OHIF extension for rendering DICOM RTSTRUCTs on top of cornerstone images.",
+  "author": "OHIF",
+  "license": "MIT",
+  "repository": "OHIF/Viewers",
+  "main": "dist/index.umd.js",
+  "module": "src/index.js",
+  "engines": {
+    "node": ">=10",
+    "npm": ">=6",
+    "yarn": ">=1.16.0"
+  },
+  "files": [
+    "dist",
+    "README.md"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "dev": "cross-env NODE_ENV=development webpack --config .webpack/webpack.dev.js --watch --debug --output-pathinfo",
+    "dev:dicom-html": "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",
+    "cornerstone-core": "^2.6.1",
+    "cornerstone-tools": "^6.0.6",
+    "dcmjs": "0.24.10",
+    "gl-matrix": "^3.3.0",
+    "prop-types": "^15.6.2",
+    "react": "^16.8.6",
+    "react-dom": "^16.8.6",
+    "react-tooltip": "4.2.10"
+  },
+  "dependencies": {
+    "@babel/runtime": "^7.5.5",
+    "react-select": "^3.0.8"
+  }
+}

extensions/dicom-rt/src/OHIFDicomRTStructSopClassHandler.js

@@ -0,0 +1,246 @@
+import { MODULE_TYPES, utils, DICOMWeb } from '@ohif/core';
+import loadRTStruct from './loadRTStruct';
+import getSourceDisplaySet from './getSourceDisplaySet';
+
+import id from './id';
+
+// TODO: Should probably use dcmjs for this
+const SOP_CLASS_UIDS = {
+  DICOM_RT_STRUCT: '1.2.840.10008.5.1.4.1.1.481.3',
+};
+
+const sopClassUIDs = Object.values(SOP_CLASS_UIDS);
+
+const OHIFDicomRTStructSopClassHandler = {
+  id: 'OHIFDicomRTStructSopClassHandler',
+  type: MODULE_TYPES.SOP_CLASS_HANDLER,
+  sopClassUIDs,
+  getDisplaySetFromSeries: function (
+    series,
+    study,
+    dicomWebClient,
+    authorizationHeaders
+  ) {
+    const instance = series.getFirstInstance();
+
+    const metadata = instance.getData().metadata;
+    const {
+      SeriesDate,
+      SeriesTime,
+      SeriesNumber,
+      SeriesDescription,
+      FrameOfReferenceUID,
+      SOPInstanceUID,
+      SeriesInstanceUID,
+      StudyInstanceUID,
+    } = metadata;
+
+    // TODO -> GET REFERENCED FRAME OF REFERENCE SEQUENCE.
+
+    const rtStructDisplaySet = {
+      Modality: 'RTSTRUCT',
+      displaySetInstanceUID: utils.guid(),
+      wadoRoot: study.getData().wadoRoot,
+      wadoUri: instance.getData().wadouri,
+      SOPInstanceUID,
+      SeriesInstanceUID,
+      StudyInstanceUID,
+      FrameOfReferenceUID,
+      authorizationHeaders,
+      metadata,
+      isDerived: true,
+      referencedDisplaySetUID: null, // Assigned when loaded.
+      labelmapIndex: null, // Assigned when loaded.
+      isLoaded: false,
+      SeriesDate,
+      SeriesTime,
+      SeriesNumber,
+      SeriesDescription,
+      metadata,
+    };
+
+    if (!metadata.ReferencedSeriesSequence) {
+      const ReferencedFrameOfReferenceSequence =
+        metadata.ReferencedFrameOfReferenceSequence;
+
+      if (ReferencedFrameOfReferenceSequence) {
+        // TODO -> @dannyrb Do we augment metadata or add a (potentially large? fallback list in filterDerivedDisplaySets )
+        metadata.ReferencedSeriesSequence = _deriveReferencedSeriesSequenceFromFrameOfReferenceSequence(
+          ReferencedFrameOfReferenceSequence
+        );
+      }
+    }
+
+    rtStructDisplaySet.getSourceDisplaySet = function (studies, activateLabelMap = true) {
+      return getSourceDisplaySet(studies, rtStructDisplaySet, activateLabelMap);
+    };
+
+    rtStructDisplaySet.load = function (referencedDisplaySet, studies) {
+      return loadRTStruct(
+        rtStructDisplaySet,
+        referencedDisplaySet,
+        studies
+      ).catch(error => {
+        rtStructDisplaySet.isLoaded = false;
+        rtStructDisplaySet.loadError = true;
+        throw new Error(error);
+      });
+    };
+
+    return rtStructDisplaySet;
+  },
+};
+
+function _deriveReferencedSeriesSequenceFromFrameOfReferenceSequence(
+  ReferencedFrameOfReferenceSequence
+) {
+  const ReferencedSeriesSequence = [];
+
+  _getSequenceAsArray(ReferencedFrameOfReferenceSequence).forEach(
+    referencedFrameOfReference => {
+      const { RTReferencedStudySequence } = referencedFrameOfReference;
+
+      _getSequenceAsArray(RTReferencedStudySequence).forEach(
+        rtReferencedStudy => {
+          const { RTReferencedSeriesSequence } = rtReferencedStudy;
+
+          _getSequenceAsArray(RTReferencedSeriesSequence).forEach(
+            rtReferencedSeries => {
+              const ReferencedInstanceSequence = [];
+              const {
+                ContourImageSequence,
+                SeriesInstanceUID,
+              } = rtReferencedSeries;
+
+              _getSequenceAsArray(ContourImageSequence).forEach(
+                contourImage => {
+                  ReferencedInstanceSequence.push({
+                    ReferencedSOPInstanceUID:
+                      contourImage.ReferencedSOPInstanceUID,
+                    ReferencedSOPClassUID: contourImage.ReferencedSOPClassUID,
+                  });
+                }
+              );
+
+              const referencedSeries = {
+                SeriesInstanceUID,
+                ReferencedInstanceSequence,
+              };
+
+              ReferencedSeriesSequence.push(referencedSeries);
+            }
+          );
+        }
+      );
+    }
+  );
+
+  return ReferencedSeriesSequence;
+}
+
+function _getSequenceAsArray(sequence) {
+  return Array.isArray(sequence) ? sequence : [sequence];
+}
+
+function _getReferencedFrameOfReferenceSequence(instance) {
+  const referencedFrameOfReferenceSequenceRaw = instance['30060010'];
+
+  const referencedFrameOfReferenceSequence = [];
+
+  if (
+    !referencedFrameOfReferenceSequenceRaw ||
+    !referencedFrameOfReferenceSequenceRaw.Value
+  ) {
+    return undefined;
+  }
+
+  referencedFrameOfReferenceSequenceRaw.Value.forEach(
+    referencedFrameOfReferenceRaw => {
+      const frameOfReferenceUID = DICOMWeb.getString(
+        referencedFrameOfReferenceRaw['00200052']
+      );
+
+      const referencedFrameOfReference = { frameOfReferenceUID };
+      const RTReferencedStudySequenceRaw =
+        referencedFrameOfReferenceRaw['30060012'];
+
+      referencedFrameOfReferenceSequence.push(referencedFrameOfReference);
+
+      if (RTReferencedStudySequenceRaw && RTReferencedStudySequenceRaw.Value) {
+        referencedFrameOfReference.rtReferencedStudySequence = [];
+
+        const { rtReferencedStudySequence } = referencedFrameOfReference;
+
+        RTReferencedStudySequenceRaw.Value.forEach(rtReferencedStudyRaw => {
+          const referencedSopClassUID = DICOMWeb.getString(
+            rtReferencedStudyRaw['00081150']
+          );
+
+          const referencedSOPInstanceUID = DICOMWeb.getString(
+            rtReferencedStudyRaw['00081155']
+          );
+
+          const rtReferencedStudy = {
+            referencedSopClassUID,
+            referencedSOPInstanceUID,
+            rtReferencedSeriesSequence: [],
+          };
+
+          rtReferencedStudySequence.push(rtReferencedStudy);
+
+          const { rtReferencedSeriesSequence } = rtReferencedStudy;
+
+          const rtReferencedSeriesSequenceRaw =
+            rtReferencedStudyRaw['30060014'];
+
+          rtReferencedSeriesSequenceRaw.Value.forEach(rtReferencedSeriesRaw => {
+            const seriesInstanceUID = DICOMWeb.getString(
+              rtReferencedSeriesRaw['0020000E']
+            );
+
+            const rtReferencedSeries = {
+              seriesInstanceUID,
+              contourImageSequence: [],
+            };
+
+            rtReferencedSeriesSequence.push(rtReferencedSeries);
+
+            const { contourImageSequence } = rtReferencedSeries;
+
+            const contourImageSequenceRaw = rtReferencedSeriesRaw['30060016'];
+
+            contourImageSequenceRaw.Value.forEach(contourImageRaw => {
+              const referencedSOPClassUID = DICOMWeb.getString(
+                contourImageRaw['00081150']
+              );
+
+              const referencedSOPInstanceUID = DICOMWeb.getString(
+                contourImageRaw['00081155']
+              );
+
+              const referencedFrameNumber = DICOMWeb.getString(
+                contourImageRaw['00081160']
+              );
+              const referencedSegmentNumber = DICOMWeb.getString(
+                contourImageRaw['0062000B']
+              );
+
+              const contourImage = {
+                referencedSOPClassUID,
+                referencedSOPInstanceUID,
+                referencedFrameNumber,
+                referencedSegmentNumber,
+              };
+
+              contourImageSequence.push(contourImage);
+            });
+          });
+        });
+      }
+    }
+  );
+
+  return referencedFrameOfReferenceSequence;
+}
+
+export default OHIFDicomRTStructSopClassHandler;

extensions/dicom-rt/src/components/LoadingIndicator/LoadingIndicator.js

@@ -0,0 +1,61 @@
+import React from 'react';
+
+const LoadingIndicator = ({ height = "200px", width = "200px", expand = false }) => {
+  return (
+    <div style={expand ? { height: "100%", width: "100%" } : {}}>
+      <svg style={{ margin: 'auto', background: 'none', display: 'block', shapeRendering: 'auto' }} width={width} height={height} viewBox="0 0 100 100" preserveAspectRatio="xMidYMid">
+        <g transform="rotate(0 50 50)">
+          <rect x="49" y="24" rx="0" ry="0" width="2" height="12" fill="#20a5d6">
+            <animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.9166666666666666s" repeatCount="indefinite"></animate>
+          </rect>
+        </g><g transform="rotate(30 50 50)">
+          <rect x="49" y="24" rx="0" ry="0" width="2" height="12" fill="#20a5d6">
+            <animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.8333333333333334s" repeatCount="indefinite"></animate>
+          </rect>
+        </g><g transform="rotate(60 50 50)">
+          <rect x="49" y="24" rx="0" ry="0" width="2" height="12" fill="#20a5d6">
+            <animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.75s" repeatCount="indefinite"></animate>
+          </rect>
+        </g><g transform="rotate(90 50 50)">
+          <rect x="49" y="24" rx="0" ry="0" width="2" height="12" fill="#20a5d6">
+            <animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.6666666666666666s" repeatCount="indefinite"></animate>
+          </rect>
+        </g><g transform="rotate(120 50 50)">
+          <rect x="49" y="24" rx="0" ry="0" width="2" height="12" fill="#20a5d6">
+            <animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.5833333333333334s" repeatCount="indefinite"></animate>
+          </rect>
+        </g><g transform="rotate(150 50 50)">
+          <rect x="49" y="24" rx="0" ry="0" width="2" height="12" fill="#20a5d6">
+            <animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.5s" repeatCount="indefinite"></animate>
+          </rect>
+        </g><g transform="rotate(180 50 50)">
+          <rect x="49" y="24" rx="0" ry="0" width="2" height="12" fill="#20a5d6">
+            <animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.4166666666666667s" repeatCount="indefinite"></animate>
+          </rect>
+        </g><g transform="rotate(210 50 50)">
+          <rect x="49" y="24" rx="0" ry="0" width="2" height="12" fill="#20a5d6">
+            <animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.3333333333333333s" repeatCount="indefinite"></animate>
+          </rect>
+        </g><g transform="rotate(240 50 50)">
+          <rect x="49" y="24" rx="0" ry="0" width="2" height="12" fill="#20a5d6">
+            <animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.25s" repeatCount="indefinite"></animate>
+          </rect>
+        </g><g transform="rotate(270 50 50)">
+          <rect x="49" y="24" rx="0" ry="0" width="2" height="12" fill="#20a5d6">
+            <animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.16666666666666666s" repeatCount="indefinite"></animate>
+          </rect>
+        </g><g transform="rotate(300 50 50)">
+          <rect x="49" y="24" rx="0" ry="0" width="2" height="12" fill="#20a5d6">
+            <animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.08333333333333333s" repeatCount="indefinite"></animate>
+          </rect>
+        </g><g transform="rotate(330 50 50)">
+          <rect x="49" y="24" rx="0" ry="0" width="2" height="12" fill="#20a5d6">
+            <animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="0s" repeatCount="indefinite"></animate>
+          </rect>
+        </g>
+      </svg>
+    </div>
+  );
+};
+
+export default LoadingIndicator;