@turbox3d/graphic-component-pixi/lib/_utils/utils.js

Graphic component library based on pixi

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _typeof = require("@babel/runtime/helpers/typeof");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.drawText = drawText;
var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
var THREE = _interopRequireWildcard(require("three"));
var _FontLoader = require("three/examples/jsm/loaders/FontLoader.js");
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
function drawLineByShape(graphics, curve, matrix) {
  var c = curve.toJSON();
  switch (curve.type) {
    case 'QuadraticBezierCurve':
      {
        var v0 = new THREE.Vector2().fromArray(c.v0).applyMatrix3(matrix);
        var v1 = new THREE.Vector2().fromArray(c.v1).applyMatrix3(matrix);
        var v2 = new THREE.Vector2().fromArray(c.v2).applyMatrix3(matrix);
        graphics.bezierCurveTo(v0.x, v0.y, v1.x, v1.y, v2.x, v2.y);
        break;
      }
    case 'LineCurve':
      {
        var v = new THREE.Vector2().fromArray(c.v2).applyMatrix3(matrix);
        graphics.lineTo(v.x, v.y);
        break;
      }
    default:
      break;
  }
}
/**
 * 绘制字体
 * @param {PIXI} graphics graphics
 * @param {string} string 文本
 * @param {ITransform} transform 绘制的 model matrix decompose
 */
function drawText(_x, _x2, _x3, _x4) {
  return _drawText.apply(this, arguments);
} // export function computeFlowLayoutPosition(central: boolean, margin?: string) {
//   const [posX, posY] = central ? [0 - this.view.width / 2, 0 - this.view.height / 2] : [0, 0];
//   const [top, right, bottom, left] = margin?.split(',').map(n => parseInt(n, 10)) || [0, 0, 0, 0];
//   const parentNode = this._vNode.parent;
//   if (parentNode && parentNode.instance instanceof Container2d) {
//     this.view.position.x = posX + left;
//     if (parentNode.child === this._vNode) {
//       this.view.position.y = posY + top;
//     }
//     if (this._vNode.sibling) {
//       const siblingMargin = this._vNode.sibling?.props.margin?.split(',').map(n => parseInt(n, 10)) || [0, 0, 0, 0];
//       if (this._vNode.sibling?.instance instanceof Mesh2D) {
//         ((this._vNode.sibling?.instance as any).view as PIXI.Container).position.y = this.view.position.y + this.view.height + bottom + siblingMargin[0];
//       }
//     }
//   }
// }
function _drawText() {
  _drawText = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee(graphics, string, transform, options) {
    var _a, _b, defaultOps, ops, size, font, str, textShapes, halfH, halfW, offset, rotation, matrix, cos, sin, i, shape, shapeCurveLength, curve, v, j, holes, _j, hole, v2, k;
    return _regenerator["default"].wrap(function _callee$(_context) {
      while (1) switch (_context.prev = _context.next) {
        case 0:
          // generate shapes
          defaultOps = {
            color: 0x131313,
            fontUrl: ''
          };
          ops = options || defaultOps;
          size = (transform === null || transform === void 0 ? void 0 : transform.size) || 5;
          _context.next = 5;
          return new _FontLoader.FontLoader().loadAsync(ops.fontUrl || defaultOps.fontUrl);
        case 5:
          font = _context.sent;
          str = string.toString();
          textShapes = font.generateShapes(str, size); // matrix parameter
          halfH = size / 2;
          halfW = str.length * 0.7 * halfH;
          offset = {
            x: ((_a = transform === null || transform === void 0 ? void 0 : transform.offset) === null || _a === void 0 ? void 0 : _a.x) || 0,
            y: ((_b = transform === null || transform === void 0 ? void 0 : transform.offset) === null || _b === void 0 ? void 0 : _b.y) || 0
          };
          rotation = (transform === null || transform === void 0 ? void 0 : transform.rotation) || 0; // compose matrix
          matrix = new THREE.Matrix3();
          cos = Math.cos(rotation);
          sin = Math.sin(rotation);
          matrix.set(cos, -sin, -cos * halfW + sin * halfH + offset.x, sin, cos, -sin * halfW - cos * halfH + offset.y, 1, 1, 1);
          // draw
          for (i = 0; i < textShapes.length; i++) {
            graphics.beginFill(ops.color || defaultOps.color);
            shape = textShapes[i];
            shapeCurveLength = shape.curves.length;
            curve = shape.curves[shapeCurveLength - 1];
            v = new THREE.Vector2().fromArray(curve.toJSON().v2).clone().applyMatrix3(matrix);
            graphics.moveTo(v.x, v.y);
            for (j = 0; j < shapeCurveLength; j++) {
              drawLineByShape(graphics, shape.curves[j], matrix);
            }
            holes = shape.holes;
            for (_j = 0; _j < holes.length; _j++) {
              hole = holes[_j];
              graphics.beginHole();
              v2 = hole.currentPoint.applyMatrix3(matrix);
              graphics.moveTo(v2.x, v2.y);
              for (k = 0; k < hole.curves.length; k++) {
                drawLineByShape(graphics, hole.curves[k], matrix);
              }
              graphics.endHole();
            }
          }
        case 17:
        case "end":
          return _context.stop();
      }
    }, _callee);
  }));
  return _drawText.apply(this, arguments);
}