A few years ago I built a small OpenGL project where I simulated an animation of mixing liquids; a similar project can be seen here or here (these are 2 youtube videos showing some liquid animations).
My main purpose is to simulate these animations using webGL, JS, CSS or HTML5 in order to use them with Phonegap.
In my project I have set 2 main liquids with different density and different colors in order to test the mixture process. My main goal is to animate the flowing of the 2 liquids and start mixing when the user starts shaking his smartphone (or when the user clicks a button, if we are in a web based application).
During my research, I have collected several physics papers explaining the process. Also I have seen several libraries like Raphael.js or Processing.js, but I am not quite sure which one is better, or where to start, and which one is compatible with Phonegap. Any suggestions, links or references will be great.
There’s an excellent Javascript library wrapping the
webglfunctionality, called three.js.