http://kelseyrogers.github.io/VizualizationTech/Project%203%20-%20Attractors:Repellers/sketch.js

1
2var particleSystem = [];
3var attractors = [];
4
5function setup() {
6    
7    var canvas = createCanvas(windowWidth, windowHeight);
8    background(0);
9    frameRate(30);
10    
11    colorMode(HSB, 360, 100, 100, 100);
12    
13    var at = new Attractor(createVector(width/2, height/2), 5, true);
14    attractors.push(at);
15    
16    var at = new Attractor(createVector(width/2, height/1.01), 5, true);
17    attractors.push(at);
18    
19    var at = new Attractor(createVector(width/2, height/90), 5, true);
20    attractors.push(at);
21    
22    var at = new Attractor(createVector(width/4, height/90), 5, true);
23    attractors.push(at);
24    
25    var at = new Attractor(createVector(width/4, height/1.01), 5, true);
26    attractors.push(at);
27    
28    var at = new Attractor(createVector(width/4, height/2), 5, false);
29    attractors.push(at);
30    
31    var at = new Attractor(createVector(width/1.25, height/2), 5, false);
32    attractors.push(at);
33    
34    var at = new Attractor(createVector(width/1.25, height/1.01), 5, true);
35    attractors.push(at);
36    
37    var at = new Attractor(createVector(width/1.25, height/90), 5, true);
38    attractors.push(at);
39    
40    var at = new Attractor(createVector(width/1.1, height/2), 5, true);
41    attractors.push(at);
42    
43    var at = new Attractor(createVector(width/1.1, height/1.01), 5, true);
44    attractors.push(at);
45    
46    var at = new Attractor(createVector(width/1.1, height/90), 5, true);
47    attractors.push(at);
48    
49    
50    var at = new Attractor(createVector(width/1.1, height/4), 5, false);
51    attractors.push(at);
52    
53    var at = new Attractor(createVector(width/4, height/4), 5, false);
54    attractors.push(at);
55    
56    var at = new Attractor(createVector(width/1.25, height/4), 5, false);
57    attractors.push(at);
58    
59    var at = new Attractor(createVector(width/2, height/4), 5, false);
60    attractors.push(at);
61    
62    
63    var at = new Attractor(createVector(width/2, height/1.33), 5, false);
64    attractors.push(at);
65    
66    var at = new Attractor(createVector(width/1.25, height/1.33), 5, false);
67    attractors.push(at);
68    
69    var at = new Attractor(createVector(width/1.1, height/1.33), 5, false);
70    attractors.push(at);
71    
72    var at = new Attractor(createVector(width/4, height/1.33), 5, false);
73    attractors.push(at);
74}
75
76function draw(){
77    
78    background(250,100,20,10);
79    
80    blendMode(SCREEN);
81    
82    //background(0);
83    
84    for(var i = particleSystem.length-1; i>=0; i--){         
85        var p = particleSystem[i];
86                                                     
87        if(p.areYouDeadYet()){
88            particleSystem.splice(i, 1);
89        }else{
90            p.update();
91            p.draw();
92        }
93
94    }
95    
96    if(mouseIsPressed){
97        createMightyParticles();
98    }
99    
100    attractors.forEach(function(at){
101        at.update();
102        at.draw();
103        
104    });
105}
106
107
108function windowResized(){
109    resizeCanvas(windowWidth, windowHeight);
110    
111}
112
113var Particle = function(pos, vel, hue){
114    
115    var pos = pos.copy();
116    var vel = vel.copy();
117    var acc = createVector(0, .25)
118    var psize = random(3, 10);
119    var initialLifeSpan = random(500, 500)
120    this.lifeSpan = initialLifeSpan;
121    this.hue = random(hue-15, hue+15);
122    
123    
124    this.update = function(){
125        
126        this.lifeSpan--; //this.lifespan = this.lifespan - 1;
127        
128
129        
130        attractors.forEach(function(A){
131            var att = p5.Vector.sub(A.getPos(), pos); 
132            var distanceSq = att.magSq();
133            if(distanceSq >1){
134                att.div(distanceSq*psize);
135                att.mult(20*A.getStrength());
136                if(A.areYouARepeller()){
137                    att.mult(-1);
138                }
139                acc.add(att);
140            }
141        });
142        
143        vel.add(acc);
144        vel.limit(5);
145        pos.add(vel);
146        acc.mult(0);
147    }
148    
149    this.getPos = function(){
150        return pos.copy();
151    }    
152    
153    this.draw = function(){
154        
155        var transparency = map(this.lifeSpan, 0, initialLifeSpan, 0, 100);
156        //stroke(this.hue, 100, 100, transparency);
157        //line(pos.x, pos.y, pos.x-4*vel.x, pos.y-4*vel.y);
158        noStroke();
159        fill(this.hue, 40, 100, transparency);
160        ellipse(pos.x, 
161                pos.y,                                           
162                psize, 
163                psize);
164    }
165   
166    this.areYouDeadYet = function(){
167        return this.lifeSpan <= 0;
168    }
169    

170    this.getSize = function(){
171        return psize;
172    }
173}
174
175function createMightyParticles(initialPos){
176    
177    var hue = random(210,250);
178    
179    for(var i=0; i<random(50, 100); i++){
180        var pos;
181        if (!initialPos){
182            pos = createVector(mouseX, mouseY);
183        }else{
184            pos = initialPos.copy();
185        }
186        
187        var vel = createVector(0, 1);
188        vel.rotate(random(0, TWO_PI));
189        //vel.mult(random(1, 2));
190
191        var newBorn = new Particle(pos, vel, hue);
192        particleSystem.push(newBorn); 
193    }
194}
195
196function mouseClicked(){
197    createMightyParticles();   
198}
199
200var Attractor = function(pos,s, brepeller){
201    var pos = pos.copy();
202    var strength = s;
203    var repeller = brepeller;
204    var initialX = pos.x;
205    this.draw = function(){
206        noStroke();
207        fill(100, 100, 0, 0);
208        ellipse(pos.x, pos.y, strength, strength);
209    }
210    
211    this.update = function(){
212        pos.x = initialX + map(noise(initialX+frameCount/25), 0, 1, -600, 600);
213    }
214    
215    this.getStrength = function(){
216        return strength;
217    }
218    this.getPos = function(){
219        return pos.copy();
220    }
221    this.areYouARepeller = function(){
222        return repeller;
223    }
224}
225