@polygonjs/polygonjs/dist/src/core/loader/SVG.js

node-based WebGL 3D engine https://polygonjs.com

"use strict";
import { SVGLoader } from "three/examples/jsm/loaders/SVGLoader";
import {
  ShapeGeometry,
  LineSegments,
  Mesh,
  DoubleSide,
  LineBasicMaterial,
  MeshBasicMaterial,
  Group,
  Color
} from "three";
import { isBooleanTrue } from "../BooleanValue";
import { CoreBaseLoader } from "./_Base";
import { Poly } from "../../engine/Poly";
export class CoreSVGLoader extends CoreBaseLoader {
  constructor(url, _node) {
    super(url, _node);
  }
  load(options) {
    if (this._node) {
      Poly.blobs.clearBlobsForNode(this._node);
    }
    return new Promise(async (resolve, reject) => {
      const loader = new SVGLoader(this.loadingManager);
      const url = this._urlToLoad();
      loader.load(
        url,
        (data) => {
          try {
            const group = this._onLoaded(data, options);
            resolve(group);
          } catch (err) {
            reject(err);
          }
        },
        void 0,
        (err) => {
          reject(err);
        }
      );
    });
  }
  parse(text, options) {
    const loader = new SVGLoader(this.loadingManager);
    const data = loader.parse(text);
    const group = this._onLoaded(data, options);
    return group;
  }
  _onLoaded(data, options) {
    const paths = data.paths;
    const group = new Group();
    for (let i = 0; i < paths.length; i++) {
      const path = paths[i];
      const userData = path.userData;
      const fillColor = userData.style.fill;
      if (isBooleanTrue(options.drawFillShapes) && fillColor !== void 0 && fillColor !== "none") {
        this._drawShapes(group, path, options);
      }
      if (isBooleanTrue(options.drawStrokes)) {
        this._drawStrokes(group, path, options);
      }
    }
    return group;
  }
  _drawShapes(group, path, options) {
    const userData = path.userData;
    const material = new MeshBasicMaterial({
      color: new Color().setStyle(userData.style.fill),
      opacity: userData.style.fillOpacity,
      transparent: userData.style.fillOpacity < 1,
      side: DoubleSide,
      depthWrite: false,
      wireframe: options.fillShapesWireframe
    });
    const isCCW = options.tadvanced && options.isCCW;
    const shapes = path.toShapes(isCCW);
    for (let j = 0; j < shapes.length; j++) {
      const shape = shapes[j];
      const geometry = new ShapeGeometry(shape);
      const mesh = new Mesh(geometry, material);
      group.add(mesh);
    }
  }
  _drawStrokes(group, path, options) {
    const userData = path.userData;
    if (options.tStyleOverride) {
      userData.style.strokeWidth = options.strokeWidth;
    }
    if (options.strokesWireframe) {
      const material = new LineBasicMaterial({
        color: new Color().setStyle(userData.style.stroke),
        opacity: userData.style.strokeOpacity,
        transparent: userData.style.strokeOpacity < 1,
        side: DoubleSide,
        depthWrite: false
      });
      for (let j = 0, jl = path.subPaths.length; j < jl; j++) {
        const subPath = path.subPaths[j];
        const geometry = SVGLoader.pointsToStroke(subPath.getPoints(), userData.style);
        if (geometry) {
          const mesh = new LineSegments(geometry, material);
          group.add(mesh);
        }
      }
    } else {
      const material = new MeshBasicMaterial({
        color: new Color().setStyle(userData.style.stroke),
        opacity: userData.style.strokeOpacity,
        transparent: userData.style.strokeOpacity < 1,
        side: DoubleSide,
        depthWrite: false
        // wireframe: options.strokesWireframe,
      });
      for (let j = 0, jl = path.subPaths.length; j < jl; j++) {
        const subPath = path.subPaths[j];
        const geometry = SVGLoader.pointsToStroke(subPath.getPoints(), userData.style);
        if (geometry) {
          const mesh = new Mesh(geometry, material);
          group.add(mesh);
        }
      }
    }
  }
}