Merge branch 'main' into sample-data-toggle

Author: zachmullen

.github/workflows/e2e.yml

@@ -10,7 +10,7 @@ jobs:
     name: E2E Testing on ${{ matrix.os }}
     runs-on: ${{ matrix.os }}
     env:
-      DOWNLOAD_TIMEOUT: 60000
+      DOWNLOAD_TIMEOUT: 220000
       VITE_SHOW_SAMPLE_DATA: true
     steps:
       - uses: actions/checkout@v4

.gitignore

@@ -35,3 +35,4 @@ reports
 
 .github/copilot
 CLAUDE.md
+.claude/

CONTRIBUTING.md

@@ -1,46 +1,87 @@
 # Development
 
-Below lists a few commands for building and running a local copy of VolView.
+## Prerequisites
 
-To prepare your environment after cloning the repo, run:
+Before you begin, make sure your environment matches the following versions:
+
+- **Node.js**: >= 18.20.0 (20.x LTS recommended)  
+- **npm**: >= 9.x (npm 10+ works with Node 20)
+
+Check your versions:
+
+```bash
+node --version
+npm --version
+```
+
+> **Tip:** Use `nvm` or `volta` to manage and switch Node.js versions.
 
+For reproducible installs, use:
+
+```bash
+npm ci
 ```
+
+
+---
+
+## Dependencies
+
+Refer to `package.json` for the full list of dependencies and devDependencies.
+
+---
+
+## Setup
+
+To prepare your environment after cloning the repo, run:
+
+```bash
 npm install
 ```
 
+---
+
 ## Compiles and hot-reloads for development
 
-```
+```bash
 npm run dev
 ```
 
+---
+
 ## Compiles and minifies for production
 
-```
+```bash
 npm run build
 ```
 
+---
+
 ## Analyzing the production bundle
 
-You can generate a production bundle and produce a bundle size breakdown report:
+Generate a production bundle and produce a bundle size breakdown report:
 
-```
+```bash
 npm run build:analyze
 ```
 
+---
+
 ## Lints and fixes files
 
-```
+```bash
 npm run lint
 ```
 
+---
+
 ## Testing
 
-```
+```bash
 # unit tests
-npm run test:unit
+npm run test
 
-# e2e tests
+# e2e tests (Chrome)
 npm run test:e2e:chrome
 ```
 
@@ -50,36 +91,38 @@ When adding a new baseline image and test, the image should be pulled from GitHu
 
 #### Run one e2e spec file
 
-```
+```bash
 npm run test:e2e:dev -- -- --spec ./tests/specs/remote-manifest.e2e.ts
 ```
 
+---
+
 ## Developing with VTK.js
 
 Follow these steps to develop against a custom development branch of VTK.js:
 
 1. Build and package VTK.js:
 
-```sh
+```bash
 path/to/vtk-js > npm run build:esm
 ```
 
 2. Create a symbolic link to the VTK.js distribution folder on your local system:
 
-```sh
-> cd path/to/vtk-js/dist/esm
-path/to/vtk-js/dist/esm > npm link
+```bash
+cd path/to/vtk-js/dist/esm
+npm link
 ```
 
 3. Reference the symbolic link in your local VolView build:
 
-```sh
-> cd path/to/VolView
-path/to/VolView > npm link --no-save @kitware/vtk.js
+```bash
+cd path/to/VolView
+npm link --no-save @kitware/vtk.js
 ```
 
 4. Build and run VolView:
 
-```sh
-path/to/VolView > npm run dev
+```bash
+npm run dev
 ```

docs/authentication.md

@@ -4,7 +4,7 @@ VolView itself does not specify any given authentication mechanism to use. How y
 
 ## VolView behind Login Portal
 
-The easiest approach to securing a VolView instance is to host VolView behind an authentication portal. This will secure access to VolView, and allow VolView to automatically use existing user credentials to request protected data.  Often the credentials are stored in a cookie.
+The easiest approach to securing a VolView instance is to host VolView behind an authentication portal. This will secure access to VolView, and allow VolView to automatically use existing user credentials to request protected data. Often the credentials are stored in a cookie.
 
 ## OAuth Tokens via URL
 
