ben.burlingham
/
dust
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Goto algo work.

Browse Source
master
Ben Burlingham 8 years ago
parent 74b3480306
commit b861b78fba
6 changed files with 174 additions and 42 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 77
      js/animation.js
  2. 13
      js/animation3a.js
  3. 22
      js/arc.js
  4. 49
      js/bundle.js
  5. 12
      js/index.js
  6. 43
      js/particle.js

77
js/animation.js
Unescape View File

@ -0,0 +1,77 @@
import Rx, { Observable } from 'rxjs';
import Grid from './grid';
import Particle from './particle';
import Controls from './controls';
import { CONTROLS, ENTITIES } from './enums';
function Animation() {
// TODO remove bottom padding from Disqus
// TODO fix "hangup" small radius evade bug
// TODO don't load simulation until requested
// TODO sort out particle nextframe
// TODO ANIM1ab free movement
// TODO ANIM3a streamline updateLeader
// TODO ANIM3b separation
// TODO ANIM3c alignment
};
Animation.prototype.destroy = function() {
}
Animation.prototype.subscriber = function({ key, value }) {
switch(key) {
case CONTROLS.ANIMATING: this.updateAnimating(value); break;
case CONTROLS.COUNT: this.updateCount(value); break;
case CONTROLS.SPEED: this.updateSpeed(value); break;
}
}
Animation.prototype.nextFrame = function() {
this.particles.forEach(p => {
const prevX = p.arc.endX;
const prevY = p.arc.endY;
p.nextFrame();
this.grid.deletePoint({ x: prevX, y: prevY, type: ENTITIES.PARTICLE });
this.grid.setPoint({ x: p.arc.endX, y: p.arc.endY, type: ENTITIES.PARTICLE }, p);
});
}
Animation.prototype.updateAnimating = function(isAnimating) {
this.options.animating = isAnimating;
if (isAnimating) {
const fps$ = Rx.Observable.interval(1000 / 32)
.takeWhile(_ => this.options.animating);
fps$.subscribe(this.nextFrame.bind(this));
}
}
Animation.prototype.updateCount = function(count) {
const bounds = this.container.getBoundingClientRect();
while (this.particles.length > count) {
const p = this.particles.pop();
this.grid.deletePoint({ x: p.arc.endX, y: p.arc.endY, type: ENTITIES.PARTICLE });
p.remove();
}
while (this.particles.length < count) {
const p = new Particle(this.container, bounds, this.options, this.grid);
this.grid.setPoint({ x: p.arc.endX, y: p.arc.endY, type: ENTITIES.PARTICLE }, p);
this.particles.push(p);
}
}
Animation.prototype.updateSpeed = function(value) {
this.options.speed = value;
this.particles.forEach(p => p.updateConfig({ speed: value }));
}
export default Animation;

13
js/animation3a.js
Unescape View File

