Plato on Github
Report Home
items/particle.js
Maintainability
57.40
Lines of code
135
Difficulty
42.87
Estimated Errors
1.96
Function weight
By Complexity
By SLOC
var Item = require('burner').Item, Mover = require('./mover'), Utils = require('burner').Utils, Vector = require('burner').Vector; /** * Creates a new Particle object. * * @constructor * @extends Mover */ function Particle(opt_options) { Mover.call(this); } Utils.extend(Particle, Mover); /** * Initializes Particle. * @param {Object} world An instance of World. * @param {Object} [opt_options=] A map of initial properties. * @param {number} [opt_options.width = 20] Width * @param {number} [opt_options.height = 20] Height * @param {Array} [opt_options.color = [200, 200, 200]] Color. * @param {number} [opt_options.borderWidth = this.width / 4] Border width. * @param {number} [opt_options.borderRadius = 100] The particle's border radius. * @param {number} [opt_options.boxShadowSpread = this.width / 4] Box-shadow spread. * @param {number} [opt_options.lifespan = 50] The max life of the object. Set to -1 for infinite life. * @param {number} [opt_options.life = 0] The current life value. If greater than this.lifespan, object is destroyed. * @param {boolean} {opt_options.fade = true} If true, opacity decreases proportionally with life. * @param {boolean} {opt_options.shrink = true} If true, width and height decrease proportionally with life. * @param {boolean} [opt_options.checkWorldEdges = false] Set to true to check the object's location against the world's bounds. * @param {number} [opt_options.maxSpeed = 4] Maximum speed. * @param {number} [opt_options.zIndex = 1] The object's zIndex. */ Particle.prototype.init = function(world, opt_options) { Particle._superClass.init.call(this, world, opt_options); var options = opt_options || {}; this.width = typeof options.width === 'undefined' ? 20 : options.width; this.height = typeof options.height === 'undefined' ? 20 : options.height; this.color = options.color || [200, 200, 200]; this.borderWidth = typeof options.borderWidth === 'undefined' ? this.width / 4 : options.borderWidth; this.borderRadius = typeof options.borderRadius === 'undefined' ? 100 : options.borderRadius; this.boxShadowSpread = typeof options.boxShadowSpread === 'undefined' ? this.width / 4 : options.boxShadowSpread; this.lifespan = typeof options.lifespan === 'undefined' ? 50 : options.lifespan; this.life = options.life || 0; this.fade = typeof options.fade === 'undefined' ? true : options.fade; this.shrink = typeof options.shrink === 'undefined' ? true : options.shrink; this.checkWorldEdges = !!options.checkWorldEdges; this.maxSpeed = typeof options.maxSpeed === 'undefined' ? 4 : options.maxSpeed; this.zIndex = typeof options.zIndex === 'undefined' ? 1 : options.zIndex; if (!options.acceleration) { this.acceleration = new Vector(1, 1); this.acceleration.normalize(); this.acceleration.mult(this.maxSpeed ? this.maxSpeed : 3); this.acceleration.rotate(Utils.getRandomNumber(0, Math.PI * 2, true)); } if (!options.velocity) { this.velocity = new Vector(); } this.initWidth = this.width; this.initHeight = this.height; }; /** * Applies additional forces. */ Particle.prototype.afterStep = function() { if (this.fade) { this.opacity = Utils.map(this.life, 0, this.lifespan, 1, 0); } if (this.shrink) { this.width = Utils.map(this.life, 0, this.lifespan, this.initWidth, 0); this.height = Utils.map(this.life, 0, this.lifespan, this.initHeight, 0); } }; /** * Updates the corresponding DOM element's style property. * @function draw * @memberof Particle */ Particle.prototype.draw = function() { var cssText = this.getCSSText({ x: this.location.x - (this.width / 2), y: this.location.y - (this.height / 2), angle: this.angle, scale: this.scale || 1, width: this.width, height: this.height, color0: this.color[0], color1: this.color[1], color2: this.color[2], colorMode: this.colorMode, borderRadius: this.borderRadius, borderWidth: this.borderWidth, borderStyle: this.borderStyle, borderColor0: this.borderColor[0], borderColor1: this.borderColor[1], borderColor2: this.borderColor[2], boxShadowOffsetX: this.boxShadowOffsetX, boxShadowOffsetY: this.boxShadowOffsetY, boxShadowBlur: this.boxShadowBlur, boxShadowSpread: this.boxShadowSpread, boxShadowColor0: this.boxShadowColor[0], boxShadowColor1: this.boxShadowColor[1], boxShadowColor2: this.boxShadowColor[2], opacity: this.opacity, zIndex: this.zIndex, visibility: this.visibility }); this.el.style.cssText = cssText; }; /** * Concatenates a new cssText string. * * @function getCSSText * @memberof Particle * @param {Object} props A map of object properties. * @returns {string} A string representing cssText. */ Particle.prototype.getCSSText = function(props) { return Item._stylePosition.replace(/<x>/g, props.x).replace(/<y>/g, props.y).replace(/<angle>/g, props.angle).replace(/<scale>/g, props.scale) + 'width: ' + props.width + 'px; height: ' + props.height + 'px; background-color: ' + props.colorMode + '(' + props.color0 + ', ' + props.color1 + (props.colorMode === 'hsl' ? '%' : '') + ', ' + props.color2 + (props.colorMode === 'hsl' ? '%' : '') +'); border: ' + props.borderWidth + 'px ' + props.borderStyle + ' ' + props.colorMode + '(' + props.borderColor0 + ', ' + props.borderColor1 + (props.colorMode === 'hsl' ? '%' : '') + ', ' + props.borderColor2 + (props.colorMode === 'hsl' ? '%' : '') + '); border-radius: ' + props.borderRadius + '%; box-shadow: ' + props.boxShadowOffsetX + 'px ' + props.boxShadowOffsetY + 'px ' + props.boxShadowBlur + 'px ' + props.boxShadowSpread + 'px ' + props.colorMode + '(' + props.boxShadowColor0 + ', ' + props.boxShadowColor1 + (props.colorMode === 'hsl' ? '%' : '') + ', ' + props.boxShadowColor2 + (props.colorMode === 'hsl' ? '%' : '') + '); opacity: ' + props.opacity + '; z-index: ' + props.zIndex + '; visibility: ' + props.visibility + ';'; }; module.exports = Particle;