@@ -26,4 +26,4 @@ The token URL is expected to return the access token as plaintext, i.e. `text/pl
 By default, VolView will make a `GET` request to the token URL. If another type of request is needed, you can configure it via the `tokenUrlMethod` parameter. For example, to make a `POST` request: `https:/example.com/VolView/?tokenUrl=https://example.com/userToken&tokenUrlMethod=POST`.
 
 > [!NOTE]
-> This requires CORS to be properly configured for the token URL endpoint. See the [CORS](/cors) documentation for more info.
+> This requires CORS to be properly configured for the token URL endpoint. See the [CORS](/cors) documentation for more info.

docs/configuration_file.md

@@ -2,19 +2,19 @@
 
 By loading a JSON file, you can set VolView's configuration:
 
-- Starting view layout (Axial Only, 3D Primary, etc).
+- Starting view layout grid size
 - Labels for tools
 - Visibility of Sample Data section
 - Keyboard shortcuts
 
 ## Starting view layout
 
-The `activeLayout` key has options (Axial Only, 3D Primary, etc.) defined in `config.ts`
+The `gridSize` key sets the initial layout grid as `[width, height]`. For example, `[2, 2]` creates a 2x2 grid of views.
 
 ```json
 {
   "layout": {
-    "activeLayout": "Axial Only"
+    "gridSize": [2, 2]
   }
 }
 ```
@@ -98,7 +98,7 @@ To configure a key for an action, add its action name and the key(s) under the `
     }
   },
   "layout": {
-    "activeLayout": "Axial Only"
+    "gridSize": [1, 1]
   }
 }
 ```
