feat: new Total Metabolic Tumor Volume tmtv (#2866)

* fix: ptDisplaySet metadata problem

* fix: typo in xhrHeader field

* fix: temporary fix for crosshairs on reload data

* fix hotkey bug for input fields

* upgrade docusarusu to stable release

* circle ci node upgrade

* cypress node upgrade

* bump node in netlify

* bump node version

* remove versioned docs

* update resources

* fix: webpack injection of plugins

* fix meaningful label for panels

* add reviews and fix cli for creation

* copy over chunks if exists in the build

* edit templates

* edit templates

* fix yarn lock

* fix(plugin):Deploy on windows is broken

Co-authored-by: Bill Wallace <wayfarer3130@gmail.com>

platform/cli/src/commands/utils/editPackageJson.js

@@ -17,7 +17,8 @@ async function editPackageJson(options) {
       description,
       author,
       license,
-      files: ['dist', 'README.md'],
+      main: `dist/umd/${name}/index.umd.js`,
+      files: ['dist/**', 'public/**', 'README.md'],
     },
     packageJson
   );

platform/cli/src/questions.js

@@ -17,7 +17,7 @@ function getPathQuestions(packageType) {
     {
       type: 'input',
       name: 'baseDir',
-      message: `What is the target path to create your ${packageType} (we recommend you do not use the OHIF ${packageType} folder (./${packageType}s) unless you are developing a core ${packageType}):`,
+      message: `What is the target absolute path to create your ${packageType} (we recommend you do not use the OHIF ${packageType} folder (./${packageType}s) unless you are developing a core ${packageType}):`,
       validate: (input) => {
         if (!input) {
           console.log('Please provide a valid target directory path');

platform/cli/templates/extension/.webpack/webpack.prod.js

@@ -3,7 +3,9 @@ const pkg = require('../package.json');
 
 const outputFile = 'index.umd.js';
 const rootDir = path.resolve(__dirname, '../');
-const outputFolder = path.join(__dirname, '../dist');
+const outputFolder = path.join(__dirname, `../dist/umd/${pkg.name}/`);
+
+// Todo: add ESM build for the extension in addition to umd build
 
 const config = {
   mode: 'production',
@@ -14,6 +16,7 @@ const config = {
     filename: outputFile,
     library: pkg.name,
     libraryTarget: 'umd',
+    chunkFilename: '[name].chunk.js',
     umdNamedDefine: true,
     globalObject: "typeof self !== 'undefined' ? self : this",
   },
@@ -46,14 +49,14 @@ const config = {
         loader: 'babel-loader',
         exclude: /(node_modules|bower_components)/,
         resolve: {
-          extensions: ['.js', '.jsx', '.ts', '.tsx',],
+          extensions: ['.js', '.jsx', '.ts', '.tsx'],
         },
       },
     ],
   },
   resolve: {
     modules: [path.resolve('./node_modules'), path.resolve('./src')],
-    extensions: ['.json', '.js', '.jsx', '.tsx', '.ts',],
+    extensions: ['.json', '.js', '.jsx', '.tsx', '.ts'],
   },
 };
 

platform/cli/templates/extension/dependencies.json

@@ -1,7 +1,6 @@
 {
   "repository": "OHIF/Viewers",
   "keywords": ["ohif-extension"],
-  "main": "dist/index.umd.js",
   "module": "src/index.js",
   "engines": {
     "node": ">=14",
@@ -51,8 +50,8 @@
     "dotenv": "^14.1.0",
     "eslint": "^5.0.1",
     "eslint-loader": "^2.0.0",
-    "uglifyjs-webpack-plugin": "^1.2.7",
-    "webpack": "^4.12.2",
-    "webpack-cli": "^3.0.8"
+    "webpack": "^5.50.0",
+    "webpack-merge": "^5.7.3",
+    "webpack-cli": "^4.7.2"
   }
 }

platform/cli/templates/mode/.webpack/webpack.prod.js

@@ -3,8 +3,9 @@ const pkg = require('../package.json');
 
 const outputFile = 'index.umd.js';
 const rootDir = path.resolve(__dirname, '../');
-const outputFolder = path.join(__dirname, '../dist');
+const outputFolder = path.join(__dirname, `../dist/umd/${pkg.name}/`);
 
+// Todo: add ESM build for the mode in addition to umd build
 const config = {
   mode: 'production',
   entry: rootDir + '/' + pkg.module,
@@ -14,6 +15,7 @@ const config = {
     filename: outputFile,
     library: pkg.name,
     libraryTarget: 'umd',
+    chunkFilename: '[name].chunk.js',
     umdNamedDefine: true,
     globalObject: "typeof self !== 'undefined' ? self : this",
   },
@@ -46,14 +48,14 @@ const config = {
         loader: 'babel-loader',
         exclude: /(node_modules|bower_components)/,
         resolve: {
-          extensions: ['.js', '.jsx', '.ts', '.tsx',],
+          extensions: ['.js', '.jsx', '.ts', '.tsx'],
         },
       },
     ],
   },
   resolve: {
     modules: [path.resolve('./node_modules'), path.resolve('./src')],
-    extensions: ['.json', '.js', '.jsx', '.tsx', '.ts',],
+    extensions: ['.json', '.js', '.jsx', '.tsx', '.ts'],
   },
 };
 

