Flory

A JavaScript library for visualizing educational and scientific molecular dynamic simulations in the browser.

Currently v0.1.4

Flory gives you the ability to easily create and visualize molecular dynamics simulations in the browser with support for streaming remote data sets,defining custom update functions and many other highly useful options.

Ready to go

With built in simulations you can easily create complex simulations from simple building blocks.

Remote stream support*

Using WebSockets or AJAX you can stream live data to visualize remote simulations.

Lightweight

With only Three.js as a dependency, Flory won't conflict with any libraries you're already using.

Extendable

The multi-paradigm design of Flory allows you to easily create custom simulations exactly the way you want.

Fast

Careful attention to coding standards and a grunt build system means that Flory can be optimized for both size and performance, even on mobile.

Full browser support

Visualizations can be shown in any browser with WebGL or HTML5 Canvas support.

Getting started with Flory

In order to use Flory, you must include the JavaScript file on your website.

Downloading the code locally

Currently, Flory is not hosted on a CDN, so you must include the files through your own static file servers.

Download the code from GitHub and copy the dist directory to your project or clone the repo with git clone https://github.com/sabidib/Flory.git
Include the following lines of code in the <head> section of your HTML.
```
<script src="path/to/flory.min.js"></script>
```
Check out the examples page to start using the additional features of Flory.

Build System

Flory uses grunt to build and deploy highly optimized visualizations to the browser.

To build flory by manually first, install the npm packages for grunt with:

npm install
grunt to build the developer library into build/flory.js
grunt --minify to build the minified library build/flory.js.min
Checkout the rest of the build options

Flory Rendering

Flory makes use of a modified Three.js rendering core. This means it can make use of the default WebGL rendering backend or drop down to a canvas renderer depending on browser support.

WebGL Support

WebGL is the default rendering mode for Flory. WebGL enables fast 3-d and 2-d visualization by making use of built-in graphics engines.

WebGL is supported by most of the major browsers on both desktop and mobile.

Canvas Renderer

When WebGL is not available, Flory drops down to a HTML5 canvas renderer engine. The canvas renderer is extremely slow in comparison to the WebGL and it is advised not to use it when WebGL is available.

* soon