@@ -131,7 +131,7 @@ To configure a key for an action, add its action name and the key(s) under the `
     }
   },
   "layout": {
-    "activeLayout": "Axial Only"
+    "gridSize": [2, 2]
   },
   "dataBrowser": {
     "hideSampleData": false

docs/cors.md

@@ -26,4 +26,4 @@ server {
 
 ## CORS proxy
 
-If you do not control the data server, you can use a CORS proxy. A CORS proxy is a lightweight proxy server that is configured to attach CORS headers to responses originating from the data server.
+If you do not control the data server, you can use a CORS proxy. A CORS proxy is a lightweight proxy server that is configured to attach CORS headers to responses originating from the data server.

docs/deploying_volview.md

@@ -5,7 +5,7 @@ Deploying VolView is straightforward: just take the locally built files in `dist
 As a local example, running `npx serve dist/` will spin up a static file server (running on <http://localhost:3000>) that reads the locally built files from `dist/`.
 
 > [!NOTE]
-> Using `npx serve` is *not* a recommended way to deploy VolView. It is only used to demonstrate how easy it can be to deploy VolView in simple scenarios.
+> Using `npx serve` is _not_ a recommended way to deploy VolView. It is only used to demonstrate how easy it can be to deploy VolView in simple scenarios.
 
 ## Managed Hosting (S3, GCP, etc.)
 
@@ -17,7 +17,7 @@ Please refer to your desired server's documentation on how to serve static files
 
 ### Apache example config
 
-In this apache2 example, the `dist/*` files are located under `/var/www/VolView`, and the domain is `example.com`. This does *not* configure TLS.
+In this apache2 example, the `dist/*` files are located under `/var/www/VolView`, and the domain is `example.com`. This does _not_ configure TLS.
 
 ```
 <VirtualHost *:80>
@@ -28,7 +28,7 @@ In this apache2 example, the `dist/*` files are located under `/var/www/VolView`
 
 ### Nginx example config
 
-In this nginx example, the `dist/*` files are located under `/var/www/VolView`, and the domain is `example.com`. This does *not* configure TLS.
+In this nginx example, the `dist/*` files are located under `/var/www/VolView`, and the domain is `example.com`. This does _not_ configure TLS.
 
 ```
 server {
@@ -43,4 +43,4 @@ server {
 		try_files $uri $uri/ /index.html;
 	}
 }
-```
+```

docs/index.md

@@ -8,33 +8,34 @@ VolView is an open source radiological viewer developed for clinical professiona
 
 Major features of VolView include:
 
-1. **Cinematic Volume Rendering**: Create beautiful renderings and gain new insights into your data with only a few clicks.  VolView provides three cinematic volume rendering modes and intuitive controls for each.  We've also provides simple ways to control lighting and multiple presets to get you started.
+1. **Cinematic Volume Rendering**: Create beautiful renderings and gain new insights into your data with only a few clicks. VolView provides three cinematic volume rendering modes and intuitive controls for each. We've also provides simple ways to control lighting and multiple presets to get you started.
 
-2. **Drag-and-Drop DICOM**: Drag DICOM images onto VolView, and they will be quickly parsed and presented as thumbnails.  Click on a thumbnail, and the data is quickly loaded and presented as 2D slices and a 3D cinematic volume rendering.
+2. **Drag-and-Drop DICOM**: Drag DICOM images onto VolView, and they will be quickly parsed and presented as thumbnails. Click on a thumbnail, and the data is quickly loaded and presented as 2D slices and a 3D cinematic volume rendering.
 
-3. **Annotations and Measures**: We have provided a small set of tools for painting, measuring, and cropping, and we are actively working to expand that toolset.  If you have suggestions for new tools or for improving VolView in general, please leave feedback at our [Issue Tracker](https://github.com/Kitware/VolView/issues).
+3. **Annotations and Measures**: We have provided a small set of tools for painting, measuring, and cropping, and we are actively working to expand that toolset. If you have suggestions for new tools or for improving VolView in general, please leave feedback at our [Issue Tracker](https://github.com/Kitware/VolView/issues).
 
-4. **Simple, Scalable, and Secure**: Simply visit a website to install VolView.  Once it is running, all data handling, processing, and visualization occurs on your machine.  Data you load into VolView never leaves your machine.  And VolView is designed to run on any web browser: from the one on your phone to the one running on your most powerful workstations.  It will take advantage of local GPU resources to accelerate its rendering processes, but if none is available, it will still generate the same high quality renderings, albeit a bit slower.
+4. **Simple, Scalable, and Secure**: Simply visit a website to install VolView. Once it is running, all data handling, processing, and visualization occurs on your machine. Data you load into VolView never leaves your machine. And VolView is designed to run on any web browser: from the one on your phone to the one running on your most powerful workstations. It will take advantage of local GPU resources to accelerate its rendering processes, but if none is available, it will still generate the same high quality renderings, albeit a bit slower.
 
-5. **Foundation for the Future**: VolView is meant to serve as a foundation for your future projects and products.  It is open-source and free for commercial and academic use.  You may modify it yourself, or Kitware can help you customize it to support client-server workflows, provide streamlined interfaces and tools, and carry your brand.
+5. **Foundation for the Future**: VolView is meant to serve as a foundation for your future projects and products. It is open-source and free for commercial and academic use. You may modify it yourself, or Kitware can help you customize it to support client-server workflows, provide streamlined interfaces and tools, and carry your brand.
 
-VolView is **not FDA approved for any purpose**, but Kitware can work with you to create a custom version of VolView and submit it for FDA approval.  For more information, contact [kitware@kitware.com](mailto:kitware@kitware.com).
+VolView is **not FDA approved for any purpose**, but Kitware can work with you to create a custom version of VolView and submit it for FDA approval. For more information, contact [kitware@kitware.com](mailto:kitware@kitware.com).
 
 ## History
 
 VolView version 1.1 was released on Sept. 21, 1999 to provide clinical professionals with an intuitive interface to industry-leading volume rendering capabilities. Built using [VTK](https://vtk.org), it was extremely innovative at the time. It provided interactive volume renderings that did not require dedicated systems purchased for big-name medical device manufacturers. It supported Windows 95/98/NT, Sun, Silicon Graphics and Linux environments, and it provided custom level-of-detail and composite rendering techniques. That version of VolView thrived for over a decade, with the last release in June of 2011. In 2011, open source radiological viewers had become commonplace (many also built using VTK), and we pivoted our attention to 3D Slicer as an advance, community-support, extensible platform for research and clinical application development.
 
-We have released VolView 4.0 in 2022 to again advance the radiological image visualization field.  Built using the javascript version of VTK (i.e., [vtk.js](https://kitware.github.io/vtk-js/index.html)), VolView 4.0 runs in web browsers and provides cinematic volume rendering capabilities that are only broadly available in dedicated systems sold by big-name medical device manufacturers.  We look forward to continuing to use the VolView platform for medical image visualization innovation, with plans to support WebXR for holographic and AR/VR devices as well as companion libraries for advance image analysis (e.g., [itk.wasm](https://github.com/InsightSoftwareConsortium/itk-wasm)) and AI algorithms (e.g., via [MONAI](https://monai.io)).
+We have released VolView 4.0 in 2022 to again advance the radiological image visualization field. Built using the javascript version of VTK (i.e., [vtk.js](https://kitware.github.io/vtk-js/index.html)), VolView 4.0 runs in web browsers and provides cinematic volume rendering capabilities that are only broadly available in dedicated systems sold by big-name medical device manufacturers. We look forward to continuing to use the VolView platform for medical image visualization innovation, with plans to support WebXR for holographic and AR/VR devices as well as companion libraries for advance image analysis (e.g., [itk.wasm](https://github.com/InsightSoftwareConsortium/itk-wasm)) and AI algorithms (e.g., via [MONAI](https://monai.io)).
 
 ## Roadmap
 
 Details and progress on our roadmap are tracked in the VolView issue tracker on Github: https://github.com/Kitware/VolView/issues
 
 Our next major release is planned for March, 2023, and it will support:
-* DICOM Web 
-* DICOM SEG, RT, and SR reading and writing 
-* ITK for image processing
-* Deep learning inference for image analysis
+
+- DICOM Web
+- DICOM SEG, RT, and SR reading and writing
+- ITK for image processing
+- Deep learning inference for image analysis
 
 ## Citation
 
@@ -50,14 +51,13 @@ This work was funded, in part, by the NIH via NIBIB and NIGMS R01EB021396, NIBIB
 
 ## Related Work
 
-Learn about our related works at the following links:
-* Glance: General purpose scientific visualization in web browsers
-    * https://kitware.github.io/glance/index.html
-* 3D Slicer: Desktop (C++ and Python), extensible radiological viewer
-    * https://slicer.org
-* trame: Python framework for quickly creating web application involving server-side rendering and computation.
-    * https://kitware.github.io/trame/index.html
-* itk.wasm: Web-assembly version of ITK for in-browser image segmentation and registration, with outstanding DICOM support.
-    * https://github.com/InsightSoftwareConsortium/itk-wasm
-* vtk.js: A pure javascript library for advanced, interactive, scientific visualization in web browsers.
-    * https://kitware.github.io/vtk-js/index.html
+- Glance: General purpose scientific visualization in web browsers
+  - https://kitware.github.io/glance/index.html
+- 3D Slicer: Desktop (C++ and Python), extensible radiological viewer
+  - https://slicer.org
+- trame: Python framework for quickly creating web application involving server-side rendering and computation.
+  - https://kitware.github.io/trame/index.html
+- itk.wasm: Web-assembly version of ITK for in-browser image segmentation and registration, with outstanding DICOM support.
+  - https://github.com/InsightSoftwareConsortium/itk-wasm
+- vtk.js: A pure javascript library for advanced, interactive, scientific visualization in web browsers.
+  - https://kitware.github.io/vtk-js/index.html

docs/mouse_controls.md

@@ -2,10 +2,10 @@
 
 ## Data management
 
-| Shortcut | Action                |
-| -------- | --------------------- |
-| Ctrl + . | Delete Current Image  |
-| Ctrl + / | Clear all data        |
+| Shortcut | Action               |
+| -------- | -------------------- |
+| Ctrl + . | Delete Current Image |
+| Ctrl + / | Clear all data       |
 
 ## Slice