import Rx, { Observable } from 'rxjs'; import Grid from './grid'; import Particle from './particle'; import Controls from './controls'; import { CONTROLS, ENTITIES } from './enums'; function Animation3a() { this.options = { cohesion: true, count: 10, maxCount: 1000, showVisionGrid: false, speed: 4 }; this.container = document.getElementById('animation3a'); this.particles = []; this.globalGrid = new Grid(); const controls = new Controls( document.getElementById('controls3a'), this.options ); controls.mount().subscribe(this.subscriber.bind(this)); this.updateAnimating(this.options.animating); this.updateCount(this.options.count); // TODO get "top" leader, once...don't update each time? // TODO if leader sees follower, assign to this leader? // TODO remove bottom padding from Disqus // TODO ANIM2ab randomize hazards // TODO fix "hangup" small radius evade bug // TODO ANIM3a perf Scale vision grid to 1000 particles // TODO hazard grid, particles grid // TODO completely seal Particle // TODO ANIM3a cohesion // TODO ANIM3b separation // TODO ANIM3c alignment }; Animation3a.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; } } Animation3a.prototype.nextFrame = function() { this.particles.forEach(p => { const prevX = p.arc.endX; const prevY = p.arc.endY; p.nextFrame(this.globalGrid); this.globalGrid.deletePoint({ x: prevX, y: prevY, type: ENTITIES.PARTICLE }); this.globalGrid.setPoint({ x: p.arc.endX, y: p.arc.endY, type: ENTITIES.PARTICLE }, p); }); } Animation3a.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)); } } Animation3a.prototype.updateCount = function(count) { const bounds = this.container.getBoundingClientRect(); while (this.particles.length > count) { delete this.particles.pop().remove(); } while (this.particles.length < count) { const p = new Particle(this.container, bounds, this.options, this.globalGrid); this.particles.push(p); } } Animation3a.prototype.updateSpeed = function(value) { this.options.speed = value; this.particles.forEach(p => p.updateConfig({ speed: value })); } export default Animation3a;