-
Notifications
You must be signed in to change notification settings - Fork 0
/
particle-canvas.js
76 lines (63 loc) · 2.45 KB
/
particle-canvas.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
function ParticleCanvas(canvas, mousePosition) {
this.mousePosition = mousePosition;
this.context = canvas.getContext('2d');
this.canvasSize = new Vector(canvas.width, canvas.height);
this.chunkSize = new Vector(100, 100);
this.particleList = [];
this.particleChunkMap = [];
}
ParticleCanvas.prototype = {
get TOTAL_PARTICLE() { return 100; },
getRandomPosition: function () {
return new Vector(Math.random() * this.canvasSize.x, Math.random() * this.canvasSize.y);
},
init: function () {
for (var i = 0; i < this.TOTAL_PARTICLE; i++) {
this.particleList.push(
new Particle(this.getRandomPosition(), this.mousePosition, this.canvasSize,
this.particleChunkMap, this.chunkSize));
}
var totalRow = this.canvasSize.y / this.chunkSize.y;
var totalCol = this.canvasSize.x / this.chunkSize.x;
for (var row = 0; row < totalRow; row++) {
this.particleChunkMap[row] = [];
for (var col = 0; col < totalCol; col++) {
this.particleChunkMap[row][col] = [];
}
}
},
clearChunkMap: function () {
this.particleChunkMap.forEach(function (row) {
row.forEach(function (chunk) {
chunk.splice(0, chunk.length);
});
});
},
setParticleInChunk: function () {
var particleChunkMap = this.particleChunkMap,
chunkSize = this.chunkSize;
this.particleList.forEach(function (particle) {
var row = Math.floor(particle.position.y / chunkSize.y);
var col = Math.floor(particle.position.x / chunkSize.x);
particleChunkMap[row][col].push(particle);
});
},
draw: function (bool) {
//var now = performance.now();
//if (now - lastTime > 1000) {
// console.log(fps);
// fps = 0;
// lastTime = now;
//}
//fps++;
var ctx = this.context;
this.clearChunkMap();
this.setParticleInChunk();
this.particleList.forEach(function (particle) { particle.clear(ctx); });
this.particleList.forEach(function (particle) { particle.update(ctx); });
this.particleList.forEach(function (particle) { particle.draw(ctx); });
this.frameId = requestAnimationFrame(this.draw.bind(this));
}
}
//lastTime = performance.now();
//fps = 0;