canvas = document.getElementById('canvas')
ctx = canvas.getContext('2d')
ctx.globalCompositeOperation = 'lighter'

var resize = function () {
	ctx.canvas.width = window.innerWidth
	ctx.canvas.height = window.innerHeight
}
resize()
window.addEventListener('resize', resize)

Particle = function (opacity, oFade, size, sFade, innerSizeFactor, x, ySpeed, ySpeedFade, xSpeed, xSpeedFade) {
	this.d = false
	this.o = opacity
	this.oF = oFade
	this.s = size
	this.sF = sFade
	this.iSF = innerSizeFactor
	this.iS = this.s * this.iSF
	this.x = x
	this.xS = xSpeed
	this.xSF = xSpeedFade
	this.yS = ySpeed
	this.ySF = ySpeedFade
	this.y = ctx.canvas.height
}
Particle.prototype.update = function () {
	if (this.d == false) {
		var o = this.o - this.oF * dt
		if (o < 0) {
			this.d = true
		} else {
			this.o = o
		}
		var s = this.s - this.sF * dt
		if (s < 0) {
			this.d = true
		} else {
			this.s = s
		}
		this.iS -= this.sF * this.iSF * dt
		this.yS -= this.ySF * dt
		this.xS -= this.xSF * dt
		this.x -= this.xS * dt
		this.y -= this.yS * dt
	}
}
Particle.prototype.draw = function () {
	if (this.d == false) {
		ctx.setTransform(1, 0, 0, 1, this.x, this.y)
		var grd = ctx.createRadialGradient(this.s, this.s, this.iS, this.s, this.s, this.s)
		ctx.globalAlpha = this.o
		grd.addColorStop(0, '#fa631a')
		grd.addColorStop(1, 'rgba(255,255,255,0)')
		ctx.fillStyle = grd
		ctx.fillRect(0, 0, this.s * 2, this.s * 2)
	}
}
window.requestAnimationFrame = window.requestAnimationFrame || window.mozRequestAnimationFrame ||
	window.webkitRequestAnimationFrame || window.msRequestAnimationFrame

var t, dt, to,
	particles = [],
	n = 0

loop = function () {
	n += 1
	t = performance.now()
	dt = t - to
	to = t
	for (var i = 0; i < canvas.width / 200; i++) {
		particles.push(new Particle(
			Math.random() * 8 + 0.01, //opacity
			Math.random() * 0.0001, //oFade
			Math.random() * 5, //size
			Math.random() * 0.003 + 0.002, //sFade
			Math.random() * 0.5, //innerSizeFactor
			Math.random() * canvas.width, //x
			Math.random() * 0.1 + 0.08, //ySpeed
			Math.random() * 0.00001, //ySpeedFade
			Math.random() * -0.2, //xSpeed
			Math.random() * 0.00006 - 0.00003 //xSpeedFade
		))
	}
	while (particles.length > 200) {
		particles.shift()
	}
	ctx.setTransform(1, 0, 0, 1, 0, 0)
	ctx.clearRect(0, 0, canvas.width, canvas.height)
	for (var i = 0; i < particles.length; i++) {
		particles[i].draw()
	}
	for (var i = 0; i < particles.length; i++) {
		particles[i].update()
	}
	window.requestAnimationFrame(loop)
}

to = performance.now()
window.requestAnimationFrame(loop)