'use strict'; exports.__esModule = true; exports.default = function (graphicsData, webGLData, webGLDataNativeLines) { if (graphicsData.nativeLines) { buildNativeLine(graphicsData, webGLDataNativeLines); } else { buildLine(graphicsData, webGLData); } }; var _math = require('../../../math'); var _utils = require('../../../utils'); /** * Builds a line to draw using the poligon method. * * 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 */ function buildLine(graphicsData, webGLData) { // TODO OPTIMISE! var points = graphicsData.points; if (points.length === 0) { return; } // if the line width is an odd number add 0.5 to align to a whole pixel // commenting this out fixes #711 and #1620 // if (graphicsData.lineWidth%2) // { // for (i = 0; i < points.length; i++) // { // points[i] += 0.5; // } // } // get first and last point.. figure out the middle! var firstPoint = new _math.Point(points[0], points[1]); var lastPoint = new _math.Point(points[points.length - 2], points[points.length - 1]); // if the first point is the last point - gonna have issues :) if (firstPoint.x === lastPoint.x && firstPoint.y === lastPoint.y) { // need to clone as we are going to slightly modify the shape.. points = points.slice(); points.pop(); points.pop(); lastPoint = new _math.Point(points[points.length - 2], points[points.length - 1]); var midPointX = lastPoint.x + (firstPoint.x - lastPoint.x) * 0.5; var midPointY = lastPoint.y + (firstPoint.y - lastPoint.y) * 0.5; points.unshift(midPointX, midPointY); points.push(midPointX, midPointY); } var verts = webGLData.points; var indices = webGLData.indices; var length = points.length / 2; var indexCount = points.length; var indexStart = verts.length / 6; // DRAW the Line var width = graphicsData.lineWidth / 2; // sort color var color = (0, _utils.hex2rgb)(graphicsData.lineColor); var alpha = graphicsData.lineAlpha; var r = color[0] * alpha; var g = color[1] * alpha; var b = color[2] * alpha; var p1x = points[0]; var p1y = points[1]; var p2x = points[2]; var p2y = points[3]; var p3x = 0; var p3y = 0; var perpx = -(p1y - p2y); var perpy = p1x - p2x; var perp2x = 0; var perp2y = 0; var perp3x = 0; var perp3y = 0; var dist = Math.sqrt(perpx * perpx + perpy * perpy); perpx /= dist; perpy /= dist; perpx *= width; perpy *= width; // start verts.push(p1x - perpx, p1y - perpy, r, g, b, alpha); verts.push(p1x + perpx, p1y + perpy, r, g, b, alpha); for (var i = 1; i < length - 1; ++i) { p1x = points[(i - 1) * 2]; p1y = points[(i - 1) * 2 + 1]; p2x = points[i * 2]; p2y = points[i * 2 + 1]; p3x = points[(i + 1) * 2]; p3y = points[(i + 1) * 2 + 1]; perpx = -(p1y - p2y); perpy = p1x - p2x; dist = Math.sqrt(perpx * perpx + perpy * perpy); perpx /= dist; perpy /= dist; perpx *= width; perpy *= width; perp2x = -(p2y - p3y); perp2y = p2x - p3x; dist = Math.sqrt(perp2x * perp2x + perp2y * perp2y); perp2x /= dist; perp2y /= dist; perp2x *= width; perp2y *= width; var a1 = -perpy + p1y - (-perpy + p2y); var b1 = -perpx + p2x - (-perpx + p1x); var c1 = (-perpx + p1x) * (-perpy + p2y) - (-perpx + p2x) * (-perpy + p1y); var a2 = -perp2y + p3y - (-perp2y + p2y); var b2 = -perp2x + p2x - (-perp2x + p3x); var c2 = (-perp2x + p3x) * (-perp2y + p2y) - (-perp2x + p2x) * (-perp2y + p3y); var denom = a1 * b2 - a2 * b1; if (Math.abs(denom) < 0.1) { denom += 10.1; verts.push(p2x - perpx, p2y - perpy, r, g, b, alpha); verts.push(p2x + perpx, p2y + perpy, r, g, b, alpha); continue; } var px = (b1 * c2 - b2 * c1) / denom; var py = (a2 * c1 - a1 * c2) / denom; var pdist = (px - p2x) * (px - p2x) + (py - p2y) * (py - p2y); if (pdist > 196 * width * width) { perp3x = perpx - perp2x; perp3y = perpy - perp2y; dist = Math.sqrt(perp3x * perp3x + perp3y * perp3y); perp3x /= dist; perp3y /= dist; perp3x *= width; perp3y *= width; verts.push(p2x - perp3x, p2y - perp3y); verts.push(r, g, b, alpha); verts.push(p2x + perp3x, p2y + perp3y); verts.push(r, g, b, alpha); verts.push(p2x - perp3x, p2y - perp3y); verts.push(r, g, b, alpha); indexCount++; } else { verts.push(px, py); verts.push(r, g, b, alpha); verts.push(p2x - (px - p2x), p2y - (py - p2y)); verts.push(r, g, b, alpha); } } p1x = points[(length - 2) * 2]; p1y = points[(length - 2) * 2 + 1]; p2x = points[(length - 1) * 2]; p2y = points[(length - 1) * 2 + 1]; perpx = -(p1y - p2y); perpy = p1x - p2x; dist = Math.sqrt(perpx * perpx + perpy * perpy); perpx /= dist; perpy /= dist; perpx *= width; perpy *= width; verts.push(p2x - perpx, p2y - perpy); verts.push(r, g, b, alpha); verts.push(p2x + perpx, p2y + perpy); verts.push(r, g, b, alpha); indices.push(indexStart); for (var _i = 0; _i < indexCount; ++_i) { indices.push(indexStart++); } indices.push(indexStart - 1); } /** * Builds a line to draw using the gl.drawArrays(gl.LINES) method * * 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 */ /** * Builds a line 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 buildNativeLine(graphicsData, webGLData) { var i = 0; var points = graphicsData.points; if (points.length === 0) return; var verts = webGLData.points; var length = points.length / 2; // sort color var color = (0, _utils.hex2rgb)(graphicsData.lineColor); var alpha = graphicsData.lineAlpha; var r = color[0] * alpha; var g = color[1] * alpha; var b = color[2] * alpha; for (i = 1; i < length; i++) { var p1x = points[(i - 1) * 2]; var p1y = points[(i - 1) * 2 + 1]; var p2x = points[i * 2]; var p2y = points[i * 2 + 1]; verts.push(p1x, p1y); verts.push(r, g, b, alpha); verts.push(p2x, p2y); verts.push(r, g, b, alpha); } } //# sourceMappingURL=buildLine.js.map