oc-web-components

Lerna monorepo containing Open Chemistry npm packages.

Table of Contents

• Packages
• Build
• Develop

Packages

@openchemistry/types
@openchemistry/utils
@openchemistry/moljs-es
@openchemistry/molecule-moljs
@openchemistry/molecule-vtkjs
@openchemistry/molecule-menu
@openchemistry/volume-controls
@openchemistry/vibrational-spectrum
@openchemistry/molecule
@openchemistry/energy-plot
@openchemistry/sample-data
@openchemistry/girder-client
@openchemistry/girder-redux
@openchemistry/girder-ui
@openchemistry/rest
@openchemistry/redux
@openchemistry/sagas

@openchemistry/types

• TypeScript interfaces used across all packages.
• Sources and Docs

@openchemistry/utils

• Auxiliary functions to convert and validate cjson data, and components props.
• Sources and Docs

@openchemistry/moljs-es

• Wrapper around 3dmoljs to turn it into an ES6 module.
• Sources and Docs

@openchemistry/molecule-moljs

• A web component to display chemical json data that uses 3dmoljs.
• Sources and Docs

@openchemistry/molecule-vtkjs

• A web component to display chemical json data that uses vtkjs.
• Sources and Docs

@openchemistry/volume-controls

• A web component to visualize and manipulate the color transfer function.
• Sources and Docs

@openchemistry/molecule-menu

• A web component to tweak the visual appearance of the molecular viewers.
• Sources and Docs

@openchemistry/vibrational-spectrum

• A web component to display the vibrational spectrum of a molecule.
• Sources and Docs

@openchemistry/molecule

• A high level web component combining molecule-vtkjs, molecule-moljs, vibrational-spectrum and molecule-menu.
• Sources and Docs

@openchemistry/energy-plot

• A web component to display the free energy of a set of reactions.
• Sources and Docs

@openchemistry/sample-data

• Sample cjson data for demo purposes.
• Sources and Docs

@openchemistry/girder-client

• A utility client to make authenticated HTTP requests to a girder instance.
• Sources and Docs

@openchemistry/girder-redux

• Redux ducks and sagas containing the boilerplate needed to perform various common operations (auth, notifications, ...) on a girder instance.
• Sources and Docs

@openchemistry/girder-ui

• Reusable React UI components to perform common operations (auth, notifications, ...) on an app with a girder server.
• Sources and Docs

@openchemistry/rest

• [LEGACY] A set of function to perform REST calls specific to the mongochem project.
• Sources and Docs

@openchemistry/redux

• [LEGACY] Redux ducks and sagas specific to the mongochem project.
• Sources and Docs

@openchemistry/sagas

• [LEGACY] Redux sagas specific to the mongochem project.
• Sources and Docs

Build

To build all the packages in the monorepo, follow the steps below.

Clone the repository:

git clone git@github.com:OpenChemistry/oc-web-components.git

Install the monorepo dependencies and bootstrap the various packages:

cd oc-web-components
yarn install
yarn run bootstrap

Build the packages:

yarn run build

Develop

To use the local dev version of the Open Chemistry packages within the mongochem project follow the steps below.

NOTE: When linking the packages in development, yarn must be used instead of npm.

Build all the packages in the monorepo. See instructions above.

Create local links for all the packages:

# From the oc-web-components root directory

export OPENCHEMISTRY_PACKAGES=$(ls packages)

for package in $OPENCHEMISTRY_PACKAGES; do \
  cd packages/${package} && \
  yarn unlink && \
  yarn link && \
  cd ../../
done;

Consume the linked packages in the mongochemclient:

# From the mongochemclient root directory

yarn install

for package in $OPENCHEMISTRY_PACKAGES; do \
  yarn link @openchemistry/${package}
done;

yarn run start