platform/cli/templates/mode/dependencies.json

@@ -1,7 +1,6 @@
 {
   "repository": "OHIF/Viewers",
   "keywords": ["ohif-mode"],
-  "main": "dist/index.umd.js",
   "module": "src/index.js",
   "engines": {
     "node": ">=14",
@@ -43,8 +42,8 @@
     "dotenv": "^14.1.0",
     "eslint": "^5.0.1",
     "eslint-loader": "^2.0.0",
-    "uglifyjs-webpack-plugin": "^1.2.7",
-    "webpack": "^4.12.2",
-    "webpack-cli": "^3.0.8"
+    "webpack": "^5.50.0",
+    "webpack-merge": "^5.7.3",
+    "webpack-cli": "^4.7.2"
   }
 }

platform/core/package.json

@@ -31,7 +31,7 @@
   },
   "peerDependencies": {
     "cornerstone-math": "0.1.9",
-    "cornerstone-wado-image-loader": "^4.2.0",
+    "cornerstone-wado-image-loader": "^4.2.1",
     "dicom-parser": "^1.8.9",
     "@ohif/ui": "^2.0.0"
   },

platform/docs/docs/release-notes.md

@@ -109,7 +109,7 @@ Below, you can find the gap analysis between the `OHIF-v2` and `OHIF-v3`:
     </tr>
     <tr>
         <td align="left">Segmentation support</td>
-        <td align="center">🔜</td>
+        <td align="center">✅</td>
         <td align="center">Not Started</td>
     </tr>
     <tr>
@@ -129,7 +129,7 @@ Below, you can find the gap analysis between the `OHIF-v2` and `OHIF-v3`:
     </tr>
     <tr>
         <td align="left">VTK Extension + MIP / MPR layout</td>
-        <td align="center">🔜</td>
+        <td align="center">✅</td>
         <td align="center">3D rendering and 3D annotation tools via Cornerstone3D</td>
     </tr>
     <tr>

platform/docs/docs/resources.md

@@ -11,6 +11,15 @@ and other resources that we have provided to the community in the past:
 
 ## 2022
 
