'use strict'; exports.__esModule = true; exports.default = buildRoundedRectangle; var _earcut = require('earcut'); var _earcut2 = _interopRequireDefault(_earcut); var _buildLine = require('./buildLine'); var _buildLine2 = _interopRequireDefault(_buildLine); var _utils = require('../../../utils'); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } /** * Builds a rounded rectangle to draw * * Ignored from docs since it is not directly exposed. * * @ignore * @private * @param {PIXI.WebGLGraphicsData} graphicsData - The graphics object containing all the necessary properties * @param {object} webGLData - an object containing all the webGL-specific information to create this shape * @param {object} webGLDataNativeLines - an object containing all the webGL-specific information to create nativeLines */ function buildRoundedRectangle(graphicsData, webGLData, webGLDataNativeLines) { var rrectData = graphicsData.shape; var x = rrectData.x; var y = rrectData.y; var width = rrectData.width; var height = rrectData.height; var radius = rrectData.radius; var recPoints = []; recPoints.push(x, y + radius); quadraticBezierCurve(x, y + height - radius, x, y + height, x + radius, y + height, recPoints); quadraticBezierCurve(x + width - radius, y + height, x + width, y + height, x + width, y + height - radius, recPoints); quadraticBezierCurve(x + width, y + radius, x + width, y, x + width - radius, y, recPoints); quadraticBezierCurve(x + radius, y, x, y, x, y + radius + 0.0000000001, recPoints); // this tiny number deals with the issue that occurs when points overlap and earcut fails to triangulate the item. // TODO - fix this properly, this is not very elegant.. but it works for now. if (graphicsData.fill) { var color = (0, _utils.hex2rgb)(graphicsData.fillColor); var alpha = graphicsData.fillAlpha; var r = color[0] * alpha; var g = color[1] * alpha; var b = color[2] * alpha; var verts = webGLData.points; var indices = webGLData.indices; var vecPos = verts.length / 6; var triangles = (0, _earcut2.default)(recPoints, null, 2); for (var i = 0, j = triangles.length; i < j; i += 3) { indices.push(triangles[i] + vecPos); indices.push(triangles[i] + vecPos); indices.push(triangles[i + 1] + vecPos); indices.push(triangles[i + 2] + vecPos); indices.push(triangles[i + 2] + vecPos); } for (var _i = 0, _j = recPoints.length; _i < _j; _i++) { verts.push(recPoints[_i], recPoints[++_i], r, g, b, alpha); } } if (graphicsData.lineWidth) { var tempPoints = graphicsData.points; graphicsData.points = recPoints; (0, _buildLine2.default)(graphicsData, webGLData, webGLDataNativeLines); graphicsData.points = tempPoints; } } /** * Calculate a single point for a quadratic bezier curve. * Utility function used by quadraticBezierCurve. * Ignored from docs since it is not directly exposed. * * @ignore * @private * @param {number} n1 - first number * @param {number} n2 - second number * @param {number} perc - percentage * @return {number} the result * */ function getPt(n1, n2, perc) { var diff = n2 - n1; return n1 + diff * perc; } /** * Calculate the points for a quadratic bezier curve. (helper function..) * Based on: https://stackoverflow.com/questions/785097/how-do-i-implement-a-bezier-curve-in-c * * Ignored from docs since it is not directly exposed. * * @ignore * @private * @param {number} fromX - Origin point x * @param {number} fromY - Origin point x * @param {number} cpX - Control point x * @param {number} cpY - Control point y * @param {number} toX - Destination point x * @param {number} toY - Destination point y * @param {number[]} [out=[]] - The output array to add points into. If not passed, a new array is created. * @return {number[]} an array of points */ function quadraticBezierCurve(fromX, fromY, cpX, cpY, toX, toY) { var out = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : []; var n = 20; var points = out; var xa = 0; var ya = 0; var xb = 0; var yb = 0; var x = 0; var y = 0; for (var i = 0, j = 0; i <= n; ++i) { j = i / n; // The Green Line xa = getPt(fromX, cpX, j); ya = getPt(fromY, cpY, j); xb = getPt(cpX, toX, j); yb = getPt(cpY, toY, j); // The Black Dot x = getPt(xa, xb, j); y = getPt(ya, yb, j); points.push(x, y); } return points; } //# sourceMappingURL=buildRoundedRectangle.js.map