diff --git a/css/particle.scss b/css/particle.scss index e7c438e..58f14b3 100644 --- a/css/particle.scss +++ b/css/particle.scss @@ -24,7 +24,7 @@ $visionS: 100px; } .particle-vision { - // background: #ddd; + // background: #f0f0f0; height: $visionS; left: -$visionS / 2; position: absolute; diff --git a/js/animation2a.js b/js/animation2a.js index b13c305..33faf3f 100644 --- a/js/animation2a.js +++ b/js/animation2a.js @@ -38,7 +38,7 @@ function Animation2a() { // TODO ANIM2a Vision grid touches trig transform // TODO ANIM2a randomize hazards // TODO ANIM2 particle evade - // TODO ANIM2b Scale vision grid to 1000? particles + // TODO ANIM2b Scale vision grid to 1000 particles // TODO ANIM3 flocking }; diff --git a/js/bundle.js b/js/bundle.js index 2185a34..073aee4 100644 --- a/js/bundle.js +++ b/js/bundle.js @@ -472,7 +472,7 @@ eval("\nvar isArray_1 = __webpack_require__(/*! ../util/isArray */ 11);\nfunctio /***/ (function(module, exports, __webpack_require__) { "use strict"; -eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\n\nvar _rxjs = __webpack_require__(/*! rxjs */ 14);\n\nvar _rxjs2 = _interopRequireDefault(_rxjs);\n\nvar _enums = __webpack_require__(/*! ./enums */ 16);\n\nvar _store = __webpack_require__(/*! ./store */ 22);\n\nvar _store2 = _interopRequireDefault(_store);\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nvar random = {\n bool: function bool(weight) {\n return Math.random() < (weight || 0.5);\n },\n color: function color() {\n return 'rgb(' + Math.floor(Math.random() * 255) + ', ' + Math.floor(Math.random() * 255) + ', ' + Math.floor(Math.random() * 255) + ')';\n },\n num: function num(min, max) {\n return min + Math.round(Math.random() * max);\n }\n};\n\n// ===== Constructor =====\n\nfunction Particle(parent, bounds, config, globalGrid) {\n this.config = Object.assign({\n bounds: bounds,\n color: random.color(),\n gridSize: 5,\n randomize: false,\n showMovementCircle: false,\n showVisionGrid: false,\n speed: 4,\n visionRadius: 50\n }, config);\n\n this.grids = {\n global: globalGrid || {},\n vision: createVisionGrid(this.config)\n };\n\n this.arc = {\n centerX: random.num(0, bounds.width),\n centerY: random.num(0, bounds.height),\n clockwise: random.bool(),\n endX: 0,\n endY: 0,\n length: random.num(_enums.RAD.t90, _enums.RAD.t360),\n radius: random.num(100, 200),\n theta: random.num(_enums.RAD.t90, _enums.RAD.t360)\n };\n\n this.nodes = {\n body: createBodyNode(this.config),\n circle: undefined,\n container: createContainerNode(this.config),\n parent: parent,\n vision: undefined,\n visionGrid: undefined\n };\n\n this.nodes.container.appendChild(this.nodes.body);\n parent.appendChild(this.nodes.container);\n\n this.updateConfig(this.config);\n this.nextFrame();\n};\n\n// ===== PROTOTYPE =====\n\nParticle.prototype.remove = function () {\n this.nodes.parent.removeChild(this.nodes.container);\n return this;\n};\n\nParticle.prototype.nextFrame = function () {\n this.arc = updateArc(this.arc, this.config);\n this.grids.vision = updateVisionGrid(this.arc, this.grids);\n\n repaintContainer(this.nodes.container, this.arc);\n repaintBody(this.nodes.body, this.arc);\n repaintCircle(this.nodes.circle, this.arc);\n repaintVision(this.nodes.vision, this.arc);\n repaintVisionGrid(this.nodes.visionGrid, this.grids, this.config);\n};\n\nParticle.prototype.updateConfig = function (config) {\n Object.assign(this.config, config);\n\n var _config = this.config,\n showMovementCircle = _config.showMovementCircle,\n showVisionGrid = _config.showVisionGrid;\n\n\n if (showMovementCircle === true && this.nodes.circle === undefined) {\n this.nodes.circle = createCircleNode(config);\n this.nodes.container.appendChild(this.nodes.circle);\n }\n\n if (showMovementCircle === false && this.nodes.circle !== undefined) {\n this.nodes.container.removeChild(this.nodes.circle);\n delete this.nodes.circle;\n }\n\n if (showVisionGrid === true && this.nodes.vision === undefined) {\n this.nodes.vision = createVisionNode(config, this.grids);\n this.nodes.visionGrid = createVisionGridNodes(this.config, this.grids, this.nodes);\n this.nodes.container.appendChild(this.nodes.vision);\n }\n\n if (showVisionGrid === false && this.nodes.vision !== undefined) {\n this.nodes.container.removeChild(this.nodes.vision);\n delete this.nodes.vision;\n delete this.nodex.visionGrid;\n }\n};\n\n// ===== CREATION =====\n\nfunction createBodyNode(config) {\n var node = document.createElement('div');\n node.className = 'particle-body';\n node.style.backgroundColor = config.color;\n return node;\n}\n\nfunction createCircleNode(config) {\n if (config.showMovementCircle === false) {\n return undefined;\n }\n\n var node = document.createElement('div');\n node.className = 'particle-movement-circle';\n node.style.borderColor = config.color;\n return node;\n}\n\nfunction createContainerNode(config) {\n var node = document.createElement('div');\n node.className = 'particle-container';\n return node;\n}\n\nfunction createVisionNode(config) {\n if (config.showVisionGrid === false) {\n return undefined;\n }\n\n var node = document.createElement('div');\n node.className = 'particle-vision';\n\n return node;\n}\n\nfunction createVisionGrid(config) {\n if (config.showVisionGrid === false) {\n return [];\n }\n\n var side = config.gridSize,\n radius = config.visionRadius;\n\n var r0 = Math.pow(radius, 2);\n var r1 = Math.pow(radius - side, 2);\n\n var points = [];\n\n for (var x = -radius; x <= radius; x += side) {\n for (var y = -radius; y <= radius; y += side) {\n // Half of triangle\n if (x > -y) {\n continue;\n }\n\n // Vision band\n var p = Math.pow(x, 2) + Math.pow(y, 2);\n if (p > r0 || p < r1) {\n continue;\n }\n\n points.push({ x: x, y: y, touch: false });\n }\n }\n\n return points;\n}\n\nfunction createVisionGridNodes(config, grids, nodes) {\n if (config.showVisionGrid === false) {\n return undefined;\n }\n\n return grids.vision.reduce(function (acc, _ref) {\n var x = _ref.x,\n y = _ref.y;\n\n var div = document.createElement('div');\n div.className = 'particle-vision-dot';\n div.style.backgroundColor = config.color;\n div.style.left = x + config.visionRadius + 'px';\n div.style.top = y + config.visionRadius + 'px';\n\n nodes.vision.appendChild(div);\n\n if (acc[x] === undefined) {\n acc[x] = {};\n }\n\n acc[x][y] = div;\n\n return acc;\n }, {});\n}\n\n// ===== CALCULATIONS =====\n\nfunction updateArc(arc, _ref2) {\n var bounds = _ref2.bounds,\n randomize = _ref2.randomize,\n speed = _ref2.speed;\n\n // Randomly change radius and rotation direction.\n if (arc.length <= 0) {\n arc.length = random.num(_enums.RAD.t90, _enums.RAD.t360);\n\n if (randomize === true) {\n arc = moveArc(arc, random.num(100, 200));\n\n if (random.bool(0.8)) {\n arc.clockwise = !arc.clockwise;\n arc = changeDirection(arc);\n }\n }\n }\n\n // Ensure constant velocity and theta between 0 and 2π.\n var delta = speed / arc.radius;\n arc.length -= delta;\n\n arc.theta += arc.clockwise ? -delta : +delta;\n arc.theta = arc.theta > 0 ? arc.theta % _enums.RAD.t360 : _enums.RAD.t360 + arc.theta;\n\n arc.endX = arc.centerX + arc.radius * Math.cos(arc.theta);\n arc.endY = arc.centerY - arc.radius * Math.sin(arc.theta);\n\n // Overflow.\n if (arc.endX < 0) {\n arc.endX += bounds.width;\n arc.centerX += bounds.width;\n } else if (arc.endX > bounds.width) {\n arc.endX -= bounds.width;\n arc.centerX -= bounds.width;\n }\n\n if (arc.endY < 0) {\n arc.endY += bounds.height;\n arc.centerY += bounds.height;\n } else if (arc.endY > bounds.height) {\n arc.endY -= bounds.height;\n arc.centerY -= bounds.height;\n }\n\n return arc;\n}\n\nfunction updateVisionGrid(arc, grids) {\n var global = grids.global,\n vision = grids.vision;\n\n\n return vision.reduce(function (acc, point) {\n // Location of point on grid\n var x = Math.round(arc.endX + point.x);\n var y = Math.round(arc.endY + point.y);\n\n var gridX = x - x % 5;\n var gridY = y - y % 5;\n\n point.touch = global[gridX] !== undefined && global[gridX][gridY] !== undefined;\n\n return acc.concat(point);\n }, []);\n}\n\nfunction moveArc(arc, newRadius) {\n var r0 = arc.radius;\n var r1 = newRadius;\n\n // Moves arc center to new radius while keeping theta constant.\n arc.centerX -= (r1 - r0) * Math.cos(arc.theta);\n arc.centerY += (r1 - r0) * Math.sin(arc.theta);\n arc.radius = r1;\n\n return arc;\n}\n\nfunction changeDirection(arc) {\n arc.theta = (arc.theta + _enums.RAD.t180) % _enums.RAD.t360;\n arc.centerX -= 2 * arc.radius * Math.cos(arc.theta);\n arc.centerY += 2 * arc.radius * Math.sin(arc.theta);\n\n return arc;\n}\n\n// ===== RENDERING =====\nfunction repaintContainer(node, arc) {\n node.style.left = arc.endX + 'px';\n node.style.top = arc.endY + 'px';\n}\n\nfunction repaintBody(node, arc) {\n var rad = arc.clockwise ? _enums.RAD.t180 - arc.theta : _enums.RAD.t360 - arc.theta;\n\n node.style.transform = 'rotate(' + (rad + _enums.RAD.t45) + 'rad)';\n}\n\nfunction repaintCircle(node, arc) {\n if (node === undefined) {\n return;\n }\n\n node.style.width = 2 * arc.radius + 'px';\n node.style.height = 2 * arc.radius + 'px';\n\n node.style.left = '-' + (arc.radius + arc.radius * Math.cos(arc.theta)) + 'px';\n node.style.top = '-' + (arc.radius - arc.radius * Math.sin(arc.theta)) + 'px';\n\n node.style.borderRadius = arc.radius + 'px';\n}\n\nfunction repaintVision(node, arc) {\n if (node === undefined) {\n return;\n }\n\n var rad = arc.clockwise ? _enums.RAD.t180 - arc.theta : _enums.RAD.t360 - arc.theta;\n\n node.style.transform = 'rotate(' + (rad + _enums.RAD.t45) + 'rad)';\n}\n\nfunction repaintVisionGrid(nodes, grids) {\n if (nodes === undefined) {\n return;\n }\n\n grids.vision.forEach(function (_ref3) {\n var x = _ref3.x,\n y = _ref3.y,\n touch = _ref3.touch;\n\n nodes[x][y].style.border = touch ? '2px solid red' : '0';\n });\n}\n\nexports.default = Particle;//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiMzMuanMiLCJzb3VyY2VzIjpbIndlYnBhY2s6Ly8vanMvcGFydGljbGUuanM/M2JkZSJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUngsIHsgT2JzZXJ2YWJsZSB9IGZyb20gJ3J4anMnO1xuaW1wb3J0IHsgUkFEIH0gZnJvbSAnLi9lbnVtcyc7XG5pbXBvcnQgU3RvcmUgZnJvbSAnLi9zdG9yZSc7XG5cbmNvbnN0IHJhbmRvbSA9IHtcbiAgICBib29sOiAod2VpZ2h0KSA9PiBNYXRoLnJhbmRvbSgpIDwgKHdlaWdodCB8fCAwLjUpLFxuICAgIGNvbG9yOiAoKSA9PiBgcmdiKCR7TWF0aC5mbG9vcihNYXRoLnJhbmRvbSgpICogMjU1KX0sICR7TWF0aC5mbG9vcihNYXRoLnJhbmRvbSgpICogMjU1KX0sICR7TWF0aC5mbG9vcihNYXRoLnJhbmRvbSgpICogMjU1KX0pYCxcbiAgICBudW06IChtaW4sIG1heCkgPT4gbWluICsgTWF0aC5yb3VuZChNYXRoLnJhbmRvbSgpICogbWF4KSxcbn1cblxuLy8gPT09PT0gQ29uc3RydWN0b3IgPT09PT1cblxuZnVuY3Rpb24gUGFydGljbGUocGFyZW50LCBib3VuZHMsIGNvbmZpZywgZ2xvYmFsR3JpZCkge1xuICAgIHRoaXMuY29uZmlnID0gT2JqZWN0LmFzc2lnbih7XG4gICAgICAgIGJvdW5kcyxcbiAgICAgICAgY29sb3I6IHJhbmRvbS5jb2xvcigpLFxuICAgICAgICBncmlkU2l6ZTogNSxcbiAgICAgICAgcmFuZG9taXplOiBmYWxzZSxcbiAgICAgICAgc2hvd01vdmVtZW50Q2lyY2xlOiBmYWxzZSxcbiAgICAgICAgc2hvd1Zpc2lvbkdyaWQ6IGZhbHNlLFxuICAgICAgICBzcGVlZDogNCxcbiAgICAgICAgdmlzaW9uUmFkaXVzOiA1MFxuICAgIH0sIGNvbmZpZyk7XG5cbiAgICB0aGlzLmdyaWRzID0ge1xuICAgICAgICBnbG9iYWw6IGdsb2JhbEdyaWQgfHwge30sXG4gICAgICAgIHZpc2lvbjogY3JlYXRlVmlzaW9uR3JpZCh0aGlzLmNvbmZpZylcbiAgICB9O1xuXG4gICAgdGhpcy5hcmMgPSB7XG4gICAgICAgIGNlbnRlclg6IHJhbmRvbS5udW0oMCwgYm91bmRzLndpZHRoKSxcbiAgICAgICAgY2VudGVyWTogcmFuZG9tLm51bSgwLCBib3VuZHMuaGVpZ2h0KSxcbiAgICAgICAgY2xvY2t3aXNlOiByYW5kb20uYm9vbCgpLFxuICAgICAgICBlbmRYOiAwLFxuICAgICAgICBlbmRZOiAwLFxuICAgICAgICBsZW5ndGg6IHJhbmRvbS5udW0oUkFELnQ5MCwgUkFELnQzNjApLFxuICAgICAgICByYWRpdXM6IHJhbmRvbS5udW0oMTAwLCAyMDApLFxuICAgICAgICB0aGV0YTogcmFuZG9tLm51bShSQUQudDkwLCBSQUQudDM2MCksXG4gICAgfTtcblxuICAgIHRoaXMubm9kZXMgPSB7XG4gICAgICAgIGJvZHk6IGNyZWF0ZUJvZHlOb2RlKHRoaXMuY29uZmlnKSxcbiAgICAgICAgY2lyY2xlOiB1bmRlZmluZWQsXG4gICAgICAgIGNvbnRhaW5lcjogY3JlYXRlQ29udGFpbmVyTm9kZSh0aGlzLmNvbmZpZyksXG4gICAgICAgIHBhcmVudCxcbiAgICAgICAgdmlzaW9uOiB1bmRlZmluZWQsXG4gICAgICAgIHZpc2lvbkdyaWQ6IHVuZGVmaW5lZCxcbiAgICB9O1xuXG4gICAgdGhpcy5ub2Rlcy5jb250YWluZXIuYXBwZW5kQ2hpbGQodGhpcy5ub2Rlcy5ib2R5KTtcbiAgICBwYXJlbnQuYXBwZW5kQ2hpbGQodGhpcy5ub2Rlcy5jb250YWluZXIpO1xuXG4gICAgdGhpcy51cGRhdGVDb25maWcodGhpcy5jb25maWcpO1xuICAgIHRoaXMubmV4dEZyYW1lKCk7XG59O1xuXG4vLyA9PT09PSBQUk9UT1RZUEUgPT09PT1cblxuUGFydGljbGUucHJvdG90eXBlLnJlbW92ZSA9IGZ1bmN0aW9uKCkge1xuICAgIHRoaXMubm9kZXMucGFyZW50LnJlbW92ZUNoaWxkKHRoaXMubm9kZXMuY29udGFpbmVyKTtcbiAgICByZXR1cm4gdGhpcztcbn1cblxuUGFydGljbGUucHJvdG90eXBlLm5leHRGcmFtZSA9IGZ1bmN0aW9uKCkge1xuICAgIHRoaXMuYXJjID0gdXBkYXRlQXJjKHRoaXMuYXJjLCB0aGlzLmNvbmZpZyk7XG4gICAgdGhpcy5ncmlkcy52aXNpb24gPSB1cGRhdGVWaXNpb25HcmlkKHRoaXMuYXJjLCB0aGlzLmdyaWRzKTtcblxuICAgIHJlcGFpbnRDb250YWluZXIodGhpcy5ub2Rlcy5jb250YWluZXIsIHRoaXMuYXJjKTtcbiAgICByZXBhaW50Qm9keSh0aGlzLm5vZGVzLmJvZHksIHRoaXMuYXJjKTtcbiAgICByZXBhaW50Q2lyY2xlKHRoaXMubm9kZXMuY2lyY2xlLCB0aGlzLmFyYyk7XG4gICAgcmVwYWludFZpc2lvbih0aGlzLm5vZGVzLnZpc2lvbiwgdGhpcy5hcmMpO1xuICAgIHJlcGFpbnRWaXNpb25HcmlkKHRoaXMubm9kZXMudmlzaW9uR3JpZCwgdGhpcy5ncmlkcywgdGhpcy5jb25maWcpO1xufVxuXG5QYXJ0aWNsZS5wcm90b3R5cGUudXBkYXRlQ29uZmlnID0gZnVuY3Rpb24oY29uZmlnKSB7XG4gICAgT2JqZWN0LmFzc2lnbih0aGlzLmNvbmZpZywgY29uZmlnKTtcblxuICAgIGNvbnN0IHsgc2hvd01vdmVtZW50Q2lyY2xlLCBzaG93VmlzaW9uR3JpZCB9ID0gdGhpcy5jb25maWc7XG5cbiAgICBpZiAoc2hvd01vdmVtZW50Q2lyY2xlID09PSB0cnVlICYmIHRoaXMubm9kZXMuY2lyY2xlID09PSB1bmRlZmluZWQpIHtcbiAgICAgICAgdGhpcy5ub2Rlcy5jaXJjbGUgPSBjcmVhdGVDaXJjbGVOb2RlKGNvbmZpZyk7XG4gICAgICAgIHRoaXMubm9kZXMuY29udGFpbmVyLmFwcGVuZENoaWxkKHRoaXMubm9kZXMuY2lyY2xlKTtcbiAgICB9XG5cbiAgICBpZiAoc2hvd01vdmVtZW50Q2lyY2xlID09PSBmYWxzZSAmJiB0aGlzLm5vZGVzLmNpcmNsZSAhPT0gdW5kZWZpbmVkKSB7XG4gICAgICAgIHRoaXMubm9kZXMuY29udGFpbmVyLnJlbW92ZUNoaWxkKHRoaXMubm9kZXMuY2lyY2xlKTtcbiAgICAgICAgZGVsZXRlIHRoaXMubm9kZXMuY2lyY2xlO1xuICAgIH1cblxuICAgIGlmIChzaG93VmlzaW9uR3JpZCA9PT0gdHJ1ZSAmJiB0aGlzLm5vZGVzLnZpc2lvbiA9PT0gdW5kZWZpbmVkKSB7XG4gICAgICAgIHRoaXMubm9kZXMudmlzaW9uID0gY3JlYXRlVmlzaW9uTm9kZShjb25maWcsIHRoaXMuZ3JpZHMpO1xuICAgICAgICB0aGlzLm5vZGVzLnZpc2lvbkdyaWQgPSBjcmVhdGVWaXNpb25HcmlkTm9kZXModGhpcy5jb25maWcsIHRoaXMuZ3JpZHMsIHRoaXMubm9kZXMpO1xuICAgICAgICB0aGlzLm5vZGVzLmNvbnRhaW5lci5hcHBlbmRDaGlsZCh0aGlzLm5vZGVzLnZpc2lvbik7XG4gICAgfVxuXG4gICAgaWYgKHNob3dWaXNpb25HcmlkID09PSBmYWxzZSAmJiB0aGlzLm5vZGVzLnZpc2lvbiAhPT0gdW5kZWZpbmVkKSB7XG4gICAgICAgIHRoaXMubm9kZXMuY29udGFpbmVyLnJlbW92ZUNoaWxkKHRoaXMubm9kZXMudmlzaW9uKTtcbiAgICAgICAgZGVsZXRlIHRoaXMubm9kZXMudmlzaW9uO1xuICAgICAgICBkZWxldGUgdGhpcy5ub2RleC52aXNpb25HcmlkO1xuICAgIH1cbn1cblxuLy8gPT09PT0gQ1JFQVRJT04gPT09PT1cblxuZnVuY3Rpb24gY3JlYXRlQm9keU5vZGUoY29uZmlnKSB7XG4gICAgY29uc3Qgbm9kZSA9IGRvY3VtZW50LmNyZWF0ZUVsZW1lbnQoJ2RpdicpO1xuICAgIG5vZGUuY2xhc3NOYW1lID0gJ3BhcnRpY2xlLWJvZHknO1xuICAgIG5vZGUuc3R5bGUuYmFja2dyb3VuZENvbG9yID0gY29uZmlnLmNvbG9yO1xuICAgIHJldHVybiBub2RlO1xufVxuXG5mdW5jdGlvbiBjcmVhdGVDaXJjbGVOb2RlKGNvbmZpZykge1xuICAgIGlmIChjb25maWcuc2hvd01vdmVtZW50Q2lyY2xlID09PSBmYWxzZSkge1xuICAgICAgICByZXR1cm4gdW5kZWZpbmVkO1xuICAgIH1cblxuICAgIGNvbnN0IG5vZGUgPSBkb2N1bWVudC5jcmVhdGVFbGVtZW50KCdkaXYnKTtcbiAgICBub2RlLmNsYXNzTmFtZSA9ICdwYXJ0aWNsZS1tb3ZlbWVudC1jaXJjbGUnO1xuICAgIG5vZGUuc3R5bGUuYm9yZGVyQ29sb3IgPSBjb25maWcuY29sb3I7XG4gICAgcmV0dXJuIG5vZGU7XG59XG5cbmZ1bmN0aW9uIGNyZWF0ZUNvbnRhaW5lck5vZGUoY29uZmlnKSB7XG4gICAgY29uc3Qgbm9kZSA9IGRvY3VtZW50LmNyZWF0ZUVsZW1lbnQoJ2RpdicpO1xuICAgIG5vZGUuY2xhc3NOYW1lID0gJ3BhcnRpY2xlLWNvbnRhaW5lcic7XG4gICAgcmV0dXJuIG5vZGU7XG59XG5cbmZ1bmN0aW9uIGNyZWF0ZVZpc2lvbk5vZGUoY29uZmlnKSB7XG4gICAgaWYgKGNvbmZpZy5zaG93VmlzaW9uR3JpZCA9PT0gZmFsc2UpIHtcbiAgICAgICAgcmV0dXJuIHVuZGVmaW5lZDtcbiAgICB9XG5cbiAgICBjb25zdCBub2RlID0gZG9jdW1lbnQuY3JlYXRlRWxlbWVudCgnZGl2Jyk7XG4gICAgbm9kZS5jbGFzc05hbWUgPSAncGFydGljbGUtdmlzaW9uJztcblxuICAgIHJldHVybiBub2RlO1xufVxuXG5mdW5jdGlvbiBjcmVhdGVWaXNpb25HcmlkKGNvbmZpZykge1xuICAgIGlmIChjb25maWcuc2hvd1Zpc2lvbkdyaWQgPT09IGZhbHNlKSB7XG4gICAgICAgIHJldHVybiBbXTtcbiAgICB9XG5cbiAgICBjb25zdCB7IGdyaWRTaXplOiBzaWRlLCB2aXNpb25SYWRpdXM6IHJhZGl1cyB9ID0gY29uZmlnO1xuICAgIGNvbnN0IHIwID0gTWF0aC5wb3cocmFkaXVzLCAyKTtcbiAgICBjb25zdCByMSA9IE1hdGgucG93KHJhZGl1cyAtIHNpZGUsIDIpO1xuXG4gICAgY29uc3QgcG9pbnRzID0gW107XG5cbiAgICBmb3IgKGxldCB4ID0gLXJhZGl1czsgeCA8PSByYWRpdXM7IHggKz0gc2lkZSkge1xuICAgICAgICBmb3IgKGxldCB5ID0gLXJhZGl1czsgeSA8PSByYWRpdXM7IHkgKz0gc2lkZSkge1xuICAgICAgICAgICAgLy8gSGFsZiBvZiB0cmlhbmdsZVxuICAgICAgICAgICAgaWYgKHggPiAteSkge1xuICAgICAgICAgICAgICAgIGNvbnRpbnVlO1xuICAgICAgICAgICAgfVxuXG4gICAgICAgICAgICAvLyBWaXNpb24gYmFuZFxuICAgICAgICAgICAgY29uc3QgcCA9IE1hdGgucG93KHgsIDIpICsgTWF0aC5wb3coeSwgMik7XG4gICAgICAgICAgICBpZiAocCA+IHIwIHx8IHAgPCByMSkge1xuICAgICAgICAgICAgICAgIGNvbnRpbnVlO1xuICAgICAgICAgICAgfVxuXG4gICAgICAgICAgICBwb2ludHMucHVzaCh7IHgsIHksIHRvdWNoOiBmYWxzZSB9KTtcbiAgICAgICAgfVxuICAgIH1cblxuICAgIHJldHVybiBwb2ludHM7XG59XG5cbmZ1bmN0aW9uIGNyZWF0ZVZpc2lvbkdyaWROb2Rlcyhjb25maWcsIGdyaWRzLCBub2Rlcykge1xuICAgIGlmIChjb25maWcuc2hvd1Zpc2lvbkdyaWQgPT09IGZhbHNlKSB7XG4gICAgICAgIHJldHVybiB1bmRlZmluZWQ7XG4gICAgfVxuXG4gICAgcmV0dXJuIGdyaWRzLnZpc2lvbi5yZWR1Y2UoKGFjYywgeyB4LCB5IH0pID0+IHtcbiAgICAgICAgY29uc3QgZGl2ID0gZG9jdW1lbnQuY3JlYXRlRWxlbWVudCgnZGl2Jyk7XG4gICAgICAgIGRpdi5jbGFzc05hbWUgPSAncGFydGljbGUtdmlzaW9uLWRvdCc7XG4gICAgICAgIGRpdi5zdHlsZS5iYWNrZ3JvdW5kQ29sb3IgPSBjb25maWcuY29sb3I7XG4gICAgICAgIGRpdi5zdHlsZS5sZWZ0ID0gYCR7eCArIGNvbmZpZy52aXNpb25SYWRpdXN9cHhgO1xuICAgICAgICBkaXYuc3R5bGUudG9wID0gYCR7eSArIGNvbmZpZy52aXNpb25SYWRpdXN9cHhgO1xuXG4gICAgICAgIG5vZGVzLnZpc2lvbi5hcHBlbmRDaGlsZChkaXYpO1xuXG4gICAgICAgIGlmIChhY2NbeF0gPT09IHVuZGVmaW5lZCkge1xuICAgICAgICAgICAgYWNjW3hdID0ge307XG4gICAgICAgIH1cblxuICAgICAgICBhY2NbeF1beV0gPSBkaXY7XG5cbiAgICAgICAgcmV0dXJuIGFjYztcbiAgICB9LCB7fSk7XG59XG5cbi8vID09PT09IENBTENVTEFUSU9OUyA9PT09PVxuXG5mdW5jdGlvbiB1cGRhdGVBcmMoYXJjLCB7IGJvdW5kcywgcmFuZG9taXplLCBzcGVlZCB9KSB7XG4gICAgLy8gUmFuZG9tbHkgY2hhbmdlIHJhZGl1cyBhbmQgcm90YXRpb24gZGlyZWN0aW9uLlxuICAgIGlmIChhcmMubGVuZ3RoIDw9IDApIHtcbiAgICAgICAgYXJjLmxlbmd0aCA9IHJhbmRvbS5udW0oUkFELnQ5MCwgUkFELnQzNjApO1xuXG4gICAgICAgIGlmIChyYW5kb21pemUgPT09IHRydWUpIHtcbiAgICAgICAgICAgIGFyYyA9IG1vdmVBcmMoYXJjLCByYW5kb20ubnVtKDEwMCwgMjAwKSk7XG5cbiAgICAgICAgICAgIGlmIChyYW5kb20uYm9vbCgwLjgpKSB7XG4gICAgICAgICAgICAgICAgYXJjLmNsb2Nrd2lzZSA9ICFhcmMuY2xvY2t3aXNlO1xuICAgICAgICAgICAgICAgIGFyYyA9IGNoYW5nZURpcmVjdGlvbihhcmMpO1xuICAgICAgICAgICAgfVxuICAgICAgICB9XG4gICAgfVxuXG4gICAgLy8gRW5zdXJlIGNvbnN0YW50IHZlbG9jaXR5IGFuZCB0aGV0YSBiZXR3ZWVuIDAgYW5kIDLPgC5cbiAgICBjb25zdCBkZWx0YSA9IHNwZWVkIC8gYXJjLnJhZGl1cztcbiAgICBhcmMubGVuZ3RoIC09IGRlbHRhO1xuXG4gICAgYXJjLnRoZXRhICs9IChhcmMuY2xvY2t3aXNlID8gLWRlbHRhIDogK2RlbHRhKTtcbiAgICBhcmMudGhldGEgPSAoYXJjLnRoZXRhID4gMCA/IGFyYy50aGV0YSAlIFJBRC50MzYwIDogUkFELnQzNjAgKyBhcmMudGhldGEpO1xuXG4gICAgYXJjLmVuZFggPSBhcmMuY2VudGVyWCArIGFyYy5yYWRpdXMgKiBNYXRoLmNvcyhhcmMudGhldGEpO1xuICAgIGFyYy5lbmRZID0gYXJjLmNlbnRlclkgLSBhcmMucmFkaXVzICogTWF0aC5zaW4oYXJjLnRoZXRhKTtcblxuICAgIC8vIE92ZXJmbG93LlxuICAgIGlmIChhcmMuZW5kWCA8IDApIHtcbiAgICAgICAgYXJjLmVuZFggKz0gYm91bmRzLndpZHRoO1xuICAgICAgICBhcmMuY2VudGVyWCArPSBib3VuZHMud2lkdGhcbiAgICB9IGVsc2UgaWYgKGFyYy5lbmRYID4gYm91bmRzLndpZHRoKSB7XG4gICAgICAgIGFyYy5lbmRYIC09IGJvdW5kcy53aWR0aDtcbiAgICAgICAgYXJjLmNlbnRlclggLT0gYm91bmRzLndpZHRoXG4gICAgfVxuXG4gICAgaWYgKGFyYy5lbmRZIDwgMCkge1xuICAgICAgICBhcmMuZW5kWSArPSBib3VuZHMuaGVpZ2h0O1xuICAgICAgICBhcmMuY2VudGVyWSArPSBib3VuZHMuaGVpZ2h0XG4gICAgfSBlbHNlIGlmIChhcmMuZW5kWSA+IGJvdW5kcy5oZWlnaHQpIHtcbiAgICAgICAgYXJjLmVuZFkgLT0gYm91bmRzLmhlaWdodDtcbiAgICAgICAgYXJjLmNlbnRlclkgLT0gYm91bmRzLmhlaWdodFxuICAgIH1cblxuICAgIHJldHVybiBhcmM7XG59XG5cbmZ1bmN0aW9uIHVwZGF0ZVZpc2lvbkdyaWQoYXJjLCBncmlkcykge1xuICAgIGNvbnN0IHsgZ2xvYmFsLCB2aXNpb24gfSA9IGdyaWRzO1xuXG4gICAgcmV0dXJuIHZpc2lvbi5yZWR1Y2UoKGFjYywgcG9pbnQpID0+IHtcbiAgICAgICAgLy8gTG9jYXRpb24gb2YgcG9pbnQgb24gZ3JpZFxuICAgICAgICBjb25zdCB4ID0gTWF0aC5yb3VuZChhcmMuZW5kWCArIHBvaW50LngpO1xuICAgICAgICBjb25zdCB5ID0gTWF0aC5yb3VuZChhcmMuZW5kWSArIHBvaW50LnkpO1xuXG4gICAgICAgIGNvbnN0IGdyaWRYID0geCAtIHggJSA1O1xuICAgICAgICBjb25zdCBncmlkWSA9IHkgLSB5ICUgNTtcblxuICAgICAgICBwb2ludC50b3VjaCA9IChnbG9iYWxbZ3JpZFhdICE9PSB1bmRlZmluZWQgJiYgZ2xvYmFsW2dyaWRYXVtncmlkWV0gIT09IHVuZGVmaW5lZCk7XG5cbiAgICAgICAgcmV0dXJuIGFjYy5jb25jYXQocG9pbnQpO1xuICAgIH0sIFtdKTtcbn1cblxuZnVuY3Rpb24gbW92ZUFyYyhhcmMsIG5ld1JhZGl1cykge1xuICAgIGNvbnN0IHIwID0gYXJjLnJhZGl1cztcbiAgICBjb25zdCByMSA9IG5ld1JhZGl1cztcblxuICAgIC8vIE1vdmVzIGFyYyBjZW50ZXIgdG8gbmV3IHJhZGl1cyB3aGlsZSBrZWVwaW5nIHRoZXRhIGNvbnN0YW50LlxuICAgIGFyYy5jZW50ZXJYIC09IChyMSAtIHIwKSAqIE1hdGguY29zKGFyYy50aGV0YSk7XG4gICAgYXJjLmNlbnRlclkgKz0gKHIxIC0gcjApICogTWF0aC5zaW4oYXJjLnRoZXRhKTtcbiAgICBhcmMucmFkaXVzID0gcjE7XG5cbiAgICByZXR1cm4gYXJjO1xufVxuXG5mdW5jdGlvbiBjaGFuZ2VEaXJlY3Rpb24oYXJjKSB7XG4gICAgYXJjLnRoZXRhID0gKGFyYy50aGV0YSArIFJBRC50MTgwKSAlIFJBRC50MzYwO1xuICAgIGFyYy5jZW50ZXJYIC09ICgyICogYXJjLnJhZGl1cykgKiBNYXRoLmNvcyhhcmMudGhldGEpO1xuICAgIGFyYy5jZW50ZXJZICs9ICgyICogYXJjLnJhZGl1cykgKiBNYXRoLnNpbihhcmMudGhldGEpO1xuXG4gICAgcmV0dXJuIGFyYztcbn1cblxuLy8gPT09PT0gUkVOREVSSU5HID09PT09XG5mdW5jdGlvbiByZXBhaW50Q29udGFpbmVyKG5vZGUsIGFyYykge1xuICAgIG5vZGUuc3R5bGUubGVmdCA9IGAke2FyYy5lbmRYfXB4YDtcbiAgICBub2RlLnN0eWxlLnRvcCA9IGAke2FyYy5lbmRZfXB4YDtcbn1cblxuZnVuY3Rpb24gcmVwYWludEJvZHkobm9kZSwgYXJjKSB7XG4gICAgY29uc3QgcmFkID0gYXJjLmNsb2Nrd2lzZVxuICAgICAgICA/IFJBRC50MTgwIC0gYXJjLnRoZXRhXG4gICAgICAgIDogUkFELnQzNjAgLSBhcmMudGhldGE7XG5cbiAgICBub2RlLnN0eWxlLnRyYW5zZm9ybSA9IGByb3RhdGUoJHtyYWQgKyBSQUQudDQ1fXJhZClgO1xufVxuXG5mdW5jdGlvbiByZXBhaW50Q2lyY2xlKG5vZGUsIGFyYykge1xuICAgIGlmIChub2RlID09PSB1bmRlZmluZWQpIHtcbiAgICAgICAgcmV0dXJuO1xuICAgIH1cblxuICAgIG5vZGUuc3R5bGUud2lkdGggPSBgJHsyICogYXJjLnJhZGl1c31weGA7XG4gICAgbm9kZS5zdHlsZS5oZWlnaHQgPSBgJHsyICogYXJjLnJhZGl1c31weGA7XG5cbiAgICBub2RlLnN0eWxlLmxlZnQgPSBgLSR7YXJjLnJhZGl1cyArIGFyYy5yYWRpdXMgKiBNYXRoLmNvcyhhcmMudGhldGEpfXB4YDtcbiAgICBub2RlLnN0eWxlLnRvcCA9IGAtJHthcmMucmFkaXVzIC0gYXJjLnJhZGl1cyAqIE1hdGguc2luKGFyYy50aGV0YSl9cHhgO1xuXG4gICAgbm9kZS5zdHlsZS5ib3JkZXJSYWRpdXMgPSBgJHthcmMucmFkaXVzfXB4YDtcbn1cblxuZnVuY3Rpb24gcmVwYWludFZpc2lvbihub2RlLCBhcmMpIHtcbiAgICBpZiAobm9kZSA9PT0gdW5kZWZpbmVkKSB7XG4gICAgICAgIHJldHVybjtcbiAgICB9XG5cbiAgICBjb25zdCByYWQgPSBhcmMuY2xvY2t3aXNlXG4gICAgICAgID8gUkFELnQxODAgLSBhcmMudGhldGFcbiAgICAgICAgOiBSQUQudDM2MCAtIGFyYy50aGV0YTtcblxuICAgIG5vZGUuc3R5bGUudHJhbnNmb3JtID0gYHJvdGF0ZSgke3JhZCArIFJBRC50NDV9cmFkKWA7XG59XG5cbmZ1bmN0aW9uIHJlcGFpbnRWaXNpb25HcmlkKG5vZGVzLCBncmlkcykge1xuICAgIGlmIChub2RlcyA9PT0gdW5kZWZpbmVkKSB7XG4gICAgICAgIHJldHVybjtcbiAgICB9XG5cbiAgICBncmlkcy52aXNpb24uZm9yRWFjaCgoeyB4LCB5LCB0b3VjaCB9KSA9PiB7XG4gICAgICAgIG5vZGVzW3hdW3ldLnN0eWxlLmJvcmRlciA9ICh0b3VjaCA/ICcycHggc29saWQgcmVkJyA6ICcwJyk7XG4gICAgfSk7XG59XG5cbmV4cG9ydCBkZWZhdWx0IFBhcnRpY2xlO1xuXG5cblxuLy8gV0VCUEFDSyBGT09URVIgLy9cbi8vIGpzL3BhcnRpY2xlLmpzIl0sIm1hcHBpbmdzIjoiOzs7Ozs7QUFBQTtBQUNBOzs7QUFBQTtBQUNBO0FBQUE7QUFDQTs7Ozs7QUFDQTtBQUNBO0FBQUE7QUFBQTtBQUNBO0FBQUE7QUFBQTtBQUNBO0FBQUE7QUFBQTtBQUhBO0FBQ0E7QUFLQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFSQTtBQUNBO0FBVUE7QUFDQTtBQUNBO0FBRkE7QUFDQTtBQUlBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQVJBO0FBQ0E7QUFVQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQU5BO0FBQ0E7QUFRQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUZBO0FBQUE7QUFBQTtBQUNBO0FBQ0E7QUFHQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBSkE7QUFBQTtBQUNBO0FBS0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFBQTtBQUFBO0FBQ0E7QUFBQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFBQTtBQUFBO0FBQUE7QUFDQTtBQUFBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUFBO0FBQUE7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFHQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFHQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFBQTtBQUFBO0FBQUE7QUFDQTtBQUFBO0FBQ0E7QUFDQTtBQUNBO0FBQ0EiLCJzb3VyY2VSb290IjoiIn0="); +eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\n\nvar _rxjs = __webpack_require__(/*! rxjs */ 14);\n\nvar _rxjs2 = _interopRequireDefault(_rxjs);\n\nvar _enums = __webpack_require__(/*! ./enums */ 16);\n\nvar _store = __webpack_require__(/*! ./store */ 22);\n\nvar _store2 = _interopRequireDefault(_store);\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nvar random = {\n bool: function bool(weight) {\n return Math.random() < (weight || 0.5);\n },\n color: function color() {\n return 'rgb(' + Math.floor(Math.random() * 255) + ', ' + Math.floor(Math.random() * 255) + ', ' + Math.floor(Math.random() * 255) + ')';\n },\n num: function num(min, max) {\n return min + Math.round(Math.random() * max);\n }\n};\n\n// ===== Constructor =====\n\nfunction Particle(parent, bounds, config, globalGrid) {\n this.config = Object.assign({\n bounds: bounds,\n color: random.color(),\n gridSize: 5,\n randomize: false,\n showMovementCircle: false,\n showVisionGrid: false,\n speed: 4,\n visionRadius: 50\n }, config);\n\n this.grids = {\n global: globalGrid || {},\n vision: createVisionGrid(this.config)\n };\n\n this.arc = {\n centerX: random.num(0, bounds.width),\n centerY: random.num(0, bounds.height),\n clockwise: random.bool(),\n endX: 0,\n endY: 0,\n length: random.num(_enums.RAD.t90, _enums.RAD.t360),\n radius: random.num(100, 200),\n theta: random.num(_enums.RAD.t90, _enums.RAD.t360)\n };\n\n this.nodes = {\n body: createBodyNode(this.config),\n circle: undefined,\n container: createContainerNode(this.config),\n parent: parent,\n vision: undefined,\n visionGrid: undefined\n };\n\n this.nodes.container.appendChild(this.nodes.body);\n parent.appendChild(this.nodes.container);\n\n this.updateConfig(this.config);\n this.nextFrame();\n};\n\n// ===== PROTOTYPE =====\n\nParticle.prototype.remove = function () {\n this.nodes.parent.removeChild(this.nodes.container);\n return this;\n};\n\nParticle.prototype.nextFrame = function () {\n this.arc = updateArc(this.arc, this.config);\n this.grids.vision = updateVisionGrid(this.arc, this.config, this.grids);\n\n repaintContainer(this.nodes.container, this.arc);\n repaintBody(this.nodes.body, this.arc);\n repaintCircle(this.nodes.circle, this.arc);\n repaintVision(this.nodes.vision, this.arc);\n repaintVisionGrid(this.nodes.visionGrid, this.arc, this.grids);\n};\n\nParticle.prototype.updateConfig = function (config) {\n Object.assign(this.config, config);\n\n var _config = this.config,\n showMovementCircle = _config.showMovementCircle,\n showVisionGrid = _config.showVisionGrid;\n\n\n if (showMovementCircle === true && this.nodes.circle === undefined) {\n this.nodes.circle = createCircleNode(config);\n this.nodes.container.appendChild(this.nodes.circle);\n }\n\n if (showMovementCircle === false && this.nodes.circle !== undefined) {\n this.nodes.container.removeChild(this.nodes.circle);\n delete this.nodes.circle;\n }\n\n if (showVisionGrid === true && this.nodes.vision === undefined) {\n this.nodes.vision = createVisionNode(config, this.grids);\n this.nodes.visionGrid = createVisionGridNodes(this.config, this.grids, this.nodes);\n this.nodes.container.appendChild(this.nodes.vision);\n }\n\n if (showVisionGrid === false && this.nodes.vision !== undefined) {\n this.nodes.container.removeChild(this.nodes.vision);\n delete this.nodes.vision;\n delete this.nodex.visionGrid;\n }\n};\n\n// ===== CREATION =====\n\nfunction createBodyNode(config) {\n var node = document.createElement('div');\n node.className = 'particle-body';\n node.style.backgroundColor = config.color;\n return node;\n}\n\nfunction createCircleNode(config) {\n if (config.showMovementCircle === false) {\n return undefined;\n }\n\n var node = document.createElement('div');\n node.className = 'particle-movement-circle';\n node.style.borderColor = config.color;\n return node;\n}\n\nfunction createContainerNode(config) {\n var node = document.createElement('div');\n node.className = 'particle-container';\n return node;\n}\n\nfunction createVisionNode(config) {\n if (config.showVisionGrid === false) {\n return undefined;\n }\n\n var node = document.createElement('div');\n node.className = 'particle-vision';\n\n return node;\n}\n\nfunction createVisionGrid(config) {\n if (config.showVisionGrid === false) {\n return [];\n }\n\n var side = config.gridSize,\n radius = config.visionRadius;\n\n var r0 = radius;\n var r1 = radius - side;\n\n var points = [];\n\n for (var x = -radius; x <= radius; x += side) {\n for (var y = -radius; y <= radius; y += side) {\n // Omit lower half\n if (y < 0) {\n continue;\n }\n\n // Include vision band\n var r = Math.pow(Math.pow(x, 2) + Math.pow(y, 2), 0.5);\n if (r > r0 || r < r1) {\n continue;\n }\n\n var alpha = Math.atan(y / x);\n if (x < 0) {\n alpha = _enums.RAD.t180 + alpha;\n }\n\n points.push({ x: x, y: y, r: r, alpha: alpha, touch: false });\n }\n }\n\n return points;\n}\n\nfunction createVisionGridNodes(config, grids, nodes) {\n if (config.showVisionGrid === false) {\n return undefined;\n }\n\n return grids.vision.reduce(function (acc, _ref) {\n var x = _ref.x,\n y = _ref.y;\n\n var div = document.createElement('div');\n div.className = 'particle-vision-dot';\n div.style.backgroundColor = config.color;\n nodes.vision.appendChild(div);\n\n acc.push(div);\n\n return acc;\n }, []);\n}\n\n// ===== CALCULATIONS =====\n\nfunction updateArc(arc, _ref2) {\n var bounds = _ref2.bounds,\n randomize = _ref2.randomize,\n speed = _ref2.speed;\n\n // Randomly change radius and rotation direction.\n if (arc.length <= 0) {\n arc.length = random.num(_enums.RAD.t90, _enums.RAD.t360);\n\n if (randomize === true) {\n arc = moveArc(arc, random.num(100, 200));\n\n if (random.bool(0.8)) {\n arc.clockwise = !arc.clockwise;\n arc = changeDirection(arc);\n }\n }\n }\n\n // Ensure constant velocity and theta between 0 and 2π.\n var delta = speed / arc.radius;\n arc.length -= delta;\n\n arc.theta += arc.clockwise ? -delta : +delta;\n arc.theta = arc.theta > 0 ? arc.theta % _enums.RAD.t360 : _enums.RAD.t360 + arc.theta;\n\n arc.endX = arc.centerX + arc.radius * Math.cos(arc.theta);\n arc.endY = arc.centerY - arc.radius * Math.sin(arc.theta);\n\n // Overflow.\n if (arc.endX < 0) {\n arc.endX += bounds.width;\n arc.centerX += bounds.width;\n } else if (arc.endX > bounds.width) {\n arc.endX -= bounds.width;\n arc.centerX -= bounds.width;\n }\n\n if (arc.endY < 0) {\n arc.endY += bounds.height;\n arc.centerY += bounds.height;\n } else if (arc.endY > bounds.height) {\n arc.endY -= bounds.height;\n arc.centerY -= bounds.height;\n }\n\n return arc;\n}\n\nfunction updateVisionGrid(arc, config, grids) {\n var global = grids.global,\n vision = grids.vision;\n\n\n return vision.reduce(function (acc, point) {\n var rad = arc.clockwise ? arc.theta - point.alpha : arc.theta - point.alpha + _enums.RAD.t180;\n\n point.x = point.r * Math.cos(rad) + config.visionRadius;\n point.y = -point.r * Math.sin(rad) + config.visionRadius;\n\n // console.warn(point.alpha, point.alpha + arc.theta)\n\n // const gridX = point.x - point.x % 5;\n // const gridY = point.y - point.y % 5;\n\n // point.touch = (global[gridX] !== undefined && global[gridX][gridY] !== undefined);\n\n return acc.concat(point);\n }, []);\n}\n\nfunction moveArc(arc, newRadius) {\n var r0 = arc.radius;\n var r1 = newRadius;\n\n // Moves arc center to new radius while keeping theta constant.\n arc.centerX -= (r1 - r0) * Math.cos(arc.theta);\n arc.centerY += (r1 - r0) * Math.sin(arc.theta);\n arc.radius = r1;\n\n return arc;\n}\n\nfunction changeDirection(arc) {\n arc.theta = (arc.theta + _enums.RAD.t180) % _enums.RAD.t360;\n arc.centerX -= 2 * arc.radius * Math.cos(arc.theta);\n arc.centerY += 2 * arc.radius * Math.sin(arc.theta);\n\n return arc;\n}\n\n// ===== RENDERING =====\nfunction repaintContainer(node, arc) {\n node.style.left = arc.endX + 'px';\n node.style.top = arc.endY + 'px';\n}\n\nfunction repaintBody(node, arc) {\n var rad = arc.clockwise ? _enums.RAD.t180 - arc.theta : _enums.RAD.t360 - arc.theta;\n\n node.style.transform = 'rotate(' + (rad + _enums.RAD.t45) + 'rad)';\n}\n\nfunction repaintCircle(node, arc) {\n if (node === undefined) {\n return;\n }\n\n node.style.width = 2 * arc.radius + 'px';\n node.style.height = 2 * arc.radius + 'px';\n\n node.style.left = '-' + (arc.radius + arc.radius * Math.cos(arc.theta)) + 'px';\n node.style.top = '-' + (arc.radius - arc.radius * Math.sin(arc.theta)) + 'px';\n\n node.style.borderRadius = arc.radius + 'px';\n}\n\nfunction repaintVision(node, arc) {\n if (node === undefined) {\n return;\n }\n\n var rad = arc.clockwise ? _enums.RAD.t180 - arc.theta : _enums.RAD.t360 - arc.theta;\n}\n\nfunction repaintVisionGrid(nodes, arc, grids) {\n if (nodes === undefined) {\n return;\n }\n\n grids.vision.forEach(function (_ref3, i) {\n var x = _ref3.x,\n y = _ref3.y,\n touch = _ref3.touch;\n\n nodes[i].style.left = x + 'px';\n nodes[i].style.top = y + 'px';\n\n nodes[i].style.border = touch ? '2px solid red' : '0';\n });\n}\n\nexports.default = Particle;//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiMzMuanMiLCJzb3VyY2VzIjpbIndlYnBhY2s6Ly8vanMvcGFydGljbGUuanM/M2JkZSJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUngsIHsgT2JzZXJ2YWJsZSB9IGZyb20gJ3J4anMnO1xuaW1wb3J0IHsgUkFEIH0gZnJvbSAnLi9lbnVtcyc7XG5pbXBvcnQgU3RvcmUgZnJvbSAnLi9zdG9yZSc7XG5cbmNvbnN0IHJhbmRvbSA9IHtcbiAgICBib29sOiAod2VpZ2h0KSA9PiBNYXRoLnJhbmRvbSgpIDwgKHdlaWdodCB8fCAwLjUpLFxuICAgIGNvbG9yOiAoKSA9PiBgcmdiKCR7TWF0aC5mbG9vcihNYXRoLnJhbmRvbSgpICogMjU1KX0sICR7TWF0aC5mbG9vcihNYXRoLnJhbmRvbSgpICogMjU1KX0sICR7TWF0aC5mbG9vcihNYXRoLnJhbmRvbSgpICogMjU1KX0pYCxcbiAgICBudW06IChtaW4sIG1heCkgPT4gbWluICsgTWF0aC5yb3VuZChNYXRoLnJhbmRvbSgpICogbWF4KSxcbn1cblxuLy8gPT09PT0gQ29uc3RydWN0b3IgPT09PT1cblxuZnVuY3Rpb24gUGFydGljbGUocGFyZW50LCBib3VuZHMsIGNvbmZpZywgZ2xvYmFsR3JpZCkge1xuICAgIHRoaXMuY29uZmlnID0gT2JqZWN0LmFzc2lnbih7XG4gICAgICAgIGJvdW5kcyxcbiAgICAgICAgY29sb3I6IHJhbmRvbS5jb2xvcigpLFxuICAgICAgICBncmlkU2l6ZTogNSxcbiAgICAgICAgcmFuZG9taXplOiBmYWxzZSxcbiAgICAgICAgc2hvd01vdmVtZW50Q2lyY2xlOiBmYWxzZSxcbiAgICAgICAgc2hvd1Zpc2lvbkdyaWQ6IGZhbHNlLFxuICAgICAgICBzcGVlZDogNCxcbiAgICAgICAgdmlzaW9uUmFkaXVzOiA1MFxuICAgIH0sIGNvbmZpZyk7XG5cbiAgICB0aGlzLmdyaWRzID0ge1xuICAgICAgICBnbG9iYWw6IGdsb2JhbEdyaWQgfHwge30sXG4gICAgICAgIHZpc2lvbjogY3JlYXRlVmlzaW9uR3JpZCh0aGlzLmNvbmZpZylcbiAgICB9O1xuXG4gICAgdGhpcy5hcmMgPSB7XG4gICAgICAgIGNlbnRlclg6IHJhbmRvbS5udW0oMCwgYm91bmRzLndpZHRoKSxcbiAgICAgICAgY2VudGVyWTogcmFuZG9tLm51bSgwLCBib3VuZHMuaGVpZ2h0KSxcbiAgICAgICAgY2xvY2t3aXNlOiByYW5kb20uYm9vbCgpLFxuICAgICAgICBlbmRYOiAwLFxuICAgICAgICBlbmRZOiAwLFxuICAgICAgICBsZW5ndGg6IHJhbmRvbS5udW0oUkFELnQ5MCwgUkFELnQzNjApLFxuICAgICAgICByYWRpdXM6IHJhbmRvbS5udW0oMTAwLCAyMDApLFxuICAgICAgICB0aGV0YTogcmFuZG9tLm51bShSQUQudDkwLCBSQUQudDM2MCksXG4gICAgfTtcblxuICAgIHRoaXMubm9kZXMgPSB7XG4gICAgICAgIGJvZHk6IGNyZWF0ZUJvZHlOb2RlKHRoaXMuY29uZmlnKSxcbiAgICAgICAgY2lyY2xlOiB1bmRlZmluZWQsXG4gICAgICAgIGNvbnRhaW5lcjogY3JlYXRlQ29udGFpbmVyTm9kZSh0aGlzLmNvbmZpZyksXG4gICAgICAgIHBhcmVudCxcbiAgICAgICAgdmlzaW9uOiB1bmRlZmluZWQsXG4gICAgICAgIHZpc2lvbkdyaWQ6IHVuZGVmaW5lZCxcbiAgICB9O1xuXG4gICAgdGhpcy5ub2Rlcy5jb250YWluZXIuYXBwZW5kQ2hpbGQodGhpcy5ub2Rlcy5ib2R5KTtcbiAgICBwYXJlbnQuYXBwZW5kQ2hpbGQodGhpcy5ub2Rlcy5jb250YWluZXIpO1xuXG4gICAgdGhpcy51cGRhdGVDb25maWcodGhpcy5jb25maWcpO1xuICAgIHRoaXMubmV4dEZyYW1lKCk7XG59O1xuXG4vLyA9PT09PSBQUk9UT1RZUEUgPT09PT1cblxuUGFydGljbGUucHJvdG90eXBlLnJlbW92ZSA9IGZ1bmN0aW9uKCkge1xuICAgIHRoaXMubm9kZXMucGFyZW50LnJlbW92ZUNoaWxkKHRoaXMubm9kZXMuY29udGFpbmVyKTtcbiAgICByZXR1cm4gdGhpcztcbn1cblxuUGFydGljbGUucHJvdG90eXBlLm5leHRGcmFtZSA9IGZ1bmN0aW9uKCkge1xuICAgIHRoaXMuYXJjID0gdXBkYXRlQXJjKHRoaXMuYXJjLCB0aGlzLmNvbmZpZyk7XG4gICAgdGhpcy5ncmlkcy52aXNpb24gPSB1cGRhdGVWaXNpb25HcmlkKHRoaXMuYXJjLCB0aGlzLmNvbmZpZywgdGhpcy5ncmlkcyk7XG5cbiAgICByZXBhaW50Q29udGFpbmVyKHRoaXMubm9kZXMuY29udGFpbmVyLCB0aGlzLmFyYyk7XG4gICAgcmVwYWludEJvZHkodGhpcy5ub2Rlcy5ib2R5LCB0aGlzLmFyYyk7XG4gICAgcmVwYWludENpcmNsZSh0aGlzLm5vZGVzLmNpcmNsZSwgdGhpcy5hcmMpO1xuICAgIHJlcGFpbnRWaXNpb24odGhpcy5ub2Rlcy52aXNpb24sIHRoaXMuYXJjKTtcbiAgICByZXBhaW50VmlzaW9uR3JpZCh0aGlzLm5vZGVzLnZpc2lvbkdyaWQsIHRoaXMuYXJjLCB0aGlzLmdyaWRzKTtcbn1cblxuUGFydGljbGUucHJvdG90eXBlLnVwZGF0ZUNvbmZpZyA9IGZ1bmN0aW9uKGNvbmZpZykge1xuICAgIE9iamVjdC5hc3NpZ24odGhpcy5jb25maWcsIGNvbmZpZyk7XG5cbiAgICBjb25zdCB7IHNob3dNb3ZlbWVudENpcmNsZSwgc2hvd1Zpc2lvbkdyaWQgfSA9IHRoaXMuY29uZmlnO1xuXG4gICAgaWYgKHNob3dNb3ZlbWVudENpcmNsZSA9PT0gdHJ1ZSAmJiB0aGlzLm5vZGVzLmNpcmNsZSA9PT0gdW5kZWZpbmVkKSB7XG4gICAgICAgIHRoaXMubm9kZXMuY2lyY2xlID0gY3JlYXRlQ2lyY2xlTm9kZShjb25maWcpO1xuICAgICAgICB0aGlzLm5vZGVzLmNvbnRhaW5lci5hcHBlbmRDaGlsZCh0aGlzLm5vZGVzLmNpcmNsZSk7XG4gICAgfVxuXG4gICAgaWYgKHNob3dNb3ZlbWVudENpcmNsZSA9PT0gZmFsc2UgJiYgdGhpcy5ub2Rlcy5jaXJjbGUgIT09IHVuZGVmaW5lZCkge1xuICAgICAgICB0aGlzLm5vZGVzLmNvbnRhaW5lci5yZW1vdmVDaGlsZCh0aGlzLm5vZGVzLmNpcmNsZSk7XG4gICAgICAgIGRlbGV0ZSB0aGlzLm5vZGVzLmNpcmNsZTtcbiAgICB9XG5cbiAgICBpZiAoc2hvd1Zpc2lvbkdyaWQgPT09IHRydWUgJiYgdGhpcy5ub2Rlcy52aXNpb24gPT09IHVuZGVmaW5lZCkge1xuICAgICAgICB0aGlzLm5vZGVzLnZpc2lvbiA9IGNyZWF0ZVZpc2lvbk5vZGUoY29uZmlnLCB0aGlzLmdyaWRzKTtcbiAgICAgICAgdGhpcy5ub2Rlcy52aXNpb25HcmlkID0gY3JlYXRlVmlzaW9uR3JpZE5vZGVzKHRoaXMuY29uZmlnLCB0aGlzLmdyaWRzLCB0aGlzLm5vZGVzKTtcbiAgICAgICAgdGhpcy5ub2Rlcy5jb250YWluZXIuYXBwZW5kQ2hpbGQodGhpcy5ub2Rlcy52aXNpb24pO1xuICAgIH1cblxuICAgIGlmIChzaG93VmlzaW9uR3JpZCA9PT0gZmFsc2UgJiYgdGhpcy5ub2Rlcy52aXNpb24gIT09IHVuZGVmaW5lZCkge1xuICAgICAgICB0aGlzLm5vZGVzLmNvbnRhaW5lci5yZW1vdmVDaGlsZCh0aGlzLm5vZGVzLnZpc2lvbik7XG4gICAgICAgIGRlbGV0ZSB0aGlzLm5vZGVzLnZpc2lvbjtcbiAgICAgICAgZGVsZXRlIHRoaXMubm9kZXgudmlzaW9uR3JpZDtcbiAgICB9XG59XG5cbi8vID09PT09IENSRUFUSU9OID09PT09XG5cbmZ1bmN0aW9uIGNyZWF0ZUJvZHlOb2RlKGNvbmZpZykge1xuICAgIGNvbnN0IG5vZGUgPSBkb2N1bWVudC5jcmVhdGVFbGVtZW50KCdkaXYnKTtcbiAgICBub2RlLmNsYXNzTmFtZSA9ICdwYXJ0aWNsZS1ib2R5JztcbiAgICBub2RlLnN0eWxlLmJhY2tncm91bmRDb2xvciA9IGNvbmZpZy5jb2xvcjtcbiAgICByZXR1cm4gbm9kZTtcbn1cblxuZnVuY3Rpb24gY3JlYXRlQ2lyY2xlTm9kZShjb25maWcpIHtcbiAgICBpZiAoY29uZmlnLnNob3dNb3ZlbWVudENpcmNsZSA9PT0gZmFsc2UpIHtcbiAgICAgICAgcmV0dXJuIHVuZGVmaW5lZDtcbiAgICB9XG5cbiAgICBjb25zdCBub2RlID0gZG9jdW1lbnQuY3JlYXRlRWxlbWVudCgnZGl2Jyk7XG4gICAgbm9kZS5jbGFzc05hbWUgPSAncGFydGljbGUtbW92ZW1lbnQtY2lyY2xlJztcbiAgICBub2RlLnN0eWxlLmJvcmRlckNvbG9yID0gY29uZmlnLmNvbG9yO1xuICAgIHJldHVybiBub2RlO1xufVxuXG5mdW5jdGlvbiBjcmVhdGVDb250YWluZXJOb2RlKGNvbmZpZykge1xuICAgIGNvbnN0IG5vZGUgPSBkb2N1bWVudC5jcmVhdGVFbGVtZW50KCdkaXYnKTtcbiAgICBub2RlLmNsYXNzTmFtZSA9ICdwYXJ0aWNsZS1jb250YWluZXInO1xuICAgIHJldHVybiBub2RlO1xufVxuXG5mdW5jdGlvbiBjcmVhdGVWaXNpb25Ob2RlKGNvbmZpZykge1xuICAgIGlmIChjb25maWcuc2hvd1Zpc2lvbkdyaWQgPT09IGZhbHNlKSB7XG4gICAgICAgIHJldHVybiB1bmRlZmluZWQ7XG4gICAgfVxuXG4gICAgY29uc3Qgbm9kZSA9IGRvY3VtZW50LmNyZWF0ZUVsZW1lbnQoJ2RpdicpO1xuICAgIG5vZGUuY2xhc3NOYW1lID0gJ3BhcnRpY2xlLXZpc2lvbic7XG5cbiAgICByZXR1cm4gbm9kZTtcbn1cblxuZnVuY3Rpb24gY3JlYXRlVmlzaW9uR3JpZChjb25maWcpIHtcbiAgICBpZiAoY29uZmlnLnNob3dWaXNpb25HcmlkID09PSBmYWxzZSkge1xuICAgICAgICByZXR1cm4gW107XG4gICAgfVxuXG4gICAgY29uc3QgeyBncmlkU2l6ZTogc2lkZSwgdmlzaW9uUmFkaXVzOiByYWRpdXMgfSA9IGNvbmZpZztcbiAgICBjb25zdCByMCA9IHJhZGl1cztcbiAgICBjb25zdCByMSA9IHJhZGl1cyAtIHNpZGU7XG5cbiAgICBjb25zdCBwb2ludHMgPSBbXTtcblxuICAgIGZvciAobGV0IHggPSAtcmFkaXVzOyB4IDw9IHJhZGl1czsgeCArPSBzaWRlKSB7XG4gICAgICAgIGZvciAobGV0IHkgPSAtcmFkaXVzOyB5IDw9IHJhZGl1czsgeSArPSBzaWRlKSB7XG4gICAgICAgICAgICAvLyBPbWl0IGxvd2VyIGhhbGZcbiAgICAgICAgICAgIGlmICh5IDwgMCkge1xuICAgICAgICAgICAgICAgIGNvbnRpbnVlO1xuICAgICAgICAgICAgfVxuXG4gICAgICAgICAgICAvLyBJbmNsdWRlIHZpc2lvbiBiYW5kXG4gICAgICAgICAgICBjb25zdCByID0gTWF0aC5wb3coTWF0aC5wb3coeCwgMikgKyBNYXRoLnBvdyh5LCAyKSwgMC41KTtcbiAgICAgICAgICAgIGlmIChyID4gcjAgfHwgciA8IHIxKSB7XG4gICAgICAgICAgICAgICAgY29udGludWU7XG4gICAgICAgICAgICB9XG5cbiAgICAgICAgICAgIGxldCBhbHBoYSA9IE1hdGguYXRhbih5IC8geCk7XG4gICAgICAgICAgICBpZiAoeCA8IDApIHtcbiAgICAgICAgICAgICAgICBhbHBoYSA9IFJBRC50MTgwICsgYWxwaGE7XG4gICAgICAgICAgICB9XG5cbiAgICAgICAgICAgIHBvaW50cy5wdXNoKHsgeCwgeSwgciwgYWxwaGEsIHRvdWNoOiBmYWxzZSB9KTtcbiAgICAgICAgfVxuICAgIH1cblxuICAgIHJldHVybiBwb2ludHM7XG59XG5cbmZ1bmN0aW9uIGNyZWF0ZVZpc2lvbkdyaWROb2Rlcyhjb25maWcsIGdyaWRzLCBub2Rlcykge1xuICAgIGlmIChjb25maWcuc2hvd1Zpc2lvbkdyaWQgPT09IGZhbHNlKSB7XG4gICAgICAgIHJldHVybiB1bmRlZmluZWQ7XG4gICAgfVxuXG4gICAgcmV0dXJuIGdyaWRzLnZpc2lvbi5yZWR1Y2UoKGFjYywgeyB4LCB5IH0pID0+IHtcbiAgICAgICAgY29uc3QgZGl2ID0gZG9jdW1lbnQuY3JlYXRlRWxlbWVudCgnZGl2Jyk7XG4gICAgICAgIGRpdi5jbGFzc05hbWUgPSAncGFydGljbGUtdmlzaW9uLWRvdCc7XG4gICAgICAgIGRpdi5zdHlsZS5iYWNrZ3JvdW5kQ29sb3IgPSBjb25maWcuY29sb3I7XG4gICAgICAgIG5vZGVzLnZpc2lvbi5hcHBlbmRDaGlsZChkaXYpO1xuXG4gICAgICAgIGFjYy5wdXNoKGRpdik7XG5cbiAgICAgICAgcmV0dXJuIGFjYztcbiAgICB9LCBbXSk7XG59XG5cbi8vID09PT09IENBTENVTEFUSU9OUyA9PT09PVxuXG5mdW5jdGlvbiB1cGRhdGVBcmMoYXJjLCB7IGJvdW5kcywgcmFuZG9taXplLCBzcGVlZCB9KSB7XG4gICAgLy8gUmFuZG9tbHkgY2hhbmdlIHJhZGl1cyBhbmQgcm90YXRpb24gZGlyZWN0aW9uLlxuICAgIGlmIChhcmMubGVuZ3RoIDw9IDApIHtcbiAgICAgICAgYXJjLmxlbmd0aCA9IHJhbmRvbS5udW0oUkFELnQ5MCwgUkFELnQzNjApO1xuXG4gICAgICAgIGlmIChyYW5kb21pemUgPT09IHRydWUpIHtcbiAgICAgICAgICAgIGFyYyA9IG1vdmVBcmMoYXJjLCByYW5kb20ubnVtKDEwMCwgMjAwKSk7XG5cbiAgICAgICAgICAgIGlmIChyYW5kb20uYm9vbCgwLjgpKSB7XG4gICAgICAgICAgICAgICAgYXJjLmNsb2Nrd2lzZSA9ICFhcmMuY2xvY2t3aXNlO1xuICAgICAgICAgICAgICAgIGFyYyA9IGNoYW5nZURpcmVjdGlvbihhcmMpO1xuICAgICAgICAgICAgfVxuICAgICAgICB9XG4gICAgfVxuXG4gICAgLy8gRW5zdXJlIGNvbnN0YW50IHZlbG9jaXR5IGFuZCB0aGV0YSBiZXR3ZWVuIDAgYW5kIDLPgC5cbiAgICBjb25zdCBkZWx0YSA9IHNwZWVkIC8gYXJjLnJhZGl1cztcbiAgICBhcmMubGVuZ3RoIC09IGRlbHRhO1xuXG4gICAgYXJjLnRoZXRhICs9IChhcmMuY2xvY2t3aXNlID8gLWRlbHRhIDogK2RlbHRhKTtcbiAgICBhcmMudGhldGEgPSAoYXJjLnRoZXRhID4gMCA/IGFyYy50aGV0YSAlIFJBRC50MzYwIDogUkFELnQzNjAgKyBhcmMudGhldGEpO1xuXG4gICAgYXJjLmVuZFggPSBhcmMuY2VudGVyWCArIGFyYy5yYWRpdXMgKiBNYXRoLmNvcyhhcmMudGhldGEpO1xuICAgIGFyYy5lbmRZID0gYXJjLmNlbnRlclkgLSBhcmMucmFkaXVzICogTWF0aC5zaW4oYXJjLnRoZXRhKTtcblxuICAgIC8vIE92ZXJmbG93LlxuICAgIGlmIChhcmMuZW5kWCA8IDApIHtcbiAgICAgICAgYXJjLmVuZFggKz0gYm91bmRzLndpZHRoO1xuICAgICAgICBhcmMuY2VudGVyWCArPSBib3VuZHMud2lkdGhcbiAgICB9IGVsc2UgaWYgKGFyYy5lbmRYID4gYm91bmRzLndpZHRoKSB7XG4gICAgICAgIGFyYy5lbmRYIC09IGJvdW5kcy53aWR0aDtcbiAgICAgICAgYXJjLmNlbnRlclggLT0gYm91bmRzLndpZHRoXG4gICAgfVxuXG4gICAgaWYgKGFyYy5lbmRZIDwgMCkge1xuICAgICAgICBhcmMuZW5kWSArPSBib3VuZHMuaGVpZ2h0O1xuICAgICAgICBhcmMuY2VudGVyWSArPSBib3VuZHMuaGVpZ2h0XG4gICAgfSBlbHNlIGlmIChhcmMuZW5kWSA+IGJvdW5kcy5oZWlnaHQpIHtcbiAgICAgICAgYXJjLmVuZFkgLT0gYm91bmRzLmhlaWdodDtcbiAgICAgICAgYXJjLmNlbnRlclkgLT0gYm91bmRzLmhlaWdodFxuICAgIH1cblxuICAgIHJldHVybiBhcmM7XG59XG5cbmZ1bmN0aW9uIHVwZGF0ZVZpc2lvbkdyaWQoYXJjLCBjb25maWcsIGdyaWRzKSB7XG4gICAgY29uc3QgeyBnbG9iYWwsIHZpc2lvbiB9ID0gZ3JpZHM7XG5cbiAgICByZXR1cm4gdmlzaW9uLnJlZHVjZSgoYWNjLCBwb2ludCkgPT4ge1xuICAgICAgICBjb25zdCByYWQgPSBhcmMuY2xvY2t3aXNlXG4gICAgICAgICAgICA/IGFyYy50aGV0YSAtIHBvaW50LmFscGhhXG4gICAgICAgICAgICA6IGFyYy50aGV0YSAtIHBvaW50LmFscGhhICsgUkFELnQxODA7XG5cbiAgICAgICAgcG9pbnQueCA9IHBvaW50LnIgKiBNYXRoLmNvcyhyYWQpICsgY29uZmlnLnZpc2lvblJhZGl1cztcbiAgICAgICAgcG9pbnQueSA9IC1wb2ludC5yICogTWF0aC5zaW4ocmFkKSArIGNvbmZpZy52aXNpb25SYWRpdXM7XG5cbiAgICAgICAgLy8gY29uc29sZS53YXJuKHBvaW50LmFscGhhLCBwb2ludC5hbHBoYSArIGFyYy50aGV0YSlcblxuICAgICAgICAvLyBjb25zdCBncmlkWCA9IHBvaW50LnggLSBwb2ludC54ICUgNTtcbiAgICAgICAgLy8gY29uc3QgZ3JpZFkgPSBwb2ludC55IC0gcG9pbnQueSAlIDU7XG5cbiAgICAgICAgLy8gcG9pbnQudG91Y2ggPSAoZ2xvYmFsW2dyaWRYXSAhPT0gdW5kZWZpbmVkICYmIGdsb2JhbFtncmlkWF1bZ3JpZFldICE9PSB1bmRlZmluZWQpO1xuXG4gICAgICAgIHJldHVybiBhY2MuY29uY2F0KHBvaW50KTtcbiAgICB9LCBbXSk7XG59XG5cbmZ1bmN0aW9uIG1vdmVBcmMoYXJjLCBuZXdSYWRpdXMpIHtcbiAgICBjb25zdCByMCA9IGFyYy5yYWRpdXM7XG4gICAgY29uc3QgcjEgPSBuZXdSYWRpdXM7XG5cbiAgICAvLyBNb3ZlcyBhcmMgY2VudGVyIHRvIG5ldyByYWRpdXMgd2hpbGUga2VlcGluZyB0aGV0YSBjb25zdGFudC5cbiAgICBhcmMuY2VudGVyWCAtPSAocjEgLSByMCkgKiBNYXRoLmNvcyhhcmMudGhldGEpO1xuICAgIGFyYy5jZW50ZXJZICs9IChyMSAtIHIwKSAqIE1hdGguc2luKGFyYy50aGV0YSk7XG4gICAgYXJjLnJhZGl1cyA9IHIxO1xuXG4gICAgcmV0dXJuIGFyYztcbn1cblxuZnVuY3Rpb24gY2hhbmdlRGlyZWN0aW9uKGFyYykge1xuICAgIGFyYy50aGV0YSA9IChhcmMudGhldGEgKyBSQUQudDE4MCkgJSBSQUQudDM2MDtcbiAgICBhcmMuY2VudGVyWCAtPSAoMiAqIGFyYy5yYWRpdXMpICogTWF0aC5jb3MoYXJjLnRoZXRhKTtcbiAgICBhcmMuY2VudGVyWSArPSAoMiAqIGFyYy5yYWRpdXMpICogTWF0aC5zaW4oYXJjLnRoZXRhKTtcblxuICAgIHJldHVybiBhcmM7XG59XG5cbi8vID09PT09IFJFTkRFUklORyA9PT09PVxuZnVuY3Rpb24gcmVwYWludENvbnRhaW5lcihub2RlLCBhcmMpIHtcbiAgICBub2RlLnN0eWxlLmxlZnQgPSBgJHthcmMuZW5kWH1weGA7XG4gICAgbm9kZS5zdHlsZS50b3AgPSBgJHthcmMuZW5kWX1weGA7XG59XG5cbmZ1bmN0aW9uIHJlcGFpbnRCb2R5KG5vZGUsIGFyYykge1xuICAgIGNvbnN0IHJhZCA9IGFyYy5jbG9ja3dpc2VcbiAgICAgICAgPyBSQUQudDE4MCAtIGFyYy50aGV0YVxuICAgICAgICA6IFJBRC50MzYwIC0gYXJjLnRoZXRhO1xuXG4gICAgbm9kZS5zdHlsZS50cmFuc2Zvcm0gPSBgcm90YXRlKCR7cmFkICsgUkFELnQ0NX1yYWQpYDtcbn1cblxuZnVuY3Rpb24gcmVwYWludENpcmNsZShub2RlLCBhcmMpIHtcbiAgICBpZiAobm9kZSA9PT0gdW5kZWZpbmVkKSB7XG4gICAgICAgIHJldHVybjtcbiAgICB9XG5cbiAgICBub2RlLnN0eWxlLndpZHRoID0gYCR7MiAqIGFyYy5yYWRpdXN9cHhgO1xuICAgIG5vZGUuc3R5bGUuaGVpZ2h0ID0gYCR7MiAqIGFyYy5yYWRpdXN9cHhgO1xuXG4gICAgbm9kZS5zdHlsZS5sZWZ0ID0gYC0ke2FyYy5yYWRpdXMgKyBhcmMucmFkaXVzICogTWF0aC5jb3MoYXJjLnRoZXRhKX1weGA7XG4gICAgbm9kZS5zdHlsZS50b3AgPSBgLSR7YXJjLnJhZGl1cyAtIGFyYy5yYWRpdXMgKiBNYXRoLnNpbihhcmMudGhldGEpfXB4YDtcblxuICAgIG5vZGUuc3R5bGUuYm9yZGVyUmFkaXVzID0gYCR7YXJjLnJhZGl1c31weGA7XG59XG5cbmZ1bmN0aW9uIHJlcGFpbnRWaXNpb24obm9kZSwgYXJjKSB7XG4gICAgaWYgKG5vZGUgPT09IHVuZGVmaW5lZCkge1xuICAgICAgICByZXR1cm47XG4gICAgfVxuXG4gICAgY29uc3QgcmFkID0gYXJjLmNsb2Nrd2lzZVxuICAgICAgICA/IFJBRC50MTgwIC0gYXJjLnRoZXRhXG4gICAgICAgIDogUkFELnQzNjAgLSBhcmMudGhldGE7XG59XG5cbmZ1bmN0aW9uIHJlcGFpbnRWaXNpb25HcmlkKG5vZGVzLCBhcmMsIGdyaWRzKSB7XG4gICAgaWYgKG5vZGVzID09PSB1bmRlZmluZWQpIHtcbiAgICAgICAgcmV0dXJuO1xuICAgIH1cblxuICAgIGdyaWRzLnZpc2lvbi5mb3JFYWNoKCh7IHgsIHksIHRvdWNoIH0sIGkpID0+IHtcbiAgICAgICAgbm9kZXNbaV0uc3R5bGUubGVmdCA9IGAke3h9cHhgO1xuICAgICAgICBub2Rlc1tpXS5zdHlsZS50b3AgPSBgJHt5fXB4YDtcblxuICAgICAgICBub2Rlc1tpXS5zdHlsZS5ib3JkZXIgPSAodG91Y2ggPyAnMnB4IHNvbGlkIHJlZCcgOiAnMCcpO1xuICAgIH0pO1xufVxuXG5leHBvcnQgZGVmYXVsdCBQYXJ0aWNsZTtcblxuXG5cbi8vIFdFQlBBQ0sgRk9PVEVSIC8vXG4vLyBqcy9wYXJ0aWNsZS5qcyJdLCJtYXBwaW5ncyI6Ijs7Ozs7O0FBQUE7QUFDQTs7O0FBQUE7QUFDQTtBQUFBO0FBQ0E7Ozs7O0FBQ0E7QUFDQTtBQUFBO0FBQUE7QUFDQTtBQUFBO0FBQUE7QUFDQTtBQUFBO0FBQUE7QUFIQTtBQUNBO0FBS0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBUkE7QUFDQTtBQVVBO0FBQ0E7QUFDQTtBQUZBO0FBQ0E7QUFJQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFSQTtBQUNBO0FBVUE7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFOQTtBQUNBO0FBUUE7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFGQTtBQUFBO0FBQUE7QUFDQTtBQUNBO0FBR0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUpBO0FBQUE7QUFDQTtBQUtBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUFBO0FBQUE7QUFDQTtBQUFBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFBQTtBQUFBO0FBQUE7QUFDQTtBQUFBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUFBO0FBQUE7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBR0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFHQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBR0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUFBO0FBQUE7QUFBQTtBQUNBO0FBQUE7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQSIsInNvdXJjZVJvb3QiOiIifQ=="); /***/ }), /* 34 */ @@ -974,7 +974,7 @@ eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n}); /***/ (function(module, exports, __webpack_require__) { "use strict"; -eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\n\nvar _rxjs = __webpack_require__(/*! rxjs */ 14);\n\nvar _rxjs2 = _interopRequireDefault(_rxjs);\n\nvar _particle = __webpack_require__(/*! ./particle */ 33);\n\nvar _particle2 = _interopRequireDefault(_particle);\n\nvar _store = __webpack_require__(/*! ./store */ 22);\n\nvar _store2 = _interopRequireDefault(_store);\n\nvar _controls = __webpack_require__(/*! ./controls */ 21);\n\nvar _controls2 = _interopRequireDefault(_controls);\n\nvar _enums = __webpack_require__(/*! ./enums */ 16);\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nfunction Animation2a() {\n this.options = {\n count: 1,\n maxCount: 10,\n randomize: true,\n showMovementCircle: true,\n showVisionGrid: true,\n speed: 4\n };\n\n this.container = document.getElementById('animation2a');\n this.bounds = this.container.getBoundingClientRect();\n\n this.particles = [];\n this.globalGrid = createGlobalGrid(this.container, this.bounds);\n\n var controls = new _controls2.default(document.getElementById('controls2a'), this.options);\n\n controls.mount().subscribe(this.subscriber.bind(this));\n\n this.updateAnimating(this.options.animating);\n this.updateCount(this.options.count);\n\n // TODO X dimension modified by core UI, maybe recalc grid in animation start?\n // TODO remove bottom padding from Disqus\n // TODO perf - cache trig or perform operations\n // TODO only randomize movement on 1a\n\n // TODO ANIM2a Vision grid touches trig transform\n // TODO ANIM2a randomize hazards\n // TODO ANIM2 particle evade\n // TODO ANIM2b Scale vision grid to 1000? particles\n\n // TODO ANIM3 flocking\n};\n\nAnimation2a.prototype.subscriber = function (_ref) {\n var key = _ref.key,\n value = _ref.value;\n\n switch (key) {\n case _enums.CONTROLS.ANIMATING:\n this.updateAnimating(value);break;\n case _enums.CONTROLS.COUNT:\n this.updateCount(value);break;\n case _enums.CONTROLS.RANDOMIZE:\n this.updateRandomize(value);break;\n case _enums.CONTROLS.SPEED:\n this.updateSpeed(value);break;\n }\n};\n\nAnimation2a.prototype.nextFrame = function () {\n this.particles.forEach(function (p) {\n return p.nextFrame();\n });\n};\n\nAnimation2a.prototype.updateAnimating = function (isAnimating) {\n var _this = this;\n\n this.options.animating = isAnimating;\n\n if (isAnimating) {\n var fps$ = _rxjs2.default.Observable.interval(1000 / 32).takeWhile(function (_) {\n return _this.options.animating;\n });\n\n fps$.subscribe(this.nextFrame.bind(this));\n }\n};\n\nAnimation2a.prototype.updateCount = function (count) {\n while (this.particles.length >= count) {\n delete this.particles.pop().remove();\n }\n\n while (this.particles.length < count) {\n var p = new _particle2.default(this.container, this.bounds, this.options, this.globalGrid);\n this.particles.push(p);\n }\n};\n\nAnimation2a.prototype.updateRandomize = function (value) {\n this.options.randomize = value;\n this.particles.forEach(function (p) {\n return p.updateConfig({ randomize: value });\n });\n};\n\nAnimation2a.prototype.updateSpeed = function (value) {\n this.options.speed = value;\n this.particles.forEach(function (p) {\n return p.updateConfig({ speed: value });\n });\n};\n\nfunction createGlobalGrid(container, bounds) {\n var grid = {};\n var gridSize = 5;\n\n var hazards = [{ x: 100, y: 100, w: 200, h: 200 }, { x: 600, y: 200, w: 200, h: 200 }];\n\n return hazards.reduce(function (acc, _ref2) {\n var x = _ref2.x,\n y = _ref2.y,\n w = _ref2.w,\n h = _ref2.h;\n\n var div = document.createElement('div');\n div.className = 'hazard';\n div.style.left = x + 'px';\n div.style.top = y + 'px';\n div.style.height = h + 'px';\n div.style.width = w + 'px';\n container.appendChild(div);\n\n for (var i = x; i <= x + w; i += gridSize) {\n for (var j = y; j <= y + h; j += gridSize) {\n if (acc[i] === undefined) {\n acc[i] = {};\n }\n\n if (acc[i][j] !== undefined) {\n continue;\n }\n\n var dot = document.createElement('dot');\n dot.className = 'hazard-dot';\n dot.style.left = i - x + 'px';\n dot.style.top = j - y + 'px';\n div.appendChild(dot);\n\n acc[i][j] = true;\n }\n }\n\n return acc;\n }, {});\n}\n\nexports.default = Animation2a;//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiNzUuanMiLCJzb3VyY2VzIjpbIndlYnBhY2s6Ly8vanMvYW5pbWF0aW9uMmEuanM/YzJmNyJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUngsIHsgT2JzZXJ2YWJsZSB9IGZyb20gJ3J4anMnO1xuaW1wb3J0IFBhcnRpY2xlIGZyb20gJy4vcGFydGljbGUnO1xuaW1wb3J0IFN0b3JlIGZyb20gJy4vc3RvcmUnO1xuaW1wb3J0IENvbnRyb2xzIGZyb20gJy4vY29udHJvbHMnO1xuaW1wb3J0IHsgQ09OVFJPTFMgfSBmcm9tICcuL2VudW1zJztcblxuZnVuY3Rpb24gQW5pbWF0aW9uMmEoKSB7XG4gICAgdGhpcy5vcHRpb25zID0ge1xuICAgICAgICBjb3VudDogMSxcbiAgICAgICAgbWF4Q291bnQ6IDEwLFxuICAgICAgICByYW5kb21pemU6IHRydWUsXG4gICAgICAgIHNob3dNb3ZlbWVudENpcmNsZTogdHJ1ZSxcbiAgICAgICAgc2hvd1Zpc2lvbkdyaWQ6IHRydWUsXG4gICAgICAgIHNwZWVkOiA0XG4gICAgfTtcblxuICAgIHRoaXMuY29udGFpbmVyID0gZG9jdW1lbnQuZ2V0RWxlbWVudEJ5SWQoJ2FuaW1hdGlvbjJhJyk7XG4gICAgdGhpcy5ib3VuZHMgPSB0aGlzLmNvbnRhaW5lci5nZXRCb3VuZGluZ0NsaWVudFJlY3QoKTtcblxuICAgIHRoaXMucGFydGljbGVzID0gW107XG4gICAgdGhpcy5nbG9iYWxHcmlkID0gY3JlYXRlR2xvYmFsR3JpZCh0aGlzLmNvbnRhaW5lciwgdGhpcy5ib3VuZHMpO1xuXG4gICAgY29uc3QgY29udHJvbHMgPSBuZXcgQ29udHJvbHMoXG4gICAgICAgIGRvY3VtZW50LmdldEVsZW1lbnRCeUlkKCdjb250cm9sczJhJyksXG4gICAgICAgIHRoaXMub3B0aW9uc1xuICAgICk7XG5cbiAgICBjb250cm9scy5tb3VudCgpLnN1YnNjcmliZSh0aGlzLnN1YnNjcmliZXIuYmluZCh0aGlzKSk7XG5cbiAgICB0aGlzLnVwZGF0ZUFuaW1hdGluZyh0aGlzLm9wdGlvbnMuYW5pbWF0aW5nKTtcbiAgICB0aGlzLnVwZGF0ZUNvdW50KHRoaXMub3B0aW9ucy5jb3VudCk7XG5cbiAgICAvLyBUT0RPIFggZGltZW5zaW9uIG1vZGlmaWVkIGJ5IGNvcmUgVUksIG1heWJlIHJlY2FsYyBncmlkIGluIGFuaW1hdGlvbiBzdGFydD9cbiAgICAvLyBUT0RPIHJlbW92ZSBib3R0b20gcGFkZGluZyBmcm9tIERpc3F1c1xuICAgIC8vIFRPRE8gcGVyZiAtIGNhY2hlIHRyaWcgb3IgcGVyZm9ybSBvcGVyYXRpb25zXG4gICAgLy8gVE9ETyBvbmx5IHJhbmRvbWl6ZSBtb3ZlbWVudCBvbiAxYVxuXG4gICAgLy8gVE9ETyBBTklNMmEgVmlzaW9uIGdyaWQgdG91Y2hlcyB0cmlnIHRyYW5zZm9ybVxuICAgIC8vIFRPRE8gQU5JTTJhIHJhbmRvbWl6ZSBoYXphcmRzXG4gICAgLy8gVE9ETyBBTklNMiBwYXJ0aWNsZSBldmFkZVxuICAgIC8vIFRPRE8gQU5JTTJiIFNjYWxlIHZpc2lvbiBncmlkIHRvIDEwMDA/IHBhcnRpY2xlc1xuXG4gICAgLy8gVE9ETyBBTklNMyBmbG9ja2luZ1xufTtcblxuQW5pbWF0aW9uMmEucHJvdG90eXBlLnN1YnNjcmliZXIgPSBmdW5jdGlvbih7IGtleSwgdmFsdWUgfSkge1xuICAgIHN3aXRjaChrZXkpIHtcbiAgICAgICAgY2FzZSBDT05UUk9MUy5BTklNQVRJTkc6IHRoaXMudXBkYXRlQW5pbWF0aW5nKHZhbHVlKTsgYnJlYWs7XG4gICAgICAgIGNhc2UgQ09OVFJPTFMuQ09VTlQ6IHRoaXMudXBkYXRlQ291bnQodmFsdWUpOyBicmVhaztcbiAgICAgICAgY2FzZSBDT05UUk9MUy5SQU5ET01JWkU6IHRoaXMudXBkYXRlUmFuZG9taXplKHZhbHVlKTsgYnJlYWs7XG4gICAgICAgIGNhc2UgQ09OVFJPTFMuU1BFRUQ6IHRoaXMudXBkYXRlU3BlZWQodmFsdWUpOyBicmVhaztcbiAgICB9XG59XG5cbkFuaW1hdGlvbjJhLnByb3RvdHlwZS5uZXh0RnJhbWUgPSBmdW5jdGlvbigpIHtcbiAgICB0aGlzLnBhcnRpY2xlcy5mb3JFYWNoKHAgPT4gcC5uZXh0RnJhbWUoKSk7XG59XG5cbkFuaW1hdGlvbjJhLnByb3RvdHlwZS51cGRhdGVBbmltYXRpbmcgPSBmdW5jdGlvbihpc0FuaW1hdGluZykge1xuICAgIHRoaXMub3B0aW9ucy5hbmltYXRpbmcgPSBpc0FuaW1hdGluZztcblxuICAgIGlmIChpc0FuaW1hdGluZykge1xuICAgICAgICBjb25zdCBmcHMkID0gUnguT2JzZXJ2YWJsZS5pbnRlcnZhbCgxMDAwIC8gMzIpXG4gICAgICAgICAgICAudGFrZVdoaWxlKF8gPT4gdGhpcy5vcHRpb25zLmFuaW1hdGluZyk7XG5cbiAgICAgICAgZnBzJC5zdWJzY3JpYmUodGhpcy5uZXh0RnJhbWUuYmluZCh0aGlzKSk7XG4gICAgfVxufVxuXG5BbmltYXRpb24yYS5wcm90b3R5cGUudXBkYXRlQ291bnQgPSBmdW5jdGlvbihjb3VudCkge1xuICAgIHdoaWxlICh0aGlzLnBhcnRpY2xlcy5sZW5ndGggPj0gY291bnQpIHtcbiAgICAgICAgZGVsZXRlIHRoaXMucGFydGljbGVzLnBvcCgpLnJlbW92ZSgpO1xuICAgIH1cblxuICAgIHdoaWxlICh0aGlzLnBhcnRpY2xlcy5sZW5ndGggPCBjb3VudCkge1xuICAgICAgICBjb25zdCBwID0gbmV3IFBhcnRpY2xlKHRoaXMuY29udGFpbmVyLCB0aGlzLmJvdW5kcywgdGhpcy5vcHRpb25zLCB0aGlzLmdsb2JhbEdyaWQpO1xuICAgICAgICB0aGlzLnBhcnRpY2xlcy5wdXNoKHApO1xuICAgIH1cbn1cblxuQW5pbWF0aW9uMmEucHJvdG90eXBlLnVwZGF0ZVJhbmRvbWl6ZSA9IGZ1bmN0aW9uKHZhbHVlKSB7XG4gICAgdGhpcy5vcHRpb25zLnJhbmRvbWl6ZSA9IHZhbHVlO1xuICAgIHRoaXMucGFydGljbGVzLmZvckVhY2gocCA9PiBwLnVwZGF0ZUNvbmZpZyh7IHJhbmRvbWl6ZTogdmFsdWUgfSkpO1xufVxuXG5BbmltYXRpb24yYS5wcm90b3R5cGUudXBkYXRlU3BlZWQgPSBmdW5jdGlvbih2YWx1ZSkge1xuICAgIHRoaXMub3B0aW9ucy5zcGVlZCA9IHZhbHVlO1xuICAgIHRoaXMucGFydGljbGVzLmZvckVhY2gocCA9PiBwLnVwZGF0ZUNvbmZpZyh7IHNwZWVkOiB2YWx1ZSB9KSk7XG59XG5cbmZ1bmN0aW9uIGNyZWF0ZUdsb2JhbEdyaWQoY29udGFpbmVyLCBib3VuZHMpIHtcbiAgICBjb25zdCBncmlkID0ge307XG4gICAgY29uc3QgZ3JpZFNpemUgPSA1O1xuXG4gICAgY29uc3QgaGF6YXJkcyA9IFtcbiAgICAgICAgeyB4OiAxMDAsIHk6IDEwMCwgdzogMjAwLCBoOiAyMDAgfSxcbiAgICAgICAgeyB4OiA2MDAsIHk6IDIwMCwgdzogMjAwLCBoOiAyMDAgfSxcbiAgICBdO1xuXG4gICAgcmV0dXJuIGhhemFyZHMucmVkdWNlKChhY2MsIHsgeCwgeSwgdywgaCB9KSA9PiB7XG4gICAgICAgIGNvbnN0IGRpdiA9IGRvY3VtZW50LmNyZWF0ZUVsZW1lbnQoJ2RpdicpO1xuICAgICAgICBkaXYuY2xhc3NOYW1lID0gJ2hhemFyZCc7XG4gICAgICAgIGRpdi5zdHlsZS5sZWZ0ID0gYCR7eH1weGA7XG4gICAgICAgIGRpdi5zdHlsZS50b3AgPSBgJHt5fXB4YDtcbiAgICAgICAgZGl2LnN0eWxlLmhlaWdodCA9IGAke2h9cHhgO1xuICAgICAgICBkaXYuc3R5bGUud2lkdGggPSBgJHt3fXB4YDtcbiAgICAgICAgY29udGFpbmVyLmFwcGVuZENoaWxkKGRpdik7XG5cbiAgICAgICAgZm9yIChsZXQgaSA9IHg7IGkgPD0gKHggKyB3KTsgaSArPSBncmlkU2l6ZSkge1xuICAgICAgICAgICAgZm9yIChsZXQgaiA9IHk7IGogPD0gKHkgKyBoKTsgaiArPSBncmlkU2l6ZSkge1xuICAgICAgICAgICAgICAgIGlmIChhY2NbaV0gPT09IHVuZGVmaW5lZCkge1xuICAgICAgICAgICAgICAgICAgICBhY2NbaV0gPSB7fTtcbiAgICAgICAgICAgICAgICB9XG5cbiAgICAgICAgICAgICAgICBpZiAoYWNjW2ldW2pdICE9PSB1bmRlZmluZWQpIHtcbiAgICAgICAgICAgICAgICAgICAgY29udGludWU7XG4gICAgICAgICAgICAgICAgfVxuXG4gICAgICAgICAgICAgICAgY29uc3QgZG90ID0gZG9jdW1lbnQuY3JlYXRlRWxlbWVudCgnZG90Jyk7XG4gICAgICAgICAgICAgICAgZG90LmNsYXNzTmFtZSA9ICdoYXphcmQtZG90JztcbiAgICAgICAgICAgICAgICBkb3Quc3R5bGUubGVmdCA9IGAke2kgLSB4fXB4YDtcbiAgICAgICAgICAgICAgICBkb3Quc3R5bGUudG9wID0gYCR7aiAtIHl9cHhgO1xuICAgICAgICAgICAgICAgIGRpdi5hcHBlbmRDaGlsZChkb3QpO1xuXG4gICAgICAgICAgICAgICAgYWNjW2ldW2pdID0gdHJ1ZTtcbiAgICAgICAgICAgIH1cbiAgICAgICAgfVxuXG5cbiAgICAgICAgcmV0dXJuIGFjYztcbiAgICB9LCB7fSk7XG59XG5cbmV4cG9ydCBkZWZhdWx0IEFuaW1hdGlvbjJhO1xuXG5cblxuLy8gV0VCUEFDSyBGT09URVIgLy9cbi8vIGpzL2FuaW1hdGlvbjJhLmpzIl0sIm1hcHBpbmdzIjoiOzs7Ozs7QUFBQTtBQUNBOzs7QUFBQTtBQUNBOzs7QUFBQTtBQUNBOzs7QUFBQTtBQUNBOzs7QUFBQTtBQUNBOzs7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBTkE7QUFDQTtBQVFBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFJQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUFBO0FBQUE7QUFDQTtBQUFBO0FBQ0E7QUFBQTtBQUNBO0FBQUE7QUFDQTtBQUFBO0FBQ0E7QUFBQTtBQUpBO0FBTUE7QUFDQTtBQUNBO0FBQ0E7QUFBQTtBQUFBO0FBQ0E7QUFDQTtBQUNBO0FBQUE7QUFDQTtBQUFBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFBQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQUE7QUFBQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFBQTtBQUFBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUlBO0FBQUE7QUFBQTtBQUFBO0FBQUE7QUFDQTtBQUFBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBRUE7QUFDQTtBQUNBO0FBQ0E7QUFDQSIsInNvdXJjZVJvb3QiOiIifQ=="); +eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\n\nvar _rxjs = __webpack_require__(/*! rxjs */ 14);\n\nvar _rxjs2 = _interopRequireDefault(_rxjs);\n\nvar _particle = __webpack_require__(/*! ./particle */ 33);\n\nvar _particle2 = _interopRequireDefault(_particle);\n\nvar _store = __webpack_require__(/*! ./store */ 22);\n\nvar _store2 = _interopRequireDefault(_store);\n\nvar _controls = __webpack_require__(/*! ./controls */ 21);\n\nvar _controls2 = _interopRequireDefault(_controls);\n\nvar _enums = __webpack_require__(/*! ./enums */ 16);\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nfunction Animation2a() {\n this.options = {\n count: 1,\n maxCount: 10,\n randomize: true,\n showMovementCircle: true,\n showVisionGrid: true,\n speed: 4\n };\n\n this.container = document.getElementById('animation2a');\n this.bounds = this.container.getBoundingClientRect();\n\n this.particles = [];\n this.globalGrid = createGlobalGrid(this.container, this.bounds);\n\n var controls = new _controls2.default(document.getElementById('controls2a'), this.options);\n\n controls.mount().subscribe(this.subscriber.bind(this));\n\n this.updateAnimating(this.options.animating);\n this.updateCount(this.options.count);\n\n // TODO X dimension modified by core UI, maybe recalc grid in animation start?\n // TODO remove bottom padding from Disqus\n // TODO perf - cache trig or perform operations\n // TODO only randomize movement on 1a\n\n // TODO ANIM2a Vision grid touches trig transform\n // TODO ANIM2a randomize hazards\n // TODO ANIM2 particle evade\n // TODO ANIM2b Scale vision grid to 1000 particles\n\n // TODO ANIM3 flocking\n};\n\nAnimation2a.prototype.subscriber = function (_ref) {\n var key = _ref.key,\n value = _ref.value;\n\n switch (key) {\n case _enums.CONTROLS.ANIMATING:\n this.updateAnimating(value);break;\n case _enums.CONTROLS.COUNT:\n this.updateCount(value);break;\n case _enums.CONTROLS.RANDOMIZE:\n this.updateRandomize(value);break;\n case _enums.CONTROLS.SPEED:\n this.updateSpeed(value);break;\n }\n};\n\nAnimation2a.prototype.nextFrame = function () {\n this.particles.forEach(function (p) {\n return p.nextFrame();\n });\n};\n\nAnimation2a.prototype.updateAnimating = function (isAnimating) {\n var _this = this;\n\n this.options.animating = isAnimating;\n\n if (isAnimating) {\n var fps$ = _rxjs2.default.Observable.interval(1000 / 32).takeWhile(function (_) {\n return _this.options.animating;\n });\n\n fps$.subscribe(this.nextFrame.bind(this));\n }\n};\n\nAnimation2a.prototype.updateCount = function (count) {\n while (this.particles.length >= count) {\n delete this.particles.pop().remove();\n }\n\n while (this.particles.length < count) {\n var p = new _particle2.default(this.container, this.bounds, this.options, this.globalGrid);\n this.particles.push(p);\n }\n};\n\nAnimation2a.prototype.updateRandomize = function (value) {\n this.options.randomize = value;\n this.particles.forEach(function (p) {\n return p.updateConfig({ randomize: value });\n });\n};\n\nAnimation2a.prototype.updateSpeed = function (value) {\n this.options.speed = value;\n this.particles.forEach(function (p) {\n return p.updateConfig({ speed: value });\n });\n};\n\nfunction createGlobalGrid(container, bounds) {\n var grid = {};\n var gridSize = 5;\n\n var hazards = [{ x: 100, y: 100, w: 200, h: 200 }, { x: 600, y: 200, w: 200, h: 200 }];\n\n return hazards.reduce(function (acc, _ref2) {\n var x = _ref2.x,\n y = _ref2.y,\n w = _ref2.w,\n h = _ref2.h;\n\n var div = document.createElement('div');\n div.className = 'hazard';\n div.style.left = x + 'px';\n div.style.top = y + 'px';\n div.style.height = h + 'px';\n div.style.width = w + 'px';\n container.appendChild(div);\n\n for (var i = x; i <= x + w; i += gridSize) {\n for (var j = y; j <= y + h; j += gridSize) {\n if (acc[i] === undefined) {\n acc[i] = {};\n }\n\n if (acc[i][j] !== undefined) {\n continue;\n }\n\n var dot = document.createElement('dot');\n dot.className = 'hazard-dot';\n dot.style.left = i - x + 'px';\n dot.style.top = j - y + 'px';\n div.appendChild(dot);\n\n acc[i][j] = true;\n }\n }\n\n return acc;\n }, {});\n}\n\nexports.default = Animation2a;//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiNzUuanMiLCJzb3VyY2VzIjpbIndlYnBhY2s6Ly8vanMvYW5pbWF0aW9uMmEuanM/YzJmNyJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUngsIHsgT2JzZXJ2YWJsZSB9IGZyb20gJ3J4anMnO1xuaW1wb3J0IFBhcnRpY2xlIGZyb20gJy4vcGFydGljbGUnO1xuaW1wb3J0IFN0b3JlIGZyb20gJy4vc3RvcmUnO1xuaW1wb3J0IENvbnRyb2xzIGZyb20gJy4vY29udHJvbHMnO1xuaW1wb3J0IHsgQ09OVFJPTFMgfSBmcm9tICcuL2VudW1zJztcblxuZnVuY3Rpb24gQW5pbWF0aW9uMmEoKSB7XG4gICAgdGhpcy5vcHRpb25zID0ge1xuICAgICAgICBjb3VudDogMSxcbiAgICAgICAgbWF4Q291bnQ6IDEwLFxuICAgICAgICByYW5kb21pemU6IHRydWUsXG4gICAgICAgIHNob3dNb3ZlbWVudENpcmNsZTogdHJ1ZSxcbiAgICAgICAgc2hvd1Zpc2lvbkdyaWQ6IHRydWUsXG4gICAgICAgIHNwZWVkOiA0XG4gICAgfTtcblxuICAgIHRoaXMuY29udGFpbmVyID0gZG9jdW1lbnQuZ2V0RWxlbWVudEJ5SWQoJ2FuaW1hdGlvbjJhJyk7XG4gICAgdGhpcy5ib3VuZHMgPSB0aGlzLmNvbnRhaW5lci5nZXRCb3VuZGluZ0NsaWVudFJlY3QoKTtcblxuICAgIHRoaXMucGFydGljbGVzID0gW107XG4gICAgdGhpcy5nbG9iYWxHcmlkID0gY3JlYXRlR2xvYmFsR3JpZCh0aGlzLmNvbnRhaW5lciwgdGhpcy5ib3VuZHMpO1xuXG4gICAgY29uc3QgY29udHJvbHMgPSBuZXcgQ29udHJvbHMoXG4gICAgICAgIGRvY3VtZW50LmdldEVsZW1lbnRCeUlkKCdjb250cm9sczJhJyksXG4gICAgICAgIHRoaXMub3B0aW9uc1xuICAgICk7XG5cbiAgICBjb250cm9scy5tb3VudCgpLnN1YnNjcmliZSh0aGlzLnN1YnNjcmliZXIuYmluZCh0aGlzKSk7XG5cbiAgICB0aGlzLnVwZGF0ZUFuaW1hdGluZyh0aGlzLm9wdGlvbnMuYW5pbWF0aW5nKTtcbiAgICB0aGlzLnVwZGF0ZUNvdW50KHRoaXMub3B0aW9ucy5jb3VudCk7XG5cbiAgICAvLyBUT0RPIFggZGltZW5zaW9uIG1vZGlmaWVkIGJ5IGNvcmUgVUksIG1heWJlIHJlY2FsYyBncmlkIGluIGFuaW1hdGlvbiBzdGFydD9cbiAgICAvLyBUT0RPIHJlbW92ZSBib3R0b20gcGFkZGluZyBmcm9tIERpc3F1c1xuICAgIC8vIFRPRE8gcGVyZiAtIGNhY2hlIHRyaWcgb3IgcGVyZm9ybSBvcGVyYXRpb25zXG4gICAgLy8gVE9ETyBvbmx5IHJhbmRvbWl6ZSBtb3ZlbWVudCBvbiAxYVxuXG4gICAgLy8gVE9ETyBBTklNMmEgVmlzaW9uIGdyaWQgdG91Y2hlcyB0cmlnIHRyYW5zZm9ybVxuICAgIC8vIFRPRE8gQU5JTTJhIHJhbmRvbWl6ZSBoYXphcmRzXG4gICAgLy8gVE9ETyBBTklNMiBwYXJ0aWNsZSBldmFkZVxuICAgIC8vIFRPRE8gQU5JTTJiIFNjYWxlIHZpc2lvbiBncmlkIHRvIDEwMDAgcGFydGljbGVzXG5cbiAgICAvLyBUT0RPIEFOSU0zIGZsb2NraW5nXG59O1xuXG5BbmltYXRpb24yYS5wcm90b3R5cGUuc3Vic2NyaWJlciA9IGZ1bmN0aW9uKHsga2V5LCB2YWx1ZSB9KSB7XG4gICAgc3dpdGNoKGtleSkge1xuICAgICAgICBjYXNlIENPTlRST0xTLkFOSU1BVElORzogdGhpcy51cGRhdGVBbmltYXRpbmcodmFsdWUpOyBicmVhaztcbiAgICAgICAgY2FzZSBDT05UUk9MUy5DT1VOVDogdGhpcy51cGRhdGVDb3VudCh2YWx1ZSk7IGJyZWFrO1xuICAgICAgICBjYXNlIENPTlRST0xTLlJBTkRPTUlaRTogdGhpcy51cGRhdGVSYW5kb21pemUodmFsdWUpOyBicmVhaztcbiAgICAgICAgY2FzZSBDT05UUk9MUy5TUEVFRDogdGhpcy51cGRhdGVTcGVlZCh2YWx1ZSk7IGJyZWFrO1xuICAgIH1cbn1cblxuQW5pbWF0aW9uMmEucHJvdG90eXBlLm5leHRGcmFtZSA9IGZ1bmN0aW9uKCkge1xuICAgIHRoaXMucGFydGljbGVzLmZvckVhY2gocCA9PiBwLm5leHRGcmFtZSgpKTtcbn1cblxuQW5pbWF0aW9uMmEucHJvdG90eXBlLnVwZGF0ZUFuaW1hdGluZyA9IGZ1bmN0aW9uKGlzQW5pbWF0aW5nKSB7XG4gICAgdGhpcy5vcHRpb25zLmFuaW1hdGluZyA9IGlzQW5pbWF0aW5nO1xuXG4gICAgaWYgKGlzQW5pbWF0aW5nKSB7XG4gICAgICAgIGNvbnN0IGZwcyQgPSBSeC5PYnNlcnZhYmxlLmludGVydmFsKDEwMDAgLyAzMilcbiAgICAgICAgICAgIC50YWtlV2hpbGUoXyA9PiB0aGlzLm9wdGlvbnMuYW5pbWF0aW5nKTtcblxuICAgICAgICBmcHMkLnN1YnNjcmliZSh0aGlzLm5leHRGcmFtZS5iaW5kKHRoaXMpKTtcbiAgICB9XG59XG5cbkFuaW1hdGlvbjJhLnByb3RvdHlwZS51cGRhdGVDb3VudCA9IGZ1bmN0aW9uKGNvdW50KSB7XG4gICAgd2hpbGUgKHRoaXMucGFydGljbGVzLmxlbmd0aCA+PSBjb3VudCkge1xuICAgICAgICBkZWxldGUgdGhpcy5wYXJ0aWNsZXMucG9wKCkucmVtb3ZlKCk7XG4gICAgfVxuXG4gICAgd2hpbGUgKHRoaXMucGFydGljbGVzLmxlbmd0aCA8IGNvdW50KSB7XG4gICAgICAgIGNvbnN0IHAgPSBuZXcgUGFydGljbGUodGhpcy5jb250YWluZXIsIHRoaXMuYm91bmRzLCB0aGlzLm9wdGlvbnMsIHRoaXMuZ2xvYmFsR3JpZCk7XG4gICAgICAgIHRoaXMucGFydGljbGVzLnB1c2gocCk7XG4gICAgfVxufVxuXG5BbmltYXRpb24yYS5wcm90b3R5cGUudXBkYXRlUmFuZG9taXplID0gZnVuY3Rpb24odmFsdWUpIHtcbiAgICB0aGlzLm9wdGlvbnMucmFuZG9taXplID0gdmFsdWU7XG4gICAgdGhpcy5wYXJ0aWNsZXMuZm9yRWFjaChwID0+IHAudXBkYXRlQ29uZmlnKHsgcmFuZG9taXplOiB2YWx1ZSB9KSk7XG59XG5cbkFuaW1hdGlvbjJhLnByb3RvdHlwZS51cGRhdGVTcGVlZCA9IGZ1bmN0aW9uKHZhbHVlKSB7XG4gICAgdGhpcy5vcHRpb25zLnNwZWVkID0gdmFsdWU7XG4gICAgdGhpcy5wYXJ0aWNsZXMuZm9yRWFjaChwID0+IHAudXBkYXRlQ29uZmlnKHsgc3BlZWQ6IHZhbHVlIH0pKTtcbn1cblxuZnVuY3Rpb24gY3JlYXRlR2xvYmFsR3JpZChjb250YWluZXIsIGJvdW5kcykge1xuICAgIGNvbnN0IGdyaWQgPSB7fTtcbiAgICBjb25zdCBncmlkU2l6ZSA9IDU7XG5cbiAgICBjb25zdCBoYXphcmRzID0gW1xuICAgICAgICB7IHg6IDEwMCwgeTogMTAwLCB3OiAyMDAsIGg6IDIwMCB9LFxuICAgICAgICB7IHg6IDYwMCwgeTogMjAwLCB3OiAyMDAsIGg6IDIwMCB9LFxuICAgIF07XG5cbiAgICByZXR1cm4gaGF6YXJkcy5yZWR1Y2UoKGFjYywgeyB4LCB5LCB3LCBoIH0pID0+IHtcbiAgICAgICAgY29uc3QgZGl2ID0gZG9jdW1lbnQuY3JlYXRlRWxlbWVudCgnZGl2Jyk7XG4gICAgICAgIGRpdi5jbGFzc05hbWUgPSAnaGF6YXJkJztcbiAgICAgICAgZGl2LnN0eWxlLmxlZnQgPSBgJHt4fXB4YDtcbiAgICAgICAgZGl2LnN0eWxlLnRvcCA9IGAke3l9cHhgO1xuICAgICAgICBkaXYuc3R5bGUuaGVpZ2h0ID0gYCR7aH1weGA7XG4gICAgICAgIGRpdi5zdHlsZS53aWR0aCA9IGAke3d9cHhgO1xuICAgICAgICBjb250YWluZXIuYXBwZW5kQ2hpbGQoZGl2KTtcblxuICAgICAgICBmb3IgKGxldCBpID0geDsgaSA8PSAoeCArIHcpOyBpICs9IGdyaWRTaXplKSB7XG4gICAgICAgICAgICBmb3IgKGxldCBqID0geTsgaiA8PSAoeSArIGgpOyBqICs9IGdyaWRTaXplKSB7XG4gICAgICAgICAgICAgICAgaWYgKGFjY1tpXSA9PT0gdW5kZWZpbmVkKSB7XG4gICAgICAgICAgICAgICAgICAgIGFjY1tpXSA9IHt9O1xuICAgICAgICAgICAgICAgIH1cblxuICAgICAgICAgICAgICAgIGlmIChhY2NbaV1bal0gIT09IHVuZGVmaW5lZCkge1xuICAgICAgICAgICAgICAgICAgICBjb250aW51ZTtcbiAgICAgICAgICAgICAgICB9XG5cbiAgICAgICAgICAgICAgICBjb25zdCBkb3QgPSBkb2N1bWVudC5jcmVhdGVFbGVtZW50KCdkb3QnKTtcbiAgICAgICAgICAgICAgICBkb3QuY2xhc3NOYW1lID0gJ2hhemFyZC1kb3QnO1xuICAgICAgICAgICAgICAgIGRvdC5zdHlsZS5sZWZ0ID0gYCR7aSAtIHh9cHhgO1xuICAgICAgICAgICAgICAgIGRvdC5zdHlsZS50b3AgPSBgJHtqIC0geX1weGA7XG4gICAgICAgICAgICAgICAgZGl2LmFwcGVuZENoaWxkKGRvdCk7XG5cbiAgICAgICAgICAgICAgICBhY2NbaV1bal0gPSB0cnVlO1xuICAgICAgICAgICAgfVxuICAgICAgICB9XG5cblxuICAgICAgICByZXR1cm4gYWNjO1xuICAgIH0sIHt9KTtcbn1cblxuZXhwb3J0IGRlZmF1bHQgQW5pbWF0aW9uMmE7XG5cblxuXG4vLyBXRUJQQUNLIEZPT1RFUiAvL1xuLy8ganMvYW5pbWF0aW9uMmEuanMiXSwibWFwcGluZ3MiOiI7Ozs7OztBQUFBO0FBQ0E7OztBQUFBO0FBQ0E7OztBQUFBO0FBQ0E7OztBQUFBO0FBQ0E7OztBQUFBO0FBQ0E7OztBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFOQTtBQUNBO0FBUUE7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUlBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQUE7QUFBQTtBQUNBO0FBQUE7QUFDQTtBQUFBO0FBQ0E7QUFBQTtBQUNBO0FBQUE7QUFDQTtBQUFBO0FBSkE7QUFNQTtBQUNBO0FBQ0E7QUFDQTtBQUFBO0FBQUE7QUFDQTtBQUNBO0FBQ0E7QUFBQTtBQUNBO0FBQUE7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUFBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFBQTtBQUFBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUFBO0FBQUE7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBSUE7QUFBQTtBQUFBO0FBQUE7QUFBQTtBQUNBO0FBQUE7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFFQTtBQUNBO0FBQ0E7QUFDQTtBQUNBIiwic291cmNlUm9vdCI6IiJ9"); /***/ }), /* 76 */ @@ -1030,7 +1030,7 @@ eval("// removed by extract-text-webpack-plugin//# sourceMappingURL=data:applica /***/ (function(module, exports, __webpack_require__) { "use strict"; -eval("\n\nvar _rxjs = __webpack_require__(/*! rxjs */ 14);\n\nvar _rxjs2 = _interopRequireDefault(_rxjs);\n\nvar _controls = __webpack_require__(/*! ./controls */ 21);\n\nvar _controls2 = _interopRequireDefault(_controls);\n\nvar _animation1a = __webpack_require__(/*! ./animation1a */ 73);\n\nvar _animation1a2 = _interopRequireDefault(_animation1a);\n\nvar _animation1b = __webpack_require__(/*! ./animation1b */ 74);\n\nvar _animation1b2 = _interopRequireDefault(_animation1b);\n\nvar _animation2a = __webpack_require__(/*! ./animation2a */ 75);\n\nvar _animation2a2 = _interopRequireDefault(_animation2a);\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\n__webpack_require__(/*! ../css/reset.scss */ 79);\n__webpack_require__(/*! ../css/index.scss */ 77);\n__webpack_require__(/*! ../css/particle.scss */ 78);\n__webpack_require__(/*! ../css/controls.scss */ 76);\n\nnew _animation1a2.default();\nnew _animation1b2.default();\nnew _animation2a2.default();//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiODAuanMiLCJzb3VyY2VzIjpbIndlYnBhY2s6Ly8vanMvaW5kZXguanM/NDJmNiJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUngsIHsgT2JzZXJ2YWJsZSB9IGZyb20gJ3J4anMnO1xuaW1wb3J0IENvbnRyb2xzIGZyb20gJy4vY29udHJvbHMnO1xuaW1wb3J0IEFuaW1hdGlvbjFhIGZyb20gJy4vYW5pbWF0aW9uMWEnO1xuaW1wb3J0IEFuaW1hdGlvbjFiIGZyb20gJy4vYW5pbWF0aW9uMWInO1xuaW1wb3J0IEFuaW1hdGlvbjJhIGZyb20gJy4vYW5pbWF0aW9uMmEnO1xuXG5yZXF1aXJlKCcuLi9jc3MvcmVzZXQuc2NzcycpO1xucmVxdWlyZSgnLi4vY3NzL2luZGV4LnNjc3MnKTtcbnJlcXVpcmUoJy4uL2Nzcy9wYXJ0aWNsZS5zY3NzJyk7XG5yZXF1aXJlKCcuLi9jc3MvY29udHJvbHMuc2NzcycpO1xuXG5uZXcgQW5pbWF0aW9uMWEoKTtcbm5ldyBBbmltYXRpb24xYigpO1xubmV3IEFuaW1hdGlvbjJhKCk7XG5cblxuXG4vLyBXRUJQQUNLIEZPT1RFUiAvL1xuLy8ganMvaW5kZXguanMiXSwibWFwcGluZ3MiOiI7O0FBQUE7QUFDQTs7O0FBQUE7QUFDQTs7O0FBQUE7QUFDQTs7O0FBQUE7QUFDQTs7O0FBQUE7QUFDQTs7Ozs7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBIiwic291cmNlUm9vdCI6IiJ9"); +eval("\n\nvar _rxjs = __webpack_require__(/*! rxjs */ 14);\n\nvar _rxjs2 = _interopRequireDefault(_rxjs);\n\nvar _controls = __webpack_require__(/*! ./controls */ 21);\n\nvar _controls2 = _interopRequireDefault(_controls);\n\nvar _animation1a = __webpack_require__(/*! ./animation1a */ 73);\n\nvar _animation1a2 = _interopRequireDefault(_animation1a);\n\nvar _animation1b = __webpack_require__(/*! ./animation1b */ 74);\n\nvar _animation1b2 = _interopRequireDefault(_animation1b);\n\nvar _animation2a = __webpack_require__(/*! ./animation2a */ 75);\n\nvar _animation2a2 = _interopRequireDefault(_animation2a);\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\n__webpack_require__(/*! ../css/reset.scss */ 79);\n__webpack_require__(/*! ../css/index.scss */ 77);\n__webpack_require__(/*! ../css/particle.scss */ 78);\n__webpack_require__(/*! ../css/controls.scss */ 76);\n\n// new Animation1a();\n// new Animation1b();\nnew _animation2a2.default();//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiODAuanMiLCJzb3VyY2VzIjpbIndlYnBhY2s6Ly8vanMvaW5kZXguanM/NDJmNiJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUngsIHsgT2JzZXJ2YWJsZSB9IGZyb20gJ3J4anMnO1xuaW1wb3J0IENvbnRyb2xzIGZyb20gJy4vY29udHJvbHMnO1xuaW1wb3J0IEFuaW1hdGlvbjFhIGZyb20gJy4vYW5pbWF0aW9uMWEnO1xuaW1wb3J0IEFuaW1hdGlvbjFiIGZyb20gJy4vYW5pbWF0aW9uMWInO1xuaW1wb3J0IEFuaW1hdGlvbjJhIGZyb20gJy4vYW5pbWF0aW9uMmEnO1xuXG5yZXF1aXJlKCcuLi9jc3MvcmVzZXQuc2NzcycpO1xucmVxdWlyZSgnLi4vY3NzL2luZGV4LnNjc3MnKTtcbnJlcXVpcmUoJy4uL2Nzcy9wYXJ0aWNsZS5zY3NzJyk7XG5yZXF1aXJlKCcuLi9jc3MvY29udHJvbHMuc2NzcycpO1xuXG4vLyBuZXcgQW5pbWF0aW9uMWEoKTtcbi8vIG5ldyBBbmltYXRpb24xYigpO1xubmV3IEFuaW1hdGlvbjJhKCk7XG5cblxuXG4vLyBXRUJQQUNLIEZPT1RFUiAvL1xuLy8ganMvaW5kZXguanMiXSwibWFwcGluZ3MiOiI7O0FBQUE7QUFDQTs7O0FBQUE7QUFDQTs7O0FBQUE7QUFDQTs7O0FBQUE7QUFDQTs7O0FBQUE7QUFDQTs7Ozs7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBIiwic291cmNlUm9vdCI6IiJ9"); /***/ }), /* 81 */ diff --git a/js/index.js b/js/index.js index 9948777..75d373b 100644 --- a/js/index.js +++ b/js/index.js @@ -9,6 +9,6 @@ require('../css/index.scss'); require('../css/particle.scss'); require('../css/controls.scss'); -new Animation1a(); -new Animation1b(); +// new Animation1a(); +// new Animation1b(); new Animation2a(); diff --git a/js/particle.js b/js/particle.js index b5cb107..d88683e 100644 --- a/js/particle.js +++ b/js/particle.js @@ -63,13 +63,13 @@ Particle.prototype.remove = function() { Particle.prototype.nextFrame = function() { this.arc = updateArc(this.arc, this.config); - this.grids.vision = updateVisionGrid(this.arc, this.grids); + this.grids.vision = updateVisionGrid(this.arc, this.config, this.grids); repaintContainer(this.nodes.container, this.arc); repaintBody(this.nodes.body, this.arc); repaintCircle(this.nodes.circle, this.arc); repaintVision(this.nodes.vision, this.arc); - repaintVisionGrid(this.nodes.visionGrid, this.grids, this.config); + repaintVisionGrid(this.nodes.visionGrid, this.arc, this.grids); } Particle.prototype.updateConfig = function(config) { @@ -143,25 +143,30 @@ function createVisionGrid(config) { } const { gridSize: side, visionRadius: radius } = config; - const r0 = Math.pow(radius, 2); - const r1 = Math.pow(radius - side, 2); + const r0 = radius; + const r1 = radius - side; const points = []; for (let x = -radius; x <= radius; x += side) { for (let y = -radius; y <= radius; y += side) { - // Half of triangle - if (x > -y) { + // Omit lower half + if (y < 0) { continue; } - // Vision band - const p = Math.pow(x, 2) + Math.pow(y, 2); - if (p > r0 || p < r1) { + // Include vision band + const r = Math.pow(Math.pow(x, 2) + Math.pow(y, 2), 0.5); + if (r > r0 || r < r1) { continue; } - points.push({ x, y, touch: false }); + let alpha = Math.atan(y / x); + if (x < 0) { + alpha = RAD.t180 + alpha; + } + + points.push({ x, y, r, alpha, touch: false }); } } @@ -177,19 +182,12 @@ function createVisionGridNodes(config, grids, nodes) { const div = document.createElement('div'); div.className = 'particle-vision-dot'; div.style.backgroundColor = config.color; - div.style.left = `${x + config.visionRadius}px`; - div.style.top = `${y + config.visionRadius}px`; - nodes.vision.appendChild(div); - if (acc[x] === undefined) { - acc[x] = {}; - } - - acc[x][y] = div; + acc.push(div); return acc; - }, {}); + }, []); } // ===== CALCULATIONS ===== @@ -239,18 +237,23 @@ function updateArc(arc, { bounds, randomize, speed }) { return arc; } -function updateVisionGrid(arc, grids) { +function updateVisionGrid(arc, config, grids) { const { global, vision } = grids; return vision.reduce((acc, point) => { - // Location of point on grid - const x = Math.round(arc.endX + point.x); - const y = Math.round(arc.endY + point.y); + const rad = arc.clockwise + ? arc.theta - point.alpha + : arc.theta - point.alpha + RAD.t180; - const gridX = x - x % 5; - const gridY = y - y % 5; + point.x = point.r * Math.cos(rad) + config.visionRadius; + point.y = -point.r * Math.sin(rad) + config.visionRadius; - point.touch = (global[gridX] !== undefined && global[gridX][gridY] !== undefined); + // console.warn(point.alpha, point.alpha + arc.theta) + + // const gridX = point.x - point.x % 5; + // const gridY = point.y - point.y % 5; + + // point.touch = (global[gridX] !== undefined && global[gridX][gridY] !== undefined); return acc.concat(point); }, []); @@ -312,17 +315,18 @@ function repaintVision(node, arc) { const rad = arc.clockwise ? RAD.t180 - arc.theta : RAD.t360 - arc.theta; - - node.style.transform = `rotate(${rad + RAD.t45}rad)`; } -function repaintVisionGrid(nodes, grids) { +function repaintVisionGrid(nodes, arc, grids) { if (nodes === undefined) { return; } - grids.vision.forEach(({ x, y, touch }) => { - nodes[x][y].style.border = (touch ? '2px solid red' : '0'); + grids.vision.forEach(({ x, y, touch }, i) => { + nodes[i].style.left = `${x}px`; + nodes[i].style.top = `${y}px`; + + nodes[i].style.border = (touch ? '2px solid red' : '0'); }); }