08ff214ea6
* init * more shifting * Move @babel dependencies up to workspace root * Begin updating dependent libraries to use sync'd webpack builds w/ watches * Commit changes before a long weekend * Split packages into platform and extensions * Consolidate how/where we specify file/module type entrypoints * Make it possible to pass in extensions as App props * Resolve viewer's modules * Target for UMD bundle * Add Webpack Stylus loader * Provide WebPack build options for microscopy, vtk, and ui * Better entrypoint for extensions * Push changes up to switch PCs * Fix ESM symlink build for Viewers * Shift docs to root * Specify additional lerna config props * Begin providing basic readme info * Rename example extension folder * Shift links to bottom of doc * First attempt at a netlify deploy preview * Attempt to fix deploy preview build * push workspace enabled to initial command; remove second yarn install; use npx to call gitbook cli commands * Try to use global gitbook-cli * Export node_modules path * More agressive with modifying PATH * Follow deploy log output advice * try again to set bin path * Try swapping bash with a new shell * Try bash -l instead of exec bash * Annd let's try again * and again * We may have figured it out johnny, boy * We need to pull cornerstone-wado-image-loader files from hoisted node_modules * Attempt to fix ticks/escapes * Change copy syntax; try running tests on viewers from root for circleci * Lower version to match circleci image * Try alternative jest-canvas-mock location and version file syntax * Run version command instead of calling node directly * Try alternative jest transform * Set path and enable workspaces * Add codecov flags * Use cpx so our copying finishes? * Get all platform unit tests to run * Run and report individually and in parallel * Try once relying on codecov yaml to split w/ flags * Add projects to split by flags * Generate separate reports * Trigger codecov after everything has finished running; these may not support flags * Use recommended flags from issue comments for codecov * Fix typo * Remove clear flag * Shift back to calling codecov from root * Generate example for codecov issue * Try fixing paths * Simplify * Try using codecov orb * Bump circleci version * Upload core and viewer * Use full string paths * Remove individual codecov calls * Fix dir * Combine files before upload * Escape anchors * tryfix syntax * Escape string literal * Combine lines to reduce path * long paths * Use home alias * Fix filename * Try to see the contents of our cat'd file * Also upload `core` * Try running with aliased folder * Fix path; split PR and Merge unit tests into separate jobs * Set default threshold * Fix typo * Changing to scoped package names * Adding note * Catch more updates * chore(release): publish %s [skip ci] - @ohif/extension-cornerstone@0.0.39-alpha.0 - @ohif/extension-dicom-html@0.0.4-alpha.0 - @ohif/extension-dicom-microscopy@0.0.9-alpha.0 - @ohif/extension-dicom-pdf@0.0.8-alpha.0 - @ohif/extension-vtk@0.1.4-alpha.0 - @ohif/core@0.11.1-alpha.0 - @ohif/i18n@0.2.3-alpha.0 - @ohif/ui@0.2.18-alpha.0 - @ohif/viewer@0.0.22-alpha.0 * Clean up primary readme * Support for dev and dev:* commands * Shift build command; satisfy default PWA build * Remove old scripts * Clean up UI to set webpack scripts * Tidy up project links * Clean duplicate code in UI project * Update UI project's docs * Clean up ui and i18n config * Reduce duplicate code in `@ohif/core` * Fix @ohif/ui versions * bump @ohif/core versions * Redux testkit dep * Remove unused/duplicate config files for projects/packages * ohif-core --> @ohif/core * Safer publish command * chore(release): publish %s [skip ci] - @ohif/extension-cornerstone@0.0.39-alpha.1 - @ohif/extension-dicom-html@0.0.4-alpha.1 - @ohif/extension-dicom-microscopy@0.0.9-alpha.1 - @ohif/extension-dicom-pdf@0.0.8-alpha.1 - @ohif/extension-vtk@0.1.4-alpha.1 - @ohif/core@0.11.1-alpha.1 - @ohif/i18n@0.2.3-alpha.1 - @ohif/ui@0.2.18-alpha.1 - @ohif/viewer@0.0.22-alpha.1 * test version bump * Add global prettier config * chore(release): publish %s [skip ci] - @ohif/viewer@0.0.22-alpha.2 * test lerna publish * Update package.jsons * Fix build scripts * catch changes * chore(release): publish %s [skip ci] - @ohif/extension-cornerstone@0.0.39-alpha.2 - @ohif/extension-dicom-html@0.0.4-alpha.2 - @ohif/extension-dicom-microscopy@0.0.9-alpha.2 - @ohif/extension-dicom-pdf@0.0.8-alpha.2 - @ohif/extension-vtk@0.1.4-alpha.2 - @ohif/core@0.11.1-alpha.2 - @ohif/i18n@0.2.3-alpha.2 - @ohif/ui@0.2.18-alpha.2 - @ohif/viewer@0.0.22-alpha.3 * fix eslint issues caused by eslint 6 and our react-app config * Publish with canary tag * chore(release): publish %s [skip ci] - @ohif/extension-cornerstone@0.0.39-alpha.3 - @ohif/extension-dicom-html@0.0.4-alpha.3 - @ohif/extension-dicom-microscopy@0.0.9-alpha.3 - @ohif/extension-dicom-pdf@0.0.8-alpha.3 - @ohif/extension-vtk@0.1.4-alpha.3 - @ohif/core@0.11.1-alpha.3 - @ohif/i18n@0.2.3-alpha.3 - @ohif/ui@0.2.18-alpha.3 - @ohif/viewer@0.0.22-alpha.4 * chore(release): publish %s [skip ci] - @ohif/extension-cornerstone@0.0.39-alpha.4 - @ohif/extension-dicom-html@0.0.4-alpha.4 - @ohif/extension-dicom-microscopy@0.0.9-alpha.4 - @ohif/extension-dicom-pdf@0.0.8-alpha.4 - @ohif/extension-vtk@0.1.4-alpha.4 - @ohif/core@0.11.1-alpha.4 - @ohif/i18n@0.2.3-alpha.4 - @ohif/ui@0.2.18-alpha.4 - @ohif/viewer@0.0.22-alpha.5 * Simplify build * chore(release): publish %s [skip ci] - @ohif/extension-cornerstone@0.0.39-alpha.5 - @ohif/extension-dicom-html@0.0.4-alpha.5 - @ohif/extension-dicom-microscopy@0.0.9-alpha.5 - @ohif/extension-dicom-pdf@0.0.8-alpha.5 - @ohif/extension-vtk@0.1.4-alpha.5 - @ohif/core@0.11.1-alpha.5 - @ohif/i18n@0.2.3-alpha.5 - @ohif/ui@0.2.18-alpha.5 - @ohif/viewer@0.0.22-alpha.6 * chore(release): publish %s [skip ci] - @ohif/extension-cornerstone@0.0.39-alpha.6 - @ohif/extension-dicom-html@0.0.4-alpha.6 - @ohif/extension-dicom-microscopy@0.0.9-alpha.6 - @ohif/extension-dicom-pdf@0.0.8-alpha.6 - @ohif/extension-vtk@0.1.4-alpha.6 - @ohif/core@0.11.1-alpha.6 - @ohif/i18n@0.2.3-alpha.6 - @ohif/ui@0.2.18-alpha.6 - @ohif/viewer@0.0.22-alpha.7 * Split version and publish * chore(release): publish %s [skip ci] - @ohif/extension-cornerstone@0.0.39-alpha.7 - @ohif/extension-dicom-html@0.0.4-alpha.7 - @ohif/extension-dicom-microscopy@0.0.9-alpha.7 - @ohif/extension-dicom-pdf@0.0.8-alpha.7 - @ohif/extension-vtk@0.1.4-alpha.7 - @ohif/core@0.11.1-alpha.7 - @ohif/i18n@0.2.3-alpha.7 - @ohif/ui@0.2.18-alpha.7 - @ohif/viewer@0.0.22-alpha.8 * Try simplify netlify build * react-viewerbase --> @ohif/ui * add test for stylus loader * Try new way to specify publish path * Use an output folder that won't be ignored * Try move command * fiddle with paths * Dig for some information * Make sure we're in root for our commands * Remove discovery * Setup script-tag example * Fix typo * Move config folder * Update cornerstone extension to use shared/root webpack configs * capture changes * Update extension webpack configs * Don't check in docz output * Fix babel runtime resolution issue * Simplify ui build steps * Push in progress * Shift directories * Get viewer dev path to work * Fix viewer commonjs build * Fix build pwa config for viewers * Make sure our package specific command can be called from root * Update notes * Fix imports and misc. merge notes * Bump wado-image-loader version * Switch up commands to remove webworkers copy * Fix CI config * Fix more broken package references * Add react-dropzone * Persist so e2e test can use * Fix lockfile * Use cypress orb to simplify CI * Fix config * Try again * Install yarn latest for orb * Install yarn a different way * Wait on correct port * Run tests in viewer project * Fix cypress config * Make Cypress happier - use default location * Simplify e2e testing * Capture UI changes since fork * Catch core up * Grab latest deps after merge * Fix broken import * Make sure cornerstone-wado-image-loader resolves to 3+ * Note regarding orbs * Fix refresh on 404 routes * Fix odd error for cornerstone-wado-image-loader * Different target for UMD * Simplify dev script * Try to get fancy with netlify output * Let's do it again * Try to fix measurementTools issue * See if we can get our lerna magic to work on merge to monorepo branch
110 lines
4.2 KiB
Markdown
110 lines
4.2 KiB
Markdown
# Architecture
|
|
|
|
Looking to extend your instance of the OHIF Viewer? Want learn how to reuse _a
|
|
portion_ of the Viewer in your own application? Or maybe you want to get
|
|
involved and draft or suggest a new feature? Regardless, you're in the right
|
|
place!
|
|
|
|
The OHIF Viewer aims to be decoupled, configurable, and extensible; while this
|
|
allows our code to be used in more ways, it also increases complexity. Below, we
|
|
aim to demistify that complexity by providing insight into how our Viewer is
|
|
architected, and the role each of it's dependent libraries plays.
|
|
|
|
## Overview
|
|
|
|
The [`OHIF/Viewers`][viewers-project] project contains the source code for the
|
|
OHIF Medical Imaging Viewer. It is effectively a React [progressive web
|
|
app][pwa] (PWA) that combines the business logic housed in
|
|
[`OHIF/ohif-core`][core] and the components in our React Component library
|
|
[`OHIF/react-viewerbase`][component-library]. It provides customization for
|
|
common use cases through [configuration][configuration] and for adding
|
|
functionality via [extensions][extensions].
|
|
|
|
### Business Logic
|
|
|
|
Our goal is to maintain the majority of our business logic in
|
|
[`OHIF/ohif-core`](https://github.com/OHIF/ohif-core). `ohif-core` offers
|
|
pre-packaged solutions for features common to Web-based medical imaging viewers.
|
|
For example:
|
|
|
|
- Hotkeys
|
|
- DICOM Web
|
|
- Hanging Protocols
|
|
- Managing a study's measurements
|
|
- Managing a study's DICOM metadata
|
|
- A flexible pattern for extensions
|
|
- [And many others](https://github.com/OHIF/ohif-core/blob/master/src/index.js#L49-L69)
|
|
|
|
It does this while remaining decoupled from any particular view library or
|
|
rendering logic. While we use it to power our React Viewer, it can be used with
|
|
Vue, React, Vanilla JS, or any number of other frameworks.
|
|
|
|
### React Component Library
|
|
|
|
[`OHIF/react-viewerbase`](https://github.com/OHIF/react-viewerbase) is a React
|
|
Component library that contains the reusable components that power the OHIF
|
|
Viewer. It allows us to build, compose, and test components in isolation; easing
|
|
the development process by reducing the need to stand-up a local PACS with test
|
|
case data.
|
|
|
|
[Check out our component library!](https://react.ohif.org/)
|
|
|
|
### Misc. Extensions
|
|
|
|
Want to add custom logic or UI Components to the OHIF Viewer, but don't want to
|
|
maintain a fork? We expose common integration points via
|
|
[extensions](./extensions.md) to make that possible. For a list of extensions
|
|
maintained by OHIF,
|
|
[check out this helpful table](./extensions.html#ohif-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
|
|
looking for ways to improve our extensibility ^\_^
|
|
|
|
[Click here to read more about extensions!](./extensions.md)
|
|
|
|
### Diagram
|
|
|
|
This diagram is a conceptual illustration of how the Viewer is architected.
|
|
|
|
1. (optional) `extensions` can be registered with `ohif-core`'s extension
|
|
manager
|
|
2. `ohif-core` provides bussiness logic and a way for `viewer` to access
|
|
registered extensions
|
|
3. The `viewer` composes and provides data to components from our component
|
|
library (`react-viewerbase`)
|
|
4. The `viewer` can be built and served as a stand-alone PWA, or as an
|
|
embeddable package
|
|
([`ohif-viewer`](https://www.npmjs.com/package/ohif-viewer))
|
|
|
|
|
|
|
|
<center><i>architecture diagram</i></center>
|
|
|
|
## Common Questions
|
|
|
|
> When should I use the packaged source `ohif-viewer` versus building a PWA from
|
|
> the source?
|
|
|
|
...
|
|
|
|
> Can I create my own Viewer using Vue.js or Angular.js?
|
|
|
|
You can, but you will not be able to leverage as much of the existing code and
|
|
components. `ohif-core` could still be used for business logic, and to provide a
|
|
model for extensions. `react-viewerbase` would then become a guide for the
|
|
components you would need to recreate.
|
|
|
|
<!--
|
|
Links
|
|
-->
|
|
|
|
<!-- prettier-ignore-start -->
|
|
[viewers-project]: https://github.com/OHIF/Viewers
|
|
[pwa]: https://developers.google.com/web/progressive-web-apps/
|
|
[core]: https://github.com/OHIF/ohif-core
|
|
[component-library]: https://github.com/OHIF/react-viewerbase
|
|
[configuration]: ../essentials/configuration.md
|
|
[extensions]: ./extensions.m
|
|
<!-- prettier-ignore-end -->
|