<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<link href='https://fonts.googleapis.com/css?family=Ubuntu:400,300' rel='stylesheet' type='text/css'>
<div class="loader">
<canvas width="480px" height="480px" id="loader"></canvas>
<h1>Loading</h1>
</div>
<script>
Loadr = new (function Loadr(id){
const max_size = 24;
const max_particles = 1500;
const min_vel = 20;
const max_generation_per_frame = 10;
var canvas = document.getElementById(id);
var ctx = canvas.getContext('2d');
var height = canvas.height;
var center_y = height/2;
var width = canvas.width;
var center_x = width / 2;
var animate = true;
var particles = [];
var last = Date.now(),now = 0;
var died = 0,len = 0,dt;
function isInsideHeart(x,y){
x = ((x - center_x) / (center_x)) * 3;
y = ((y - center_y) / (center_y)) * -3;
var x2 = x * x;