@ -6,7 +6,6 @@ import { CONTROLS, ENTITIES } from './enums';
function Animation3a() {
this.options = {
cohesion: true,
count: 400,
maxCount: 1000,
showVisionGrid: false,
@ -24,19 +23,7 @@ function Animation3a() {
controls.mount().subscribe(this.subscriber.bind(this));
this.updateAnimating(this.options.animating);
this.updateCount(this.options.count);
// TODO remove bottom padding from Disqus
// TODO fix "hangup" small radius evade bug
// TODO don't load simulation until requested
// TODO sort out particle nextframe
// TODO ANIM1ab free movement
// TODO ANIM3a streamline updateLeader
// TODO ANIM3b separation
// TODO ANIM3c alignment
};
Animation3a.prototype.subscriber = function({ key, value }) {

22
js/arc.js
Unescape View File

@ -10,6 +10,8 @@ const Arc = {
endX: 0,
endY: 0,
length: Random.num(RAD.t90, RAD.t360),
prevEndX: 0,
prevEndY: 0,
radius: Random.num(100, 200),
theta: Random.num(RAD.t90, RAD.t360)
};
@ -41,6 +43,9 @@ const Arc = {
arc.cosTheta = Math.cos(arc.theta);
arc.sinTheta = Math.sin(arc.theta);
arc.prevEndX = arc.endX;
arc.prevEndY = arc.endY;
arc.endX = arc.centerX + arc.radius * arc.cosTheta;
arc.endY = arc.centerY - arc.radius * arc.sinTheta;
@ -122,6 +127,23 @@ const Arc = {
return arc;
},
goto: function (arc, x, y, speed) {
const prevD = Math.pow(Math.pow(x - arc.prevEndX, 2) + Math.pow(y - arc.prevEndY, 2), 0.5);
const currD = Math.pow(Math.pow(x - arc.endX, 2) + Math.pow(y - arc.endY, 2), 0.5);
const ratio = (prevD - currD) / speed;
if (currD < 10) {
throw new Error(`Arc end of (${arc.endX},${arc.endY}) is within 50px of (${x},${y})`);
} else if (ratio < 0.8) {
// arc = (ratio < 0 ? Arc.reverse(arc) : arc);
arc = Arc.changeRadius(arc, 20);
} else {
arc = Arc.changeRadius(arc, 400);
}
return arc;
},
evade: function(arc) {
arc = Arc.changeRadius(arc, 20);
arc.length = 1;

49
js/bundle.js
View File

File diff suppressed because one or more lines are too long

12
js/index.js
Unescape View File

@ -1,10 +1,10 @@
import Rx, { Observable } from 'rxjs';
import Controls from './controls';
// import Animation1a from './animation1a';
// import Animation1b from './animation1b';
import Animation1a from './animation1a';
import Animation1b from './animation1b';
import Animation2a from './animation2a';
import Animation2b from './animation2b';
// import Animation3a from './animation3a';
import Animation3a from './animation3a';
require('../css/reset.scss');
require('../css/index.scss');
@ -12,9 +12,9 @@ require('../css/particle.scss');
require('../css/controls.scss');
window.addEventListener('load', () => {
// new Animation1a();
new Animation1a();
// new Animation1b();
new Animation2a();
new Animation2b();
// new Animation2a();
// new Animation2b();
// new Animation3a();
});

43
js/particle.js
Unescape View File

@ -7,7 +7,7 @@ import Random from './random';
function Particle(parent, bounds, config, globalGrid) {
this.config = Object.assign({}, {
behavior: BEHAVIOR.FREE,
behavior: BEHAVIOR.COHESION,
bounds,
color: Random.color(),
gridSize: 5,
@ -40,8 +40,19 @@ function Particle(parent, bounds, config, globalGrid) {
this.isLeader = false;
this.arc = Arc.create(bounds, this.grids.global);
console.error('starting', this.arc)
this.updateConfig(this.config);
this.nextFrame(globalGrid);
const point = document.createElement('div');
point.style.height = '10px'
point.style.width = '10px'
point.style.background = 'red'
point.style.position = 'absolute'
point.style.left = '200px'
point.style.top = '200px'
this.nodes.parent.appendChild(point);
};
// ===== PROTOTYPE =====
@ -53,22 +64,24 @@ Particle.prototype.remove = function() {
}
Particle.prototype.nextFrame = function() {
this.arc = Arc.step(this.arc, this.config.bounds, this.config.speed);
if (this.leader !== null) {
this.arc = Arc.follow(this.arc, this.leader.arc);
} else if (this.arc.length <= 0 && this.config.randomize) {
this.arc = Arc.randomize(this.arc);
}
this.grids.vision = updateVisionGrid(this.arc, this.config, this.grids);
const { hazards, particles } = look(this.arc, this.grids);
this.arc = Arc.goto(this.arc, 200, 200, this.config.speed)
if (hazards.length > 0) {
this.arc = Arc.evade(this.arc);
}
this.arc = Arc.step(this.arc, this.config.bounds, this.config.speed);
this.updateLeader(particles);
// if (this.leader !== null) {
// this.arc = Arc.follow(this.arc, this.leader.arc);
// } else if (this.arc.length <= 0 && this.config.randomize) {
// this.arc = Arc.randomize(this.arc);
// }
//
// this.grids.vision = updateVisionGrid(this.arc, this.config, this.grids);
// const { hazards, particles } = look(this.arc, this.grids);
//
// if (hazards.length > 0) {
// this.arc = Arc.evade(this.arc);
// }
//
// this.updateLeader(particles);
repaintContainer(this.nodes.container, this.arc);
repaintBody(this.nodes.body, this.arc, this.isLeader);

Write Preview
Loading…
Cancel
Save