diff --git a/README.md b/README.md index 7c6ef7c9..8311af1c 100644 --- a/README.md +++ b/README.md @@ -1,43 +1,73 @@ # Miew – 3D Molecular Viewer -> ⚠ It seems that experiments over recent years have led to application instability. We decided -> to step back and proceed with architectural changes slowly. We apologize for any inconvenience -> it may cause during the transition period. The old "master" branch is kept for your reference. -> This is the new "main" branch for further development 🚀 - - -[![Build Status](https://img.shields.io/appveyor/ci/paulsmirnov/miew/main.svg)](https://ci.appveyor.com/project/paulsmirnov/miew/branch/main) +[![Build Status](https://img.shields.io/github/actions/workflow/status/epam/miew/ci.yml?label=linux)](https://github.com/epam/miew/actions?query=branch%3Amain) +[![AppVeyor Build Status](https://img.shields.io/appveyor/ci/paulsmirnov/miew/main?label=windows)](https://ci.appveyor.com/project/paulsmirnov/miew) [![Version](https://img.shields.io/npm/v/miew)](https://www.npmjs.com/package/miew?activeTab=versions) [![Downloads](https://img.shields.io/npm/dm/miew)](https://www.npmjs.com/package/miew?activeTab=versions) [![License](https://img.shields.io/badge/license-MIT-green)](./LICENSE.md) -Copyright (c) 2015–2024 [EPAM Systems, Inc.](https://www.epam.com/) - -Miew is a high performance web tool for advanced visualization and manipulation of molecular -structures. +Miew is a high performance web tool for advanced visualization and manipulation +of molecular structures. It provides a full-featured set of tools for 3D visualization and editing +of small molecules as well as large molecular complexes, including means to view, analyze, +and modify the 3D structure of a molecule. ![Screenshot](README.png) -It provides a full-featured set of tools for 3D visualization and editing of small molecules as -well as large molecular complexes, including means to view, analyze, and modify the 3D structure -of a molecule. +It works as a standalone web application or integrates as a component into your web pages. +We plan to support the [latest versions](https://browsehappy.com/) +of WebGL-enabled desktop (Chrome, Firefox, Safari, Edge) and mobile (iOS, Android) browsers. + +## Project Structure + +- [miew] - the core JavaScript library including docs, examples, and the demo application, +- [miew-react] - a simple React.js wrapper component, +- [miew-app] - a new demo application (work in progress). -It works as a standalone HTML5 web application or integrates as a component into -your web pages. We plan to support the [latest versions](https://browsehappy.com/) of WebGL-enabled desktop (Chrome, -Firefox, Safari, Opera, Edge) and mobile (iOS, Android) browsers. +[miew]: packages/miew#readme +[miew-react]: packages/miew-react#readme +[miew-app]: packages/miew-app#readme -You can find details on installation and usage of Miew component in the [library readme]. -There is also a [demo application] available in the git repository. +## Installation and Usage -[tutorials]: docs/tutorials/embed.md -[examples]: examples/ -[library readme]: packages/miew/README.md -[demo application]: https://miew.opensource.epam.com/ +The demo application is available at and . -## Contributing +The library is published as an npm package. The easiest way to start using the viewer +is to reference a CDN version: -Please read [CONTRIBUTING.md](CONTRIBUTING.md) for details on our code of conduct, and the process for submitting pull requests to us. +```html + + + + + + + + + + +
+ + + + +``` + +For more details please refer to the corresponding README files ([miew] and [miew-react]). + +## Contribution + +Please read [CONTRIBUTING.md](CONTRIBUTING.md) for details on our code of conduct, and the process +for submitting pull requests. ## License [MIT](LICENSE.md) + +Copyright (c) 2015–2024 [EPAM Systems, Inc.](https://www.epam.com/) diff --git a/README.png b/README.png index 7b4f3f29..dd6d64dd 100644 Binary files a/README.png and b/README.png differ diff --git a/packages/miew-app/README.md b/packages/miew-app/README.md new file mode 100644 index 00000000..dca12b78 --- /dev/null +++ b/packages/miew-app/README.md @@ -0,0 +1,21 @@ +# miew-app + +Miew is a high performance web tool for advanced visualization and manipulation +of molecular structures. + +The `miew-app` package is an attempt to recreate a demo application using React.js. +Please refer to the topmost [README][] for an overview of the entire project. + +[README]: https://github.com/epam/miew#readme + +![Screenshot](README.png) + +## Contribution + +Please read [CONTRIBUTING.md](../../CONTRIBUTING.md) for details on our code of conduct, and the process for submitting pull requests. + +## License + +[MIT](../../LICENSE.md) + +Copyright (c) 2015–2024 [EPAM Systems, Inc.](https://www.epam.com/) diff --git a/packages/miew-app/README.png b/packages/miew-app/README.png new file mode 100644 index 00000000..dd6d64dd Binary files /dev/null and b/packages/miew-app/README.png differ diff --git a/packages/miew-react/README.md b/packages/miew-react/README.md index dc00ce57..35b459ac 100644 --- a/packages/miew-react/README.md +++ b/packages/miew-react/README.md @@ -1,49 +1,70 @@ # miew-react -[![npm version](https://img.shields.io/npm/v/miew-react)](https://www.npmjs.com/package/miew-react) -[![Downloads](https://img.shields.io/npm/dm/miew-react)](https://www.npmjs.com/package/miew-react) -[![License](https://img.shields.io/badge/MIT%20-blue.svg)](https://opensource.org/licenses/MIT) +[![Version](https://img.shields.io/npm/v/miew-react)](https://www.npmjs.com/package/miew-react?activeTab=versions) +[![Downloads](https://img.shields.io/npm/dm/miew-react)](https://www.npmjs.com/package/miew-react?activeTab=versions) +[![License](https://img.shields.io/badge/license-MIT-green)](./LICENSE.md) -Copyright (c) 2015–2024 [EPAM Systems, Inc.](https://www.epam.com/) - -Miew is a high performance web library for advanced visualization and manipulation of molecular structures. - -For more details please look at the following [link](https://github.com/epam/miew). +Miew is a high performance web tool for advanced visualization and manipulation +of molecular structures. -The miew-react package contains only the functionality necessary to define components. It is used together with [miew](https://www.npmjs.com/package/miew). +The `miew-react` package contains only a React.js wrapper component. +Please refer to the topmost [README][] for an overview of the entire project. -## Installation +[README]: https://github.com/epam/miew#readme -The miew-react library is available as an [NPM](https://www.npmjs.com/) package. Install it either with NPM: +![Screenshot](README.png) -```sh -npm install --save miew-react -``` +## Installation and Usage -or [Yarn](https://yarnpkg.com/): +The component is available as an [npm package](https://www.npmjs.com/package/miew-react). ```sh -yarn add miew-react +npm i --save miew-react ``` -## Usage +index.jsx ```js +import React from 'react'; +import ReactDOM from 'react-dom/client'; import Viewer from 'miew-react'; -const MyComponent = () => { - return ; -}; +ReactDOM.createRoot(document.getElementById('root')).render( + + + , +); +``` + +index.html (e.g., using Vite) + +```html + + + + + + +
+ + + ``` ### Props -Imported component accepts the following optional props: +The component accepts the following optional props: - **onInit**: a callback function which recieves an instance of Miew, and called after initialization of Miew instance inside the Viewer component. With a help of this prop you can access Miew methods and fields. - **options**: an object containing representation settings for Miew and initial structure to be shown (all the fields are also optional, when not provided, default settings are applied) - **theme**: ignored +## Contribution + +Please read [CONTRIBUTING.md](../../CONTRIBUTING.md) for details on our code of conduct, and the process for submitting pull requests. + ## License [MIT](LICENSE.md) + +Copyright (c) 2015–2024 [EPAM Systems, Inc.](https://www.epam.com/) diff --git a/packages/miew-react/README.png b/packages/miew-react/README.png new file mode 100644 index 00000000..587cf2e5 Binary files /dev/null and b/packages/miew-react/README.png differ diff --git a/packages/miew/LICENSE.md b/packages/miew/LICENSE.md new file mode 100644 index 00000000..0fc546d1 --- /dev/null +++ b/packages/miew/LICENSE.md @@ -0,0 +1,21 @@ +The MIT License + +Copyright (c) 2015-2024 [EPAM Systems, Inc.](https://www.epam.com/) + +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. diff --git a/packages/miew/README.md b/packages/miew/README.md index 33ecd2bd..e6fe5abf 100644 --- a/packages/miew/README.md +++ b/packages/miew/README.md @@ -1,65 +1,104 @@ -# Miew – 3D Molecular Viewer +# miew -[![Build Status](https://img.shields.io/appveyor/ci/paulsmirnov/miew/main.svg)](https://ci.appveyor.com/project/paulsmirnov/miew/branch/main) [![Version](https://img.shields.io/npm/v/miew)](https://www.npmjs.com/package/miew?activeTab=versions) [![Downloads](https://img.shields.io/npm/dm/miew)](https://www.npmjs.com/package/miew?activeTab=versions) [![License](https://img.shields.io/badge/license-MIT-green)](./LICENSE.md) -Copyright (c) 2015–2024 [EPAM Systems, Inc.](https://www.epam.com/) +Miew is a high performance web tool for advanced visualization and manipulation +of molecular structures. -Miew is a high performance web library for advanced visualization and manipulation of molecular -structures. +The `miew` package is the core JavaScript library that implements the functionality. +Please refer to the topmost [README][] for an overview of the entire project. -![Screenshot](README.png) +[README]: https://github.com/epam/miew#readme -It provides a full-featured set of tools for 3D visualization and editing of small molecules as -well as large molecular complexes, including means to view, analyze, and modify the 3D structure -of a molecule. It integrates as a component into your web pages. +![Screenshot](README.png) ## Installation and Usage -Miew library is available as an [NPM] package. Install it either with NPM: - -```sh -npm install --save miew +Miew library is available as an [npm package](https://www.npmjs.com/package/miew). +It provides both UMD and ES2015 modules, so can be included in a SCRIPT tag via a CDN +or built with a bundler of your choice. For more details refer to: + +- [tutorials](docs/tutorials/), +- [examples](examples/). + +### SCRIPT tag + +```html + + + + + + + + + + +
+ + + + ``` -or [Yarn]: +### Webpack + +Install using npm: ```sh -yarn add miew +npm i --save miew ``` -Then use it in your [Webpack] / [Browserify] / [Rollup] setup, or just test it right in the Node -environment. +index.js ```js -var Miew = require('miew'); -console.log(Miew.VERSION); +import Miew from 'miew'; +import './index.css'; + +window.onload = function () { + var viewer = new Miew({ load: '1CRN' }); + if (viewer.init()) { + viewer.run(); + } +}; ``` -You may also download the [minified library](dist/Miew.min.js) and access it from the browser's -` + + +
+ + +``` -## Contributing +## Contribution -Please read [CONTRIBUTING.md](../../CONTRIBUTING.md) for details on our code of conduct, and the process for submitting pull requests to us. +Please read [CONTRIBUTING.md](../../CONTRIBUTING.md) for details on our code of conduct, and the process for submitting pull requests. ## License -[MIT](../../LICENSE.md) +[MIT](LICENSE.md) + +Copyright (c) 2015–2024 [EPAM Systems, Inc.](https://www.epam.com/) diff --git a/packages/miew/README.png b/packages/miew/README.png index b91a2fb3..587cf2e5 100644 Binary files a/packages/miew/README.png and b/packages/miew/README.png differ