+### OHIF Demo to Interns
+[[Slides]](https://docs.google.com/presentation/d/1a2PkUnqkVMaXaBsuFn7-PPlBJULU3dBwzI_44gKFeYI/edit?usp=sharing)
+
+### SIIM 2022 - Updates from the Imaging Informatics Community
+We participated in the SIIM 2022 conference to give update for the imaging
+informatics community.
+[[Slides]](https://docs.google.com/presentation/d/1EUGaUzQtGhZbZWpGLe6ONqChpVMw9Qr9l3KHODevMow/edit?usp=sharing)
+[[Video]](https://vimeo.com/734463662/dbd5a88371)
+
 ### The Imaging Network Ontario - Remote
 
 The Imaging Network Ontario (ImNO) is an annual symposium that brings together

platform/docs/docusaurus.config.js

@@ -218,7 +218,6 @@ module.exports = {
 
             // We want users to submit doc updates to the upstream/next version!
             // Otherwise we risk losing the update on the next release.
-            const nextVersionDocsDirPath = 'docs';
             return `https://github.com/OHIF/Viewers/edit/v3-stable/platform/docs/docs/${docPath}`;
           },
           showLastUpdateAuthor: true,
@@ -234,11 +233,10 @@ module.exports = {
           //     : undefined,
           versions: {
             current: {
-              label: 'Version 3.1 - Cornerstone3D 🚧',
+              label: 'Version 3.2 - Cornerstone3D Volume API 🚧',
             },
             '2.0': {
               label: 'Version 2.0 - Master branch',
-              //path: `2.0`,
             },
           },
         },

platform/docs/netlify.toml

@@ -16,7 +16,7 @@
 [build.environment]
   # If 'production', `yarn install` does not install devDependencies
   NODE_ENV = "development"
-  NODE_VERSION = "14.19.1"
+  NODE_VERSION = "16.14.0"
   YARN_VERSION = "1.22.5"
   RUBY_VERSION = "2.6.2"
   YARN_FLAGS = "--no-ignore-optional --pure-lockfile"

platform/docs/package.json

@@ -27,14 +27,14 @@
     "write-heading-ids": "docusaurus write-heading-ids"
   },
   "dependencies": {
-    "@docusaurus/core": "2.0.0-beta.20",
-    "@docusaurus/plugin-client-redirects": "2.0.0-beta.20",
-    "@docusaurus/plugin-ideal-image": "2.0.0-beta.20",
-    "@docusaurus/plugin-pwa": "2.0.0-beta.20",
-    "@docusaurus/preset-classic": "2.0.0-beta.20",
-    "@docusaurus/remark-plugin-npm2yarn": "2.0.0-beta.20",
-    "@docusaurus/theme-live-codeblock": "2.0.0-beta.20",
-    "@docusaurus/plugin-google-gtag": "2.0.0-beta.20",
+    "@docusaurus/core": "2.0.1",
+    "@docusaurus/plugin-client-redirects": "2.0.1",
+    "@docusaurus/plugin-ideal-image": "2.0.1",
+    "@docusaurus/plugin-pwa": "2.0.1",
+    "@docusaurus/preset-classic": "2.0.1",
+    "@docusaurus/remark-plugin-npm2yarn": "2.0.1",
+    "@docusaurus/theme-live-codeblock": "2.0.1",
+    "@docusaurus/plugin-google-gtag": "2.0.1",
     "@mdx-js/react": "^1.6.21",
     "@svgr/webpack": "^5.5.0",
     "classnames": "^2.3.1",

platform/docs/versionsArchived.json

@@ -1,4 +1,5 @@
 {
+  "Version 3.1 - Cornerstone3D Basics": "https://62e92bf05fc5050008aa1300--ohif-platform-docs.netlify.app/",
   "Version 3.0 - Cornerstone Legacy": "https://deploy-preview-2791--ohif-platform-docs.netlify.app/",
   "Version 1.0": "https://deploy-preview-2791--ohif-platform-docs.netlify.app/1.0/"
 }

platform/ui/src/components/ImageScrollbar/ImageScrollbar.tsx

@@ -23,7 +23,9 @@ class ImageScrollbar extends PureComponent {
       <div className="scroll">
         <div className="scroll-holder">
           <input
-            className="imageSlider"
+            // adding mousetrap let the mousetrap know about the scrollbar otherwise,
+            // it will not capture the keyboard event
+            className="imageSlider mousetrap"
             style={this.style}
             type="range"
             min="0"

platform/viewer/.webpack/writePluginImportsFile.js

@@ -1,5 +1,6 @@
 const pluginConfig = require('../pluginConfig.json');
 const fs = require('fs');
+const glob = require('glob');
 
 const autogenerationDisclaimer = `
 // THIS FILE IS AUTOGENERATED AS PART OF THE EXTENSION AND MODE PLUGIN PROCESS.
@@ -44,11 +45,12 @@ function getFormattedImportBlock(importLines) {
 }
 
 function getFormattedWindowBlock(addToWindowLines) {
-  let content = "const extensions = [];\n" +
-    "const modes = [];\n" +
-    "const modesFactory = [];\n" +
-    "window.extensions = extensions;\n" +
-    "window.modes = modes;\n\n";
+  let content =
+    'const extensions = [];\n' +
+    'const modes = [];\n' +
+    'const modesFactory = [];\n' +
+    'window.extensions = extensions;\n' +
+    'window.modes = modes;\n\n';
 
   addToWindowLines.forEach(addToWindowLine => {
     content += addToWindowLine;
@@ -58,34 +60,67 @@ function getFormattedWindowBlock(addToWindowLines) {
 }
 
 function getRuntimeLoadModesExtensions() {
-  return "\n\n// Add a dynamic runtime loader\n" +
-    "export default async () => {\n" +
-    " for(const modeFactory of modesFactory) {\n" +
-    "  const newModes = await modeFactory(modes,extensions);\n" +
-    "  newModes.forEach(newMode => modes.push(newMode));\n" +
-    "}\n}\n";
+  return (
+    '\n\n// Add a dynamic runtime loader\n' +
+    'export default async () => {\n' +
+    ' for(const modeFactory of modesFactory) {\n' +
+    '  const newModes = await modeFactory(modes,extensions);\n' +
+    '  newModes.forEach(newMode => modes.push(newMode));\n' +
+    '}\n}\n'
+  );
 }
 
-const createCopyPluginFromExtensions = (SRC_DIR, DIST_DIR, plugins) => {
+const createCopyPluginToDistForLink = (
+  SRC_DIR,
+  DIST_DIR,
+  plugins,
+  folderName
+) => {
+  return plugins
+    .map(plugin => {
+      const from = `${SRC_DIR}/../node_modules/${plugin.packageName}/${folderName}/`;
+      const exists = fs.existsSync(from);
+      return exists
+        ? {
+            from,
+            to: DIST_DIR,
+            toType: 'dir',
+          }
+        : undefined;
+    })
+    .filter(x => !!x);
+};
 
-  return plugins.map(plugin => {
-    const from = `${SRC_DIR}/../node_modules/${plugin.packageName}/public/`;
-    const exists = fs.existsSync(from);
-    return exists ? {
-      from,
-      to: DIST_DIR,
-      toType: 'dir',
-    } : undefined;
-  }
-  ).filter(x => !!x);
-}
+const createCopyPluginToDistForBuild = (
+  SRC_DIR,
+  DIST_DIR,
+  plugins,
+  folderName
+) => {
+  return plugins
+    .map(plugin => {
+      const from = `${SRC_DIR}/../../../node_modules/${plugin.packageName}/${folderName}/`;
+      const exists = fs.existsSync(from);
+      return exists
+        ? {
+            from,
+            to: DIST_DIR,
+            toType: 'dir',
+          }
+        : undefined;
+    })
+    .filter(x => !!x);
+};
 
 function writePluginImportsFile(SRC_DIR, DIST_DIR) {
   let pluginImportsJsContent = autogenerationDisclaimer;
 
   const extensionLines = constructLines(pluginConfig.extensions, 'extensions');
   const modeLines = constructLines(pluginConfig.modes, 'modes');
-  const modesFactoryLines = constructLines(pluginConfig.modesFactory, 'modesFactory');
+  const modesFactoryLines = constructLines(
+    pluginConfig.modesFactory,
+    'modesFactory'
+  );
 
   pluginImportsJsContent += getFormattedImportBlock([
     ...extensionLines.importLines,
@@ -112,17 +147,71 @@ function writePluginImportsFile(SRC_DIR, DIST_DIR) {
     }
   );
 
-  const copyPluginFromExtensions = createCopyPluginFromExtensions(
-    SRC_DIR, DIST_DIR,
+  // Build packages using cli add-mode and add-extension
+  // will get added to the root node_modules, but the linked packages
+  // will be hosted at the viewer node_modules.
+
+  const copyPluginPublicToDistBuild = createCopyPluginToDistForBuild(
+    SRC_DIR,
+    DIST_DIR,
     [
       ...pluginConfig.modesFactory,
       ...pluginConfig.modes,
       ...pluginConfig.extensions,
       ...pluginConfig.umd,
-    ]
-  )
+    ],
+    'public'
+  );
 
-  return copyPluginFromExtensions;
+  const copyPluginPublicToDistLink = createCopyPluginToDistForLink(
+    SRC_DIR,
+    DIST_DIR,
+    [
+      ...pluginConfig.modesFactory,
+      ...pluginConfig.modes,
+      ...pluginConfig.extensions,
+      ...pluginConfig.umd,
+    ],
+    'public'
+  );
+
+  // Temporary way to copy chunks from the dist folder so that the become
+  // available
+  const copyPluginDistToDistBuild = createCopyPluginToDistForBuild(
+    SRC_DIR,
+    DIST_DIR,
+    [
+      ...pluginConfig.modesFactory,
+      ...pluginConfig.modes,
+      ...pluginConfig.extensions,
+      ...pluginConfig.umd,
+    ],
+    'dist'
+  );
+
+  const copyPluginDistToDistLink = createCopyPluginToDistForLink(
+    SRC_DIR,
+    DIST_DIR,
+    [
+      ...pluginConfig.modesFactory,
+      ...pluginConfig.modes,
+      ...pluginConfig.extensions,
+      ...pluginConfig.umd,
+    ],
+    'dist'
+  );
+
+  console.log('copy plugins', [...copyPluginPublicToDistBuild,
+  ...copyPluginPublicToDistLink,
+  ...copyPluginDistToDistBuild,
+  ...copyPluginDistToDistLink,
+  ])
+  return [
+    ...copyPluginPublicToDistBuild,
+    ...copyPluginPublicToDistLink,
+    ...copyPluginDistToDistBuild,
+    ...copyPluginDistToDistLink,
+  ];
 }
 
 module.exports = writePluginImportsFile;

platform/viewer/netlify.toml

@@ -20,7 +20,7 @@
 [build.environment]
   # If 'production', `yarn install` does not install devDependencies
   NODE_ENV = "development"
-  NODE_VERSION = "14.19.1"
+  NODE_VERSION = "16.14.0"
   YARN_VERSION = "1.22.5"
   RUBY_VERSION = "2.6.2"
   YARN_FLAGS = "--no-ignore-optional --pure-lockfile"

platform/viewer/package.json

@@ -62,7 +62,7 @@
     "config-point": "^0.4.8",
     "core-js": "^3.16.1",
     "cornerstone-math": "^0.1.9",
-    "cornerstone-wado-image-loader": "^4.2.0",
+    "cornerstone-wado-image-loader": "^4.2.1",
     "dcmjs": "^0.24.5",
     "detect-gpu": "^4.0.16",
     "dicom-parser": "^1.8.9",
@@ -90,6 +90,7 @@
     "cypress-file-upload": "^3.5.3",
     "identity-obj-proxy": "3.0.x",
     "lodash": "4.17.15",
+    "glob": "^8.0.3",
     "tailwindcss": "2.2.4",
     "terser-webpack-plugin": "^5.1.1",
     "webpack": "^5.50.0",

platform/viewer/pluginConfig.json

@@ -33,10 +33,12 @@
     {
       "packageName": "@ohif/mode-longitudinal",
       "version": "3.0.0"
+    },
+    {
+      "packageName": "@ohif/mode-tmtv",
+      "version": "3.0.0"
     }
   ],
-  "modesFactory": [
-  ],
-  "umd": [
-  ]
+  "modesFactory": [],
+  "umd": []
 }