var Item = require('burner').Item,
Utils = require('burner').Utils;
/**
* Creates a new Point.
*
* Points are the most basic Flora item. They represent a fixed point in
* 2D space and are just an extension of Burner Item with isStatic set to true.
*
* @constructor
* @extends Item
*/
function Point() {
Item.call(this);
}
Utils.extend(Point, Item);
/**
* Initializes an instance of Point.
*
* @param {Object} [opt_options=] A map of initial properties.
* @param {Array} [opt_options.color = 200, 200, 200] Color.
* @param {number} [opt_options.borderRadius = 100] Border radius.
* @param {number} [opt_options.borderWidth = 2] Border width.
* @param {string} [opt_options.borderStyle = 'solid'] Border style.
* @param {Array} [opt_options.borderColor = 60, 60, 60] Border color.
*/
Point.prototype.init = function(world, opt_options) {
Point._superClass.init.call(this, world, opt_options);
var options = opt_options || {};
this.color = options.color || [200, 200, 200];
this.borderRadius = typeof options.borderRadius === 'undefined' ? 100 : options.borderRadius;
this.borderWidth = typeof options.borderWidth === 'undefined' ? 2 : options.borderWidth;
this.borderStyle = options.borderStyle || 'solid';
this.borderColor = options.borderColor || [60, 60, 60];
// Points are static
this.isStatic = true;
};
Point.prototype.step = function() {};
/**
* Updates the corresponding DOM element's style property.
* @function draw
* @memberof Point
*/
Point.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]
});
this.el.style.cssText = cssText;
};
/**
* Concatenates a new cssText string.
*
* @function getCSSText
* @memberof Point
* @param {Object} props A map of object properties.
* @returns {string} A string representing cssText.
*/
Point.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 + '%;';
};
module.exports = Point;