Particle Hydrodynamic Simulator

by Kyle Bezio

HTML

<canvas id="myCanvas" width="500" height="500" style="border:1px solid #000000;"></canvas>

JavaScript

//Current Version

//Study Material
//http://www.petercollingridge.co.uk/sites/files/peter/particle_tutorial_13.txt
//http://www.petercollingridge.co.uk/sites/files/peter/PyParticles3_0.txt
		//http://vobarian.com/collisions/2dcollisions2.pdf
//https://en.wikipedia.org/wiki/Elastic_collision
//http://www.hakenberg.de/diffgeo/collision_resolution.htm
//http://vobarian.com/bouncescope/
//http://www.beepbox.co/#5s5kbl02e01t7a7g0fj7i1r1w11111411f00000400d11111111c00000000h00000000v00000020o3210b4h4h8y8h4h40014y8x4h4g0h4i8y4h4h000h8y8h4h4p221kNU32ic3p1n1F3k6KORymwt0W0Q3jfyh00kPW2Ce46wd8kQugVoo9OWU60TWg05cu8aCAtc7lieGGG0QPXApagFGHK00kMf9k4a1k4a2iC8A6Me00E8k0E1B1G3B0E000
//https://fontstruct.com/register/

// Dot product -> a · b = |a| × |b| × cos(0) where cos(0) is the angle between vector a and b

//access the canvas
var canvas = document.getElementById('myCanvas');
//access drawing environment
var context = canvas.getContext("2d");
canvas.width = document.body.clientWidth;
canvas.height = document.body.clientHeight;

var canvasWM = canvas.width / 500; //Canvas width multiplier
var canvasHM = canvas.height / 500; //Canvas height multiplier

var particles = [];
var mouseX;
var mouseY;
var clicking = false;
var time = 0;

init();

//Game Variables
var maxParticles = 2000;
var gravity = .02;
var drawSpeed = 30;
var speed = drawSpeed / 30;
var flow = 10; //higher is lower flow
var boundry = "on"; //"on" -- present boundries //"off" -- will leave screen //"return" -- returns to mouse //"loop" -- loops to opposite side of screen //"delete" -- deletes objects off screen **To Be Tested**
var vmod = 3;
var posmod = 40;
var collision = [];

function init() {
		thread = setInterval(simulate, drawSpeed);
}

//rounded rectangle function
function roundedRect(x, y, width, height, radius) {
  context.beginPath();
  context.moveTo(x, y+radius);
  context.lineTo(x, y+height-radius);
  context.arcTo(x, y+height, x+radius, y+height, radius);
  context.lineTo(x+width-radius, y+height);
 ...